/* litbuys.de — handgeschriebenes Stylesheet
   Redaktioneller Ratgeber-Look: helles Grauweiß, tiefes Tintenschwarz,
   Bernstein als Akzentlinie. Kein Dashboard, keine Framework-Klassen. */

:root {
  /* Farben */
  --ink:        #23201c;
  --ink-soft:   #3c372f;
  --muted:      #57534b;
  --muted-2:    #6f6a60;
  --line:       #e3ded3;
  --line-soft:  #eceae2;
  --page:       #f6f5f1;
  --surface:    #ffffff;
  --surface-2:  #fbfaf6;
  --amber:      #b26a0a;   /* Akzentlinie / Hover, AA auf Weiß */
  --amber-deep: #8f550a;
  --amber-tint: #f4ead6;
  --ok:         #2f6b3a;
  --warn-bg:    #fbf3e2;
  --warn-line:  #e4c886;

  /* Typo */
  --font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

  /* Layout */
  --wrap:       1200px;
  --measure:    68ch;
  --radius:     10px;
  --radius-sm:  7px;

  /* Abstände (ein Eigentümer je Abstand) */
  --gap-section:      56px;
  --gap-grid:         20px;
  --card-pad:         16px;
  --stack:            22px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink);
  background: var(--page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; display: block; }

a {
  color: var(--ink);
  text-underline-offset: 2px;
  text-decoration-color: var(--line);
}
a:hover { color: var(--amber-deep); text-decoration-color: currentColor; }

:focus-visible {
  outline: 3px solid var(--amber);
  outline-offset: 2px;
  border-radius: 3px;
}

h1, h2, h3, h4 { color: var(--ink); margin: 0; text-wrap: balance; }
p { margin: 0; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding-inline: 20px; }

