body{ line-height:1.55; }
  h1{ font-size:clamp(1.7rem, 6vw, 2.3rem); }

  main{ max-width:480px; padding:1rem 1.25rem 3rem; }

  .standort{
    display:inline-block;
    background:var(--card);
    border-radius:999px;
    padding:.3rem .9rem;
    font-size:.9rem; font-weight:600;
    margin:.75rem 0 0;
  }

  .lead{ margin:.5rem 0 1.5rem; }

  /* ── Karte ── */
  #map{
    width:100%;
    height:400px;
    border-radius:14px;
    box-shadow:0 2px 8px rgba(0,0,0,.12);
    margin-bottom:1rem;
    position:relative;
    z-index:0;                 /* Karte bleibt unter dem Sticky-Header */
  }
  .leaflet-container{ font-family:"Inter", system-ui, sans-serif; }
  .popup-wrap{ text-align:center; }
  .popup-wrap strong{
    display:block; margin-bottom:.5rem;
    font-size:.95rem;
  }
  .popup-ok{
    color:var(--success); font-size:.85rem; font-weight:700;
  }
  /* Gewählter Pin: Lila statt Blau */
  .marker-gewaehlt{ filter:hue-rotate(105deg) saturate(1.4); }

  /* ── Standortliste mit Suche (Alternative zur Karte) ── */
  .standort-wahl{ margin-bottom:1.25rem; }
  .suche-zeile{
    display:flex; flex-wrap:wrap; gap:.5rem;
  }
  .suche-zeile input{
    flex:1 1 12rem; min-width:0;
    padding:.75rem 1rem;
    font:inherit; color:var(--text);
    background:var(--card);
    border:1.5px solid var(--line);
    border-radius:10px;
  }
  :root[data-theme="dark"] .suche-zeile input{ background:#1E1E38; }
  .suche-zeile input:hover{ border-color:var(--heading); }
  .naehe-btn{
    flex:none;
    padding:.75rem 1rem;
    font:inherit; font-size:.95rem; font-weight:700;
    color:var(--heading);
    background:var(--card);
    border:1.5px solid var(--heading);
    border-radius:10px;
    cursor:pointer;
  }
  .naehe-btn:hover{ background:var(--primary-soft); }
  .naehe-btn:disabled{ opacity:.6; cursor:wait; }
  .naehe-hinweis{
    font-size:.9rem; color:var(--text-soft);
    margin-top:.4rem;
  }
  .naehe-hinweis:empty{ display:none; }
  .standort-liste{
    list-style:none;
    margin-top:.6rem;
    max-height:15.5rem; overflow-y:auto;
    border:1.5px solid var(--line);
    border-radius:10px;
    background:var(--card);
  }
  .standort-liste li + li{ border-top:1px solid var(--line); }
  .standort-liste button{
    display:flex; align-items:center; justify-content:space-between; gap:.75rem;
    width:100%;
    padding:.75rem 1rem;
    font:inherit; font-size:.95rem; text-align:left;
    color:var(--text);
    background:none; border:none;
    cursor:pointer;
  }
  .standort-liste button:hover{ background:var(--paper-soft); }
  .standort-liste button[aria-pressed="true"]{
    background:var(--primary-soft);
    font-weight:700;
  }
  .standort-liste button[aria-pressed="true"] .standort-name::before{
    content:"✓ "; color:var(--heading);
  }
  .standort-entfernung{
    flex:none;
    font-size:.85rem; font-weight:600;
    color:var(--text-soft);
  }
  .standort-leer{
    padding:.75rem 1rem;
    font-size:.95rem; color:var(--text-soft);
  }

  /* gesperrtes Feld: leicht ausgegraut (Selektor so gewählt, dass der Dark Mode greift) */
  .meta-fields #ortInput{ cursor:default; }
  .meta-fields input[readonly]{ background:#f2f2f2; }
  :root[data-theme="dark"] .meta-fields input[readonly]{ background:#1A1A30; }
  .ort-error{
    display:none;
    color:var(--cta); font-size:.9rem; font-weight:600;
    margin-top:.35rem;
  }
  .ort-error.show{ display:block; }

  /* ── Standort & Code ── */
  .meta-fields{
    display:grid; gap:1rem;
    margin-bottom:1.5rem;
  }
  .meta-fields label{
    display:block; font-weight:600;
    font-size:.95rem; margin-bottom:.35rem;
  }
  .required::after{ content:" *"; color:var(--cta); font-weight:700; }
  .meta-fields select,
  .meta-fields input{
    width:100%;
    padding:.85rem 1rem;
    font:inherit; color:var(--text);
    background:var(--card);
    border:1.5px solid var(--line);
    border-radius:10px;
  }
  :root[data-theme="dark"] .meta-fields select,
  :root[data-theme="dark"] .meta-fields input{ background:#1E1E38; }
  .meta-fields select:hover,
  .meta-fields input:hover{ border-color:var(--heading); }
  .label-row{
    display:flex; align-items:center; gap:.45rem;
    margin-bottom:.35rem;
  }
  .label-row label{ margin-bottom:0; }
  .info-btn{
    width:1.35rem; height:1.35rem;
    border-radius:50%;
    border:none;
    background:var(--heading); color:#fff;
    font:inherit; font-size:.85rem; font-weight:700;
    line-height:1; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    flex:none;
  }
  .info-box{
    display:none;
    background:#f6ecf4;
    border-left:4px solid var(--heading);
    border-radius:0 8px 8px 0;
    padding:.6rem .9rem;
    font-size:.9rem;
    margin-bottom:.5rem;
  }
  .info-box.show{ display:block; }
  :root[data-theme="dark"] .info-box{ background:var(--primary-soft); }

  /* ── Einkreuz-Menü "Was fehlt?" ── */
  .was-fehlt{ display:grid; gap:.85rem; }
  .was-fehlt .field-label{ margin-bottom:0; }
  .feld-hinweis{
    font-size:.9rem; color:var(--text-soft);
    margin-top:-.6rem;
  }
  .tile, .chip{
    display:flex; align-items:center; gap:.9rem;
    background:var(--card);
    border:2.5px solid transparent;
    border-radius:14px;
    padding:1rem 1.15rem;
    cursor:pointer;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
    transition:border-color .12s ease, background .12s ease;
    -webkit-tap-highlight-color:transparent;
  }
  .tile[hidden]{ display:none; }
  .tile:hover, .chip:hover{ border-color:var(--heading); }
  .tile:has(input:checked), .chip:has(input:checked){
    border-color:var(--heading);
    background:#f6ecf4;
  }
  :root[data-theme="dark"] .tile:has(input:checked),
  :root[data-theme="dark"] .chip:has(input:checked){ background:var(--primary-soft); }
  .tile:has(input:focus-visible), .chip:has(input:focus-visible){
    outline:3px solid var(--heading); outline-offset:2px;
  }
  .tile input, .chip input{
    width:1.6rem; height:1.6rem;
    flex:none; margin:0;
    accent-color:var(--heading);
    cursor:pointer;
  }
  .tile-text{ display:flex; flex-direction:column; min-width:0; }
  .tile-titel{ font-size:1.15rem; font-weight:600; line-height:1.3; }
  .tile-unter{ font-size:.88rem; color:var(--text-soft); line-height:1.3; }

  .produkte{ display:grid; gap:.85rem; }
  .produkte:empty{ display:none; }
  .art-bereich{ display:grid; gap:.85rem; }
  .art-bereich[hidden]{ display:none; }

  .produkte-hinweis{
    background:var(--paper-soft);
    border-radius:12px;
    padding:.85rem 1rem;
    font-size:.95rem;
  }
  .produkte-hinweis[hidden]{ display:none; }

  /* Schritt 1: Tampons oder Binden, große Knöpfe nebeneinander */
  .arten{
    display:grid; gap:.6rem;
    grid-template-columns:repeat(auto-fit, minmax(8.5rem, 1fr));
  }
  .arten[hidden]{ display:none; }
  .art-btn{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:.15rem;
    min-height:4.2rem;
    padding:.7rem .6rem;
    font:inherit; color:var(--text);
    background:var(--card);
    border:2.5px solid var(--line-strong);
    border-radius:14px;
    cursor:pointer;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
    -webkit-tap-highlight-color:transparent;
  }
  .art-btn:hover{ border-color:var(--heading); }
  .art-btn[aria-pressed="true"]{
    border-color:var(--heading);
    background:var(--heading); color:#fff;
  }
  :root[data-theme="dark"] .art-btn[aria-pressed="true"]{ color:#1A1A30; }
  .art-name{ font-size:1.15rem; font-weight:700; line-height:1.2; text-align:center; }
  .art-zahl{ font-size:.8rem; font-weight:600; min-height:1em; }

  /* Gruppe mit mehreren Größen (z. B. Tampons): Größen nebeneinander, kleinste links */
  .produkt-gruppe{
    border:none; margin:0; padding:.85rem;
    background:var(--paper-soft);
    border-radius:16px;
    min-width:0;
  }
  .produkt-gruppe legend{
    float:left; width:100%;
    font-size:1.15rem; font-weight:700;
    padding:0 .2rem .6rem;
  }
  .groessen{
    clear:both;
    display:grid; gap:.6rem;
    grid-template-columns:repeat(auto-fit, minmax(5.5rem, 1fr));
  }
  .chip{
    flex-direction:column; align-items:center; text-align:center;
    gap:.45rem; padding:.85rem .35rem;
    min-height:6rem;
  }
  .chip .tile-text{ align-items:center; }
  .chip .tile-titel{ font-size:1.05rem; }
  .chip .tile-unter{ font-size:.8rem; }

  .wunsch-field{
    margin-top:.65rem;
    display:none;
  }
  .wunsch-field.show{ display:block; }
  .wunsch-field label{
    display:block; font-weight:600;
    font-size:.95rem; margin-bottom:.35rem;
  }
  .wunsch-field input{
    width:100%;
    padding:.85rem 1rem;
    font:inherit; color:var(--text);
    background:var(--card);
    border:1.5px solid var(--line);
    border-radius:10px;
  }
  :root[data-theme="dark"] .wunsch-field input{ background:#1E1E38; }

  .btn{
    display:block; width:100%;
    background:var(--cta); color:#fff;
    font:inherit; font-weight:700; font-size:1.15rem;
    padding:1rem;
    border:none; border-radius:8px;
    cursor:pointer;
    margin-top:1.5rem;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .btn:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(204,2,0,.35); }
  .btn:disabled{
    background:#999; cursor:not-allowed;
    transform:none; box-shadow:none;
  }

  .note{
    font-size:.85rem; opacity:.7;
    text-align:center; margin-top:1rem;
  }
  .send-error{
    display:none;
    background:#fdf1f0; border:1.5px solid var(--cta);
    color:var(--text); border-radius:10px;
    padding:.85rem 1rem; margin-top:1rem;
    font-size:.95rem; font-weight:600; text-align:center;
  }
  .send-error.show{ display:block; }
  :root[data-theme="dark"] .send-error{ background:#3a2426; }

  /* ── Danke-Screen ── */
  .danke{
    display:none;
    text-align:center;
    padding-top:3rem;
  }
  .danke.show{ display:block; }
  .danke .check{
    width:4.5rem; height:4.5rem;
    background:var(--heading);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 1.25rem;
  }
  .danke .check svg{ width:2.4rem; height:2.4rem; }
  .danke p{ max-width:32ch; margin:.75rem auto 0; }
  .danke a{
    display:inline-block; margin-top:1.5rem;
    color:var(--heading); font-weight:600;
  }

  .cf-turnstile{ margin:.25rem 0 1rem; }
  .field-label{ display:block; font-weight:600; margin-bottom:.35rem; }
  .lead-strong{ margin:0 0 .75rem; font-weight:600; }

  /* ── Beipackzettel (ganz unten, siehe nachschub-beipack.js) ── */
  .beipack{
    margin-top:3.5rem; padding-top:2rem;
    border-top:1.5px solid var(--line);
  }
  .beipack h2{ margin-top:0; }
  .beipack > p{ font-size:.95rem; color:var(--text-soft); margin-bottom:.85rem; }
  .beipack > p.bp-tss-hinweis{
    color:var(--text);
    background:var(--cta-soft);
    border-left:4px solid var(--cta);
    border-radius:0 10px 10px 0;
    padding:.65rem .9rem;
  }
  :root[data-theme="dark"] .beipack > p.bp-tss-hinweis{ background:#3a2426; }
  .bp-sprung{
    list-style:none;
    display:flex; flex-wrap:wrap; gap:.45rem;
    margin:1rem 0 .5rem;
  }
  .bp-sprung a{
    display:inline-block;
    padding:.35rem .8rem;
    font-size:.9rem; font-weight:600; text-decoration:none;
    color:var(--heading);
    background:var(--primary-soft);
    border-radius:999px;
  }
  .bp-sprung a:hover{ text-decoration:underline; }
  .bp-gruppe{
    font-family:"Work Sans", sans-serif;
    font-size:1.05rem; font-weight:700;
    color:var(--text-soft);
    margin:1.5rem 0 .6rem;
  }

  /* Marke: Karte wie in der FAQ */
  .bp-marke{
    background:var(--card); border-radius:14px;
    box-shadow:0 2px 10px rgba(0,0,0,.08);
    margin-bottom:.75rem;
    scroll-margin-top:5.5rem;
  }
  .bp-marke > summary{
    list-style:none; cursor:pointer;
    display:flex; align-items:center; justify-content:space-between; gap:1rem;
    padding:1rem 1.15rem;
  }
  .bp-marke > summary::-webkit-details-marker{ display:none; }
  .bp-marke-titel{ display:flex; flex-direction:column; min-width:0; }
  .bp-marke-name{
    font-family:"Work Sans", sans-serif; font-weight:700;
    font-size:1.15rem; color:var(--heading); line-height:1.25;
  }
  .bp-marke-zusatz{ font-size:.85rem; color:var(--text-soft); }
  .bp-marke .faq-icon{
    flex:none; width:1.6rem; height:1.6rem;
    display:flex; align-items:center; justify-content:center;
    border-radius:50%; background:var(--primary-soft); color:var(--heading);
    font-size:1.1rem; line-height:1; transition:transform .2s ease;
  }
  .bp-marke[open] > summary .faq-icon{ transform:rotate(45deg); }
  .bp-marke-inhalt{ padding:0 1.15rem 1.15rem; display:grid; gap:1rem; }
  .bp-hinweis{ font-size:.9rem; color:var(--text-soft); }

  /* Produkt innerhalb einer Marke */
  .bp-produkt{
    background:var(--paper-soft);
    border-radius:12px;
    padding:.9rem;
    display:grid; gap:.6rem;
    min-width:0;
  }
  .bp-produkt-kopf{ display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem .6rem; }
  .bp-produkt h4{ font-size:1.02rem; font-weight:700; line-height:1.3; }
  .bp-art{
    font-size:.78rem; font-weight:700;
    padding:.1rem .55rem;
    border-radius:999px;
    background:var(--card); color:var(--text-soft);
  }
  .bp-gilt{ font-size:.88rem; color:var(--text-soft); }

  .bp-tabelle{
    width:100%;
    border-collapse:collapse;
    font-size:.88rem; line-height:1.35;
    background:var(--card);
    border-radius:10px; overflow:hidden;
  }
  .bp-tabelle th, .bp-tabelle td{
    padding:.5rem .55rem;
    text-align:left; vertical-align:top;
    border-top:1px solid var(--line);
  }
  .bp-tabelle thead th{
    border-top:none;
    font-size:.78rem; font-weight:700; color:var(--text-soft);
  }
  .bp-tabelle tbody th{ font-weight:700; white-space:nowrap; }
  .bp-tropfen{ display:flex; gap:2px; margin-bottom:.15rem; }
  .bp-tropfen span{
    width:.55rem; height:.55rem;
    border-radius:50% 0 50% 50%;
    transform:rotate(-45deg);
    border:1.5px solid var(--heading);
  }
  .bp-tropfen .bp-tropfen-voll{ background:var(--heading); }
  .bp-gramm{ display:block; white-space:nowrap; font-weight:600; }
  .bp-fehlt-kurz{ color:var(--text-faint); font-style:italic; }

  /* Abschnitte (Gebrauchsanweisung, TSS usw.), einzeln aufklappbar */
  .bp-abschnitt{
    background:var(--card);
    border-radius:10px;
    border:1.5px solid var(--line);
  }
  .bp-abschnitt > summary{
    list-style:none; cursor:pointer;
    display:flex; align-items:center; justify-content:space-between; gap:.75rem;
    padding:.6rem .8rem;
    font-size:.95rem; font-weight:600;
  }
  .bp-abschnitt > summary::-webkit-details-marker{ display:none; }
  .bp-pfeil{
    flex:none; width:.55rem; height:.55rem;
    border-right:2px solid currentColor; border-bottom:2px solid currentColor;
    transform:rotate(45deg); margin-top:-.2rem;
    transition:transform .2s ease;
  }
  .bp-abschnitt[open] > summary .bp-pfeil{ transform:rotate(-135deg); margin-top:.2rem; }
  .bp-wichtig{ border-color:var(--cta); }
  .bp-wichtig > summary{ color:var(--cta); }
  :root[data-theme="dark"] .bp-wichtig > summary{ color:#FF8A80; }
  :root[data-theme="dark"] .bp-wichtig{ border-color:#FF8A80; }
  .bp-text{
    padding:0 .8rem .8rem;
    font-size:.9rem; line-height:1.55;
    display:grid; gap:.55rem;
  }
  .bp-text ul, .bp-text ol{ padding-left:1.25rem; display:grid; gap:.35rem; }

  .bp-fehlt{ font-size:.85rem; color:var(--text-soft); font-style:italic; }
  .bp-quelle{ font-size:.8rem; color:var(--text-soft); overflow-wrap:anywhere; }
  .bp-stand{ font-size:.8rem; color:var(--text-faint); margin-top:1rem; }
  @media (max-width:420px){
    .bp-marke-inhalt{ padding:0 .7rem .9rem; }
    .bp-produkt{ padding:.65rem; }
    .bp-text{ padding:0 .65rem .7rem; }
  }
  .bp-tabelle caption{
    caption-side:bottom; text-align:left;
    padding:.45rem .55rem;
    font-size:.78rem; color:var(--text-soft);
    border-top:1px solid var(--line);
    background:var(--card);
  }
  .bp-link{ font-size:.92rem; font-weight:600; }