/*
Theme Name: PZ Shop
Theme URI: https://bookgenie.de
Author: Produkt-Zentrale
Description: Schlankes, schnelles WooCommerce-Theme. Kein Baukasten, keine Fremdbibliotheken, keine Webfonts — nur das, was eine Verkaufsseite wirklich braucht. Ruhige Farbwelt (Aubergine/Kupfer) statt Rabattgeschrei.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: pz-shop
Tags: e-commerce, woocommerce, fast, accessibility-ready
*/

/* ── Grundwerte ────────────────────────────────────────────────────────────
   Alle Farben und Abstaende an EINER Stelle. Wer die Farbwelt aendern will,
   aendert nur diesen Block — nicht 200 Regeln weiter unten.                */
:root{
  --pz-tief:#2B1537;        /* Aubergine — Kopf, Fusszeile, Ueberschriften   */
  --pz-tief-hell:#3E2050;
  --pz-kupfer:#B87333;      /* Akzent — Kaufknopf, Links, Hervorhebung       */
  --pz-kupfer-dunkel:#965B27;
  --pz-papier:#FAF8F6;      /* Seitenhintergrund, warmes Off-White           */
  --pz-weiss:#FFFFFF;
  --pz-text:#1C1B1F;
  --pz-grau:#5A5560;
  --pz-linie:#E4DFE6;
  --pz-gruen:#1B7A43;       /* Verfuegbar / Erfolg                           */
  --pz-rot:#9B2226;         /* Fehler — bewusst gedeckt, kein Signalrot      */
  --pz-radius:12px;
  --pz-breite:1180px;
  --pz-lese:70ch;
  /* Systemschriften: laden in 0 ms. Ein Webfont kostet 100-300 ms und einen
     Layoutsprung — den Preis ist Typografie hier nicht wert.                */
  --pz-serif:Georgia,"Times New Roman",serif;
  --pz-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ── Zuruecksetzen (nur das Noetige) ──────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--pz-papier);color:var(--pz-text);
  font:400 17px/1.75 var(--pz-sans);overflow-wrap:break-word}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--pz-kupfer-dunkel);text-underline-offset:.18em}
a:hover{color:var(--pz-tief)}
h1,h2,h3,h4{font-family:var(--pz-serif);color:var(--pz-tief);line-height:1.22;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(28px,4.2vw,42px)}
h2{font-size:clamp(23px,3vw,30px);margin-top:1.8em}
h3{font-size:20px;margin-top:1.4em}
p,li{max-width:var(--pz-lese)}
:focus-visible{outline:3px solid var(--pz-kupfer);outline-offset:2px}

/* ── Aufbau ────────────────────────────────────────────────────────────── */
.pz-huelle{max-width:var(--pz-breite);margin:0 auto;padding:0 20px}
.pz-inhalt{padding:28px 0 60px;min-height:50vh}

