/* ============================================================
   FISHAROO SHOP — Design Tokens
   Marken-Tokens der Webseite (colors_and_type.css) +
   Card-/Schatten-Layout des Spotfinders.
   Schriften LOKAL eingebettet — kein Google-Fonts-CDN (abmahnfrei).
   ============================================================ */

/* ----- Lokale Marken-Webfonts ----------------------------------- */
/* woff2 wird von allen JS-fähigen Browsern unterstützt → keine .ttf-Fallbacks (Deploy-Ballast). */
@font-face{font-family:'Fredoka';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/Fredoka-Light.woff2') format('woff2');}
@font-face{font-family:'Fredoka';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Fredoka-Regular.woff2') format('woff2');}
@font-face{font-family:'Fredoka';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/Fredoka-Medium.woff2') format('woff2');}
@font-face{font-family:'Fredoka';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/Fredoka-SemiBold.woff2') format('woff2');}
@font-face{font-family:'Fredoka';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/Fredoka-Bold.woff2') format('woff2');}
@font-face{font-family:'Andika';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Andika-Regular.woff2') format('woff2');}
@font-face{font-family:'Andika';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/Andika-Italic.woff2') format('woff2');}
@font-face{font-family:'Andika';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/Andika-Bold.woff2') format('woff2');}
@font-face{font-family:'Andika';font-style:italic;font-weight:700;font-display:swap;src:url('../fonts/Andika-BoldItalic.woff2') format('woff2');}
@font-face{font-family:'Bevan';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Bevan-Regular.woff2') format('woff2');}

:root{
  /* Marken-Palette (Quelle: Webseite colors_and_type.css) */
  --navy-900:#0E1A2E; --navy-800:#16263F; --navy-700:#1F3454;
  --blue-700:#145E92; --blue-600:#1A75B5; --blue-500:#1E84C7; --blue-100:#DBEEFB; --blue-50:#EFF7FE;
  --green-600:#248C5C; --green-500:#2E9E6B; --green-100:#DCF1E7;
  --orange-700:#B7480F; --orange-600:#D45413; --orange-500:#E8631C; --orange-100:#FDEDE1;
  --sun-500:#F4B740; --sun-300:#F8D079;
  --sand-100:#F8F1E4; --paper:#FBF7EF;
  --white:#FFFFFF; --line:#E6DECF; --gray-500:#636D78; --gray-600:#5A6A7E; /* gray-500 abgedunkelt: 4,9:1 als Text (vorher #7E8C9B = 3,2:1) */

  /* Semantische Rollen */
  --bg:var(--paper); --fg:var(--navy-800); --fg-muted:var(--gray-600);
  --primary:var(--blue-600); --primary-hover:var(--blue-700); /* dunkler: WeiSS auf Blau 4,9:1 statt 4,05:1 */
  --accent:var(--orange-500); --accent-hover:var(--orange-600);
  --nature:var(--green-500);

  /* Card-/Schatten-Layout (Quelle: Spotfinder server.js) */
  --card:var(--white);
  --radius:14px; --radius-sm:10px;
  --shadow:0 8px 24px rgba(27,42,74,.08);
  --shadow-lg:0 14px 40px rgba(27,42,74,.12);

  --font-display:'Fredoka', system-ui, 'Segoe UI', sans-serif;
  --font-body:'Andika', system-ui, 'Segoe UI', sans-serif;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{background:var(--bg);color:var(--fg);font-family:var(--font-body);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;height:auto;}

h1,h2,h3,.fr-display{font-family:var(--font-display);line-height:1.1;color:var(--navy-800);}

.fr-wrap{max-width:1100px;margin:0 auto;padding:0 1.25rem;}
.fr-section{padding:72px 0;}
@media(max-width:720px){.fr-section{padding:48px 0;}}

/* Buttons (gleiche Klassen wie Webseite) */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--font-display);
  font-weight:600;font-size:1rem;padding:.7em 1.4em;border-radius:var(--radius-sm);
  border:2px solid transparent;cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s;}
.btn:hover{transform:translateY(-2px);}
.btn:focus-visible,a:focus-visible{outline:3px solid var(--orange-500);outline-offset:2px;}
/* A11y: Navy-Text auf Orange (4,5:1); Hover bleibt gleich hell, damit der Kontrast hält */
.btn-accent{background:var(--accent);color:var(--navy-800);}
.btn-accent:hover{background:var(--accent);}
.btn-primary{background:var(--primary);color:#fff;}
.btn-primary:hover{background:var(--primary-hover);}
.btn-secondary{background:#fff;color:var(--navy-800);border-color:var(--navy-700);}
.btn-ghost-dark{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.35);}

/* Karte (Spotfinder-Look) */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;}

/* KI-Kennzeichnung (AI Act Art. 50) */
.ai-label{font-size:11px;color:var(--gray-500);font-style:italic;margin-top:.6em;}

/* ============================================================
   SHOP-KOMPONENTEN
   ============================================================ */

/* Header */
.hdr{background:var(--navy-800);position:sticky;top:0;z-index:50;}
.hdr-in{display:flex;align-items:center;justify-content:space-between;height:62px;}
.hdr-logo{font-family:var(--font-display);font-weight:700;font-size:1.3rem;color:#fff;display:flex;align-items:center;gap:.35em;}
.hdr-shop{color:var(--sun-500);}
.hdr-nav{display:flex;align-items:center;gap:1.3em;}
.hdr-nav a{font-family:var(--font-display);font-weight:500;color:rgba(255,255,255,.88);font-size:.98rem;}
.hdr-nav a:hover{color:#fff;}
.hdr-cart{position:relative;font-size:1.25rem;}
.cart-badge{position:absolute;top:-7px;right:-10px;background:var(--orange-500);color:#fff;font-family:var(--font-body);
  font-size:11px;min-width:18px;height:18px;border-radius:999px;display:none;align-items:center;justify-content:center;padding:0 4px;}

/* Footer */
.ftr{background:var(--navy-900);color:rgba(255,255,255,.72);padding:2em 0;margin-top:3em;text-align:center;}
.ftr-links{display:flex;gap:1.1em;flex-wrap:wrap;justify-content:center;margin-bottom:.8em;}
.ftr-links a{color:rgba(255,255,255,.8);font-size:.92rem;}
.ftr-links a:hover{color:#fff;}
/* § 356a BGB: Widerrufsfunktion muss hervorgehoben platziert und leicht erkennbar sein. */
.ftr-links a.ftr-widerruf{color:#fff;font-weight:700;border:1.5px solid rgba(255,255,255,.55);border-radius:8px;padding:.15em .7em;}
.ftr-links a.ftr-widerruf:hover{background:rgba(255,255,255,.14);border-color:#fff;}
.ftr-legal{font-size:.8rem;color:rgba(255,255,255,.55);max-width:46em;margin:0 auto .6em;line-height:1.5;}
.ftr-copy{font-size:.82rem;color:rgba(255,255,255,.5);}

/* Shop-Hero */
.shop-hero{background:linear-gradient(135deg,var(--navy-800),var(--navy-900));color:#fff;text-align:center;padding:46px 1.25rem 40px;}
.shop-hero h1{color:#fff;font-size:clamp(1.9rem,5vw,2.7rem);margin-bottom:.3em;}
.shop-hero h1 .accent{color:var(--sun-500);}
.shop-hero p{color:rgba(255,255,255,.82);max-width:34em;margin:0 auto;font-size:1.05rem;}

/* Featured (Herzstück, z. B. Buch) */
.feat{display:grid;grid-template-columns:minmax(0,300px) 1fr;gap:1.8em;align-items:center;padding:1.6em;margin-bottom:1.4em;border:2px solid var(--sun-300);}
.feat-img{display:block;background:var(--sand-100);border-radius:var(--radius-sm);}
.feat-img img{width:100%;aspect-ratio:3/4;object-fit:contain;padding:.6em;}
.feat-name{font-size:1.7rem;margin:.15em 0 .3em;}
.feat-name a{color:inherit;text-decoration:none;}
.feat-name a:hover{color:var(--primary);}
.feat-short{color:var(--fg-muted);margin-bottom:1em;font-size:1.05rem;}
.feat-buy{display:flex;align-items:center;gap:.9em;flex-wrap:wrap;}
.feat-price{font-size:1.5rem;color:var(--orange-600);}
.feat-ship{background:var(--green-100);color:var(--green-600);font-weight:700;
  padding:.25em .7em;border-radius:999px;font-size:.82rem;}

/* ---- Das Buch als Herzstueck ----
   Vorher steckte das querformatige Cover in einem 3:4-Rahmen mit object-fit:contain.
   Ergebnis: viel Leerraum, Cover winzig, Titel auf dem Bild unlesbar. Jetzt bekommt
   das Buch mehr Breite und sein echtes Seitenverhaeltnis. */
.feat-buch{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:2.2em;padding:2em;
  background:linear-gradient(160deg,var(--blue-50),var(--white) 60%);}
.feat-buch .feat-img{position:relative;border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow-lg);background:transparent;transition:transform .2s ease;}
.feat-buch .feat-img:hover{transform:translateY(-3px);}
.feat-buch .feat-img img{aspect-ratio:auto;width:100%;height:auto;padding:0;
  object-fit:cover;display:block;}
.feat-flip{position:absolute;right:.9em;top:.9em;
  background:rgba(14,26,46,.85);color:#fff;font-family:var(--font-display);font-weight:600;
  font-size:.9rem;padding:.55em 1.2em;border-radius:999px;white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.3);}
.feat-buch .feat-name{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.15;}
.feat-sub{font-family:var(--font-display);color:var(--orange-600);font-weight:600;
  font-size:1.02rem;margin:0 0 .6em;}
.feat-buch .feat-short{font-size:1.1rem;color:var(--navy-700);}

@media (max-width:760px){
  .feat-buch{grid-template-columns:1fr;padding:1.2em;}
  .feat-buch .feat-name{font-size:1.5rem;}
}
.feat-note{margin-top:.9em;font-size:.86rem;color:var(--green-600);}
.grid-heading{font-size:1.3rem;margin:1.6em 0 1em;color:var(--navy-800);}
@media(max-width:600px){.feat{grid-template-columns:1fr;text-align:center;}.feat-buy{justify-content:center;}}

/* Detail-Zusätze */
.d-subtitle{font-family:var(--font-display);font-weight:500;color:var(--orange-600);font-size:1.1rem;margin:-.1em 0 .5em;}
.d-features{list-style:none;margin:.4em 0 1em;padding:0;}
.d-features li{position:relative;padding-left:1.5em;margin-bottom:.4em;color:var(--fg);}
.d-features li::before{content:'✓';position:absolute;left:0;color:var(--green-600);font-weight:700;}
.d-delivery{background:var(--green-100);color:var(--green-700);border-radius:var(--radius-sm);padding:.6em .9em;font-size:.9rem;margin:.4em 0 1em;}
.d-leseprobe{margin-top:.7em;}
.d-contact{margin-top:1.1em;font-size:.9rem;color:var(--fg-muted);}
.d-contact a{color:var(--blue-500);text-decoration:underline;}

/* Leseprobe (inline, selbst-gehostet) — erste Seiten frei, Rest geblurrt */
.leseprobe{margin-top:2.4em;border-top:1px solid var(--line);padding-top:1.6em;}
.lp-h{font-size:1.4rem;margin-bottom:.4em;}
.lp-intro{font-size:.9rem;color:var(--fg-muted);margin-bottom:1.2em;max-width:46em;}
.lp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1em;}
.lp-cell{position:relative;border-radius:var(--radius-sm);overflow:hidden;}
.lp-page{width:100%;display:block;border-radius:var(--radius-sm);box-shadow:var(--shadow);background:var(--sand-100);}
/* Gesperrte Seiten zeigen wieder ein Bild — aber eine eigene Teaser-Datei mit
   nur 40 Pixel echter Bildinformation (siehe shop.js und products.js). Kein
   CSS-blur auf der Originaldatei: der laesst sich in den Entwicklertools
   abschalten, die Datei liegt trotzdem im Cache. */
.lp-cell.lp-locked{background:var(--sand-100);border:1px dashed var(--line);
  display:flex;align-items:center;justify-content:center;}
.lp-teaser{pointer-events:none;user-select:none;opacity:.75;}
.lp-lock{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-size:1.5rem;opacity:.9;filter:drop-shadow(0 1px 3px rgba(0,0,0,.35));}
.lp-pg{position:absolute;bottom:.4em;left:0;right:0;text-align:center;
  font-size:.75rem;color:var(--gray-600);opacity:.9;}

/* Offene Seiten sind anklickbar und zeigen das beim Darueberfahren. */
.lp-cell.lp-open{cursor:zoom-in;}
.lp-cell.lp-open .lp-page{transition:transform .18s ease;}
.lp-cell.lp-open:hover .lp-page,.lp-cell.lp-open:focus-visible .lp-page{transform:scale(1.03);}
.lp-zoom{position:absolute;right:.4em;bottom:.4em;width:1.7em;height:1.7em;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:rgba(0,0,0,.55);color:#fff;font-size:.85rem;opacity:0;transition:opacity .18s ease;}
.lp-cell.lp-open:hover .lp-zoom,.lp-cell.lp-open:focus-visible .lp-zoom{opacity:1;}
@media (hover:none){.lp-zoom{opacity:.85;}}

/* Vollbild-Ansicht der Leseprobe */
.lpbox{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;
  gap:.5em;padding:1em;background:rgba(15,20,25,.92);}
.lpbox.is-open{display:flex;}
.lpbox-fig{margin:0;max-width:min(1100px,92vw);max-height:88vh;display:flex;
  flex-direction:column;align-items:center;gap:.6em;}
.lpbox-img{max-width:100%;max-height:80vh;border-radius:var(--radius-sm);
  box-shadow:0 8px 40px rgba(0,0,0,.5);background:#fff;}
.lpbox-cap{color:rgba(255,255,255,.8);font-size:.85rem;}
.lpbox-nav,.lpbox-close{background:rgba(255,255,255,.12);color:#fff;border:0;cursor:pointer;
  border-radius:50%;line-height:1;transition:background .15s ease;}
.lpbox-nav{width:2.4em;height:2.4em;font-size:1.6rem;flex:0 0 auto;}
.lpbox-close{position:absolute;top:1em;right:1em;width:2.2em;height:2.2em;font-size:1.5rem;}
.lpbox-nav:hover,.lpbox-close:hover{background:rgba(255,255,255,.25);}
@media (max-width:640px){
  .lpbox-nav{position:absolute;bottom:1.2em;}
  .lpbox-prev{left:1.2em;} .lpbox-next{right:1.2em;}
  .lpbox-img{max-height:72vh;}
}
.lp-cta{text-align:center;margin-top:1.6em;}

/* Bewertungen (Fische statt Sterne) */
.reviews{margin-top:2.4em;border-top:1px solid var(--line);padding-top:1.6em;}
.rv-h{font-size:1.4rem;margin-bottom:.6em;}
.fish-row{display:inline-flex;gap:1px;}
.fish-row .fish{filter:grayscale(1);opacity:.3;font-size:1.1rem;}
.fish-row .fish.on{filter:none;opacity:1;}
.rv-summary{display:flex;align-items:center;gap:.6em;margin-bottom:.6em;}
.rv-avg{font-family:var(--font-display);font-weight:600;color:var(--navy-800);}
.rv-count{color:var(--fg-muted);font-size:.9rem;}
.rv-empty{color:var(--fg-muted);margin-bottom:.6em;}
.rv-disclosure{font-size:.82rem;color:var(--fg-muted);margin-bottom:1.2em;}
.rv-list{display:flex;flex-direction:column;gap:.8em;margin-bottom:1.6em;}
.rv-card{background:var(--white);border-radius:var(--radius-sm);box-shadow:var(--shadow);padding:.9em 1.1em;}
.rv-cardtop{display:flex;align-items:center;gap:.7em;margin-bottom:.4em;flex-wrap:wrap;}
.rv-name{font-family:var(--font-display);font-weight:500;}
.rv-verified{font-size:.74rem;color:var(--green-700);background:var(--green-100);padding:.15em .5em;border-radius:999px;}
.rv-text{color:var(--fg);}
.rv-date{font-size:.78rem;color:var(--fg-muted);margin-top:.3em;}
.rv-form{padding:1.3em 1.4em;max-width:560px;}
.rv-fh{font-size:1.1rem;margin-bottom:.8em;}
.rv-l{display:block;font-family:var(--font-display);font-weight:500;font-size:.9rem;margin-bottom:.9em;color:var(--navy-800);}
.rv-l input,.rv-l textarea{display:block;width:100%;margin-top:.35em;padding:.6em;border:2px solid var(--line);border-radius:var(--radius-sm);font-family:var(--font-body);font-size:1rem;color:var(--fg);}
.rv-l input:focus,.rv-l textarea:focus{outline:none;border-color:var(--blue-500);}
.rv-pick{display:flex;gap:.2em;margin-top:.4em;}
.rv-pf{background:none;border:none;cursor:pointer;font-size:1.7rem;line-height:1;filter:grayscale(1);opacity:.3;transition:.12s;padding:.1em;}
.rv-pf.on{filter:none;opacity:1;transform:scale(1.05);}
.rv-check{display:flex;gap:.55em;align-items:flex-start;font-size:.85rem;margin-bottom:.7em;color:var(--fg);font-family:var(--font-body);font-weight:400;}
.rv-check a{color:var(--blue-500);text-decoration:underline;}
.rv-note{font-size:.78rem;color:var(--fg-muted);margin:.3em 0 1em;}
.rv-thanks{color:var(--green-700);font-family:var(--font-display);font-weight:500;}

/* Größentabelle / Maß-Guide (aufklappbar) */
.sizeguide{margin-top:1.4em;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);overflow:hidden;}
.sg-sum{cursor:pointer;list-style:none;padding:.9em 1.1em;font-family:var(--font-display);font-weight:500;color:var(--navy-800);display:flex;align-items:center;gap:.5em;}
.sg-sum::-webkit-details-marker{display:none;}
.sg-sum::after{content:'▾';margin-left:auto;color:var(--gray-500);transition:transform .2s;}
.sizeguide[open] .sg-sum::after{transform:rotate(180deg);}
.sg-body{padding:0 1.1em 1.2em;}
.sg-h{font-size:1rem;margin:.4em 0 .5em;color:var(--navy-800);}
.sg-how{list-style:none;padding:0;margin-bottom:1em;}
.sg-how li{position:relative;padding-left:1.4em;margin-bottom:.4em;color:var(--fg);font-size:.95rem;}
.sg-how li::before{content:'📐';position:absolute;left:0;font-size:.85rem;}
.sg-imgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1em;}
.sg-img{width:100%;border-radius:var(--radius-sm);border:1px solid var(--line);background:#fff;}
.sg-fit{font-size:.92rem;color:var(--green-700);margin-bottom:.7em;}
.sg-tablewrap{margin:.4em 0 .6em;}
.sg-table{width:100%;border-collapse:collapse;font-size:.92rem;}
.sg-table th,.sg-table td{text-align:left;padding:.5em .7em;border-bottom:1px solid var(--line);}
.sg-table th{font-family:var(--font-display);font-weight:500;color:var(--navy-800);background:var(--sand-100);}
.sg-unit{font-size:.78rem;color:var(--fg-muted);margin-top:.4em;}
.sg-note{font-size:.78rem;color:var(--fg-muted);margin-top:.2em;}

/* Sichtbare Spezifikationen (Material/Farben — Textilkennzeichnung) */
.d-spec{font-size:.92rem;margin-bottom:.5em;color:var(--fg);}
.d-spec strong{color:var(--navy-800);}

/* Info-Aufklapper (Herkunft/Rückverfolgbarkeit usw.) */
.infosec{margin-top:.8em;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;}
.is-sum{cursor:pointer;list-style:none;padding:.8em 1.1em;font-family:var(--font-display);font-weight:500;color:var(--navy-800);display:flex;align-items:center;}
.is-sum::-webkit-details-marker{display:none;}
.is-sum::after{content:'▾';margin-left:auto;color:var(--gray-500);transition:transform .2s;}
.infosec[open] .is-sum::after{transform:rotate(180deg);}
.is-body{padding:0 1.1em 1em;}
.is-body ul{list-style:none;padding:0;}
.is-body li{padding:.25em 0;border-bottom:1px solid var(--line);color:var(--fg);font-size:.92rem;}
.is-body li:last-child{border-bottom:none;}

/* Shop-Suche
   Nur für Screenreader sichtbar — das Label gehört ans Feld, soll aber
   optisch nicht doppelt zum Placeholder stehen. */
.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;}
.shop-search{position:relative;max-width:460px;margin:1.8em auto .4em;}
.shop-search-icon{position:absolute;left:.95em;top:50%;transform:translateY(-50%);
  font-size:1rem;pointer-events:none;opacity:.6;}
.shop-search-input{width:100%;font-family:var(--font-body);font-size:1rem;color:var(--fg);
  padding:.75em 2.6em .75em 2.7em;border:2px solid var(--line);border-radius:999px;
  background:#fff;transition:border-color .15s,box-shadow .15s;}
.shop-search-input::placeholder{color:var(--fg-muted);}
.shop-search-input:focus{outline:none;border-color:var(--blue-500);
  box-shadow:0 0 0 4px var(--blue-50);}
/* Das native X von type="search" ausblenden, wir haben einen eigenen Button. */
.shop-search-input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;}
.shop-search-clear{position:absolute;right:.5em;top:50%;transform:translateY(-50%);
  width:2em;height:2em;border:none;border-radius:50%;background:var(--sand-100);
  color:var(--navy-800);font-size:1.1rem;line-height:1;cursor:pointer;}
.shop-search-clear:hover{background:var(--line);}
.shop-noresult{text-align:center;color:var(--fg-muted);line-height:1.7;padding:2.5em 1em;}
.shop-noresult a{color:var(--blue-500);}

/* Kategorie-Filter */
.cat-filter{display:flex;gap:.6em;flex-wrap:wrap;justify-content:center;margin:1.8em 0 1.6em;}
.chip{font-family:var(--font-display);font-weight:500;font-size:.95rem;padding:.5em 1.1em;border-radius:999px;
  border:2px solid var(--line);background:#fff;color:var(--navy-800);cursor:pointer;transition:.15s;}
.chip:hover{border-color:var(--blue-500);}
.chip.is-active{background:var(--navy-800);color:#fff;border-color:var(--navy-800);}

/* Produkt-Grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.4em;}
.prod{display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s;}
.prod:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);}
.prod-img{position:relative;aspect-ratio:1/1;background:var(--sand-100);display:flex;align-items:center;justify-content:center;}
.prod-img img{width:100%;height:100%;object-fit:contain;padding:.6em;}
.prod-img.is-empty::after,.d-main.is-empty::after{content:attr(data-empty);font-family:var(--font-display);font-weight:500;color:var(--gray-500);font-size:.95rem;}
.d-main.is-empty{min-height:280px;}
.ribbon{position:absolute;top:10px;left:10px;background:var(--orange-500);color:#fff;font-family:var(--font-display);
  font-weight:600;font-size:.74rem;padding:.3em .7em;border-radius:999px;}
.ribbon-soon{background:var(--gray-500);left:auto;right:10px;}
/* Personalisierbare Produkte hervorheben */
.ribbon-perso{background:linear-gradient(115deg,var(--orange-500),#e8a020);box-shadow:0 2px 10px rgba(232,120,30,.45);
  animation:perso-pulse 2.4s ease-in-out infinite;}
@keyframes perso-pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.07);}}
.prod-perso{box-shadow:0 0 0 2px var(--orange-500), var(--shadow);}
.prod-perso:hover{transform:translateY(-4px);box-shadow:0 0 0 2px var(--orange-500), var(--shadow-lg);}
@media (prefers-reduced-motion: reduce){.ribbon-perso{animation:none;}}

/* Partner-Artikel (Affiliate) — müssen sich klar von eigener Ware unterscheiden,
   sonst denkt der Kunde, er kauft bei Fisharoo (§ 5a Abs. 4 UWG). Deshalb:
   graues Band statt Fisharoo-Orange, gestrichelter Rahmen, Klartext-Zeile. */
.ribbon-partner{background:var(--navy-700);letter-spacing:.02em;}
.prod-ext{border:2px dashed var(--line);box-shadow:none;}
.prod-ext:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--navy-700);}
.prod-partner{font-size:.76rem;color:var(--fg-muted);margin:-.3em 0 .6em;line-height:1.45;}

/* Hinweisseite für Partner-Artikel (produkt.html?id=ext-…) */
.ext-page{max-width:640px;margin:0 auto;padding:2em 0 3em;}
.ext-crumb{margin-bottom:1.4em;}
.ext-crumb a{color:var(--blue-500);text-decoration:none;}
.ext-flag{position:static;display:inline-block;margin-bottom:.8em;}
.ext-h{font-family:var(--font-display);font-size:1.6rem;color:var(--navy-800);margin:0 0 .2em;}
.ext-age{color:var(--fg-muted);font-size:.9rem;margin-bottom:1em;}
.ext-short{line-height:1.7;color:var(--fg);margin-bottom:1em;}
.ext-price{font-family:var(--font-display);font-size:1.2rem;color:var(--navy-800);margin-bottom:1.2em;}
.ext-disclosure{background:var(--sun-300);border-left:5px solid var(--orange-500);
  border-radius:var(--radius-sm);padding:1em 1.2em;font-size:.93rem;line-height:1.65;
  color:var(--navy-800);margin-bottom:1.4em;}
.ext-soon{color:var(--fg-muted);font-style:italic;}

.prod-body{padding:.9em 1em 1.1em;display:flex;flex-direction:column;flex:1;}
.prod-badges{display:flex;gap:.4em;flex-wrap:wrap;margin-bottom:.5em;}
.badge{font-family:var(--font-display);font-weight:500;font-size:.72rem;padding:.25em .6em;border-radius:999px;}
.badge-age{background:var(--sun-300);color:var(--navy-800);}
.badge-ai{background:var(--blue-100);color:var(--blue-700);}
.badge-hot{background:var(--orange-100);color:var(--orange-700);}
.prod-name{font-size:1.05rem;margin-bottom:.25em;}
.prod-short{font-size:.88rem;color:var(--fg-muted);flex:1;margin-bottom:.7em;}
.prod-foot{display:flex;align-items:center;justify-content:space-between;}
.price{font-family:var(--font-display);font-weight:600;font-size:1.15rem;color:var(--navy-800);}
.price-old{color:var(--fg-muted);font-weight:500;opacity:.8;margin-right:.4em;font-size:.85em;}
.price-now{color:var(--orange-600);}
.prod-cta{font-family:var(--font-display);font-weight:500;color:var(--blue-500);font-size:.9rem;}

/* Detail */
.back-link{display:inline-block;margin:1.4em 0 .6em;color:var(--blue-500);font-family:var(--font-display);font-weight:500;}
.detail{display:grid;grid-template-columns:1fr 1fr;gap:2em;align-items:start;}
.d-main{position:relative;background:var(--sand-100);border-radius:var(--radius);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);}
.d-nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,255,255,.9);color:var(--navy-800);font-size:1.6rem;line-height:1;cursor:pointer;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;transition:.12s;}
.d-nav:hover{background:#fff;transform:translateY(-50%) scale(1.08);}
.d-prev{left:10px;}.d-next{right:10px;}
.d-dots{display:flex;gap:7px;justify-content:center;margin-top:.8em;flex-wrap:wrap;}
.d-dot{width:9px;height:9px;border-radius:50%;border:none;background:var(--line);cursor:pointer;padding:0;transition:.12s;}
.d-dot.is-active{background:var(--orange-500);transform:scale(1.2);}
.d-main img{width:100%;height:100%;object-fit:contain;padding:1em;}
.d-zoom-lens{position:absolute;display:none;width:190px;height:190px;border-radius:50%;border:3px solid rgba(255,255,255,.95);
  box-shadow:0 4px 18px rgba(0,0,0,.28), inset 0 0 0 1px rgba(0,0,0,.08);background-repeat:no-repeat;background-color:var(--sand-100);
  pointer-events:none;z-index:6;}
.d-main:hover{cursor:zoom-in;}
.d-thumbs{display:flex;gap:.6em;margin-top:.8em;}
.d-thumb{width:64px;height:64px;object-fit:contain;background:var(--sand-100);border-radius:8px;border:2px solid transparent;cursor:pointer;padding:.2em;}
.d-thumb.is-active{border-color:var(--blue-500);}
.d-name{font-size:1.8rem;margin:.2em 0 .3em;}
.d-price{font-family:var(--font-display);font-weight:600;font-size:1.6rem;color:var(--orange-600);}
.d-pangv{font-size:.82rem;color:var(--fg-muted);margin-bottom:1.1em;}
.d-desc{margin-bottom:.7em;color:var(--fg);}
.d-opt{margin:1.2em 0;}
.d-opt-label{display:block;font-family:var(--font-display);font-weight:500;margin-bottom:.4em;}
.d-opt select{width:100%;padding:.7em;border:2px solid var(--line);border-radius:var(--radius-sm);font-family:var(--font-body);font-size:1rem;background:#fff;}
/* Motiv-/Farbpunkte auf der Übersichtskachel — zeigen ohne Klick, dass es
   von diesem Artikel mehrere Varianten gibt. */
.prod-variants{display:flex;align-items:center;gap:.35em;margin:.5em 0 .2em;}
.prod-dot{width:15px;height:15px;border-radius:50%;border:1.5px solid rgba(22,38,63,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);flex:0 0 auto;}
.prod-dot-more{font-size:.72rem;color:var(--fg-muted);font-weight:500;}
.prod-variants-label{font-size:.78rem;color:var(--fg-muted);margin-left:.25em;}
.d-opt-count{font-weight:400;font-size:.85rem;color:var(--fg-muted);}

.d-swatches{display:flex;gap:.5em;margin-top:.45em;flex-wrap:wrap;}
.d-swatch{width:30px;height:30px;border-radius:50%;border:2px solid var(--line);cursor:pointer;padding:0;transition:.12s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);}
.d-swatch:hover{transform:scale(1.08);}
.d-swatch.is-active{border-color:var(--navy-800);box-shadow:0 0 0 2px var(--blue-100),inset 0 0 0 1px rgba(0,0,0,.08);}
.d-swatch.is-unavailable{opacity:.3;cursor:not-allowed;position:relative;}
.d-swatch.is-unavailable::after{content:'';position:absolute;left:-1px;right:-1px;top:50%;height:2px;background:var(--gray-600);transform:rotate(-45deg);}
.d-color-hint{display:block;font-size:.78rem;color:var(--fg-muted);margin-top:.4em;}
.d-sizes{display:flex;gap:.5em;flex-wrap:wrap;margin-top:.45em;}
.d-size{font-family:var(--font-display);font-weight:500;font-size:.95rem;min-width:48px;padding:.5em .9em;border:2px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--navy-800);cursor:pointer;transition:.12s;}
.d-size:hover{border-color:var(--blue-500);}
.d-size.is-active{background:var(--navy-800);color:#fff;border-color:var(--navy-800);}
.d-size-group{font-family:var(--font-display);font-weight:500;font-size:.82rem;color:var(--fg-muted);margin:.7em 0 .1em;}
.d-size-note{font-size:.78rem;color:var(--fg-muted);margin-top:.5em;}
.d-buy{display:flex;gap:.8em;align-items:center;margin-top:1em;}
.d-wait{display:inline-block;margin-top:.7em;color:var(--blue-500);font-family:var(--font-display);font-weight:500;}
.qty{display:inline-flex;align-items:center;border:2px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;}
.qty button{width:38px;height:42px;border:none;background:#fff;font-size:1.2rem;cursor:pointer;color:var(--navy-800);}
.qty button:hover{background:var(--sand-100);}
.qty span{min-width:34px;text-align:center;font-family:var(--font-display);font-weight:600;}
.btn.added{background:var(--green-500);}

/* Warenkorb */
.cart-list{display:flex;flex-direction:column;gap:.9em;margin-bottom:1.6em;}
.cart-row{display:grid;grid-template-columns:72px 1fr auto auto;gap:1em;align-items:center;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:.8em 1em;}
.cart-img{width:72px;height:72px;object-fit:contain;background:var(--sand-100);border-radius:8px;padding:.2em;}
.cart-name{font-family:var(--font-display);font-weight:600;}
.cart-var{font-size:.85rem;color:var(--fg-muted);}
.cart-del{background:none;border:none;color:var(--orange-600);font-size:.82rem;cursor:pointer;padding:0;margin-top:.3em;font-family:var(--font-body);}
.cart-line{font-family:var(--font-display);font-weight:600;min-width:80px;text-align:right;}
.cart-sum{max-width:380px;margin-left:auto;padding:1.3em 1.4em;}
.sum-row{display:flex;justify-content:space-between;margin-bottom:.5em;color:var(--fg);}
.sum-total{font-family:var(--font-display);font-weight:600;font-size:1.2rem;border-top:1px solid var(--line);padding-top:.6em;margin-top:.3em;}
.sum-note{font-size:.78rem;color:var(--fg-muted);margin:.5em 0 1em;}
.cart-continue{display:block;text-align:center;margin-top:.8em;color:var(--blue-500);font-family:var(--font-display);font-weight:500;}
.btn-block{width:100%;justify-content:center;}

/* Kasse */
.checkout{display:grid;grid-template-columns:1.4fr 1fr;gap:1.6em;align-items:start;}
.co-form,.co-sum{padding:1.4em 1.5em;}
.co-pflicht{margin:.9em 0;padding:.7em .9em;border-left:3px solid var(--blue-500);background:var(--paper-2,#f5f7fa);border-radius:var(--radius-sm);font-size:.88rem;line-height:1.5;}
.co-h{font-size:1.2rem;margin-bottom:.9em;}
.co-grid{display:grid;grid-template-columns:1fr 1fr;gap:.9em;}
@media(max-width:480px){.co-grid{grid-template-columns:1fr;}}
.co-grid label{display:flex;flex-direction:column;font-size:.85rem;color:var(--fg-muted);gap:.3em;font-family:var(--font-display);font-weight:500;}
.co-grid .co-wide{grid-column:1/-1;}
.co-grid input{padding:.65em;border:2px solid var(--line);border-radius:var(--radius-sm);font-family:var(--font-body);font-size:1rem;color:var(--fg);}
.co-grid input:focus{outline:none;border-color:var(--blue-500);}
.co-check{display:flex;gap:.6em;align-items:flex-start;font-size:.86rem;margin-top:1em;color:var(--fg);}
.co-check a{color:var(--blue-500);text-decoration:underline;}
.co-stripe-note{background:var(--blue-50);border-radius:var(--radius-sm);padding:.8em 1em;font-size:.85rem;color:var(--navy-700);margin:1.2em 0;}
.co-fine{font-size:.78rem;color:var(--fg-muted);margin-top:.7em;text-align:center;}
.co-item{display:flex;justify-content:space-between;font-size:.9rem;margin-bottom:.5em;gap:1em;}
.co-item em{color:var(--fg-muted);font-style:normal;}

/* Bestätigung */
.confirm{max-width:520px;margin:2.5em auto;text-align:center;padding:2.2em 1.6em;}
.confirm-ico{width:64px;height:64px;border-radius:50%;background:var(--green-500);color:#fff;font-size:2rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1em;}
.confirm h1{margin-bottom:.5em;}
.confirm p{color:var(--fg-muted);margin-bottom:1.2em;}
.confirm-demo{background:var(--sun-300);color:var(--navy-800);border-radius:var(--radius-sm);padding:.6em 1em;font-size:.88rem;}

/* Leerzustände */
.empty{text-align:center;padding:3em 1em;color:var(--fg-muted);}
.empty .btn{margin-top:1em;}

/* Responsive */
@media(max-width:760px){
  .detail{grid-template-columns:1fr;}
  .checkout{grid-template-columns:1fr;}
  /* Bestellübersicht MUSS über den Bestellbutton — 13.08.2026.
     Einspaltig rutschte die Zusammenfassung (Artikel, Größe, Wunschname,
     Zwischensumme, Versand) unter das Formular und damit unter den Button.
     § 312j Abs. 2 BGB verlangt diese Angaben "unmittelbar vor" der
     Bestellung; die Rechtsprechung liest das räumlich als oberhalb.
     Da die meisten Besucher mobil kommen, war das der Regelfall,
     nicht der Sonderfall. */
  .co-sum{order:-1;}
  .cart-row{grid-template-columns:60px 1fr auto;grid-template-areas:'img meta line' 'img qty line';row-gap:.5em;}
  .cart-img{grid-area:img;}.cart-meta{grid-area:meta;}.cart-row .qty{grid-area:qty;}.cart-line{grid-area:line;}
}

/* ============ Conversion-Bausteine ============ */
/* Gratisversand-Fortschritt */
.ship-bar{background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);padding:.7em .9em;margin-bottom:1em;}
.ship-bar.is-free{background:var(--green-100);border-color:var(--green-100);}
.ship-msg{font-size:.9rem;color:var(--navy-800);margin-bottom:.5em;}
.ship-track{height:8px;background:#fff;border-radius:999px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line);}
.ship-track span{display:block;height:100%;background:linear-gradient(90deg,var(--blue-500),var(--green-500));border-radius:999px;transition:width .4s ease;}
.ship-bar.is-free .ship-track span{background:var(--green-500);}

/* Trust-/Vorteils-Leiste */
.trust-bar{display:flex;flex-wrap:wrap;gap:.6em 1.2em;justify-content:center;background:var(--sand-100);border-radius:var(--radius);padding:.9em 1.1em;margin:1.4em 0;}
.trust-it{display:flex;align-items:center;gap:.45em;font-size:.86rem;color:var(--navy-700);font-weight:500;}
.trust-ic{font-size:1.1rem;}
.trust-ic-img{display:inline-block;vertical-align:-.15em;}
/* Im Ribbon (Produktkarte) sitzt das Icon inline neben dem Text, nicht wie
   in der Trust-Leiste als eigener Flex-Block -- sonst faellt es auf eine
   eigene Zeile und sprengt die kleine Pille (08.09.2026). */
.ribbon-perso .trust-ic-img{display:inline-block;width:13px;height:13px;object-fit:contain;padding:0;vertical-align:-2px;margin-right:.3em;}

/* Cross-Selling */
.xsell{margin-top:2.4em;}
.xsell-h{font-size:1.25rem;margin-bottom:.8em;}
.xsell-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1em;}
.xsell-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.15s;}
.xsell-card:hover{box-shadow:var(--shadow);transform:translateY(-2px);}
.xsell-img{aspect-ratio:1/1;background:var(--sand-100);display:flex;align-items:center;justify-content:center;}
.xsell-img img{width:100%;height:100%;object-fit:cover;}
.xsell-img.is-empty::after{content:attr(data-empty);color:var(--fg-muted);font-size:.8rem;}
.xsell-name{font-family:var(--font-display);font-weight:500;font-size:.92rem;padding:.6em .7em .1em;color:var(--navy-800);}
.xsell-price{padding:0 .7em .7em;font-size:1rem;}

/* Mini-Warenkorb (Slide-in) */
.mini-cart{position:fixed;right:16px;bottom:16px;z-index:120;max-width:330px;width:calc(100% - 32px);transform:translateY(140%);opacity:0;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s;pointer-events:none;}
.mini-cart.show{transform:translateY(0);opacity:1;pointer-events:auto;}
.mc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:1em;}
.mc-top{font-family:var(--font-display);font-weight:600;color:var(--green-600);margin-bottom:.6em;display:flex;align-items:center;gap:.4em;}
.mc-check{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:999px;background:var(--green-500);color:#fff;font-size:.8rem;}
.mc-item{display:flex;gap:.7em;align-items:center;margin-bottom:.8em;}
.mc-item img{width:52px;height:52px;object-fit:cover;border-radius:8px;background:var(--sand-100);}
.mc-name{font-weight:500;font-size:.9rem;color:var(--navy-800);}
.mc-var{font-size:.8rem;color:var(--fg-muted);}
.mc-actions{display:flex;gap:.5em;}
.mc-actions .btn{flex:1;justify-content:center;}
.mc-count{margin-top:.7em;font-size:.8rem;color:var(--fg-muted);text-align:center;}

/* Preis-Hinweis (Einführungspreis) + Geschenk */
.d-price-wrap{display:flex;align-items:baseline;gap:.5em;flex-wrap:wrap;margin:.2em 0;}
.price-note{font-family:var(--font-display);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--orange-700);background:var(--orange-100);padding:.2em .6em;border-radius:999px;}
.d-gift{font-size:.88rem;color:var(--green-600);margin:.3em 0;}
.co-gift textarea{width:100%;font-family:inherit;}

/* Sticky-Kaufleiste (nur Mobil) */
.sticky-buy{display:none;}
@media(max-width:760px){
  .sticky-buy{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;align-items:center;gap:.8em;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(27,42,74,.12);padding:.7em 1em;}
  .sb-info{display:flex;flex-direction:column;flex:1;min-width:0;}
  .sb-name{font-size:.78rem;color:var(--fg-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .sb-price{font-size:1.1rem;}
  .sticky-buy .btn{white-space:nowrap;}
  body:has(.sticky-buy){padding-bottom:74px;}
  .xsell-row{grid-template-columns:1fr 1fr;}
  .trust-bar{gap:.5em .9em;}
  .mini-cart{bottom:84px;}
}

/* Personalisierung (Namensfeld) */
.d-perso{margin:.2em 0;}
.d-perso-input{width:100%;max-width:320px;font-family:inherit;font-size:1rem;padding:.6em .8em;border:2px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--navy-800);}
.d-perso-input:focus{outline:none;border-color:var(--blue-500);}
.d-perso-prev{display:block;margin-top:.4em;font-family:var(--font-display);font-weight:500;color:var(--orange-600);min-height:1.2em;}
.d-perso-note{display:block;margin-top:.3em;font-size:.8rem;color:var(--fg-muted);}
.d-perso-legal{background:var(--sun-300);color:var(--navy-800);border-radius:var(--radius-sm);padding:.6em .9em;font-size:.86rem;margin:.6em 0;}
.co-perso-ack{background:var(--sand-100);border-radius:var(--radius-sm);padding:.6em .8em;}
.d-perso-long{font-size:.82rem;color:var(--navy-800);background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);padding:.6em .8em;margin-top:.5em;line-height:1.5;}
.d-perso-long a{color:var(--blue-600);text-decoration:underline;}

/* Live-Namens-Overlay auf dem Produktbild */
.d-main{container-type:inline-size;}
.name-overlay{position:absolute;display:none;pointer-events:none;line-height:1.05;white-space:nowrap;letter-spacing:.01em;}
.name-overlay.show{display:block;}

/* ============================================================
   GESCHENKGUTSCHEIN — Homepage-Banner, Betragswahl & Geschenkfelder
   ============================================================ */
.gc-banner{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);gap:clamp(1rem,3vw,2.4rem);
  align-items:center;background:linear-gradient(135deg,var(--navy-800),var(--navy-900));
  border-radius:var(--radius,18px);padding:clamp(1.1rem,2.6vw,2rem);color:#fff;overflow:hidden;box-shadow:0 10px 30px rgba(14,26,46,.18);}
.gc-banner-img{display:block;border-radius:14px;overflow:hidden;line-height:0;background:var(--paper);}
.gc-banner-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.gc-banner-img:hover img{transform:scale(1.03);}
.gc-banner-body{display:flex;flex-direction:column;align-items:flex-start;gap:.6em;}
.gc-banner-h{color:#fff;font-size:clamp(1.4rem,3vw,2rem);margin:.1em 0 0;}
.gc-banner-p{color:var(--blue-100,#DBEEFB);margin:0;font-size:1.02rem;}
.gc-amts{display:flex;flex-wrap:wrap;gap:.5em;margin:.2em 0 .4em;}
.gc-amt{font-family:var(--font-display);font-weight:600;font-size:.95rem;color:var(--navy-800);
  background:var(--sand-100);border-radius:999px;padding:.32em .9em;}
.gc-amt-more{background:var(--sun-500);color:var(--navy-900);}
@media(max-width:640px){.gc-banner{grid-template-columns:1fr;text-align:center;}
  .gc-banner-body{align-items:center;}.gc-amts{justify-content:center;}}

/* Betragswahl (Gutschein-Detailseite) */
.d-gift-amount{margin-top:.4em;}
.d-amounts{display:flex;flex-wrap:wrap;gap:.5em;}
.d-amount{font-family:var(--font-display);font-weight:600;font-size:1.05rem;min-width:74px;padding:.6em 1em;
  border:2px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--navy-800);cursor:pointer;transition:.12s;}
.d-amount:hover{border-color:var(--sun-500);}
.d-amount.is-active{background:var(--navy-800);color:#fff;border-color:var(--navy-800);}
.d-amount-custom-btn{font-size:.95rem;font-weight:500;}
.d-amount-custom-wrap{margin-top:.7em;}
.d-amount-field{display:inline-flex;align-items:center;gap:.4em;border:2px solid var(--line);
  border-radius:var(--radius-sm);padding:.15em .7em;background:#fff;max-width:220px;}
.d-amount-field:focus-within{border-color:var(--sun-500);}
.d-amount-input{border:none;outline:none;font-family:var(--font-display);font-weight:600;font-size:1.15rem;
  width:110px;padding:.45em 0;color:var(--navy-800);background:transparent;}
.d-amount-eur{font-family:var(--font-display);font-weight:600;font-size:1.15rem;color:var(--gray-500);}
.d-amount-hint{font-size:.85rem;color:var(--fg-muted,#5A6A7E);margin:.4em 0 0;}

/* Geschenk-Felder (Empfänger/Absender/Gruß) */
.d-gift-fields{display:flex;flex-direction:column;gap:.7em;margin-top:1em;padding-top:1em;border-top:1px solid var(--line);}
.d-gift-label{display:block;font-family:var(--font-display);font-weight:500;font-size:.95rem;color:var(--navy-800);}
.d-gift-label input,.d-gift-label textarea{display:block;width:100%;margin-top:.35em;padding:.6em;
  border:2px solid var(--line);border-radius:var(--radius-sm);font-family:var(--font-body);font-size:1rem;color:var(--fg);background:#fff;}
.d-gift-label input:focus,.d-gift-label textarea:focus{outline:none;border-color:var(--sun-500);}
.d-opt-opt{font-weight:400;color:var(--gray-500);font-size:.85em;}

/* Checkout-Hinweis bei rein digitaler Bestellung */
.co-digital-note{background:var(--blue-50,#EFF7FE);border:1px solid var(--blue-100,#DBEEFB);
  border-radius:var(--radius-sm);padding:.7em .9em;font-size:.92rem;color:var(--navy-800);margin:0 0 1em;}

/* Grußkarten-Vorschau auf der Gutschein-Detailseite */
.gift-note-prev{margin-top:1em;background:var(--sand-100);border:1px dashed var(--sun-500);border-radius:var(--radius-sm);padding:.9em 1.1em;}
.gnp-title{font-family:var(--font-display);font-weight:600;font-size:.9rem;color:var(--navy-800);margin:0 0 .5em;}
.gnp-to{font-family:var(--font-display);font-weight:600;color:var(--navy-800);margin:0 0 .3em;}
.gnp-msg{font-style:italic;color:var(--fg);margin:0 0 .4em;white-space:pre-wrap;}
.gnp-sign{font-family:var(--font-display);color:var(--gray-600);margin:0;text-align:right;}
.gnp-to:empty,.gnp-msg:empty,.gnp-sign:empty{display:none;}

/* Zeichenzähler unterm Grußtext-Feld (Gutschein) */
.d-msg-count{display:block;text-align:right;font-size:.78rem;color:var(--gray-500);margin-top:.25em;}

/* ── Barrierefreiheit: Skip-Link (per shop.js in den Header injiziert) ── */
.skip-link{
  position:absolute; left:8px; top:-48px; z-index:9999;
  background:var(--navy-800,#16263F); color:#fff;
  padding:.6em 1em; border-radius:8px; font-weight:700; text-decoration:none;
  transition:top .15s;
}
.skip-link:focus{ top:8px; outline:3px solid var(--sun-500,#F4B740); outline-offset:2px; }

/* ============================================================
   A11y-Kontrast: Akzentfarben im KLEIN-/Fließtext auf dunklere
   Tokens ziehen (Ziel >=4.5:1 auf Weiß/Paper). Großtext (Preise
   >=24px) und Deko/Rahmen bleiben unverändert. Additiv – zum
   Zurückrollen einfach diesen Block entfernen.
   ============================================================ */
:root{ --green-700:#1B6F49; } /* war referenziert, aber nicht definiert */
.feat-note{color:var(--green-700);}
.d-subtitle{color:var(--orange-700);}
.d-features li::before{color:var(--green-700);}
.d-contact a{color:var(--blue-600);}
.rv-check a{color:var(--blue-600);}
.price-now{color:var(--orange-700);}
.prod-cta{color:var(--blue-600);}
.back-link{color:var(--blue-600);}
.d-wait{color:var(--blue-600);}
.cart-del{color:var(--orange-700);}
.cart-continue{color:var(--blue-600);}
.co-check a{color:var(--blue-600);}
.mc-top{color:var(--green-700);}
.d-gift{color:var(--green-700);}
.d-perso-prev{color:var(--orange-700);}

/* ============================================================
   Warenkorb: Abgleich-Meldungen und Speicher-Hinweis (08/2026)
   Meldungen entstehen, wenn beim Laden ein Artikel ausgelistet, eine
   Variante verschwunden oder ein Preis geändert wurde. Bewusst ruhig
   gehalten — das ist keine Fehlermeldung, sondern eine Information.
   ============================================================ */
.cart-notice{background:var(--orange-100);border-left:4px solid var(--accent);
  border-radius:var(--radius-sm);padding:1em 1.2em;margin-bottom:1.4em;color:var(--navy-800);}
.cart-notice-h{font-family:var(--font-display);font-weight:600;margin-bottom:.4em;}
.cart-notice ul{margin:0;padding-left:1.2em;}
.cart-notice li{margin:.25em 0;line-height:1.5;}

/* „Bleibt gespeichert" — Vertrauenszeile unter der Summe. */
.cart-persist{max-width:380px;margin:.8em 0 0 auto;text-align:right;
  font-size:.9rem;color:var(--gray-600);line-height:1.4;}
@media(max-width:720px){
  .cart-persist{max-width:none;text-align:center;margin-inline:0;}
}

/* ---- Mobile Kopfzeile + Handy-Zoom (16.10.2026) ---- */
.hdr-burger{display:none;background:none;border:0;color:#fff;font-size:1.55rem;line-height:1;padding:.15em .3em;cursor:pointer;}
.hdr-mnav{display:flex;flex-direction:column;background:var(--navy-800);border-top:1px solid rgba(255,255,255,.12);padding:.3em 1.2em .9em;}
.hdr-mnav[hidden]{display:none;}
.hdr-mnav a{color:#fff;font-family:var(--font-display);font-weight:500;font-size:1.05rem;padding:.75em 0;border-bottom:1px solid rgba(255,255,255,.08);}
.hdr-mnav a:last-child{border-bottom:0;}
@media (max-width:640px){
  .hdr-nav .hdr-link{display:none;}
  .hdr-burger{display:inline-block;}
  .hdr-nav{gap:.9em;}
  .hdr-logo{font-size:1.15rem;white-space:nowrap;}
}
@media (min-width:641px){.hdr-mnav{display:none!important;}}
.d-zoom-tip{position:absolute;left:50%;bottom:.7em;transform:translateX(-50%);background:rgba(26,39,68,.78);color:#fff;font-size:.8rem;padding:.35em .8em;border-radius:999px;pointer-events:none;white-space:nowrap;}
.d-zoom-full{position:fixed;inset:0;z-index:1000;background:rgba(10,16,30,.96);display:flex;flex-direction:column;}
.d-zoom-scroll{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;display:flex;align-items:center;justify-content:center;}
.d-zoom-scroll img{width:100%;height:auto;max-height:100%;object-fit:contain;cursor:zoom-in;}
.d-zoom-scroll img.gross{width:250%;max-width:none;max-height:none;cursor:zoom-out;}
.d-zoom-scroll:has(img.gross){display:block;}
.d-zoom-close{position:absolute;top:.6em;right:.6em;z-index:2;width:2.6em;height:2.6em;border-radius:50%;border:0;background:#fff;color:var(--navy-800);font-size:1.1rem;cursor:pointer;}
.d-zoom-hint{color:rgba(255,255,255,.75);text-align:center;font-size:.85rem;padding:.7em 1em 1.1em;}