﻿@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');

/* Sexleksaker Online – Design tokens v1.0 */
:root {
  color-scheme: light;
  --color-ink: #231f2b;
  --color-plum-900: #35273f;
  --color-plum-700: #583c7e;
  --color-plum-600: #7751a4;
  --color-berry-700: #a5475b;
  --color-lilac-100: #f3edf8;
  --color-lilac-50: #f8f5fa;
  --color-canvas: #fbf9fc;
  --color-surface: #ffffff;
  --color-product-stage: #f7f4f8;
  --color-border: #e6e1ea;
  --color-muted: #6d6574;
  --color-success: #176949;
  --color-warning: #805317;
  --color-danger: #ae3535;
  --color-focus: #583c7e;
  --color-on-brand: #ffffff;
  --font-heading: 'Manrope', 'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --container-max: 1240px;
  --gutter-mobile: 18px;
  --gutter-desktop: 32px;
  --radius-sm: 8px;
  --radius-control: 12px;
  --radius-card: 18px;
  --radius-feature: 26px;
  --radius-pill: 999px;
  --shadow-card: 0 14px 45px rgba(35, 31, 43, .045);
  --shadow-popover: 0 16px 52px rgba(35, 31, 43, .11);
  --ring-focus: 0 0 0 3px rgba(88, 60, 126, .25);
  --duration-fast: 150ms;
  --duration-medium: 200ms;
}
@media (prefers-reduced-motion: reduce) {
  :root { --duration-fast: 0ms; --duration-medium: 0ms; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  color: var(--color-ink);
  background: var(--color-canvas);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
a:hover { color: var(--color-plum-700); }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 {
  font-family: var(--font-heading);
  letter-spacing: -.04em;
  line-height: 1.13;
  margin: 0;
}
p { margin: 0; }
button, input { font: inherit; }
button:focus-visible, input:focus-visible, a:focus-visible {
  outline: 3px solid rgba(88, 60, 126, .42);
  outline-offset: 3px;
}

.container {
  width: min(var(--container-max), calc(100% - 2 * var(--gutter-mobile)));
  margin-inline: auto;
}
@media (min-width: 768px) {
  .container { width: min(var(--container-max), calc(100% - 2 * var(--gutter-desktop))); }
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--color-plum-700);
  font-size: 11px;
  font-weight: 800;
}
.muted { color: var(--color-muted); }

/* Staging notice */
.staging-banner {
  background: var(--color-plum-900);
  color: #fff;
  text-align: center;
  font-size: 12px;
  padding: 9px 14px;
  letter-spacing: .01em;
}

/* Utility bar */
.utility-bar {
  background: var(--color-lilac-100);
  color: #564464;
  text-align: center;
  padding: 8px 20px;
  font-size: 12px;
  font-weight: 650;
}

/* Header */
.site-header {
  background: rgba(255, 255, 255, .97);
  border-bottom: 1px solid var(--color-border);
  position: sticky;
  top: 0;
  z-index: 40;
  backdrop-filter: blur(10px);
}
.header-inner {
  height: 80px;
  display: flex;
  align-items: center;
  gap: 28px;
}
.brand {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  color: var(--color-ink);
}
.brand img {
  height: 34px;
  width: auto;
}
.brand-compact { display: none; }
.nav {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0 1.35rem;
  font-size: 13.5px;
  font-weight: 650;
  margin-left: 1.1rem;
  max-width: none;
  flex: 1 1 auto;
  min-width: 0;
}
.nav a,
.nav .nav-link {
  color: var(--color-ink);
  transition: color var(--duration-fast);
}
.nav a:hover,
.nav .nav-link:hover { color: var(--color-plum-700); }
.nav-item {
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.nav-link {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  white-space: nowrap;
  padding: .65rem 0;
  letter-spacing: -.01em;
}
.nav-link--button {
  border: 0;
  background: transparent;
  font: inherit;
  font-weight: inherit;
  color: inherit;
  cursor: pointer;
  padding: .65rem 0;
}
.nav-item--more .nav-link {
  color: var(--color-plum-700);
}
.nav-caret {
  width: 0;
  height: 0;
  border-left: 3.5px solid transparent;
  border-right: 3.5px solid transparent;
  border-top: 4px solid currentColor;
  opacity: .55;
  translate: 0 1px;
}
.nav-item.has-dropdown:hover .nav-caret,
.nav-item.has-dropdown:focus-within .nav-caret {
  opacity: 1;
}
.nav-dropdown {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 50;
  min-width: 280px;
  max-width: min(520px, 88vw);
  /* Invisible bridge above the panel so the pointer never leaves .nav-item */
  padding: 12px .85rem .9rem;
  margin: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  transition: opacity .12s ease, visibility .12s ease;
}
.nav-dropdown::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  box-shadow: var(--shadow-popover);
  z-index: -1;
}
.nav-item.has-dropdown:hover > .nav-dropdown,
.nav-item.has-dropdown:focus-within > .nav-dropdown {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.nav-dropdown__all {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .2rem 0 .55rem;
  margin-bottom: .45rem;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-plum-700) !important;
  font-size: 12.5px;
}
.nav-dropdown__all span {
  color: var(--color-muted);
  font-weight: 600;
}
.nav-dropdown__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: .15rem .85rem;
  max-height: min(62vh, 420px);
  overflow: auto;
}
.nav-dropdown__list a {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .38rem 0;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--color-ink);
}
.nav-dropdown__count {
  color: var(--color-muted);
  font-weight: 500;
  font-size: 11.5px;
}
.nav-dropdown__list a:hover { color: var(--color-plum-700); }
.nav-dropdown--more {
  min-width: 260px;
  right: 0;
  left: auto;
}
.nav-more-list {
  list-style: none;
  margin: 0 0 .55rem;
  padding: 0 0 .55rem;
  border-bottom: 1px solid var(--color-border);
  display: grid;
  gap: .1rem;
}
.nav-more-list a {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .42rem 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-ink);
}
.nav-more-list a:hover { color: var(--color-plum-700); }
.nav-dropdown--more .nav-dropdown__all {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: .15rem;
}
.subcat-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  margin-top: 1.15rem;
  max-width: 52rem;
}
.subcat-strip a {
  color: var(--color-plum-700);
  font-size: .92rem;
  font-weight: 650;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in srgb, var(--color-plum-700) 35%, transparent);
}
.subcat-strip a:hover {
  color: var(--color-berry-700);
  text-decoration-color: currentColor;
}
.mobile-nav-item { width: 100%; }
.mobile-nav-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
}
.mobile-nav-row > a { flex: 1; }
.mobile-nav-expand {
  width: 36px;
  height: 36px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  color: var(--color-plum-700);
  flex-shrink: 0;
}
.mobile-nav-expand span {
  display: block;
  width: 10px;
  height: 10px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-1px, -1px);
  transition: transform .18s ease;
}
.mobile-nav-item.is-open .mobile-nav-expand span {
  transform: rotate(225deg) translate(-1px, -1px);
}
.mobile-nav-sub {
  display: none;
  list-style: none;
  margin: .15rem 0 .35rem;
  padding: 0 0 0 .65rem;
  border-left: 2px solid var(--color-lilac-100);
}
.mobile-nav-item.is-open .mobile-nav-sub { display: grid; gap: .1rem; }
.mobile-nav-sub a {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .45rem 0;
  font-size: .95rem;
  font-weight: 600;
}
.mobile-nav-sub a span {
  color: var(--color-muted);
  font-weight: 500;
  font-size: .82rem;
}
.header-search {
  margin-left: auto;
  display: flex;
  gap: 8px;
  width: min(340px, 100%);
}
.header-search input {
  flex: 1;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  padding: .65rem 1rem;
  background: var(--color-surface);
  min-width: 0;
}
.header-search input:focus {
  outline: none;
  box-shadow: var(--ring-focus);
  border-color: var(--color-plum-600);
}
.nav-toggle {
  display: none;
  margin-left: auto;
  background: none;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  place-items: center;
  cursor: pointer;
}
.mobile-nav {
  display: none;
  padding: 0 0 16px;
  border-top: 1px solid var(--color-border);
}
.mobile-nav.is-open { display: block; }
.mobile-nav .nav {
  flex-wrap: wrap;
  margin: 12px 0 0;
  gap: 14px;
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--color-plum-700);
  color: #fff !important;
  border: 1px solid var(--color-plum-700);
  border-radius: 11px;
  padding: 13px 20px;
  font-weight: 750;
  font-size: 13px;
  white-space: nowrap;
  cursor: pointer;
  transition: transform var(--duration-fast), background var(--duration-fast);
}
.btn:hover {
  background: #462c69;
  border-color: #462c69;
  transform: translateY(-1px);
  color: #fff !important;
}
.btn-secondary {
  background: #fff;
  color: var(--color-plum-700) !important;
  border-color: #d9cde4;
}
.btn-secondary:hover {
  background: var(--color-lilac-100);
  color: var(--color-plum-700) !important;
}
.btn-block { width: 100%; }

/* Hero — light lilac per designkoncept */
.hero {
  padding: 76px 0 70px;
  background:
    radial-gradient(circle at 72% 40%, #ece1f5 0, transparent 38%),
    linear-gradient(142deg, #fbf8fc 0%, #f7f2f9 58%, #f7eff5 100%);
}
.hero-layout {
  display: grid;
  grid-template-columns: 1.04fr .96fr;
  gap: 62px;
  align-items: center;
}
.hero h1 {
  font-size: clamp(42px, 4.6vw, 64px);
  font-weight: 800;
  margin: 18px 0;
  max-width: 580px;
  line-height: 1.06;
}
.hero h1 span { color: var(--color-plum-700); }
.hero-lead {
  font-size: 17px;
  line-height: 1.65;
  max-width: 560px;
  color: #635a69;
}
.hero-search {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  background: #fff;
  padding: 8px;
  border: 1px solid #dfd4e6;
  border-radius: 17px;
  box-shadow: 0 8px 30px rgba(88, 60, 126, .07);
  max-width: 590px;
}
.hero-search svg {
  margin-left: 14px;
  flex: none;
  color: #897e91;
}
.hero-search input {
  border: 0;
  outline: 0;
  min-width: 0;
  flex: 1;
  font-size: 14px;
  color: var(--color-ink);
  background: transparent;
}
.hero-search input:focus-visible { outline: none; }
.popular-tags {
  margin-top: 17px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--color-muted);
}
.tag {
  border: 1px solid #dcd1e5;
  border-radius: 40px;
  padding: 6px 12px;
  background: rgba(255, 255, 255, .72);
  color: #604f6b;
  font-weight: 650;
}
.tag:hover { border-color: var(--color-plum-600); color: var(--color-plum-700); }

/* Hero comparison card */
.comparison-visual {
  position: relative;
  padding: 40px 0 20px;
}
.abstract-orbit {
  position: absolute;
  width: 430px;
  height: 430px;
  border: 1px solid #e5d8ed;
  border-radius: 100%;
  left: 8%;
  top: -5%;
  pointer-events: none;
}
.abstract-orbit::after {
  content: "";
  position: absolute;
  inset: 34px;
  border: 1px solid #eadff0;
  border-radius: 100%;
}
.compare-card {
  position: relative;
  background: #fff;
  border: 1px solid #e5dce9;
  border-radius: 26px;
  padding: 28px 30px;
  box-shadow: 0 27px 75px rgba(69, 43, 89, .11);
  transform: rotate(1deg);
  z-index: 1;
}
.compare-card h3 {
  font-size: 21px;
  margin: 7px 0 19px;
}
.compare-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.tiny-brand {
  border-radius: 100px;
  padding: 7px 12px;
  background: var(--color-lilac-100);
  font-size: 11px;
  font-weight: 700;
  color: var(--color-plum-700);
}
.offer-mini {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 0;
  border-top: 1px solid #efeaf1;
}
.offer-mini .dot {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--color-lilac-100);
  font-size: 13px;
  font-weight: 800;
  color: var(--color-plum-700);
}
.offer-mini .offer-meta { flex: 1; }
.offer-mini strong { display: block; font-size: 12px; line-height: 1.3; }
.offer-mini small { color: var(--color-muted); font-size: 10px; }
.offer-mini .price {
  font-weight: 800;
  font-size: 16px;
  letter-spacing: -.04em;
}
.offer-mini.best {
  background: var(--color-lilac-50);
  margin: 0 -12px;
  padding: 15px 12px;
  border-radius: 12px;
  border: 1px solid #eadfee;
}
.compare-foot {
  border-top: 1px solid var(--color-border);
  padding-top: 15px;
  margin-top: 7px;
  font-size: 11px;
  color: var(--color-muted);
  display: flex;
  justify-content: space-between;
  gap: 15px;
}
.floating-note {
  position: absolute;
  z-index: 2;
  left: -28px;
  bottom: 1px;
  background: #fff;
  padding: 13px 17px;
  border-radius: 13px;
  box-shadow: 0 15px 50px rgba(69, 43, 89, .13);
  transform: rotate(-3deg);
  font-size: 12px;
  font-weight: 700;
}
.floating-note span {
  display: block;
  font-weight: 500;
  color: var(--color-muted);
  font-size: 11px;
}
.float-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--color-success);
  border-radius: 50%;
  margin-right: 5px;
}