.skip-link {
  position: absolute; left: -999px; top: 0;
  background: var(--ink); color: #fff; padding: 10px 14px; z-index: 100;
  border-radius: 0 0 var(--radius-sm) 0;
}
.skip-link:focus { left: 0; color: #fff; }

/* ---------- Unabhängigkeits-Streifen ---------- */
.strip {
  background: var(--ink);
  color: #f4f1ea;
  font-size: 13px;
  line-height: 1.5;
}
.strip .wrap { padding-block: 7px; display: flex; gap: 10px; flex-wrap: wrap; align-items: baseline; }
.strip b { color: #fff; font-weight: 600; }
.strip a { color: #f0d9a8; text-decoration-color: rgba(240,217,168,.5); }
.strip a:hover { color: #fff; }

/* ---------- Kopf ---------- */
.site-head {
  position: sticky; top: 0; z-index: 40;
  background: rgba(246,245,241,.94);
  backdrop-filter: saturate(1.1) blur(6px);
  border-bottom: 1px solid var(--line);
}
.site-head .wrap {
  display: flex; align-items: center; gap: 18px;
  padding-block: 12px;
}
.brand {
  display: inline-flex; align-items: center; gap: 9px;
  font-weight: 800; letter-spacing: -.01em; font-size: 18px; color: var(--ink);
  text-decoration: none; flex: 0 0 auto;
}
.brand:hover { color: var(--ink); }
.brand .mark {
  width: 26px; height: 26px; border-radius: 7px; flex: 0 0 auto;
  background: var(--ink); color: #fff; display: grid; place-items: center;
  font-size: 15px; font-weight: 800;
  box-shadow: inset 0 0 0 2px var(--amber);
}
.brand small { display: block; font-weight: 500; font-size: 11px; color: var(--muted-2); letter-spacing: 0; }

.main-nav { display: flex; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.main-nav a {
  font-size: 14px; font-weight: 500; color: var(--ink-soft);
  text-decoration: none; padding: 7px 10px; border-radius: var(--radius-sm);
  line-height: 1;
}
.main-nav a:hover { background: var(--surface); color: var(--amber-deep); }
.main-nav a[aria-current="page"] { color: var(--ink); box-shadow: inset 0 -2px 0 var(--amber); border-radius: 0; }

.head-search { flex: 0 0 auto; display: flex; }
.head-search form { display: flex; gap: 6px; }
.head-search input {
  width: 168px; max-width: 40vw;
  font: inherit; font-size: 14px; padding: 8px 11px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--ink);
}
.head-search input::placeholder { color: var(--muted-2); }

.menu-toggle {
  display: none; margin-left: auto;
  font: inherit; font-size: 14px; font-weight: 600;
  background: var(--surface); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 8px 12px; cursor: pointer; gap: 7px; align-items: center;
}
.menu-toggle .bars { width: 16px; height: 2px; background: var(--ink); position: relative; display: inline-block; }
.menu-toggle .bars::before, .menu-toggle .bars::after { content: ""; position: absolute; left: 0; width: 16px; height: 2px; background: var(--ink); }
.menu-toggle .bars::before { top: -5px; } .menu-toggle .bars::after { top: 5px; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 600; line-height: 1;
  padding: 11px 16px; border-radius: var(--radius-sm);
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
  white-space: nowrap;
}
.btn-primary { background: var(--ink); color: #fff; }
.btn-primary:hover { background: #000; color: #fff; }
.btn-ghost { background: var(--surface); color: var(--ink); border-color: var(--line); }
.btn-ghost:hover { border-color: var(--amber); color: var(--amber-deep); }
.btn-amber { background: var(--amber); color: #fff; }
.btn-amber:hover { background: var(--amber-deep); color: #fff; }
.btn-sm { font-size: 14px; padding: 9px 13px; }
.btn .arrow { font-size: 15px; }

/* ---------- Seiten-Stack / Sektionen ---------- */
main { display: block; }
.page-stack { display: flex; flex-direction: column; gap: var(--gap-section); padding-block: var(--gap-section); }
.section > h2 { font-size: 28px; font-weight: 700; line-height: 1.3; }
.section > .lede { margin-top: 10px; color: var(--muted); max-width: var(--measure); }
.section-head { margin-bottom: 22px; }
.eyebrow {
  display: inline-block; font-size: 12.5px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--amber-deep); margin-bottom: 10px;
  border-left: 3px solid var(--amber); padding-left: 9px;
}

/* ---------- Hero ---------- */
.hero { background: linear-gradient(180deg, #fbfaf6 0%, var(--page) 100%); border-bottom: 1px solid var(--line); }
.hero .wrap { padding-block: 52px 46px; }
.hero h1 { font-size: 48px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; max-width: 16ch; }
.hero .sub { margin-top: 18px; font-size: 18px; line-height: 1.6; color: var(--muted); max-width: 60ch; }
.hero .hero-actions { margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; }
.hero .hero-note { margin-top: 16px; font-size: 13px; color: var(--muted-2); }

.chip-row { margin-top: 26px; display: flex; gap: 8px; flex-wrap: wrap; }
.chip {
  font-size: 13px; font-weight: 500; color: var(--ink-soft);
  background: var(--surface); border: 1px solid var(--line);
  padding: 6px 12px; border-radius: 999px; text-decoration: none;
}
.chip:hover { border-color: var(--amber); color: var(--amber-deep); }

/* ---------- Karten-Raster generisch ---------- */
.grid { display: grid; gap: var(--gap-grid); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

.card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); padding: var(--card-pad);
}
.card h3 { font-size: 18px; font-weight: 600; line-height: 1.4; }
.card p { margin-top: 8px; color: var(--muted); font-size: 15px; }

/* Nummerierte Ablaufkarten */
.stage-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.stage {
  display: grid; grid-template-columns: 44px 1fr; gap: 16px; align-items: start;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px;
}
.stage .num {
  width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center;
  background: var(--amber-tint); color: var(--amber-deep); font-weight: 800; font-size: 16px;
  border: 1px solid var(--warn-line);
}
.stage h3 { font-size: 18px; font-weight: 600; }
.stage p { margin-top: 6px; color: var(--muted); font-size: 15px; }
.stage .verify { margin-top: 9px; font-size: 13.5px; }
.stage .verify a { color: var(--amber-deep); font-weight: 600; }

/* Checkliste */
.check {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 10px;
}
.check li {
  position: relative; padding-left: 30px; color: var(--ink-soft); font-size: 15.5px; line-height: 1.6;
}
.check li::before {
  content: ""; position: absolute; left: 4px; top: .55em;
  width: 9px; height: 9px; border-radius: 2px; background: var(--amber);
  box-shadow: 0 0 0 4px var(--amber-tint);
}

/* Definitionsblöcke */
.def-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
.def { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; }
.def h3 { font-size: 17px; font-weight: 700; }
.def p { margin-top: 8px; color: var(--muted); font-size: 15px; }
.def .tag { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 9px; padding: 3px 8px; border-radius: 5px; }
.tag.can { background: #e9f2ea; color: var(--ok); }
.tag.cannot { background: #f7e9e9; color: #9a3b2f; }
.tag.note { background: var(--warn-bg); color: var(--amber-deep); }

/* ---------- Hinweis-Box ---------- */
.notice {
  background: var(--warn-bg); border: 1px solid var(--warn-line);
  border-radius: var(--radius); padding: 16px 18px; font-size: 14.5px; color: var(--ink-soft);
  line-height: 1.6;
}
.notice strong { color: var(--ink); }
.notice.plain { background: var(--surface-2); border-color: var(--line); }

/* ---------- Produktraster ---------- */
.product-grid { display: grid; gap: var(--gap-grid); grid-template-columns: repeat(4, 1fr); }
.product-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; display: flex; flex-direction: column;
}
.product-card .thumb {
  aspect-ratio: 1 / 1; background: var(--surface-2); border-bottom: 1px solid var(--line-soft);
  position: relative; overflow: hidden;
}
.product-card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.product-card .body { padding: 13px 14px 15px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.product-card .cat { font-size: 12px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--amber-deep); }
.product-card h3 { font-size: 15px; font-weight: 600; line-height: 1.4; }
.product-card h3 a { text-decoration: none; }
.product-card h3 a:hover { text-decoration: underline; text-decoration-color: var(--amber); }
.price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.price .eur { font-size: 16px; font-weight: 700; color: var(--ink); }
.price .cny { font-size: 13px; color: var(--muted-2); }
.price .ca { font-size: 12.5px; color: var(--muted-2); font-weight: 500; }
.card-links { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.qc-flag { font-size: 12px; color: var(--muted-2); }

/* ---------- Brotkrumen ---------- */
.crumbs { font-size: 13px; color: var(--muted-2); padding-block: 16px 0; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; }
.crumbs li::after { content: "›"; margin-left: 6px; color: var(--line); }
.crumbs li:last-child::after { content: ""; }
.crumbs a { color: var(--muted); text-decoration: none; }
.crumbs a:hover { color: var(--amber-deep); }

/* ---------- Artikel-Layout mit TOC ---------- */
.article-layout { display: grid; grid-template-columns: 220px minmax(0, var(--measure)); gap: 48px; align-items: start; padding-block: 36px var(--gap-section); }
.article-layout > * { min-width: 0; } /* Grid-Kinder dürfen unter ihre Inhaltsbreite schrumpfen (sonst sprengen breite Tabellen den mobilen Viewport) */
.toc { position: sticky; top: 84px; font-size: 14px; }
.toc h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted-2); margin-bottom: 12px; }
.toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; counter-reset: t; }
.toc a { display: block; padding: 5px 10px; border-left: 2px solid var(--line); color: var(--muted); text-decoration: none; border-radius: 0 4px 4px 0; }
.toc a:hover { border-left-color: var(--amber); color: var(--ink); background: var(--surface); }

.prose { max-width: var(--measure); }
.prose > * + * { margin-top: var(--stack); }
.prose h1 { font-size: 40px; font-weight: 800; line-height: 1.18; letter-spacing: -.02em; }
.prose h2 { font-size: 26px; font-weight: 700; line-height: 1.3; margin-top: 40px; scroll-margin-top: 84px; }
.prose h3 { font-size: 18px; font-weight: 600; line-height: 1.4; margin-top: 26px; }
.prose p, .prose li { font-size: 16px; line-height: 1.75; color: var(--ink-soft); }
.prose .dek { font-size: 18px; color: var(--muted); line-height: 1.6; }
.prose ul, .prose ol { padding-left: 22px; display: grid; gap: 8px; }
.prose a { color: var(--amber-deep); font-weight: 500; }
.prose strong { color: var(--ink); }
.prose table { width: 100%; border-collapse: collapse; font-size: 15px; }
.prose th, .prose td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.prose th { color: var(--ink); font-weight: 700; background: var(--surface-2); }
.prose figure { margin: 0; }
.meta-line { font-size: 13.5px; color: var(--muted-2); }
blockquote { margin: 0; padding: 4px 0 4px 18px; border-left: 3px solid var(--amber); color: var(--muted); }

.table-scroll { overflow-x: auto; }

/* ---------- Stage / Phasentabelle ---------- */
.phase-table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; font-size: 15px; }
.phase-table th, .phase-table td { text-align: left; padding: 13px 15px; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
.phase-table thead th { background: var(--surface-2); font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.phase-table tr:last-child td { border-bottom: 0; }
.phase-table td:first-child { font-weight: 600; color: var(--ink); white-space: nowrap; }

/* ---------- FAQ ---------- */
.faq { display: grid; gap: 12px; }
.faq details {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 4px 18px;
}
.faq summary {
  cursor: pointer; padding: 14px 0; font-weight: 600; font-size: 17px; list-style: none;
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 22px; font-weight: 400; color: var(--amber-deep); flex: 0 0 auto; }
.faq details[open] summary::after { content: "–"; }
.faq details > div { padding: 0 0 16px; color: var(--ink-soft); font-size: 15.5px; }
.faq details > div > * + * { margin-top: 12px; }
.faq a { color: var(--amber-deep); }

/* ---------- Produktdetail ---------- */
.pd { display: grid; grid-template-columns: minmax(0, 460px) 1fr; gap: 40px; padding-block: 30px var(--gap-section); align-items: start; }
.pd .media { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface-2); }
.pd .media img { width: 100%; height: auto; }
.pd .info > * + * { margin-top: 18px; }
.pd h1 { font-size: 32px; font-weight: 800; line-height: 1.2; letter-spacing: -.01em; }
.pd .cat-line { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--amber-deep); }
.pd .price-block { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.pd .price-block .eur { font-size: 26px; font-weight: 800; }
.pd .price-block .cny { font-size: 15px; color: var(--muted); }
.pd .cta-row { display: flex; gap: 12px; flex-wrap: wrap; }
.pd .fact-table { width: 100%; border-collapse: collapse; font-size: 14.5px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.pd .fact-table th, .pd .fact-table td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--line-soft); }
.pd .fact-table th { width: 42%; color: var(--muted); font-weight: 600; background: var(--surface-2); vertical-align: top; }
.pd .fact-table tr:last-child th, .pd .fact-table tr:last-child td { border-bottom: 0; }
.pd .checklist-box { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 20px; }
.pd .checklist-box h2 { font-size: 18px; font-weight: 700; margin-bottom: 12px; }

/* ---------- Footer ---------- */
.site-foot { background: var(--ink); color: #cfc9bd; margin-top: var(--gap-section); }
.site-foot .wrap { padding-block: 42px 34px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 28px; }
.site-foot h4 { color: #fff; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 12px; }
.site-foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.site-foot a { color: #cfc9bd; text-decoration: none; font-size: 14px; }
.site-foot a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--amber); }
.site-foot .about-blurb { font-size: 14px; line-height: 1.6; color: #b7b1a4; max-width: 34ch; }
.site-foot .brand-foot { display: inline-flex; align-items: center; gap: 9px; color: #fff; font-weight: 800; font-size: 17px; margin-bottom: 12px; text-decoration: none; }
.foot-bottom { border-top: 1px solid #3a352d; margin-top: 30px; padding-top: 18px; font-size: 12.5px; color: #948e82; display: flex; gap: 16px; flex-wrap: wrap; justify-content: space-between; }

/* ---------- Externe-Suche Sektion ---------- */
.search-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 26px 28px; }
.search-panel h2 { font-size: 22px; }
.search-panel p { margin-top: 10px; color: var(--muted); font-size: 15px; }
.search-panel form { margin-top: 18px; display: flex; gap: 10px; flex-wrap: wrap; }
.search-panel input { flex: 1 1 260px; min-width: 0; font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); }
.search-panel .hint { margin-top: 12px; font-size: 13px; color: var(--muted-2); }

/* ---------- Media-Hinweis (nicht-Tracking) ---------- */
.consent {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 60;
  max-width: 560px; margin: 0 auto;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 8px 30px rgba(35,32,28,.16);
  padding: 16px 18px; font-size: 13.5px; color: var(--ink-soft); line-height: 1.55;
}
.consent p { margin: 0 0 12px; }
.consent .actions { display: flex; gap: 10px; flex-wrap: wrap; }
.consent a { color: var(--amber-deep); }

/* ---------- Utilities ---------- */
.muted { color: var(--muted); }
.small { font-size: 14px; }
.center { text-align: center; }
.mt-0 { margin-top: 0; }
.divider { height: 1px; background: var(--line); border: 0; }
.rel-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.rel-list a { color: var(--ink); text-decoration: none; font-size: 15px; }
.rel-list a:hover { color: var(--amber-deep); }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-grid); }
.pagerow { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-top: 8px; }
.tag-count { font-size: 13px; color: var(--muted-2); }

/* ---------- 404 ---------- */
.err { text-align: center; padding-block: 80px; }
.err h1 { font-size: 64px; font-weight: 800; letter-spacing: -.03em; }
.err p { margin-top: 12px; color: var(--muted); }
.err .btn { margin-top: 24px; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 960px) {
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 24px 20px; }
  .article-layout { grid-template-columns: 1fr; gap: 0; }
  .toc { position: static; margin-bottom: 24px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 14px 16px; }
  .toc.details-toc { padding: 0; }
  .pd { grid-template-columns: 1fr; gap: 26px; }
  .pd .media { max-width: 460px; }
  .product-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 760px) {
  body { font-size: 15px; line-height: 1.6; }
  :root { --gap-section: 40px; --gap-grid: 14px; --card-pad: 13px; }
  .main-nav, .head-search { display: none; }
  .menu-toggle { display: inline-flex; }
  .site-head .wrap { gap: 12px; }

  .main-nav.open {
    display: flex; position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; gap: 2px; background: var(--surface);
    border-bottom: 1px solid var(--line); padding: 10px 20px 16px;
    box-shadow: 0 12px 24px rgba(35,32,28,.08);
  }
  .main-nav.open a { padding: 11px 10px; }
  .head-search.open { display: flex; position: absolute; left: 0; right: 0; top: 100%; padding: 12px 20px; background: var(--surface); border-bottom: 1px solid var(--line); }
  .head-search.open input { width: 100%; max-width: none; }

  .hero .wrap { padding-block: 36px 32px; }
  .hero h1 { font-size: 32px; line-height: 1.2; }
  .hero .sub { font-size: 16px; }

  .section > h2, .prose h2 { font-size: 22px; }
  .prose h1, .pd h1 { font-size: 30px; }
  .prose h1 { font-size: 30px; }

  .grid-3, .grid-2, .grid-4 { grid-template-columns: 1fr; }
  .def-grid, .two-col { grid-template-columns: 1fr; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .stage { grid-template-columns: 36px 1fr; gap: 12px; padding: 14px; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 400px) {
  .wrap { padding-inline: 16px; }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .product-card .body { padding: 11px 12px 13px; }
  .hero h1 { font-size: 29px; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* Presentation-only Germany theme. Existing content and behaviour are retained. */
:root {
  --ink:#111111; --ink-soft:#292c30; --muted:#595d63; --muted-2:#656971;
  --line:#e5e5e2; --line-soft:#efefec; --page:#faf9f6; --surface:#ffffff;
  --surface-2:#f5f5f2; --amber:#ffc629; --amber-deep:#815400;
  --amber-tint:#fff2c5; --warn-bg:#fff8df; --warn-line:#e8cf8d;
  --gold:#ffc629; --de-red:#c7352b; --wrap:1280px; --radius:16px;
  --radius-sm:9px; --gap-section:48px; --gap-grid:20px;
}
html {scroll-padding-top:110px;}
body {background:var(--page);}
.wrap {padding-inline:28px;}
.strip {background:#111; color:#e6e6e6; font-size:12.5px;}
.strip .wrap {position:relative; padding-block:10px; padding-left:66px; gap:8px 16px;}
.strip .wrap::before {content:"";position:absolute;left:28px;top:12px;width:24px;height:16px;border-radius:2px;background:linear-gradient(to bottom,#161616 0 33.33%,#cf342c 33.33% 66.66%,#ffd13c 66.66%);box-shadow:0 0 0 1px #ffffff35;}
.strip a {color:#ffe09a;}
.site-head {background:#fffffffa; border-bottom-color:#e9e8e4; backdrop-filter:blur(12px);}
.site-head .wrap {min-height:82px;gap:20px;padding-block:15px;}
.brand {font-size:20px;gap:10px;}
.brand .mark {background:#23201c;color:#fff;box-shadow:inset 0 0 0 2px #b26a0a;}
.brand small {font-size:11px;line-height:1.6;color:#62656a;}
.main-nav {gap:4px;flex-wrap:nowrap;align-items:center;}
.main-nav a {min-height:44px;display:inline-flex;align-items:center;padding:10px 11px;line-height:1.35;}
.main-nav a:hover {background:#fff3c7;color:#111;}
.main-nav a[aria-current="page"] {box-shadow:inset 0 -3px 0 var(--gold);color:#111;}
.head-search form {border:1px solid #d7d9dc;background:#f8f8f7;border-radius:999px;padding:4px;gap:5px;align-items:center;}
.head-search input {width:180px;max-width:none;padding:8px 10px;font-size:16px;min-height:40px;border:0;background:transparent;border-radius:999px;}
.head-search .btn {border-radius:999px;}
.btn {min-height:44px;justify-content:center;line-height:1.3;white-space:normal;text-align:center;transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s;}
.btn-primary,.btn-amber {background:var(--gold);color:#111;border-color:var(--gold);}
.btn-primary:hover,.btn-amber:hover {background:#ffda61;border-color:#ffda61;color:#111;box-shadow:0 4px 12px #a8750020;}
.btn-ghost:hover {background:#fff8df;border-color:#c89938;color:#111;}
.btn-sm {font-size:13px;padding:9px 12px;}
:focus-visible {outline:3px solid #946000;outline-offset:4px;}
.hero {position:relative;isolation:isolate;overflow:hidden;background:#181714 url('/assets/berlin-hero-20261013.jpg') center 12%/cover no-repeat;border-bottom:0;}
.hero::before {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(9,12,15,.96) 0%,rgba(9,12,15,.83) 34%,rgba(9,12,15,.35) 66%,rgba(9,12,15,.05) 100%);}
.hero::after {content:"";position:absolute;width:194px;height:126px;top:-53px;left:-40px;transform:rotate(-35deg);background:linear-gradient(to bottom,#141414 0 33.33%,#c7352b 33.33% 66.66%,#ffc629 66.66%);box-shadow:0 12px 28px #0005;z-index:-1;}
.hero .wrap {position:relative;padding-block:58px 46px;min-height:540px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;}
.hero .eyebrow {color:#ffe39a;border:0;padding-left:0;margin:0 0 18px;text-transform:none;letter-spacing:.03em;}
.hero h1 {color:#fff;max-width:19ch;font-size:52px;line-height:1.12;letter-spacing:-.025em;text-shadow:0 2px 18px #0003;}
.hero .sub {font-size:17px;color:#f0ede7;line-height:1.65;max-width:64ch;margin-top:20px;}
.hero .hero-actions {margin-top:24px;gap:12px;}
.hero-actions .btn {padding:13px 21px;border-radius:999px;}
.hero-actions .btn-ghost {background:#ffffff0d;color:#fff;border-color:#ffffff6b;}
.hero-actions .btn-ghost:hover {background:#fff1c7;color:#111;border-color:#fff1c7;}
.hero .chip-row {max-width:690px;margin-top:24px;gap:10px;}
.hero .chip {background:#080c119c;border-color:#ffffff80;color:#fff;padding:9px 14px;min-height:40px;display:inline-flex;align-items:center;line-height:1.35;}
.hero .chip:hover {background:#ffc629;color:#111;border-color:#ffc629;}
.hero .hero-note {color:#d4d5d6;max-width:76ch;line-height:1.55;font-size:12.5px;margin-top:24px;}
.hero :focus-visible {outline-color:#ffdb70;}
.section-head h2,.section > h2 {font-size:28px;line-height:1.28;letter-spacing:-.02em;}
.section-head .lede {margin-top:12px;line-height:1.7;max-width:85ch;color:var(--muted);}
.eyebrow {border-left-color:var(--de-red);color:#805500;text-transform:none;font-size:13px;letter-spacing:.02em;}
.page-stack {gap:48px;padding-block:42px;}
.stage-list {grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.stage {display:flex;flex-direction:column;padding:22px;gap:15px;border-color:#e8e6df;box-shadow:0 5px 18px #27231b05;}
.stage > div:last-child {flex:1;display:flex;flex-direction:column;align-items:flex-start;}
.stage .num {background:var(--gold);color:#111;border:0;width:42px;height:42px;border-radius:50%;font-size:19px;}
.stage h3 {font-weight:700;line-height:1.4;}
.stage p {font-size:14px;line-height:1.65;margin-top:10px;}
.stage .verify {margin-top:auto;padding-top:16px;font-size:13px;}
.stage .verify a {color:#775000;text-decoration-color:#d4b96f;}
.phase-table {border:0;border-radius:0;font-size:15px;}
.table-scroll {border:1px solid var(--line);border-radius:12px;background:#fff;scrollbar-color:#c69b39 #f8f3e4;}
.phase-table thead th,.prose th {background:#fff4cf;color:#342d1b;text-transform:none;letter-spacing:0;font-weight:700;}
.phase-table th,.phase-table td {padding:16px 18px;}
.phase-table tr:nth-child(even) td {background:#fcfcfa;}
.def-grid {gap:22px;}
.def {padding:26px;border:1px solid #e2e3e2;background:#fff;}
.def:first-child {border-top:4px solid #dfb537;}
.def:last-child {border-top:4px solid #c7352b;}
.def h3 {font-size:19px;}
.def p {line-height:1.7;}
.notice {padding:18px 22px;border-radius:12px;}
.notice.plain {background:#f1f1ed;}
.check {gap:15px;}
.check li::before {background:#b08008;box-shadow:0 0 0 4px #ffedb2;}
.product-grid {gap:20px;grid-template-columns:repeat(4,minmax(0,1fr));}
.product-card {overflow:visible;border:1px solid #e7e7e3;border-radius:14px;box-shadow:0 4px 14px #23232305;transition:border-color .18s,box-shadow .18s;min-width:0;}
.product-card:hover,.product-card:focus-within {border-color:#c7a13f;box-shadow:0 7px 22px #33271312;}
.product-card .thumb {margin:10px 10px 0;border:0;border-radius:9px;background:#f4f4f1;}
.product-card .thumb img {object-fit:contain;border-radius:9px;}
.product-card .body {padding:16px;gap:12px;}
.product-card .cat {text-transform:none;letter-spacing:0;color:#815400;}
.product-card h3 {font-size:16px;line-height:1.45;min-height:3em;overflow-wrap:anywhere;}
.price {padding-top:4px;gap:6px 10px;}
.price .eur {font-size:19px;letter-spacing:-.02em;}
.card-links {display:grid;grid-template-columns:1fr;gap:8px;}
.card-links .btn {width:100%;min-height:42px;}
.qc-flag {font-size:12px;line-height:1.5;}
.search-panel {margin-top:26px;padding:28px;background:#fff5d9;border:1px solid #ecd18e;}
.search-panel form {gap:12px;}
.search-panel input {border-color:#d2be8c;background:#fff;border-radius:999px;padding:13px 18px;min-height:48px;}
.search-panel .btn {border-radius:999px;padding-inline:24px;}
.faq {gap:12px;}
.faq details {padding:4px 22px;border-color:#dedfdc;}
.faq details[open] {background:#fffbee;border-color:#d4af53;}
.faq summary {padding:17px 0;font-size:16px;line-height:1.5;}
.faq summary::after {width:28px;height:28px;border-radius:50%;background:#fff0b9;color:#775000;display:grid;place-items:center;}
.faq details > div {padding-top:3px;line-height:1.7;}
.crumbs {padding-top:22px;font-size:13px;}
.crumbs li::after {color:#7b7e82;}
.article-layout {grid-template-columns:230px minmax(0,1fr);gap:36px;padding-block:28px 52px;}
.toc {top:108px;padding:22px 18px;background:#fff;border:1px solid var(--line);border-radius:14px;}
.toc h2 {color:#36383b;text-transform:none;font-size:14px;letter-spacing:0;}
.toc ol {gap:7px;}
.toc a {padding:9px 11px;border-left-color:#e2d2a1;line-height:1.45;}
.toc a:hover {background:#fff2c5;border-left-color:#ba8300;color:#111;}
.prose {max-width:78ch;padding:32px 36px;background:#fff;border:1px solid var(--line);border-radius:16px;}
.prose h1 {font-size:38px;line-height:1.2;}
.prose h2 {scroll-margin-top:112px;}
.prose .dek {font-size:17px;line-height:1.7;}
.prose .table-scroll {margin-inline:0;}
.prose th,.prose td {padding:13px 14px;}
.card {padding:24px;}
.card h3 {font-weight:700;}
.grid-3 {grid-template-columns:repeat(3,minmax(0,1fr));}
.pagerow {margin-top:16px;}
.tag-count {color:#413515;background:#fff0b8;padding:5px 11px;border-radius:999px;}
.pd {grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:36px;padding-block:30px 52px;}
.pd .media {background:#fff;border-radius:16px;padding:14px;}
.pd .info {background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;min-width:0;}
.pd h1 {font-size:32px;line-height:1.24;overflow-wrap:anywhere;}
.pd .cat-line {text-transform:none;letter-spacing:0;}
.pd .price-block .eur {color:#111;font-size:30px;}
.pd .fact-table {border:1px solid var(--line);border-radius:0;}
.pd .fact-table th {background:#fff7df;}
.pd .checklist-box {background:#faf9f5;padding:22px;}
.pd .cta-row .btn {flex:1;}
.consent {border-color:#d1b770;border-top:4px solid var(--gold);border-radius:14px;box-shadow:0 10px 38px #1112;max-height:calc(100dvh - 32px);overflow:auto;}
.consent .actions {align-items:center;gap:14px;}
.consent .actions a:not(.btn) {display:inline-flex;align-items:center;min-height:44px;}
.site-foot {position:relative;background:#111;color:#d3d4d5;margin-top:20px;border-top:4px solid transparent;border-image:linear-gradient(to right,#161616 0 33.33%,#c7352b 33.33% 66.66%,#ffc629 66.66%) 1;}
.site-foot .wrap {padding-block:44px 30px;position:relative;}
.foot-grid {grid-template-columns:1.35fr 1fr 1fr 1fr;gap:36px;}
.site-foot h4 {font-size:14px;text-transform:none;letter-spacing:0;}
.site-foot a {color:#d7d8da;line-height:1.6;display:inline-block;}
.site-foot a:hover {color:#ffe29a;}
.site-foot .about-blurb {color:#bfc1c5;}
.site-foot .brand-foot {font-size:21px;color:#fff;}
.foot-bottom {color:#b6b8bc;border-top-color:#3a3b3d;line-height:1.7;margin-top:34px;}
.site-foot :focus-visible {outline-color:#ffd052;}
@media (min-width:1001px) {
 .hero + .page-stack {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px 28px;}
 .hero + .page-stack > .section {grid-column:1 / -1;min-width:0;}
 .hero + .page-stack > .section:nth-child(3),.hero + .page-stack > .section:nth-child(4) {grid-column:auto;background:#fff;padding:28px;border:1px solid var(--line);border-radius:16px;}
 .hero + .page-stack > .section:nth-child(3) .def-grid {grid-template-columns:1fr;gap:14px;}
 .hero + .page-stack > .section:nth-child(3) .def {padding:18px;}
 .hero + .page-stack > .section:nth-child(3) .notice {margin-top:18px;}
 .hero + .page-stack > .section:nth-child(4) > p {margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;}
}
@media (max-width:1160px) {
 .site-head .wrap {flex-wrap:wrap;gap:8px 16px;padding-block:12px;}
 .main-nav {margin-left:auto;}
 .head-search {width:100%;justify-content:flex-end;}
 .head-search input {width:240px;}
 .hero .wrap {min-height:560px;}
 .stage-list {grid-template-columns:repeat(2,minmax(0,1fr));}
 .article-layout {grid-template-columns:200px minmax(0,1fr);gap:24px;}
 .toc {top:166px;}
 html {scroll-padding-top:172px;}
 .prose h2 {scroll-margin-top:172px;}
}
@media (max-width:960px) {
 .wrap {padding-inline:24px;}
 .strip .wrap {padding-left:60px;}
 .strip .wrap::before {left:24px;}
 .product-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
 .article-layout {grid-template-columns:1fr;gap:22px;}
 .toc {position:static;}
 .toc ol {grid-template-columns:repeat(2,minmax(0,1fr));}
 .prose {max-width:none;}
 .pd {grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:22px;}
 .pd .info {padding:22px;}
 .pd h1 {font-size:28px;}
 .foot-grid {grid-template-columns:1.25fr 1fr;gap:28px;}
}
@media (max-width:760px) {
 :root {--gap-section:36px;--gap-grid:16px;}
 .wrap {padding-inline:20px;}
 .strip .wrap {padding-left:54px;padding-block:9px;font-size:12px;gap:5px 9px;}
 .strip .wrap::before {left:20px;top:11px;}
 .site-head .wrap {min-height:72px;gap:10px;flex-wrap:nowrap;padding-block:13px;}
 .brand {font-size:19px;}
 .brand small {font-size:10px;}
 .menu-toggle {min-height:44px;gap:10px;padding:10px 13px;}
 .main-nav,.head-search {display:none;}
 .main-nav.open {display:grid;position:absolute;left:0;right:0;top:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:12px 20px 14px;background:#fff;border-bottom:1px solid var(--line);min-height:174px;box-shadow:0 10px 20px #1111;max-height:calc(100dvh - 150px);overflow-y:auto;}
 .main-nav.open a {padding:10px 12px;min-height:44px;border-radius:8px;}
 .head-search.open {display:flex;top:calc(100% + 174px);padding:12px 20px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 22px #1111;}
 .head-search form {width:100%;}
 .head-search input {width:100%;min-width:0;flex:1;}
 .head-search .btn {flex:0 0 auto;}
 .hero {background-position:66% center;}
 .hero::before {background:linear-gradient(90deg,#090c10eF 0%,#090c10dE 42%,#090c10A8 100%);}
 .hero::after {width:145px;height:92px;top:-42px;left:-38px;}
 .hero .wrap {padding-block:40px 36px;min-height:0;}
 .hero .eyebrow {font-size:12px;max-width:28ch;line-height:1.6;margin-bottom:16px;}
 .hero h1 {font-size:36px;max-width:18ch;line-height:1.15;}
 .hero .sub {font-size:15px;line-height:1.7;margin-top:18px;}
 .hero .hero-actions {gap:10px;margin-top:22px;}
 .hero-actions .btn {padding:12px 16px;font-size:14px;}
 .hero .chip-row {gap:9px;margin-top:22px;}
 .hero .chip {font-size:12px;padding:9px 11px;min-height:40px;}
 .hero .hero-note {font-size:12px;line-height:1.6;margin-top:22px;color:#d8d9da;}
 .page-stack {gap:34px;padding-block:30px;}
 .section-head {margin-bottom:18px;}
 .section-head h2,.section > h2 {font-size:24px;line-height:1.3;}
 .section-head h1 {font-size:30px !important;line-height:1.2 !important;overflow-wrap:anywhere;}
 .section-head .lede {font-size:15px;line-height:1.7;}
 .grid-3,.grid-2,.grid-4 {grid-template-columns:1fr;}
 .stage-list {gap:14px;}
 .stage {padding:18px;gap:12px;}
 .stage .num {width:36px;height:36px;font-size:17px;}
 .stage h3 {font-size:17px;}
 .stage p {font-size:14px;}
 .stage .verify {padding-top:12px;}
 .phase-table {font-size:13px;}
 .phase-table th,.phase-table td {padding:12px 10px;}
 .phase-table td:first-child {white-space:normal;}
 .def-grid {grid-template-columns:1fr;gap:16px;}
 .def {padding:22px;}
 .notice {padding:17px 18px;}
 .product-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
 .product-card .thumb {margin:8px 8px 0;}
 .product-card .body {padding:13px;gap:10px;}
 .product-card h3 {font-size:14px;min-height:3em;}
 .price {gap:3px 8px;}
 .product-card .price {display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 6px;min-height:52px;align-content:start;}
 .product-card .price .cny {grid-column:1 / -1;}
 .price .eur {font-size:17px;}
 .price .cny {font-size:12px;}
 .card-links .btn {font-size:12px;min-height:44px;padding:9px 8px;}
 .qc-flag {font-size:11.5px;}
 .search-panel {padding:22px 20px;margin-top:22px;}
 .search-panel form {display:grid;grid-template-columns:minmax(0,1fr);gap:12px;}
 .search-panel input,.search-panel .btn {width:100%;min-height:48px;}
 .faq details {padding-inline:18px;}
 .faq summary {font-size:15px;gap:16px;}
 .faq summary::after {flex:0 0 28px;}
 .faq details > div {font-size:15px;}
 .article-layout {padding-block:24px 34px;}
 .toc {margin-bottom:0;padding:18px 16px;}
 .toc ol {grid-template-columns:1fr;}
 .prose {padding:24px 20px;border-radius:14px;}
 .prose h1 {font-size:30px;overflow-wrap:anywhere;}
 .prose h2 {font-size:23px;scroll-margin-top:94px;}
 .prose p,.prose li {font-size:15px;line-height:1.75;}
 .prose .dek {font-size:16px;}
 .prose th,.prose td {overflow-wrap:anywhere;hyphens:auto;}
 .pd {grid-template-columns:1fr;padding-block:24px 34px;gap:22px;}
 .pd .media {max-width:560px;width:100%;margin-inline:auto;}
 .pd .info {padding:22px 20px;}
 .pd h1 {font-size:28px;}
 .pd .cta-row {gap:12px;}
 .pd .cta-row .btn {flex:1 1 180px;}
 .pd .fact-table th,.pd .fact-table td {padding:11px 10px;overflow-wrap:anywhere;}
 .pd .checklist-box {padding:18px 16px;}
 .foot-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;}
 .foot-grid > div:first-child {grid-column:1 / -1;}
 .site-foot .wrap {padding-block:34px 26px;}
 .site-foot .about-blurb {max-width:52ch;}
 .site-foot a {font-size:13px;}
 .foot-bottom {font-size:12px;margin-top:26px;}
 .consent {left:12px;right:12px;bottom:12px;padding:16px;max-height:calc(100dvh - 130px);font-size:13px;}
 html {scroll-padding-top:94px;}
}
@media (max-width:380px) {
 .wrap {padding-inline:16px;}
 .strip .wrap {padding-left:49px;}
 .strip .wrap::before {left:16px;}
 .hero h1 {font-size:32px;}
 .hero-actions {width:100%;}
 .hero-actions .btn {flex:1 1 150px;}
 .stage-list {grid-template-columns:1fr;}
 .stage {display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;}
 .product-grid {grid-template-columns:1fr;gap:18px;}
 .product-card .thumb {aspect-ratio:4/3;}
 .product-card h3 {font-size:16px;min-height:0;}
 .product-card .body {padding:17px;}
 .product-card .price {display:flex;min-height:0;}
 .card-links {grid-template-columns:1fr 1fr;}
 .foot-grid {gap:24px 16px;}
 .prose {padding:22px 16px;}
}
@media (prefers-reduced-motion:reduce) {*,*::before,*::after {animation:none !important;transition:none !important;scroll-behavior:auto !important;}}

/* Balanced rhythm: retain the Germany palette, assets, copy and behaviour. */
:root {--gap-section:40px;--gap-grid:18px;--stack:18px;}
.page-stack {gap:40px;padding-block:36px;}
.section-head {margin-bottom:20px;}
.hero .wrap {padding-block:52px 40px;min-height:520px;}
.product-grid {gap:18px;}
.product-card .body {padding:18px;}
.card-links {gap:10px;}
.card-links .btn {min-height:44px;}
.article-layout {gap:32px;padding-block:24px 40px;}
.prose {padding:28px 32px;}
.prose > .eyebrow {margin-bottom:0;}
.prose > .eyebrow + h1 {margin-top:12px;}
.prose > h1 + .dek {margin-top:16px;}
.prose h2 {margin-top:32px;}
.prose h3 {margin-top:24px;}
.pd {gap:32px;padding-block:26px 40px;}
.pd .info {padding:26px;}
.head-search form {gap:8px;padding:5px;}
.head-search input:focus-visible {outline:2px solid #946000;outline-offset:-2px;}
.head-search .btn:focus-visible {outline:3px solid #946000;outline-offset:1px;}
.faq summary {padding-inline:8px;margin-inline:-8px;}
.faq summary:focus-visible {outline-offset:-3px;}
.toc a {min-height:44px;}
.toc ol {gap:10px;}
.site-foot {margin-top:0;}
.site-foot .wrap {padding-block:40px 28px;}
.foot-grid {gap:32px;}
@media (min-width:1001px) {
 .hero + .page-stack {gap:40px 24px;}
 .hero + .page-stack > .section:nth-child(3),
 .hero + .page-stack > .section:nth-child(4) {padding:24px;align-self:start;}
}
@media (max-width:1160px) {
 .hero::after {width:144px;height:74px;top:-78px;left:-42px;}
 .hero::before {background:linear-gradient(90deg,rgba(9,12,15,.94) 0%,rgba(9,12,15,.78) 58%,rgba(9,12,15,.62) 100%);}
}
@media (max-width:960px) {
 .site-head .wrap {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;min-height:76px;padding-block:12px;}
 .menu-toggle {display:inline-flex;min-height:44px;padding:10px 13px;gap:10px;}
 .main-nav,.head-search {display:none;}
 .main-nav.open {display:grid;position:static;grid-column:1 / -1;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px 8px;margin:0;border:0;box-shadow:none;min-height:0;max-height:calc(100dvh - 180px);overflow:auto;}
 .main-nav.open a {min-height:44px;padding:10px 12px;line-height:1.4;}
 .head-search.open {display:flex;position:static;grid-column:1 / -1;top:auto;left:auto;right:auto;width:100%;padding:4px 0 2px;margin:0;border:0;box-shadow:none;}
 .head-search form {width:100%;}
 .head-search input {width:100%;min-width:0;max-width:none;flex:1;}
 .head-search .btn {flex:0 0 auto;}
 .foot-grid {gap:28px 24px;}
 html {scroll-padding-top:96px;}
 .prose h2 {scroll-margin-top:96px;}
}
@media (max-width:760px) {
 :root {--gap-section:28px;--gap-grid:14px;--stack:18px;}
 .page-stack {gap:28px;padding-block:28px;}
 .section-head {margin-bottom:18px;}
 .hero .wrap {padding-block:32px 30px;min-height:0;}
 .hero::after {width:144px;height:74px;top:-78px;left:-42px;}
 .hero .hero-actions {gap:12px;margin-top:20px;}
 .hero .chip-row {gap:10px;margin-top:18px;}
 .hero .chip {min-height:44px;}
 .hero .hero-note {margin-top:20px;}
 .stage-list {grid-template-columns:1fr;gap:14px;}
 .stage {display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:18px;}
 .stage .verify {padding-top:12px;}
 .product-grid {gap:14px;}
 .product-card .thumb {margin:10px 10px 0;}
 .product-card .body {padding:14px;gap:12px;}
 .card-links {gap:10px;}
 .article-layout {gap:20px;padding-block:22px 32px;}
 .prose {padding:22px 20px;}
 .prose h2 {margin-top:28px;}
 .prose h3 {margin-top:22px;}
 .pd {gap:20px;padding-block:24px 32px;}
 .pd .info {padding:22px 20px;}
 .site-foot .wrap {padding-block:32px 24px;}
 .foot-grid {gap:26px 20px;}
 .site-foot li a {min-height:28px;}
}
@media (max-width:380px) {
 .product-grid {gap:18px;}
 .product-card .body {padding:16px;}
 .prose {padding:22px 16px;}
}

/* Official-inspired flame family, independently drawn for litbuys.de. */
.site-head .brand {display:inline-flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:44px;max-width:190px;border-radius:7px;}
.brand .brand-logo {display:block;width:184px;height:auto;max-width:100%;}
.brand small {font-size:10px;line-height:1.5;white-space:nowrap;}
.brand:focus-visible {outline:3px solid #946000;outline-offset:5px;}
.brand-logo {transition:filter .18s ease;}
.brand:hover .brand-logo {filter:brightness(1.08);}
.site-foot .brand-foot {min-height:44px;border-radius:7px;}
.brand-foot .brand-logo {display:block;width:208px;height:auto;max-width:100%;}
.site-foot .brand-foot:focus-visible {outline:3px solid #ffc629;outline-offset:5px;}
@media (max-width:960px) {.site-head .brand {max-width:176px;}.brand .brand-logo {width:176px;}}
@media (max-width:380px) {.site-head .brand {max-width:166px;}.brand .brand-logo {width:166px;}.brand small {font-size:9.5px;}}
@media (prefers-reduced-motion:reduce) {.brand-logo {transition:none;}}