/* ── Kopf ──────────────────────────────────────────────────────────────── */
.pz-kopf{background:var(--pz-tief);color:#fff}
.pz-kopf a{color:#fff;text-decoration:none}
.pz-kopf__reihe{display:flex;align-items:center;gap:20px;padding:14px 0;flex-wrap:wrap}
.pz-marke{font-family:var(--pz-serif);font-size:25px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
.pz-menue{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.pz-menue li{max-width:none}
.pz-menue a{font-size:16px;padding:6px 0;border-bottom:2px solid transparent}
.pz-menue a:hover,.pz-menue .current-menu-item>a{border-bottom-color:var(--pz-kupfer)}
.pz-kopf__rechts{margin-left:auto;display:flex;align-items:center;gap:16px}
.pz-suche{display:flex;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.12)}
.pz-suche input{border:0;background:transparent;color:#fff;padding:9px 16px;font-size:15px;width:190px}
.pz-suche input::placeholder{color:rgba(255,255,255,.65)}
.pz-suche button{border:0;background:var(--pz-kupfer);color:#fff;padding:0 16px;cursor:pointer;font-size:15px}
.pz-warenkorb{font-size:15px;white-space:nowrap}
.pz-warenkorb b{background:var(--pz-kupfer);border-radius:999px;padding:1px 8px;margin-left:6px}

/* Vertrauensband — die vier Zusagen, die in dieser Nische zaehlen */
.pz-band{background:var(--pz-tief-hell);color:rgba(255,255,255,.92);font-size:14px}
.pz-band ul{display:flex;gap:26px;list-style:none;margin:0;padding:9px 0;flex-wrap:wrap;justify-content:center}
.pz-band li{max-width:none}

/* ── Fusszeile ─────────────────────────────────────────────────────────── */
.pz-fuss{background:var(--pz-tief);color:rgba(255,255,255,.85);margin-top:60px;font-size:15px}
.pz-fuss a{color:rgba(255,255,255,.85)}
.pz-fuss a:hover{color:var(--pz-kupfer)}
.pz-fuss__reihe{display:flex;gap:40px;flex-wrap:wrap;padding:34px 0}
.pz-fuss__block{flex:1 1 220px}
.pz-fuss h4{color:#fff;font-size:16px;margin:0 0 10px}
.pz-fuss ul{list-style:none;margin:0;padding:0}
.pz-fuss li{padding:3px 0;max-width:none}
.pz-fuss__unten{border-top:1px solid rgba(255,255,255,.14);padding:14px 0;font-size:14px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ── Knoepfe ───────────────────────────────────────────────────────────── */
.pz-knopf,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce .button{
  display:inline-block;background:var(--pz-kupfer);color:#fff!important;border:0;border-radius:999px;
  padding:13px 26px;font-size:16px;font-weight:600;cursor:pointer;text-decoration:none;
  transition:background .15s ease;line-height:1.3}
.pz-knopf:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,
.woocommerce input.button:hover,.woocommerce .button:hover{background:var(--pz-kupfer-dunkel)}
/* Der eine Kaufknopf darf lauter sein als alles andere — er ist das Ziel der Seite. */
.woocommerce button.button.alt,.woocommerce .single_add_to_cart_button{
  background:var(--pz-kupfer);font-size:18px;padding:16px 34px;width:100%;max-width:420px}
.woocommerce button.button.alt:hover{background:var(--pz-kupfer-dunkel)}

/* ── WooCommerce: Produktliste ─────────────────────────────────────────── */
.woocommerce ul.products{display:grid;gap:26px;list-style:none;margin:26px 0;padding:0;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product{width:auto;margin:0;float:none;text-align:left;
  background:var(--pz-weiss);border:1px solid var(--pz-linie);border-radius:var(--pz-radius);
  padding:14px;transition:border-color .15s ease}
.woocommerce ul.products li.product:hover{border-color:var(--pz-kupfer)}
.woocommerce ul.products li.product a img{border-radius:8px;margin-bottom:12px;aspect-ratio:1/1;object-fit:contain;background:#fff}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--pz-sans);font-size:15px;line-height:1.45;color:var(--pz-text);
  padding:0;margin:0 0 8px;font-weight:600}
.woocommerce ul.products li.product .price{color:var(--pz-tief);font-size:19px;font-weight:700;display:block;margin-bottom:10px}
.woocommerce ul.products li.product .price del{color:var(--pz-grau);font-weight:400;font-size:15px}
.woocommerce ul.products li.product .price ins{text-decoration:none;color:var(--pz-kupfer-dunkel)}
.woocommerce span.onsale{background:var(--pz-tief);color:#fff;border-radius:999px;
  padding:4px 12px;font-size:13px;min-height:0;min-width:0;line-height:1.6;top:14px;left:14px;margin:0}

/* ── WooCommerce: Produktseite ─────────────────────────────────────────── */
.woocommerce div.product{display:grid;gap:38px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.woocommerce div.product .woocommerce-product-gallery{width:auto;float:none;margin:0}
.woocommerce div.product .summary{margin:0;float:none;width:auto}
.woocommerce div.product .product_title{margin-top:0}
.woocommerce div.product p.price,.woocommerce div.product span.price{
  color:var(--pz-tief);font-size:30px;font-weight:700;font-family:var(--pz-serif)}
.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related,.woocommerce div.product .upsells{grid-column:1/-1}
.woocommerce div.product .stock.in-stock{color:var(--pz-gruen);font-weight:600}
.woocommerce div.product .stock.out-of-stock{color:var(--pz-rot);font-weight:600}
.woocommerce .woocommerce-tabs ul.tabs{padding:0;margin:0 0 20px}
.woocommerce .woocommerce-tabs ul.tabs::before{border-color:var(--pz-linie)}
.woocommerce .woocommerce-tabs ul.tabs li{background:transparent;border:0;border-radius:0;box-shadow:none}
.woocommerce .woocommerce-tabs ul.tabs li::before,.woocommerce .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce .woocommerce-tabs ul.tabs li a{color:var(--pz-grau);font-weight:600;padding:10px 0;margin-right:26px}
.woocommerce .woocommerce-tabs ul.tabs li.active a{color:var(--pz-tief);border-bottom:3px solid var(--pz-kupfer)}

/* ── Hinweise, Formulare, Tabellen ─────────────────────────────────────── */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border-top:0;border-left:4px solid var(--pz-kupfer);background:var(--pz-weiss);
  border-radius:0 var(--pz-radius) var(--pz-radius) 0;padding:16px 20px;color:var(--pz-text)}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{display:none}
.woocommerce-error{border-left-color:var(--pz-rot)}
.woocommerce table.shop_table{border-radius:var(--pz-radius);border-color:var(--pz-linie);background:var(--pz-weiss)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,
.woocommerce form .form-row select,.select2-container .select2-selection--single{
  border:1px solid var(--pz-linie);border-radius:8px;padding:11px 13px;font-size:16px;background:#fff}
.woocommerce .quantity .qty{border:1px solid var(--pz-linie);border-radius:8px;padding:10px;font-size:16px}

/* ── Seiteninhalte ─────────────────────────────────────────────────────── */
.pz-seite{background:var(--pz-weiss);border:1px solid var(--pz-linie);
  border-radius:var(--pz-radius);padding:34px 38px}
.pz-seite>h1:first-child{margin-top:0}
.woocommerce-breadcrumb{font-size:14px;color:var(--pz-grau);margin-bottom:18px}
.woocommerce-breadcrumb a{color:var(--pz-grau)}

/* ── Handy ─────────────────────────────────────────────────────────────── */
@media(max-width:860px){
  .woocommerce div.product{grid-template-columns:1fr;gap:24px}
  .pz-kopf__rechts{margin-left:0;width:100%}
  .pz-suche{flex:1}
  .pz-suche input{width:100%}
  .pz-seite{padding:24px 20px}
  body{font-size:16px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ══════════════════════════════════════════════════════════════════════════
   ERWEITERUNG 1.1 — Premium-Anmutung
   Grund: Die erste Fassung wirkte wie ein Katalog. Der Vergleich mit
   Amorelie, EIS, Orion und Lovehoney zeigte drei Ursachen: zu langer
   Kopfzeilen-Text, alles in einer schmalen Spalte, kein Hero-Bereich.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Marke kompakt statt Bandwurm-Titel ───────────────────────────────── */
.pz-marke{font-size:26px;line-height:1.1;display:flex;flex-direction:column}
.pz-marke small{font-size:12px;font-weight:400;letter-spacing:.09em;text-transform:uppercase;
  opacity:.68;font-family:var(--pz-sans);margin-top:3px}

/* ── Hero ─────────────────────────────────────────────────────────────── */
.pz-hero{background:linear-gradient(135deg,var(--pz-tief) 0%,var(--pz-tief-hell) 62%,#4A2A5E 100%);
  color:#fff;padding:66px 20px 72px;text-align:center;position:relative;overflow:hidden}
/* Ein einziges dekoratives Element — Kupfer-Bogen. Mehr braucht es nicht. */
.pz-hero::after{content:"";position:absolute;right:-140px;bottom:-190px;width:430px;height:430px;
  border-radius:50%;border:1px solid rgba(184,115,51,.34);pointer-events:none}
.pz-hero__text{max-width:760px;margin:0 auto;position:relative;z-index:1}
.pz-hero h1{color:#fff;font-size:clamp(30px,4.6vw,46px);margin:0 0 14px;line-height:1.15}
.pz-hero__satz{font-size:clamp(17px,2vw,21px);color:rgba(255,255,255,.9);margin:0 auto 26px;max-width:58ch}
.pz-knopf--gross{padding:16px 40px;font-size:17px}

/* ── Startseite: Text schmal, Produktreihen breit ─────────────────────── */
.pz-start{max-width:var(--pz-breite);margin:0 auto;padding:0 20px}
.pz-start>div{max-width:none!important}            /* Wrapper des Texters aufheben */
.pz-start p,.pz-start li{max-width:var(--pz-lese)}  /* Text bleibt lesbar schmal   */
.pz-start h2{font-size:clamp(24px,3.2vw,32px);margin-top:2em;padding-bottom:12px;
  border-bottom:2px solid var(--pz-linie);max-width:none}
/* Produkt- und Kategoriereihen ueber die volle Breite */
.pz-start .woocommerce,.pz-start ul.products,.pz-start ul.product-categories{max-width:none}
.pz-start ul.products{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}

/* ── Produktkacheln mit mehr Ruhe und Tiefe ───────────────────────────── */
.woocommerce ul.products li.product{padding:16px;box-shadow:0 1px 2px rgba(43,21,55,.05);
  transition:box-shadow .18s ease,border-color .18s ease}
.woocommerce ul.products li.product:hover{box-shadow:0 10px 26px rgba(43,21,55,.13);border-color:var(--pz-kupfer)}
.woocommerce ul.products li.product a img{aspect-ratio:4/5;object-fit:contain;padding:8px;background:#fff}
.woocommerce ul.products li.product .price{font-family:var(--pz-serif);font-size:21px}
/* "In den Warenkorb" in der Liste ruhiger — der laute Knopf gehoert auf die Produktseite */
.woocommerce ul.products li.product .button{background:transparent;color:var(--pz-kupfer-dunkel)!important;
  border:1.5px solid var(--pz-kupfer);padding:9px 18px;font-size:15px}
.woocommerce ul.products li.product .button:hover{background:var(--pz-kupfer);color:#fff!important}

/* ── Kategorie-Kacheln ────────────────────────────────────────────────── */
.woocommerce ul.products li.product-category a{text-align:center}
.woocommerce ul.products li.product-category h2,
.woocommerce ul.products li.product-category .woocommerce-loop-category__title{
  font-family:var(--pz-sans);font-size:16px;font-weight:600;color:var(--pz-tief);
  padding:12px 0 0;margin:0;border:0}
.woocommerce ul.products li.product-category mark{background:transparent;color:var(--pz-grau);font-weight:400}

/* ── Abschnitts-Rhythmus: jeder zweite Block bekommt Luft ─────────────── */
.pz-start>div>h2{scroll-margin-top:80px}