/* Trust / stats */
.stats {
  background: #fff;
  border-block: 1px solid var(--color-border);
}
.stats .container {
  display: flex;
  justify-content: center;
  gap: 70px;
  padding: 21px 0;
  flex-wrap: wrap;
}
.stats span {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #5c5261;
  font-weight: 650;
  font-size: 12px;
}
.stats .mini-symbol {
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  background: #ede5f4;
  color: var(--color-plum-700);
  border-radius: 7px;
  font-weight: 900;
  font-size: 11px;
}

/* Sections */
.section { padding: 75px 0; }
.section-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: end;
  margin-bottom: 27px;
}
.section h2 { font-size: 35px; margin-top: 10px; }
.section-intro {
  max-width: 470px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--color-muted);
}
.text-link {
  font-size: 13px;
  color: var(--color-plum-700);
  font-weight: 750;
}

/* Categories */
.categories {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 14px;
}
.nav-all {
  font-weight: 700;
  color: var(--color-plum-700) !important;
}
.category-directory {
  display: grid;
  gap: 1.25rem;
  padding-bottom: 3rem;
}
.category-directory__block {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  padding: 1rem 1.15rem 1.1rem;
}
.category-directory__root {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: baseline;
  margin-bottom: .55rem;
}
.category-directory__name {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.03em;
}
.category-directory__count {
  color: var(--color-muted);
  font-size: .88rem;
  white-space: nowrap;
}
.category-directory__children {
  list-style: none;
  margin: 0;
  padding: .35rem 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: .35rem .75rem;
  border-top: 1px solid var(--color-border);
}
.category-directory__children a {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .35rem 0;
  font-size: .92rem;
  color: var(--color-ink);
}
.category-directory__children a span {
  color: var(--color-muted);
  font-size: .82rem;
}
.category-directory__children a:hover { color: var(--color-plum-700); }
.cat {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 18px;
  padding: 18px 16px;
  min-height: 165px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform var(--duration-medium), box-shadow var(--duration-medium);
  color: inherit;
}
.cat:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-card);
  color: inherit;
}
.cat-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  background: var(--color-lilac-50);
  border-radius: 16px;
  color: var(--color-plum-700);
  font-size: 21px;
  font-weight: 750;
  letter-spacing: -.06em;
}
.cat:nth-child(2) .cat-icon { background: #faedf1; color: var(--color-berry-700); }
.cat:nth-child(3) .cat-icon { background: #edf5f3; color: var(--color-success); }
.cat:nth-child(4) .cat-icon { background: #f1edf8; }
.cat:nth-child(5) .cat-icon { background: #f8f0e8; color: #92604d; }
.cat:nth-child(6) .cat-icon { background: #edf2f8; color: #3d5a80; }
.cat-name {
  font-size: 13px;
  font-weight: 790;
  line-height: 1.3;
  margin-top: 23px;
}
.cat-more {
  font-size: 11px;
  color: var(--color-muted);
  margin-top: 5px;
}

/* Products */
.product-badge {
  display: inline-block;
  margin: 0 0 .45rem;
  padding: .2rem .55rem;
  border-radius: var(--radius-sm);
  background: var(--color-lilac-100);
  color: var(--color-plum-700);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.product-section--trending {
  background:
    linear-gradient(180deg, rgba(243, 237, 248, .55), rgba(251, 249, 252, 0) 42%),
    var(--color-canvas);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.product-section {
  background: #fff;
  padding-top: 64px;
  padding-bottom: 74px;
}
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 15px;
}
.product-card {
  border: 1px solid #eee8ee;
  border-radius: 17px;
  background: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-width: 0;
  transition: box-shadow .18s, transform .18s, border-color .18s;
  color: inherit;
}
.product-card:hover {
  box-shadow: 0 16px 40px rgba(74,46,70,.08);
  border-color: #dacbda;
  transform: translateY(-2px);
  color: inherit;
}
.product-card .art {
  height: 210px;
  background: #fff;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.product-card .art-link {
  position: absolute; inset: 0; z-index: 1;
  display: block;
}
.product-card .art img {
  position: absolute; inset: 0; z-index: 1;
  width: 100%; height: 100%;
  object-fit: contain;
  object-position: center;
  padding: 0; margin: 0;
}
.product-card .art .tag {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  border-radius: 100px; background: rgba(255,255,255,.9);
  padding: 5px 10px; color: #776779; font-size: 9px; font-weight: 800;
}
.product-card .card-body {
  padding: 16px; flex: 1; display: flex; flex-direction: column;
}
.product-card .brandline {
  font-size: 9px; text-transform: uppercase; letter-spacing: .11em;
  font-weight: 800; color: #8e7f8c;
}
.product-card .card-title {
  font-family: var(--font-heading);
  font-size: 14px; line-height: 1.38; font-weight: 800;
  letter-spacing: -.02em; min-height: 40px; margin: 7px 0 12px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; color: inherit;
}
.product-card .feature-tags {
  display: flex; flex-wrap: wrap; gap: 5px; min-height: 24px; margin-bottom: 12px;
}
.product-card .feature-tags span {
  border-radius: 100px; background: #f8f3f8; color: #826f83;
  padding: 5px 8px; font-size: 9px; font-weight: 680;
}
.product-card .price-row {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 7px; margin-top: auto; padding-top: 11px; border-top: 1px solid #f0eaf0;
}
.product-card .fromsmall {
  display: block; font-size: 10px; color: #8f818e; font-weight: 600;
}
.product-card .price {
  font-size: 22px; letter-spacing: -.055em; font-weight: 850;
  color: #3a293b; line-height: 1.16; margin-top: 1px;
}
.product-card .offertext {
  color: #736774; font-size: 10px; font-weight: 700;
  padding-bottom: 4px; white-space: nowrap;
}
.product-card .compare {
  background: #4a2e46; color: #fff; width: 100%; margin-top: 14px;
  border: none; min-height: 39px; border-radius: 10px; font-size: 11px;
  font-weight: 800; display: flex; align-items: center; justify-content: center; gap: 9px;
}
.product-card .compare:hover { background: #674363; color: #fff; }

/* How it works */
.section-split {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 60px;
  align-items: center;
}
.feature-panel {
  padding: 36px;
  border-radius: 26px;
  background: linear-gradient(143deg, #34253f, #55386b);
  color: #fff;
  box-shadow: 0 25px 60px rgba(53, 39, 63, .14);
}
.feature-panel h3 { font-size: 22px; color: #fff; margin-top: 4px; }
.feature-panel .quote {
  font-size: 13px;
  color: #e6dceb;
  line-height: 1.65;
  margin-top: 12px;
}
.panel-offer {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 15px 0;
  border-top: 1px solid rgba(255, 255, 255, .19);
}
.panel-offer:first-of-type { margin-top: 18px; }
.panel-offer .merchant-name { flex: 1; font-size: 13px; font-weight: 650; }
.panel-offer span { font-size: 11px; color: #e9dceb; display: block; font-weight: 450; }
.panel-offer strong { font-size: 17px; }
.pill-light {
  padding: 5px 8px;
  border-radius: 7px;
  background: rgba(255, 255, 255, .13);
  font-size: 10px;
}
.steps { display: grid; gap: 24px; margin-top: 26px; }
.step { display: flex; align-items: flex-start; gap: 14px; }
.step-number {
  height: 32px;
  width: 32px;
  flex: none;
  border-radius: 10px;
  background: var(--color-lilac-100);
  color: var(--color-plum-700);
  display: grid;
  place-items: center;
  font-size: 13px;
  font-weight: 850;
}
.step strong { font-size: 14px; }
.step p {
  font-size: 13px;
  color: var(--color-muted);
  margin-top: 3px;
  line-height: 1.6;
}

/* Editorial CTA */
.editorial { padding: 55px 0 0; }
.quote-card {
  background: var(--color-lilac-100);
  border-radius: 26px;
  padding: 39px 43px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
}
.quote-card h2 { font-size: 30px; max-width: 550px; }
.quote-card p {
  max-width: 480px;
  color: #5e5367;
  font-size: 14px;
  margin-top: 10px;
}

/* Product page */
.product-hero {
  display: grid;
  gap: 32px;
  grid-template-columns: 1fr;
  padding: 40px 0;
}
@media (min-width: 900px) {
  .product-hero { grid-template-columns: 1fr 1.1fr; align-items: start; }
}
.product-stage {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-feature);
  position: relative;
  min-height: 360px;
  height: min(52vw, 480px);
  overflow: hidden;
}
.product-stage > img {
  position: absolute;
  inset: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  max-width: none;
  margin: 0;
  object-fit: contain;
  object-position: center;
}
.product-stage-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 12px;
  color: var(--color-muted);
  font-size: .95rem;
}
.product-stage-empty img {
  position: static;
  width: 96px;
  height: 96px;
  inset: auto;
}
.badge {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .25rem .7rem;
  border-radius: var(--radius-pill);
  background: var(--color-lilac-100);
  color: var(--color-plum-700);
  font-size: .8rem;
  font-weight: 600;
}
.offer-list { display: grid; gap: 12px; margin-top: 16px; }
.offer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface);
}
.offer-row .merchant { font-weight: 600; }
.offer-row .price { font-size: 1.15rem; font-weight: 700; }

.breadcrumbs {
  font-size: 13px;
  color: var(--color-muted);
  margin: 20px 0 0;
}
.breadcrumbs a { color: var(--color-muted); }
.breadcrumbs a:hover { color: var(--color-plum-700); }

/* Footer */
/* Legacy site-footer styles kept inert; global footer lives in footer.css */
.site-footer {
  display: none;
}
.footer-grid {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 40px;
}
.site-footer .brand img { height: 32px; filter: brightness(0) invert(1); }
.site-footer p {
  font-size: 12px;
  max-width: 570px;
  color: #d3cbd8;
  margin-top: 18px;
  line-height: 1.7;
}
.footer-side {
  font-size: 12px;
  color: #d3cbd8;
  text-align: right;
  line-height: 2;
}
.footer-side a { color: #d3cbd8; }
.footer-side a:hover { color: #fff; }
.foot-bottom {
  border-top: 1px solid #63546d;
  margin-top: 34px;
  padding-top: 19px;
  color: #c9c0ce;
  font-size: 11px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.empty {
  padding: 40px;
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-card);
  color: var(--color-muted);
  text-align: center;
  background: #fff;
}

/* Category page */
.category-hero { padding: 36px 0 12px; }
.category-hero h1 { font-size: clamp(30px, 3vw, 40px); margin-top: 10px; }
.category-hero .lead {
  max-width: 65ch;
  color: var(--color-muted);
  margin-top: 10px;
}

/* Search page */
.search-page { padding: 36px 0 64px; }
.search-page h1 { font-size: 32px; margin-bottom: 20px; }

.catalog-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  align-items: end;
  margin: 0 0 1.35rem;
  padding: .9rem 1rem;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
}
.catalog-toolbar__group {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  min-width: 150px;
}
.catalog-toolbar__group label,
.catalog-toolbar__check {
  font-size: .78rem;
  font-weight: 600;
  color: var(--color-muted);
  letter-spacing: .02em;
}
.catalog-toolbar__group select {
  appearance: none;
  padding: .55rem .75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236d6574' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right .7rem center;
  padding-right: 1.8rem;
  font: inherit;
  color: var(--color-ink);
  min-width: 170px;
}
.catalog-toolbar__check {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin-bottom: .35rem;
  cursor: pointer;
  color: var(--color-ink);
  font-weight: 500;
}
.catalog-toolbar__reset {
  margin-left: auto;
  align-self: center;
  font-size: .88rem;
  color: var(--color-plum-700);
  font-weight: 600;
}
.catalog-pager {
  margin-top: 2rem;
}
.catalog-pager nav {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.catalog-pager a,
.catalog-pager span {
  display: inline-block;
  padding: .4rem .7rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background: #fff;
  font-size: .88rem;
}
.catalog-pager a:hover { border-color: var(--color-plum-700); color: var(--color-plum-700); }
@media (max-width: 640px) {
  .catalog-toolbar__reset { margin-left: 0; width: 100%; }
}

/* Responsive */
@media (max-width: 1170px) {
  .nav { gap: 0 1.05rem; font-size: 13px; }
  .header-inner { gap: 15px; }
  .categories { grid-template-columns: repeat(3, 1fr); }
  .hero-layout { gap: 25px; }
}
@media (max-width: 950px) {
  .header-inner > .nav,
  .header-search { display: none; }
  .nav-toggle { display: grid; }
  .mobile-nav.is-open .nav { display: flex; flex-direction: column; align-items: stretch; }
  .brand-desktop { display: none; }
  .brand-compact { display: block; height: 30px; }
  .header-inner { height: 70px; }
  .hero-layout { grid-template-columns: 1fr; }
  .hero { padding: 61px 0; }
  .comparison-visual { max-width: 490px; margin: 0 auto; width: 100%; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-split { grid-template-columns: 1fr; gap: 35px; }
  .feature-copy { order: -1; }
  .footer-grid { display: block; }
  .footer-side { text-align: left; margin-top: 25px; }
}
@media (max-width: 640px) {
  .hero { padding: 45px 0 37px; }
  .hero h1 { font-size: 40px; }
  .hero-lead { font-size: 15px; }
  .hero-search { padding: 6px; gap: 7px; }
  .hero-search .btn { padding: 12px; font-size: 11px; }
  .abstract-orbit { display: none; }
  .floating-note { left: 0; bottom: -5px; }
  .stats .container { gap: 11px; justify-content: space-between; }
  .stats span { font-size: 10px; }
  .section { padding: 50px 0; }
  .section h2 { font-size: 27px; }
  .categories { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .cat { min-height: 135px; padding: 14px; }
  .product-grid { gap: 10px; }
  .product-card .art { height: 176px; }
  .product-card .card-title { font-size: 12px; min-height: 34px; }
  .product-card .price { font-size: 19px; }
  .quote-card { padding: 26px; display: block; }
  .quote-card h2 { font-size: 27px; }
  .quote-card .btn { margin-top: 16px; }
  .foot-bottom { display: block; }
  .foot-bottom span { display: block; margin-top: 8px; }
}

/* ============================================================
   Product page (designpaket) — scoped under .product-page
   ============================================================ */
.product-page {
  --pp-ink: var(--color-ink);
  --pp-dark: #4a2e46;
  --pp-plum: var(--color-plum-700);
  --pp-rose: #b98ca1;
  --pp-rose-light: #f4eaef;
  --pp-line: var(--color-border);
  --pp-muted: var(--color-muted);
  --pp-shadow: var(--shadow-card);
  padding-bottom: 48px;
}
.product-page .pp-breadcrumbs {
  display: flex; gap: 9px; align-items: center; flex-wrap: wrap;
  color: #8b848b; font-size: 12px; padding: 28px 0 27px;
}
.product-page .pp-breadcrumbs a:hover { text-decoration: underline; color: var(--pp-plum); }
.product-page .pp-breadcrumbs__current { color: var(--pp-ink); font-weight: 550; }

.product-page .pp-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
  gap: 51px;
  align-items: start;
}

.product-page .pp-gallery { min-width: 0; }
.product-page .pp-photo-stage {
  height: 560px; border-radius: 22px; overflow: hidden; position: relative;
  background: #fff;
  border: 1px solid #f1e9ee;
}
.product-page .pp-photo-stage > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
.product-page .pp-photo-empty {
  position: absolute; inset: 0;
  display: grid; place-items: center; gap: 12px; color: var(--pp-muted); font-size: 13px;
}
.product-page .pp-thumb-row { display: flex; gap: 12px; margin-top: 13px; }
.product-page .pp-thumb {
  width: 86px; height: 86px; display: grid; place-items: center; padding: 0;
  background: #fff; border: 1.5px solid #e7e0e6; border-radius: 13px; cursor: pointer;
  overflow: hidden;
}
.product-page .pp-thumb:hover { border-color: #bd9db5; }
.product-page .pp-thumb[aria-pressed="true"] { border: 2px solid var(--pp-dark); background: #f7eef5; }
.product-page .pp-thumb img { width: 100%; height: 100%; object-fit: contain; }

.product-page .pp-product-top {
  display: flex; align-items: center; justify-content: space-between; gap: 15px;
}
.product-page .pp-eyebrow {
  font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--pp-plum);
}
.product-page .pp-eyebrow-sep { color: #c7bac5; margin: 0 .35em; }
.product-page .pp-share-actions { display: flex; gap: 7px; }
.product-page .pp-icon-btn {
  width: 38px; height: 38px; border-radius: 50%; border: 1px solid #e6dee5;
  background: #fff; display: grid; place-items: center; color: var(--pp-plum); cursor: pointer;
}
.product-page .pp-icon-btn:hover,
.product-page .pp-icon-btn[aria-pressed="true"] { background: var(--pp-rose-light); }

.product-page .pp-summary h1 {
  font-size: clamp(28px, 3.1vw, 42px); font-weight: 770; letter-spacing: -.055em;
  line-height: 1.11; margin: 13px 0 15px; max-width: 570px;
}
.product-page .pp-intro { font-size: 14px; color: #6b606c; line-height: 1.7; max-width: 550px; }
.product-page .pp-highlights { display: flex; gap: 9px; flex-wrap: wrap; margin: 19px 0 27px; }
.product-page .pp-chip {
  display: inline-flex; gap: 7px; align-items: center; background: #f5edf3;
  border: 1px solid #eee1eb; color: #59445a; border-radius: 100px; padding: 8px 12px;
  font-size: 11px; font-weight: 750;
}
.product-page .pp-chip svg { color: #7a5978; }
.product-page .pp-mini-divider { border: 0; border-top: 1px solid var(--pp-line); margin: 0 0 25px; }

.product-page .pp-price-box {
  border: 1px solid #e7dfe5; border-radius: 20px; background: #fff;
  box-shadow: var(--pp-shadow); overflow: hidden;
}
.product-page .pp-price-head {
  display: flex; justify-content: space-between; align-items: center; gap: 15px;
  padding: 23px 25px 20px; border-bottom: 1px solid #f1eaf0;
  background: linear-gradient(95deg, #fff 0, #fdf9fc 100%);
}
.product-page .pp-price-label { font-size: 12px; color: #7a717a; font-weight: 650; }
.product-page .pp-lowest { display: flex; align-items: baseline; gap: 10px; margin: 2px 0 5px; }
.product-page .pp-lowest strong {
  font-size: 34px; letter-spacing: -.065em; line-height: 1.1; color: var(--pp-dark);
}
.product-page .pp-lowest span { color: #7b737b; font-size: 13px; }
.product-page .pp-offers-count {
  font-size: 11px; color: #817681; display: flex; align-items: center; gap: 7px;
}
.product-page .pp-pulse {
  width: 7px; height: 7px; border-radius: 50%; background: #3c9970;
}
.product-page .pp-outline-btn {
  display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d8c5d4;
  background: white; color: var(--pp-dark); padding: 10px 12px; border-radius: 11px;
  font-weight: 800; font-size: 11px; white-space: nowrap; cursor: pointer;
}
.product-page .pp-outline-btn:hover { background: #fcf6fb; }
.product-page .pp-sort-line {
  padding: 11px 22px 5px; display: flex; justify-content: space-between;
  align-items: center; gap: 9px; font-size: 11px; color: #8c828c;
}
.product-page .pp-sort-line select {
  border: none; background: transparent; color: #4f4353; font-weight: 700;
  font-size: 11px; cursor: pointer;
}

.product-page .pp-offer {
  display: grid; grid-template-columns: minmax(0, 1fr) 92px 101px; gap: 10px;
  align-items: center; padding: 16px 22px; border-bottom: 1px solid #f0ebef;
}
/* display:grid above would otherwise override the HTML hidden attribute */
.product-page .pp-offer[hidden],
.product-page .pp-offer.is-collapsed {
  display: none !important;
}
.product-page .pp-offer:first-child { background: #fffcfe; }
.product-page .pp-merchant { display: flex; align-items: center; gap: 11px; min-width: 0; }
.product-page .pp-merchant-logo {
  width: 32px; height: 32px; border: 1px solid #ece6eb; background: #f8f4f7;
  border-radius: 9px; display: grid; place-items: center; color: #593c53;
  font-size: 13px; font-weight: 900; flex-shrink: 0;
}
.product-page .pp-merchant-info { min-width: 0; }
.product-page .pp-merchant-info strong {
  font-size: 12px; font-weight: 800; display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
}
.product-page .pp-best-label {
  font-size: 9px; letter-spacing: .01em; font-weight: 750; color: #78513c;
  border-radius: 100px; background: #f8eadb; padding: 3px 7px; white-space: nowrap;
}
.product-page .pp-merchant-info small {
  display: block; color: #8b808c; font-size: 10px; line-height: 1.45; margin-top: 3px;
}
.product-page .pp-offer-price { text-align: right; }
.product-page .pp-offer-price strong {
  display: block; color: #332733; font-size: 17px; letter-spacing: -.04em; font-weight: 800;
}
.product-page .pp-offer-price small { display: block; color: #847984; font-size: 10px; white-space: nowrap; }
.product-page .pp-go-button {
  background: var(--pp-dark); border: 1px solid var(--pp-dark); color: white;
  padding: 10px 12px; border-radius: 10px; display: flex; justify-content: center;
  align-items: center; gap: 7px; font-size: 11px; font-weight: 780; white-space: nowrap;
}
.product-page .pp-go-button:hover { background: #6c4a68; color: #fff; }
.product-page .pp-more-offers {
  padding: 15px 22px 17px; background: #fff; display: flex; justify-content: center;
}
.product-page .pp-more-offers button {
  display: flex; align-items: center; gap: 8px; border: 0; color: var(--pp-plum);
  background: transparent; font-weight: 800; font-size: 12px; cursor: pointer;
}
.product-page .pp-more-offers button[aria-expanded="true"] svg { transform: rotate(180deg); }
.product-page .pp-empty-offers { padding: 24px; color: var(--pp-muted); font-size: 13px; }
.product-page .pp-affiliate-note {
  color: #827985; font-size: 10px; line-height: 1.55; margin-top: 14px; padding: 0 3px;
}
.product-page .pp-trust-row {
  display: flex; align-items: center; gap: 9px; margin-top: 20px; font-size: 11px; color: #716871;
}
.product-page .pp-trust-row svg { color: var(--pp-plum); flex-shrink: 0; }

.product-page .pp-section-tabs {
  margin-top: 65px; border-top: 1px solid var(--pp-line); border-bottom: 1px solid var(--pp-line);
  background: rgba(255,255,255,.9); position: sticky; top: 0; z-index: 30;
}
.product-page .pp-tabs-inner { display: flex; gap: 37px; overflow: auto; scrollbar-width: none; }
.product-page .pp-tabs-inner a {
  font-size: 12px; font-weight: 750; color: #7d747e; padding: 17px 0;
  white-space: nowrap; border-bottom: 2px solid transparent;
}
.product-page .pp-tabs-inner a:hover { color: var(--pp-dark); border-color: var(--pp-dark); }

.product-page .pp-section { padding: 74px 0 0; }
.product-page .pp-section-heading {
  font-size: 30px; font-weight: 770; letter-spacing: -.05em; margin-bottom: 14px;
}
.product-page .pp-section-lead {
  font-size: 14px; color: #7a707b; max-width: 590px; line-height: 1.75;
}
.product-page .pp-details-grid {
  display: grid; grid-template-columns: 1.25fr .75fr; gap: 64px;
}
.product-page .pp-copy-block {
  max-width: 710px; color: #5d5660; font-size: 14px; line-height: 1.85; margin-top: 25px;
}
.product-page .pp-copy-block p + p { margin-top: 16px; }
.product-page .pp-benefits {
  display: grid; grid-template-columns: 1fr 1fr; gap: 15px 17px; margin-top: 27px;
}
.product-page .pp-benefit {
  display: flex; align-items: flex-start; gap: 10px; font-size: 13px; color: #4d4350;
}
.product-page .pp-benefit svg { color: #855d7f; flex-shrink: 0; margin-top: 2px; }
.product-page .pp-side-note {
  border-radius: 19px; padding: 29px; background: #f3ecf1; border: 1px solid #ecdfeb; align-self: start;
}
.product-page .pp-mini-overline {
  font-size: 10px; text-transform: uppercase; letter-spacing: .15em; font-weight: 800; color: #865a7e;
}
.product-page .pp-side-note h3 { font-size: 20px; margin: 10px 0 12px; }
.product-page .pp-side-note p { font-size: 12px; color: #655c65; line-height: 1.8; }
.product-page .pp-fact-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 17px; }
.product-page .pp-fact-tags span {
  border: 1px solid #e5d6e1; background: rgba(255,255,255,.58); padding: 7px 10px;
  border-radius: 9px; color: #60435b; font-size: 11px; font-weight: 700;
}

.product-page .pp-spec {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px 60px; margin-top: 28px;
}
.product-page .pp-spec div {
  border-bottom: 1px solid #e8e1e6; padding-bottom: 14px;
  display: flex; justify-content: space-between; gap: 30px; font-size: 13px;
}
.product-page .pp-spec dt { color: #827782; }
.product-page .pp-spec dd { margin: 0; text-align: right; font-weight: 700; color: #413744; }

.product-page .pp-price-history-card {
  display: grid; grid-template-columns: 1fr 1fr; gap: 25px; background: #fff;
  border: 1px solid var(--pp-line); border-radius: 20px; margin-top: 26px;
  padding: 31px 34px; align-items: center;
}
.product-page .pp-history-info h3 { font-size: 24px; margin: 8px 0 10px; }
.product-page .pp-history-info p {
  max-width: 360px; color: #807581; font-size: 12px; line-height: 1.75;
}
.product-page .pp-chart-wrap {
  position: relative;
  touch-action: pan-y;
  cursor: crosshair;
}
.product-page .pp-chart-svg { display: block; width: 100%; max-height: 145px; overflow: visible; }
.product-page .pp-chart-line {
  stroke: #7f5879; stroke-width: 3; fill: none; stroke-linecap: round; stroke-linejoin: round;
  pointer-events: stroke;
}
.product-page .pp-chart-fill { fill: #b98ca1; opacity: .12; pointer-events: none; }
.product-page .pp-axis { stroke: #ded6dc; stroke-width: 1; stroke-dasharray: 4 5; pointer-events: none; }
.product-page .pp-chart-guide {
  stroke: #4a2e46; stroke-width: 1; stroke-dasharray: 3 4; opacity: .45; pointer-events: none;
}
.product-page .pp-chart-dot { pointer-events: none; }
.product-page .pp-chart-tooltip {
  position: absolute;
  transform: translate(-50%, -100%);
  background: #2f2433;
  color: #fff;
  border-radius: 10px;
  padding: 8px 11px;
  font-size: 11px;
  line-height: 1.35;
  pointer-events: none;
  box-shadow: 0 10px 28px rgba(40, 28, 42, .22);
  z-index: 4;
  white-space: nowrap;
  text-align: center;
}
.product-page .pp-chart-tooltip strong {
  display: block;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.product-page .pp-chart-tooltip span {
  display: block;
  margin-top: 2px;
  color: #d7cad6;
  font-size: 10px;
}
.product-page .pp-chart-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -5px;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #2f2433;
}
.product-page .pp-chart-sub {
  font-size: 10px; color: #918791; margin-top: 10px; display: flex; justify-content: space-between;
}
.product-page .pp-history-empty {
  min-height: 120px; display: grid; place-items: center; border: 1px dashed #e0d6df;
  border-radius: 14px; color: #918791; font-size: 13px; background: #faf7fa; padding: 24px; text-align: center;
}

.product-page .pp-faq {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 27px;
}
.product-page .pp-faq details {
  border: 1px solid #e8e1e7; background: white; border-radius: 13px; padding: 17px 20px;
}
.product-page .pp-faq summary {
  font-size: 13px; font-weight: 750; cursor: pointer; list-style: none;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.product-page .pp-faq summary::-webkit-details-marker { display: none; }
.product-page .pp-faq summary::after { content: '+'; font-size: 19px; font-weight: 400; color: #806b7c; }
.product-page .pp-faq details[open] summary::after { content: '−'; }
.product-page .pp-faq details p {
  font-size: 12px; color: #7b727b; margin-top: 13px; line-height: 1.7;
}

.product-page .pp-bottom-cta {
  margin: 79px 0 24px; background: #4a2e46; color: #fff; border-radius: 23px;
  display: flex; justify-content: space-between; gap: 25px; align-items: center; padding: 35px 41px;
}
.product-page .pp-bottom-cta h2 {
  font-family: Georgia, 'Times New Roman', serif; font-size: 31px; font-weight: 450;
  line-height: 1.16; letter-spacing: -.02em; color: #fff;
}
.product-page .pp-bottom-cta p { color: #e2d3de; font-size: 12px; margin-top: 8px; }
.product-page .pp-light-btn {
  border: 0; background: #fff; color: #4a2e46; padding: 13px 19px; border-radius: 11px;
  font-size: 12px; font-weight: 800; white-space: nowrap;
}
.product-page .pp-light-btn:hover { color: #4a2e46; opacity: .92; }

.product-page .pp-mobile-bar {
  display: none;
}
.product-page .pp-modal-backdrop {
  position: fixed; inset: 0; background: rgba(28,19,29,.56); display: none;
  align-items: center; justify-content: center; padding: 16px; z-index: 120;
}
.product-page .pp-modal-backdrop.is-open { display: flex; }
.product-page .pp-modal {
  position: relative; background: #fff; padding: 30px; border-radius: 20px;
  max-width: 440px; width: 100%; box-shadow: 0 30px 90px rgba(0,0,0,.2);
}
.product-page .pp-modal h2 { font-size: 22px; margin: 8px 0 13px; }
.product-page .pp-modal p { font-size: 13px; color: #746b75; line-height: 1.8; }
.product-page .pp-close-modal {
  position: absolute; right: 16px; top: 15px; border: 0; background: #f6f0f5;
  border-radius: 50%; width: 30px; height: 30px; display: grid; place-items: center; cursor: pointer;
}

@media (max-width: 1100px) {
  .product-page .pp-main-grid { gap: 30px; }
  .product-page .pp-photo-stage { height: 500px; }
  .product-page .pp-offer { grid-template-columns: minmax(0,1fr) 84px 93px; gap: 5px; padding: 15px; }
  .product-page .pp-details-grid { gap: 40px; }
}
@media (max-width: 850px) {
  .product-page .pp-main-grid { grid-template-columns: minmax(0,1fr); gap: 30px; }
  .product-page .pp-gallery { max-width: 680px; margin: auto; width: 100%; }
  .product-page .pp-photo-stage { height: 480px; }
  .product-page .pp-details-grid { grid-template-columns: 1fr; }
  .product-page .pp-price-history-card { grid-template-columns: 1fr; }
  .product-page .pp-faq { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .product-page { padding-bottom: 96px; }
  .product-page .pp-breadcrumbs { padding: 18px 0; font-size: 10px; }
  .product-page .pp-photo-stage { height: 340px; border-radius: 15px; }
  .product-page .pp-thumb { width: 64px; height: 64px; }
  .product-page .pp-summary h1 { font-size: 28px; }
  .product-page .pp-price-head { padding: 20px 17px 16px; flex-wrap: wrap; }
  .product-page .pp-lowest strong { font-size: 28px; }
  .product-page .pp-offer {
    grid-template-columns: minmax(0,1fr) 70px 73px; padding: 13px 11px; gap: 5px;
  }
  .product-page .pp-section { padding-top: 48px; }
  .product-page .pp-section-heading { font-size: 25px; }
  .product-page .pp-benefits { grid-template-columns: 1fr; }
  .product-page .pp-spec { grid-template-columns: 1fr; }
  .product-page .pp-price-history-card { padding: 24px 18px; }
  .product-page .pp-bottom-cta { margin: 55px 0 24px; padding: 26px; display: block; }
  .product-page .pp-bottom-cta h2 { font-size: 26px; }
  .product-page .pp-light-btn { display: inline-block; margin-top: 20px; }
  .product-page .pp-mobile-bar {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 65;
    background: #fff; border-top: 1px solid #eae0e7;
    box-shadow: 0 -5px 25px rgba(44,29,43,.07);
    padding: 10px 16px max(10px, env(safe-area-inset-bottom));
    justify-content: space-between; align-items: center; gap: 12px;
  }
  .product-page .pp-mobile-bar strong { font-size: 19px; letter-spacing: -.05em; }
  .product-page .pp-mobile-bar small { display: block; color: #8b818d; font-size: 10px; }
  .product-page .pp-mobile-bar a {
    background: #4a2e46; color: #fff; border-radius: 11px; padding: 12px 15px;
    font-size: 12px; font-weight: 800; white-space: nowrap;
  }
  .product-page .pp-mobile-bar a:hover { color: #fff; }
  .product-page .pp-mobile-bar.is-hidden { display: none; }
}

/* —— Catalog / PLP (designpaket) —— */
.catalog-page { padding-bottom: 40px; }
.catalog-page .cat-crumb {
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  font-size: 12px; color: #918894; padding: 22px 0 18px;
}
.catalog-page .cat-crumb a:hover { color: #4a2e46; }
.catalog-page .cat-crumb b { font-weight: 600; color: #5e5361; }
.catalog-page .cat-hero {
  display: flex; justify-content: space-between; align-items: center;
  background: linear-gradient(112deg, #fbf2f5 0%, #f7eef7 48%, #f5f0f6 100%);
  border: 1px solid #f0e7f0; border-radius: 24px; padding: 28px 40px;
  overflow: hidden; position: relative; min-height: 160px; margin-bottom: 0;
}
.catalog-page .cat-hero-content { position: relative; z-index: 1; max-width: 680px; }
.catalog-page .cat-eyebrow {
  color: #815f7d; font-size: 10px; font-weight: 800; letter-spacing: .17em;
}
.catalog-page .cat-hero h1 {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(28px, 3.2vw, 42px); line-height: 1.08; margin: 10px 0;
  letter-spacing: -.045em;
}
.catalog-page .cat-hero-query { font-weight: 650; color: #6a5568; }
.catalog-page .cat-hero p {
  font-size: 13px; max-width: 590px; color: #726674; line-height: 1.7; margin: 0;
}
.catalog-page .cat-hero-emblem {
  position: absolute; width: 280px; height: 280px; right: 30px; top: -70px;
  border: 1px solid #e4d2df; border-radius: 50%;
  box-shadow: 0 0 0 24px rgba(255,255,255,.25), 0 0 0 52px rgba(255,255,255,.13);
  pointer-events: none;
}
.catalog-page .cat-search-bar {
  display: flex; align-items: center; gap: 10px; margin: 18px 0 6px;
  background: #fff; border: 1px solid #e9e0e7; border-radius: 12px;
  padding: 0 14px; max-width: 520px; height: 46px;
}
.catalog-page .cat-search-bar input {
  flex: 1; border: 0; background: none; outline: 0; font-size: 13px; min-width: 0;
}
.catalog-page .cat-search-bar button {
  border: 0; background: #4a2e46; color: #fff; border-radius: 9px;
  padding: 8px 14px; font-weight: 800; font-size: 12px; cursor: pointer;
}
.catalog-page .cat-scroller {
  display: flex; gap: 10px; overflow-x: auto; overflow-y: hidden;
  padding: 28px 0 14px;
  margin-bottom: 12px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: #c9b7c9 transparent;
}
.catalog-page .cat-scroller::-webkit-scrollbar {
  height: 6px;
}
.catalog-page .cat-scroller::-webkit-scrollbar-track {
  background: transparent;
  margin-inline: 2px;
}
.catalog-page .cat-scroller::-webkit-scrollbar-thumb {
  background: #c9b7c9;
  border-radius: 100px;
}
.catalog-page .cat-scroller::-webkit-scrollbar-thumb:hover {
  background: #a994aa;
}
.catalog-page .cat-pill {
  display: flex; align-items: center; gap: 8px; border: 1px solid #e7dfe7;
  background: #fff; border-radius: 100px; padding: 11px 16px; white-space: nowrap;
  font-size: 12px; font-weight: 750; color: #67586a; min-height: 42px;
  flex-shrink: 0; scroll-snap-align: start;
}
.catalog-page .cat-pill:hover { border-color: #bca9bc; background: #fdfbfe; color: inherit; }
.catalog-page .cat-pill.is-active {
  background: #4a2e46; color: #fff; border-color: #4a2e46;
}
.catalog-page .cat-pill small { font-size: 10px; opacity: .75; }
.catalog-page .cat-dot {
  display: inline-block; width: 7px; height: 7px; border: 2px solid currentColor; border-radius: 50%;
}
.catalog-page .cat-subpills {
  display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 18px;
}
.catalog-page .cat-subpills a {
  font-size: 11px; font-weight: 700; color: #6d5d70; border: 1px solid #e8dfe8;
  background: #fff; border-radius: 100px; padding: 7px 12px;
}
.catalog-page .cat-subpills a.is-active,
.catalog-page .cat-subpills a:hover { background: #f3eaf4; color: #4a2e46; }
.catalog-page .cat-promo {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 6px 0 22px; border-bottom: 1px solid #e9e2eb;
}
.catalog-page .cat-promo h2 { font-size: 16px; font-weight: 800; margin: 0; }
.catalog-page .cat-promo p { font-size: 12px; color: #857b85; margin: 4px 0 0; }
.catalog-page .cat-promo-note {
  font-size: 11px; color: #7d6b7b; display: flex; gap: 8px; align-items: center; flex-shrink: 0;
}
.catalog-page .cat-layout {
  display: grid; grid-template-columns: 268px minmax(0,1fr); gap: 28px; padding: 26px 0 50px;
}
.catalog-page .cat-filter-card {
  border: 1px solid #e9e2e9; background: #fff; border-radius: 18px; padding: 22px;
  position: sticky; top: 100px; max-height: calc(100vh - 120px); overflow: auto; scrollbar-width: thin;
}
.catalog-page .cat-filter-head {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 16px; border-bottom: 1px solid #e9e2eb;
}
.catalog-page .cat-filter-head h2 { font-size: 17px; margin: 0; }
.catalog-page .cat-text-btn {
  font-size: 11px; font-weight: 800; color: #583c7e; background: none; border: 0; padding: 5px;
}
.catalog-page .cat-fgroup { padding: 16px 0; border-bottom: 1px solid #eee9ef; }
.catalog-page .cat-fgroup:last-child { border-bottom: 0; }
.catalog-page .cat-fgroup-title { font-weight: 800; font-size: 12px; margin-bottom: 14px; }
/* Quiet list filter — same control language as .sortselect, not header search */
.catalog-page .cat-brand-filter {
  display: block; width: 100%; box-sizing: border-box;
  height: 36px; margin: -2px 0 12px; padding: 0 12px;
  border: 1px solid #e8dfe8; border-radius: 11px;
  background: #fff; color: #554b57; font-size: 12px;
}
.catalog-page .cat-brand-filter::placeholder { color: #9a8e9c; }
.catalog-page .cat-brand-filter:focus {
  outline: 3px solid #7c5682; outline-offset: 2px; border-color: #d5c4d8;
}
.catalog-page .cat-brand-empty {
  margin: 4px 0 0; font-size: 11px; color: #887b88;
}
.catalog-page [data-brand-facet].is-brand-filtering [data-brand-list] {
  max-height: 280px; overflow: auto; scrollbar-width: thin;
  padding-right: 2px;
}
.catalog-page .cat-check-list { display: grid; gap: 10px; }
.catalog-page .cat-check-list label {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 12px; color: #544c56; cursor: pointer; min-height: 24px;
}
.catalog-page .cat-check-list label[hidden] { display: none !important; }
.catalog-page .cat-check-list span { display: flex; align-items: center; gap: 10px; min-width: 0; }
.catalog-page .cat-check-list input { accent-color: #583c7e; width: 16px; height: 16px; margin: 0; flex-shrink: 0; }
.catalog-page .cat-check-list small {
  font-size: 10px; color: #aca1ad; flex-shrink: 0; font-variant-numeric: tabular-nums;
}
.catalog-page .cat-facet-more {
  margin-top: 12px; border: 0; background: none; padding: 0;
  color: #583c7e; font-size: 11px; font-weight: 800; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.catalog-page .cat-facet-more:hover { color: #4a2e46; text-decoration: underline; }
.catalog-page .cat-facet-more[aria-expanded="true"] { color: #6d586e; }
.catalog-page .cat-price-values {
  display: flex; justify-content: space-between; font-size: 12px; font-weight: 750;
  margin: 8px 0 14px; color: #6d586e;
}
.catalog-page .cat-price-dual {
  position: relative; height: 28px; display: flex; align-items: center;
  --min-pct: 0%; --max-pct: 100%;
}
.catalog-page .cat-price-dual::before {
  content: ""; position: absolute; left: 0; right: 0; height: 4px;
  border-radius: 100px; background: #ebe4ec; top: 50%; transform: translateY(-50%);
}
.catalog-page .cat-price-dual::after {
  content: ""; position: absolute; height: 4px; border-radius: 100px;
  background: #583c7e; top: 50%; transform: translateY(-50%);
  left: var(--min-pct); right: calc(100% - var(--max-pct));
}
.catalog-page .cat-price-range {
  position: absolute; inset: 0; width: 100%; margin: 0; background: none;
  pointer-events: none; -webkit-appearance: none; appearance: none; accent-color: #583c7e;
}
.catalog-page .cat-price-range::-webkit-slider-runnable-track { height: 4px; background: transparent; }
.catalog-page .cat-price-range::-moz-range-track { height: 4px; background: transparent; }
.catalog-page .cat-price-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; pointer-events: auto;
  width: 18px; height: 18px; border-radius: 50%; background: #fff;
  border: 2px solid #583c7e; box-shadow: 0 1px 4px rgba(74,46,70,.18); cursor: pointer;
  position: relative; z-index: 2;
}
.catalog-page .cat-price-range::-moz-range-thumb {
  pointer-events: auto; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; border: 2px solid #583c7e; cursor: pointer; position: relative; z-index: 2;
}
.catalog-page .cat-price-range--max { z-index: 3; }
.catalog-page .cat-value-hint { color: #9a8e9c; font-size: 10px; margin-top: 8px; }
.catalog-page .cat-trust {
  padding: 18px; margin-top: 14px; border: 1px solid #ebe3ed; border-radius: 17px; background: #f8f3f9;
}
.catalog-page .cat-trust strong { font-size: 12px; }
.catalog-page .cat-trust p { font-size: 11px; color: #887b87; margin: 7px 0 0; line-height: 1.6; }
.catalog-page .cat-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-bottom: 16px; min-height: 45px;
}
.catalog-page .cat-results strong { font-size: 14px; }
.catalog-page .cat-results small { display: block; font-size: 11px; color: #887b88; margin-top: 3px; }
.catalog-page .cat-controls { display: flex; align-items: center; gap: 10px; }
.catalog-page .cat-sort {
  height: 42px; border: 1px solid #e8dfe8; background: #fff; padding: 0 32px 0 12px;
  border-radius: 11px; font-size: 12px; color: #554b57; max-width: 200px;
}
.catalog-page .cat-view-toggle {
  display: flex; border: 1px solid #e8dfe8; background: #fff; border-radius: 11px; padding: 3px; gap: 2px;
}
.catalog-page .cat-view-toggle button {
  display: grid; place-items: center; background: none; border: 0; width: 33px; height: 32px;
  color: #958796; border-radius: 8px; cursor: pointer;
}
.catalog-page .cat-view-toggle button[aria-pressed="true"] { background: #f2eaf4; color: #4a2e46; }
.catalog-page .cat-mobile-filter {
  display: none; height: 42px; background: #fff; border: 1px solid #ded4e1; border-radius: 11px;
  padding: 0 14px; color: #4a2e46; font-size: 12px; font-weight: 800; align-items: center; gap: 8px; cursor: pointer;
}
.catalog-page .cat-active-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: -4px 0 14px; }
.catalog-page .cat-active-chip {
  background: #f1e7f1; color: #644768; border: 1px solid #dfcede; border-radius: 100px;
  padding: 6px 10px; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px;
}
.catalog-page .cat-active-chip:hover { color: #4a2e46; }
.catalog-page .cat-product-grid.list { grid-template-columns: 1fr; gap: 12px; }
.catalog-page .cat-product-grid.list .product-card { flex-direction: row; }
.catalog-page .cat-product-grid.list .art { width: 200px; height: 180px; flex-shrink: 0; }
.catalog-page .cat-product-grid.list .card-title { min-height: auto; font-size: 16px; }
.catalog-page .cat-product-grid.list .compare { max-width: 190px; margin-left: auto; }
.catalog-page .cat-empty {
  padding: 70px 20px; text-align: center; background: #fff; border: 1px solid #e9e2eb;
  border-radius: 17px; color: #786a78;
}
.catalog-page .cat-empty h3 { font-size: 22px; color: #231f2b; margin: 0 0 10px; }
.catalog-page .cat-empty p { margin: 0 0 18px; }
.catalog-page .cat-empty-reset {
  display: inline-block; border-radius: 11px; background: #4a2e46; color: #fff;
  padding: 12px 18px; font-weight: 800; font-size: 12px;
}
.catalog-page .cat-empty-reset:hover { color: #fff; background: #674363; }
.catalog-page .cat-pager {
  margin-top: 28px; display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.catalog-page .cat-pager-nav { width: 100%; }
.catalog-page .cat-pager-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px;
}
.catalog-page .cat-pager-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; min-height: 38px; padding: 8px 12px;
  border: 1px solid #e7dfe7; border-radius: 10px; background: #fff;
  color: #5e5361; font-size: 12px; font-weight: 750; line-height: 1;
}
.catalog-page .cat-pager-btn:hover {
  border-color: #bca9bc; color: #4a2e46; background: #fdfbfe;
}
.catalog-page .cat-pager-btn.is-current {
  background: #4a2e46; border-color: #4a2e46; color: #fff;
}
.catalog-page .cat-pager-btn.is-disabled {
  opacity: .45; cursor: default; pointer-events: none;
}
.catalog-page .cat-pager-ellipsis {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 28px; color: #9a8e9c; font-weight: 700;
}
.catalog-page .cat-disclaimer {
  margin-top: 18px; font-size: 11px; color: #908490; line-height: 1.65;
}
.catalog-page .cat-guide {
  margin: 10px 0 40px; border: 1px solid #eadfe9; border-radius: 22px;
  background: linear-gradient(110deg, #fff, #f8f0f6); padding: 30px 36px;
  display: flex; align-items: center; justify-content: space-between; gap: 36px;
}
.catalog-page .cat-guide h2 { font-size: 24px; line-height: 1.3; margin: 0 0 8px; }
.catalog-page .cat-guide p { color: #807380; font-size: 12px; line-height: 1.8; max-width: 650px; margin: 0; }
.catalog-page .cat-guide a {
  display: inline-flex; background: #4a2e46; color: #fff; border-radius: 12px;
  padding: 13px 17px; font-size: 12px; font-weight: 800; white-space: nowrap;
}
.catalog-page .cat-guide a:hover { color: #fff; background: #674363; }
.catalog-page .cat-drawer-backdrop {
  position: fixed; inset: 0; background: rgba(37,22,37,.45); z-index: 85;
}
.catalog-page .cat-drawer-backdrop[hidden] { display: none !important; }
.catalog-page .cat-drawer {
  position: fixed; inset: 0 auto 0 0; z-index: 90; width: min(380px, 93vw);
  background: #fff; box-shadow: 20px 0 80px rgba(0,0,0,.12);
  display: flex; flex-direction: column;
}
.catalog-page .cat-drawer[hidden] { display: none !important; }
.catalog-page .cat-drawer-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; border-bottom: 1px solid #e9e2eb;
}
.catalog-page .cat-drawer-top h2 { font-size: 18px; margin: 0; }
.catalog-page .cat-drawer-top button {
  border: 0; background: #f6f1f5; border-radius: 50%; height: 36px; width: 36px;
  font-size: 20px; cursor: pointer;
}
.catalog-page .cat-drawer .cat-filter-card {
  position: static; border: 0; border-radius: 0; overflow: auto; max-height: none;
  flex: 1; box-shadow: none;
}
.catalog-page .cat-drawer-apply {
  padding: 16px 19px; border-top: 1px solid #e9e2eb;
}
.catalog-page .cat-drawer-apply button {
  width: 100%; border: 0; background: #4a2e46; color: #fff; border-radius: 11px;
  padding: 14px; font-weight: 800; cursor: pointer;
}

@media (max-width: 1140px) {
  .catalog-page .cat-layout { grid-template-columns: 240px minmax(0,1fr); gap: 18px; }
  .catalog-page .cat-product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .product-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 860px) {
  .catalog-page .cat-layout { display: block; }
  .catalog-page .cat-aside { display: none; }
  .catalog-page .cat-mobile-filter { display: flex; }
  .catalog-page .cat-hero-emblem { right: -70px; opacity: .55; }
  .catalog-page .cat-product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .catalog-page .cat-hero { padding: 24px 22px; min-height: 140px; border-radius: 18px; }
  .catalog-page .cat-promo { display: block; }
  .catalog-page .cat-promo-note { margin-top: 8px; }
  .catalog-page .cat-toolbar { flex-wrap: wrap; align-items: flex-start; }
  .catalog-page .cat-results { width: 100%; }
  .catalog-page .cat-controls { width: 100%; }
  .catalog-page .cat-mobile-filter { flex: 1; justify-content: center; }
  .catalog-page .cat-sort { flex: 2; max-width: none; }
  .catalog-page .cat-view-toggle { display: none; }
  .catalog-page .cat-guide { display: block; padding: 22px; }
  .catalog-page .cat-guide a { margin-top: 16px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 380px) {
  .product-grid { grid-template-columns: 1fr; }
}

/* —— About / Om oss (designpaket) —— */
.about-page { --about-plum: #4a2e46; --about-plum-deep: #31202f; --about-rose: #b98ca1; --about-muted: #746c72; --about-serif: Georgia, 'Times New Roman', serif; color: #2e2e2e; }
.about-page a:hover { color: inherit; }
.about-crumb { display: flex; gap: 10px; align-items: center; color: #8f8189; font-size: 11px; padding: 28px 0 0; }
.about-crumb span:last-child { color: #5c4a57; }
.about-crumb a:hover { text-decoration: underline; color: var(--about-plum); }
.about-eyebrow { font-size: 10px; letter-spacing: .18em; font-weight: 900; text-transform: uppercase; color: #95647e; display: flex; align-items: center; gap: 10px; }
.about-eyebrow::before { content: ""; height: 1px; width: 23px; background: #ad8299; display: block; }
.about-eyebrow-center { justify-content: center; }
.about-eyebrow-center::before { display: none; }
.about-hero { padding: 44px 0 90px; display: grid; grid-template-columns: minmax(0,1.02fr) minmax(0,.98fr); align-items: center; gap: 48px; }
.about-hero h1 { font-family: var(--font-heading); font-size: clamp(42px, 5vw, 72px); letter-spacing: -.07em; line-height: 1.04; margin: 22px 0 22px; font-weight: 800; color: var(--about-plum-deep); }
.about-hero h1 em { font: italic .98em/1.04 var(--about-serif); font-weight: 400; color: #986f87; letter-spacing: -.06em; }
.about-hero-copy { font-size: 16px; line-height: 1.8; color: #6b6069; max-width: 560px; margin: 0; }
.about-cta-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.about-cta-center { justify-content: center; margin-top: 0; }
.about-btn { display: inline-flex; justify-content: center; align-items: center; gap: 10px; border-radius: 12px; padding: 14px 18px; font-weight: 750; font-size: 13px; border: 1px solid transparent; min-height: 48px; text-decoration: none; }
.about-btn-primary { background: var(--about-plum); color: #fff; }
.about-btn-primary:hover { background: #69465f; color: #fff; }
.about-btn-secondary { border-color: #ddccd5; background: #fff; color: var(--about-plum); }
.about-btn-secondary:hover { background: #f7edf1; color: var(--about-plum); }
.about-micro { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 32px; color: #6f5e69; font-size: 12px; font-weight: 650; }
.about-micro span { display: flex; align-items: center; gap: 7px; }
.about-tick { width: 17px; height: 17px; border-radius: 50%; background: #ede0e7; color: #6b4c60; display: grid; place-items: center; font-size: 11px; font-weight: 900; }
.about-hero-art { height: 520px; border-radius: 28px; background: radial-gradient(circle at 35% 17%, #fff9f4 1%, #f7e9e5 40%, #e9cfd1 100%); position: relative; overflow: hidden; isolation: isolate; }
.about-hero-art::before { content: ""; position: absolute; inset: -130px -160px auto auto; width: 460px; height: 460px; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; box-shadow: 0 0 0 42px rgba(255,255,255,.13), 0 0 0 100px rgba(255,255,255,.07); }
.about-hero-art-head { position: absolute; top: 36px; left: 38px; color: #694b5d; text-transform: uppercase; font-size: 10px; letter-spacing: .19em; font-weight: 800; z-index: 1; }
.about-flower { position: absolute; right: -8px; top: 42px; width: 240px; height: 248px; opacity: .8; transform: rotate(7deg); }
.about-art-icon { width: 88px; height: 88px; position: absolute; top: 90px; left: calc(50% - 44px); background: #fff9f6; border: 1px solid #edd9da; display: grid; place-items: center; border-radius: 24px; box-shadow: 0 18px 40px rgba(70,38,64,.08); z-index: 1; }
.about-art-icon img { width: 64px; height: 64px; object-fit: contain; }
.about-art-corner { position: absolute; bottom: 12px; left: 26px; font: italic 28px var(--about-serif); color: #a27085; transform: rotate(-12deg); opacity: .5; }
.about-comparison { position: absolute; left: 40px; right: 40px; bottom: 40px; background: rgba(255,255,255,.94); border-radius: 20px; box-shadow: 0 25px 65px rgba(89,54,69,.14); padding: 22px; z-index: 2; border: 1px solid rgba(255,255,255,.8); }
.about-comp-h { display: flex; justify-content: space-between; gap: 12px; align-items: center; border-bottom: 1px solid #f1e6e8; padding-bottom: 14px; margin-bottom: 10px; }
.about-comp-h strong { font-size: 15px; letter-spacing: -.03em; color: #443143; }
.about-comp-h small { font-size: 10px; font-weight: 800; color: #9d738a; background: #faeff3; padding: 6px 10px; border-radius: 50px; text-transform: uppercase; letter-spacing: .04em; }
.about-comp-row { padding: 10px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 12px; color: #675764; }
.about-comp-left { display: flex; align-items: center; gap: 10px; }
.about-store-dot { width: 32px; height: 32px; border-radius: 10px; background: #f5eaf0; border: 1px solid #eddfe6; display: grid; place-items: center; color: #89667a; }
.about-comp-row b { color: #4e3546; font-size: 11px; }
.about-comp-note { background: #f7f0f2; border-radius: 9px; font-size: 11px; color: #776471; text-align: center; padding: 10px 8px; margin-top: 8px; }
.about-section { padding: 88px 0; }
.about-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.about-section-head h2 { font-family: var(--font-heading); font-size: clamp(30px, 3.4vw, 48px); max-width: 700px; margin: 14px 0 0; color: var(--about-plum-deep); letter-spacing: -.045em; line-height: 1.12; }
.about-side-desc { max-width: 320px; color: var(--about-muted); font-size: 14px; line-height: 1.8; margin: 0; }
.about-steps-wrap { background: #fff; border-block: 1px solid #f1e9e9; }
.about-steps { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.about-step { background: #fbf7f6; border: 1px solid #efe6e6; border-radius: 18px; padding: 28px 26px; min-height: 250px; }
.about-step:nth-child(2) { background: #f6edf2; }
.about-step:nth-child(3) { background: #f5f2f0; }
.about-step-top { display: flex; align-items: center; justify-content: space-between; }
.about-stepnum { font: italic 32px var(--about-serif); color: #bd9baa; }
.about-stepico { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: #fff; color: var(--about-plum); }
.about-step h3 { font-size: 22px; color: var(--about-plum); margin: 22px 0 0; font-family: var(--font-heading); }
.about-step p { font-size: 13px; color: #786b72; line-height: 1.8; margin: 10px 0 0; max-width: 280px; }
.about-story { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.about-story-art { height: 460px; background: linear-gradient(145deg, #eddee3, #ead5d3 50%, #faf0e8); border-radius: 26px; position: relative; overflow: hidden; display: grid; place-items: center; }
.about-rings { border-radius: 50%; width: 340px; height: 340px; border: 1px solid rgba(255,255,255,.64); box-shadow: 0 0 0 42px rgba(255,255,255,.17), 0 0 0 86px rgba(255,255,255,.1); }
.about-art-word { position: absolute; top: 52px; left: 40px; color: #875e73; font-size: 11px; text-transform: uppercase; font-weight: 900; letter-spacing: .15em; }
.about-story-art blockquote { font: italic 40px/1.12 var(--about-serif); color: var(--about-plum); text-align: center; letter-spacing: -.03em; margin: 0; position: absolute; z-index: 1; }
.about-story-art blockquote span { color: #a8758e; }
.about-story-text h2 { font-family: var(--font-heading); font-size: clamp(30px, 3.3vw, 46px); margin: 16px 0 22px; color: var(--about-plum-deep); letter-spacing: -.045em; line-height: 1.12; }
.about-story-text p { color: #716770; line-height: 1.9; font-size: 15px; margin: 0 0 16px; }
.about-fine-line { height: 1px; background: #eadfe1; margin: 24px 0; }
.about-text-link { font-weight: 800; color: #624052; display: inline-flex; gap: 8px; align-items: center; font-size: 13px; }
.about-text-link:hover { text-decoration: underline; color: #624052; }
.about-promise { background: #f8f3f3; padding: 88px 0; }
.about-promise-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.about-promise-card { background: #fff; padding: 28px 30px; border: 1px solid #eee5e6; border-radius: 18px; display: grid; grid-template-columns: 48px 1fr; gap: 18px; min-height: 170px; }
.about-promise-icon { background: #f8edf3; color: var(--about-plum); border-radius: 13px; width: 48px; height: 48px; display: grid; place-items: center; }
.about-promise-card h3 { font-size: 17px; margin: 4px 0 8px; color: #43323f; font-family: var(--font-heading); }
.about-promise-card p { color: #786e77; font-size: 13px; line-height: 1.8; margin: 0; }
.about-transparency { padding: 90px 0; background: var(--about-plum-deep); color: #f9f0f4; position: relative; overflow: hidden; }
.about-transparency::after { content: ""; position: absolute; right: -130px; top: -170px; width: 510px; height: 510px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; box-shadow: 0 0 0 62px rgba(255,255,255,.027), 0 0 0 148px rgba(255,255,255,.016); }
.about-transparency .about-eyebrow { color: #d8aebf; }
.about-transparency .about-eyebrow::before { background: #d8aebf; }
.about-transparency h2 { color: #fff; font-family: var(--font-heading); font-size: clamp(32px, 3.8vw, 52px); max-width: 720px; margin: 14px 0 0; letter-spacing: -.045em; line-height: 1.12; position: relative; z-index: 1; }
.about-trans-intro { color: #d1c1cc; max-width: 700px; margin: 18px 0 0; line-height: 1.85; position: relative; z-index: 1; }
.about-trans-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; margin-top: 36px; position: relative; z-index: 2; }
.about-trans-card { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16); border-radius: 18px; padding: 26px 24px; min-height: 230px; }
.about-trans-num { font: italic 24px var(--about-serif); color: #d6b2c5; }
.about-trans-card h3 { color: #fff; font-size: 18px; margin: 18px 0 10px; font-family: var(--font-heading); }
.about-trans-card p { font-size: 12px; line-height: 1.86; color: #d1c3cd; margin: 0; }
.about-trans-card a { color: #f3d9e4; text-decoration: underline; }
.about-trans-note { font-size: 11px; color: #bdaab9; margin: 26px 0 0; position: relative; z-index: 1; }
.about-faq { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); gap: 60px; }
.about-faq h2 { font-family: var(--font-heading); font-size: clamp(32px, 3.8vw, 48px); margin: 14px 0 0; color: var(--about-plum-deep); letter-spacing: -.045em; line-height: 1.12; }
.about-faq-copy { color: #716771; margin: 18px 0 0; line-height: 1.9; max-width: 340px; }
.about-faq-cta { margin-top: 22px; }
.about-faq-list { border-top: 1px solid #e6dce1; }
.about-faq-list details { border-bottom: 1px solid #e6dce1; }
.about-faq-list summary { list-style: none; cursor: pointer; padding: 22px 8px 22px 0; font-size: 15px; font-weight: 740; color: #4d3748; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.about-faq-list summary::-webkit-details-marker { display: none; }
.about-plus { display: grid; place-items: center; flex: 0 0 auto; width: 27px; height: 27px; background: #f1e6ec; border-radius: 50%; font-weight: 500; color: #6b4a5d; font-size: 18px; line-height: 1; transition: transform .15s ease; }
.about-faq-list details[open] .about-plus { transform: rotate(45deg); }
.about-faq-list details p { padding: 0 40px 22px 0; color: #716772; font-size: 13px; line-height: 1.85; margin: 0; }
.about-faq-list details a { color: #624052; text-decoration: underline; }
.about-endcta { padding: 78px 0 90px; text-align: center; background: linear-gradient(135deg, #fff6f5, #f7e9ed); }
.about-endcta h2 { font-family: var(--font-heading); font-size: clamp(32px, 3.8vw, 52px); margin: 14px 0 16px; color: var(--about-plum-deep); letter-spacing: -.045em; }
.about-endcta p { color: #796a73; max-width: 560px; margin: 0 auto 26px; line-height: 1.75; }
@media (max-width: 960px) {
  .about-hero { grid-template-columns: 1fr; padding: 32px 0 64px; gap: 36px; }
  .about-hero-art { height: 420px; max-width: 620px; width: 100%; justify-self: center; }
  .about-section-head { display: block; }
  .about-side-desc { margin-top: 14px; max-width: none; }
  .about-steps { grid-template-columns: 1fr; }
  .about-step { min-height: 0; }
  .about-step p { max-width: none; }
  .about-story { grid-template-columns: 1fr; gap: 28px; }
  .about-story-art { height: 320px; order: 2; }
  .about-story-text { order: 1; }
  .about-promise-grid { grid-template-columns: 1fr; }
  .about-promise-card { min-height: 0; }
  .about-trans-grid { grid-template-columns: 1fr; }
  .about-trans-card { min-height: 0; }
  .about-faq { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 620px) {
  .about-hero h1 { font-size: clamp(36px, 10vw, 52px); }
  .about-hero-copy { font-size: 14px; }
  .about-hero-art { height: 380px; border-radius: 22px; }
  .about-comparison { left: 14px; right: 14px; bottom: 14px; padding: 16px; }
  .about-section { padding: 64px 0; }
  .about-promise { padding: 64px 0; }
  .about-transparency { padding: 64px 0; }
  .about-endcta { padding: 64px 0; }
}

/* —— Contact / Kontakta oss (designpaket) —— */
.contact-page { --c-plum: #4a2e46; --c-plum2: #33202f; --c-muted: #716971; --c-serif: Georgia, 'Times New Roman', serif; color: #2e2e2e; }
.contact-page a:hover { color: inherit; }
.contact-crumb { display: flex; gap: 10px; align-items: center; color: #9a8992; font-size: 11px; padding: 24px 0 0; }
.contact-crumb span:last-child { color: #634e5b; }
.contact-crumb a:hover { text-decoration: underline; color: var(--c-plum); }
.contact-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: .18em; color: #986b82; font-weight: 850; display: flex; align-items: center; gap: 12px; }
.contact-kicker::before { content: ""; width: 27px; height: 1px; background: #b98ca1; }
.contact-hero { display: grid; grid-template-columns: 1.04fr .96fr; gap: 48px; align-items: center; padding: 44px 0 80px; }
.contact-hero h1 { font-family: var(--font-heading); font-size: clamp(42px, 5vw, 72px); line-height: 1.04; letter-spacing: -.07em; margin: 18px 0 22px; color: var(--c-plum2); max-width: 600px; }
.contact-hero h1 em { font: italic 1em var(--c-serif); color: #956f86; font-weight: 400; }
.contact-lead { font-size: 16px; line-height: 1.85; color: #6d616b; max-width: 540px; margin: 0; }
.contact-hero-quick { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 28px; }
.contact-text-link { color: var(--c-plum); font-weight: 800; font-size: 13px; }
.contact-text-link:hover { text-decoration: underline; color: var(--c-plum); }
.contact-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 18px; border-radius: 12px; font-size: 13px; font-weight: 800; border: 0; cursor: pointer; text-decoration: none; min-height: 48px; }
.contact-btn-primary { background: var(--c-plum); color: #fff; }
.contact-btn-primary:hover { background: #65435f; color: #fff; }
.contact-btn:disabled { opacity: .65; cursor: wait; }
.contact-hero-art { height: 460px; border-radius: 28px; position: relative; overflow: hidden; background: radial-gradient(circle at 28% 27%, #fffaf8, #f8e9e5 45%, #ebd5da 100%); isolation: isolate; }
.contact-hero-art::before { content: ""; position: absolute; width: 400px; height: 400px; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; top: -120px; right: -80px; box-shadow: 0 0 0 45px rgba(255,255,255,.16), 0 0 0 110px rgba(255,255,255,.09); }
.contact-mini-label { position: absolute; left: 34px; top: 32px; font-size: 10px; letter-spacing: .2em; font-weight: 900; color: #846477; text-transform: uppercase; z-index: 1; }
.contact-bubble { position: absolute; background: #fff; border: 1px solid rgba(233,219,224,.8); box-shadow: 0 19px 50px rgba(77,46,60,.12); border-radius: 20px; padding: 17px 20px; z-index: 2; }
.contact-bubble-large { top: 100px; left: 48px; right: 42px; padding: 24px; }
.contact-bubble-small { position: absolute; top: 50px; right: 48px; width: 66px; height: 66px; border-radius: 22px; display: grid; place-items: center; background: #fffdfb; box-shadow: 0 18px 36px rgba(64,38,56,.12); z-index: 2; padding: 0; }
.contact-bubble-topline { color: #947285; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 10px; }
.contact-bubble strong { font-size: 18px; letter-spacing: -.04em; color: #4b3244; display: block; }
.contact-bubble p { font-size: 13px; color: #796b75; margin: 8px 0 0; line-height: 1.7; }
.contact-bubble-footer { top: 280px; left: 90px; right: 24px; padding: 14px 18px; display: flex; justify-content: space-between; align-items: center; }
.contact-bubble-footer b { font-size: 13px; color: #664455; }
.contact-bubble-footer span { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 50%; background: #f2e9ed; color: #805e73; }
.contact-arc { position: absolute; bottom: 16px; left: 26px; z-index: 0; font: italic 28px var(--c-serif); color: #a5768e; opacity: .55; transform: rotate(-9deg); }
.contact-topics { padding: 0 0 84px; }
.contact-topic-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 24px; }
.contact-topic-head h2 { font-family: var(--font-heading); font-size: clamp(28px, 3.2vw, 44px); margin: 12px 0 0; color: var(--c-plum2); letter-spacing: -.045em; }
.contact-topic-head p { font-size: 13px; color: var(--c-muted); max-width: 320px; margin: 0; }
.contact-topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.contact-topic { border: 1px solid #eee5e6; background: #fff; border-radius: 18px; padding: 26px; min-height: 220px; display: flex; flex-direction: column; align-items: flex-start; transition: transform .2s, box-shadow .2s; color: inherit; text-decoration: none; }
.contact-topic:hover { box-shadow: 0 25px 65px rgba(69,40,58,.075); transform: translateY(-3px); color: inherit; }
.contact-topic:nth-child(2) { background: #faf4f5; }
.contact-topic:nth-child(3) { background: #f7f3f2; }
.contact-topic-icon { height: 48px; width: 48px; display: grid; place-items: center; border-radius: 14px; background: #f4eaf0; color: var(--c-plum); }
.contact-topic h3 { margin: 18px 0 0; font-size: 19px; color: #462b42; font-family: var(--font-heading); }
.contact-topic p { margin: 8px 0 0; color: #796d75; font-size: 13px; line-height: 1.8; }
.contact-topic-arr { margin-top: auto; padding-top: 12px; color: #8c657c; font-size: 12px; font-weight: 800; }
.contact-section { background: #f7f1f2; border-block: 1px solid #eee5e8; padding: 80px 0 90px; }
.contact-grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(280px,.73fr); gap: 28px; align-items: start; }
.contact-card { background: #fff; border-radius: 24px; border: 1px solid #efe3e6; padding: 40px; box-shadow: 0 15px 45px rgba(69,38,54,.055); }
.contact-card h2 { font-family: var(--font-heading); font-size: clamp(30px, 3.5vw, 48px); margin: 12px 0 12px; color: var(--c-plum2); letter-spacing: -.045em; }
.contact-card-lead { max-width: 560px; color: #786c75; font-size: 14px; margin: 0; }
.contact-form { margin-top: 28px; display: grid; gap: 16px; }
.contact-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-field { display: grid; gap: 7px; }
.contact-field label { font-size: 12px; color: #594b54; font-weight: 800; }
.contact-field label em { font-style: normal; color: #a34a6f; }
.contact-optional { font-weight: 450; color: #8d8288; }
.contact-field input, .contact-field textarea, .contact-field select { width: 100%; padding: 12px 14px; min-height: 48px; border-radius: 11px; border: 1px solid #ddcfd6; color: #322933; background: #fff; font: inherit; }
.contact-field textarea { resize: vertical; min-height: 140px; }
.contact-field input:focus, .contact-field textarea:focus, .contact-field select:focus { border-color: #926680; box-shadow: 0 0 0 3px #f6eaf1; outline: none; }
.contact-help { font-size: 11px; color: #857982; }
.contact-field-error { font-size: 12px; color: #ae3535; font-weight: 650; }
.contact-choice-note { display: none; border-radius: 12px; background: #f8f2ee; border: 1px solid #e9ddd7; padding: 14px 16px; color: #74565a; font-size: 12px; line-height: 1.7; }
.contact-choice-note.is-visible { display: block; }
.contact-choice-note strong { display: block; color: #533c46; margin-bottom: 3px; }
.contact-charcount { text-align: right; font-size: 11px; color: #867882; }
.contact-form-footer { border-top: 1px solid #eee6e8; margin-top: 4px; padding-top: 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.contact-privacy { font-size: 11px; color: #827680; line-height: 1.6; max-width: 300px; margin: 0; }
.contact-privacy a { text-decoration: underline; color: #624052; }
.contact-feedback { margin-top: 4px; padding: 14px 16px; border-radius: 12px; font-size: 13px; }
.contact-feedback.is-success { background: #eef6f1; border: 1px solid #c9e0d2; color: #2f5a42; }
.contact-feedback.is-error { background: #faf0f0; border: 1px solid #ebcfcf; color: #8a3030; }
.contact-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.contact-aside { display: grid; gap: 16px; }
.contact-help-panel { padding: 30px; background: var(--c-plum); border-radius: 22px; color: #fff; position: relative; overflow: hidden; }
.contact-help-panel::after { content: ""; position: absolute; bottom: -110px; right: -75px; width: 230px; height: 230px; border-radius: 50%; border: 1px solid #ffffff38; box-shadow: 0 0 0 31px #ffffff12; }
.contact-help-small { color: #d8bfcf; font-size: 10px; letter-spacing: .18em; font-weight: 900; text-transform: uppercase; }
.contact-help-panel h3 { font: italic 32px/1.12 var(--c-serif); margin: 18px 0 0; letter-spacing: -.03em; color: #fff; }
.contact-help-panel p { color: #e1d1dc; margin: 14px 0 0; font-size: 13px; line-height: 1.85; max-width: 300px; position: relative; z-index: 2; }
.contact-help-panel a { display: inline-flex; margin-top: 18px; gap: 8px; align-items: center; color: #fff; font-size: 12px; font-weight: 800; border-bottom: 1px solid #d9b7c8; padding-bottom: 3px; position: relative; z-index: 2; }
.contact-help-panel a:hover { color: #fff; }
.contact-aside-card { background: #fff; border: 1px solid #eee3e7; border-radius: 20px; padding: 26px; }
.contact-aside-card h3 { font-size: 18px; color: #4b3043; margin: 0; font-family: var(--font-heading); }
.contact-aside-divider { height: 1px; background: #f0e6e9; margin: 18px 0; }
.contact-aside-row { display: flex; gap: 12px; align-items: start; }
.contact-aside-icon { flex: 0 0 35px; height: 35px; border-radius: 11px; background: #f7edf1; display: grid; place-items: center; color: #75465e; font-weight: 800; }
.contact-aside-row strong { font-size: 13px; color: #4a3044; }
.contact-aside-row p { margin: 3px 0 0; font-size: 12px; color: #746773; line-height: 1.7; }
.contact-faq { padding: 88px 0; }
.contact-faq-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; }
.contact-faq h2 { font-family: var(--font-heading); font-size: clamp(30px, 3.5vw, 46px); margin: 14px 0 12px; color: var(--c-plum2); letter-spacing: -.045em; }
.contact-faq-intro { color: var(--c-muted); font-size: 14px; max-width: 360px; margin: 0; }
.contact-accordion { border-top: 1px solid #e9dfe3; }
.contact-accordion details { border-bottom: 1px solid #e9dfe3; padding: 16px 0; }
.contact-accordion summary { list-style: none; cursor: pointer; font-weight: 750; font-size: 14px; color: #503b4a; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.contact-accordion summary::-webkit-details-marker { display: none; }
.contact-accordion summary::after { content: "+"; font-size: 22px; color: #946f82; font-weight: 400; }
.contact-accordion details[open] summary::after { content: "−"; }
.contact-accordion p { font-size: 13px; color: #786c74; margin: 12px 28px 0 0; line-height: 1.85; }
.contact-end { background: #f3e8ed; padding: 64px 0; text-align: center; }
.contact-end h2 { font-family: var(--font-heading); font-size: clamp(28px, 3.4vw, 44px); color: var(--c-plum2); margin: 0; letter-spacing: -.045em; }
.contact-end p { max-width: 520px; margin: 14px auto 22px; color: #75656e; font-size: 14px; }
@media (max-width: 960px) {
  .contact-hero { grid-template-columns: 1fr; padding: 32px 0 56px; gap: 32px; }
  .contact-hero-art { height: 380px; max-width: 620px; width: 100%; justify-self: center; }
  .contact-topic-head { display: block; }
  .contact-topic-head p { margin-top: 12px; max-width: none; }
  .contact-topic-grid { grid-template-columns: 1fr; }
  .contact-topic { min-height: 0; }
  .contact-grid { grid-template-columns: 1fr; }
  .contact-faq-grid { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 620px) {
  .contact-hero h1 { font-size: clamp(36px, 10vw, 52px); }
  .contact-row2 { grid-template-columns: 1fr; }
  .contact-card { padding: 26px 20px; }
  .contact-form-footer { flex-direction: column; align-items: stretch; }
  .contact-form-footer .contact-btn { width: 100%; }
  .contact-privacy { max-width: none; }
  .contact-bubble-large { left: 16px; right: 16px; top: 80px; }
  .contact-bubble-footer { left: 40px; right: 14px; top: 250px; }
  .contact-section { padding: 64px 0; }
  .contact-faq { padding: 64px 0; }
}
