/*
Theme Name: RIOS1931
Author: RIOS1931 Oswald Riemer Uhrenarmbandfabrik GmbH
Description: Shop-Theme nach der Kreativdenker-Vorlage (Entscheidung 13.09.2026). Inter für Text und Navigation, Times New Roman MT Std für Überschriften, monochrom.
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 8.2
Text Domain: rios1931
*/

/* Schriften: Inter (OFL) und Times New Roman MT Std (lizenziert, aus dem CI-Skill) */
@font-face{font-family:"Inter";src:url(fonts/Inter-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/Inter-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/Inter-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/Inter-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Times New Roman MT Std";src:url(fonts/TimesNewRomanMTStd.otf) format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:"Times New Roman MT Std";src:url(fonts/TimesNewRomanMTStd-Italic.otf) format("opentype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Times New Roman MT Std";src:url(fonts/TimesNewRomanMTStd-Bold.otf) format("opentype");font-weight:700;font-display:swap}

:root{
  --brand:#212529;--text:#212529;--grau:#6c757d;--linie:#e0e0e0;--weiss:#fff;--hg:#f5f5f5;
  --sans:"Inter",system-ui,sans-serif;--serif:"Times New Roman MT Std","Times New Roman",Times,serif;
  --wide:84.375rem;--pad:clamp(1rem,calc(1rem + (1vw - 6.4px) * 1),1.5rem);
  --kopf:7.0625rem;
  --h1:clamp(3.125rem,calc(3.125rem + (1vw - 6.4px) * 4.5),5.375rem);
  --h2:clamp(2.25rem,calc(2.25rem + (1vw - 6.4px) * 4.25),4.375rem);
  --h3:clamp(1.75rem,calc(1.75rem + (1vw - 6.4px) * 1),2.25rem);
  --abschnitt:clamp(3.75rem,calc(3.75rem + (1vw - 6.4px) * 7.5),7.5rem);
  --spalten:clamp(1.5rem,calc(1.5rem + (1vw - 6.4px) * 1),1.875rem);
  --t:.3s ease;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:1rem;line-height:1.6;color:var(--text);background:var(--weiss);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.1;margin:0 0 1rem;text-wrap:balance}
h1{font-size:var(--h1);line-height:1}
h2{font-size:var(--h2);line-height:1}
h3{font-size:var(--h3)}
p{margin:0 0 1rem}
.innen{width:100%;max-width:var(--wide);margin-inline:auto;padding-inline:var(--pad)}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.screen-reader-text:focus{position:fixed;top:1rem;left:1rem;width:auto;height:auto;clip:auto;background:var(--weiss);color:var(--brand);padding:.75rem 1rem;z-index:100;outline:2px solid var(--brand)}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
a,button,input,select,textarea,.button{touch-action:manipulation}

/* ---------- Kopf ---------- */
.kopf{position:sticky;top:0;z-index:10;color:var(--text);background:var(--weiss);border-bottom:1px solid var(--linie);transition:background .25s ease,box-shadow .25s ease}
/* Kopfzeile bleibt beim Scrollen oben (Kevin 14.09.); gescrollt etwas kompakter, damit sie nicht die halbe Seite belegt */
.kopf.ist-gescrollt{box-shadow:0 1px 8px rgba(0,0,0,.06)}
/* angemeldet: die WordPress-Leiste (32 px, mobil 46 px) liegt sonst über der Kopfzeile */
body.admin-bar .kopf{top:32px}@media(max-width:782px){body.admin-bar .kopf{top:46px}}
.kopf.ist-gescrollt .kopf-main{gap:.9rem;padding:.35rem 0 .75rem}
.kopf.ist-gescrollt .logo img{width:150px;height:auto}
.kopf .logo img{transition:width .25s ease}
.kopf-user{font-size:.875rem;font-weight:600}
.kopf-user .innen{display:flex;justify-content:flex-end;align-items:center;gap:1.5rem;height:2.5rem}
.kopf-user a{display:inline-flex;align-items:center;gap:.4rem}
.kopf-user .trenner{opacity:.6;font-weight:400}
.kopf-main{display:flex;flex-direction:column;align-items:center;gap:1.75rem;padding:.5rem 0 1.25rem}
.logo img{height:4.25rem;width:auto}
.logo-hell{display:none}
.nav ul{display:flex;gap:2.5rem;list-style:none;margin:0;padding:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;flex-wrap:wrap;justify-content:center}
.nav a{position:relative;padding:.25rem 0}
.nav a::before{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--t)}
.nav a:hover::before,.nav .current-menu-item>a::before{transform:scaleX(1)}
/* Startseite: Kopf transparent auf dem Intro */
body.home .kopf{position:fixed;top:0;left:0;width:100%;background:transparent;border:0;color:var(--weiss)}
body.home .kopf.ist-gescrollt{background:var(--weiss);color:var(--text);border-bottom:1px solid var(--linie)}
body.home .kopf.ist-gescrollt .logo-dunkel{display:block}body.home .kopf.ist-gescrollt .logo-hell{display:none}
body.home .kopf.ist-gescrollt .kopf-user a img{filter:none}
body.home .logo-dunkel{display:none}
body.home .logo-hell{display:block}

/* ---------- Intro (Startseite) ---------- */
.intro{position:relative;height:100vh;max-height:800px;min-height:36rem;background-size:cover;background-position:center;color:var(--weiss);display:flex;align-items:center;justify-content:center;text-align:center;padding:calc(var(--kopf) + 2rem) var(--pad) 3rem}
@media(min-width:1366px){.intro{max-height:860px}}
.intro::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.18);pointer-events:none}
.intro-inhalt{position:relative;max-width:62rem}
.intro h1{margin-bottom:1.5rem}
@media(min-width:1100px){.intro h1{white-space:nowrap}}
.intro p{font-size:1.5rem;line-height:1.5;max-width:42rem;margin:0 auto 2.25rem}

/* ---------- Knöpfe ---------- */
.button,.knopf,button.button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{display:inline-block;border:1px solid currentColor;background:transparent;color:inherit;font-family:var(--sans);font-size:.875rem;font-weight:600;line-height:1.6;padding:.875rem 2.25rem;text-transform:uppercase;border-radius:0;cursor:pointer;transition:color var(--t),background var(--t)}
.knopf-hell{color:var(--weiss)}.knopf-hell:hover{background:var(--weiss);color:var(--brand)}
.knopf-dunkel{color:var(--brand)}
.knopf-dunkel:hover{background:var(--brand);color:var(--weiss)}
/* WooCommerce-Systemknöpfe (Anmelden, Zurück zum Shop, Aktualisieren …) dunkel gefüllt wie die Vorlage (A13) */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce-page .button{background:var(--brand);color:var(--weiss);border-color:var(--brand)}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:#000;color:var(--weiss)}
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #respond input#submit.alt{background:var(--brand);color:var(--weiss);border-color:var(--brand)}
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover{background:#000}

/* ---------- Blöcke ---------- */
.block{padding-top:var(--abschnitt);padding-bottom:var(--abschnitt)}
.block h2{margin-bottom:3.75rem}
.text-block p:not(.augenbraue){max-width:37.5rem;font-size:.9375rem;margin-bottom:1.875rem}
.text-block h2{margin-bottom:1.5rem}
.augenbraue{font-size:.8125rem;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.75rem}

/* ---------- Produktkarten (Startseite und Shop-Listen) ---------- */
.produkte,.woocommerce ul.products{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spalten);list-style:none;margin:0;padding:0}
.produkte{margin-top:5rem}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product,.produkt{width:auto;margin:0;float:none;display:block}
.produkt-bild,.woocommerce ul.products li.product a img{aspect-ratio:1/1.05;display:flex;align-items:center;justify-content:center;padding:.5rem;object-fit:contain;margin:0;width:100%;background:var(--weiss)}
.produkt-bild img{max-height:100%;object-fit:contain;transition:opacity var(--t)}
.produkt-bild img,.woocommerce ul.products li.product img{transition:transform .3s ease,opacity .3s ease}
.produkt:hover .produkt-bild img,.woocommerce ul.products li.product:hover img{opacity:.7;transform:translateY(-10px)}
.mehr{position:relative}
.mehr::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.produkt:hover .mehr::after,.woocommerce ul.products li.product:hover .mehr::after{transform:scaleX(1)}
.produkt-titel,.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--sans);font-size:.8125rem;font-weight:700;line-height:1.2;text-align:center;margin:0 0 .25rem;padding:0}
.produkt-sku{font-size:.6875rem;color:var(--grau);text-align:center;margin-bottom:.875rem}
.produkt-fuss,.woocommerce ul.products li.product .rios-fuss{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);padding:.75rem .5rem;margin-top:.875rem}
.woocommerce ul.products li.product .price,.preis{font-size:.9375rem;color:var(--text);margin:0}
.woocommerce ul.products li.product .price .woocommerce-Price-amount{font-weight:400}
.mehr{font-size:.75rem;font-weight:700;text-transform:uppercase}
.mehr .pfeil{display:inline-block;margin-left:.15rem;transition:transform var(--t)}
.produkt:hover .pfeil,.woocommerce ul.products li.product:hover .pfeil{transform:translateX(4px)}
.woocommerce ul.products li.product .button{display:none}
.woocommerce ul.products li.product .onsale{display:none}
.woocommerce ul.products li.product .wc-gzd-additional-info,.woocommerce ul.products li.product .price .wc-gzd-additional-info{font-size:.6875rem;color:var(--grau);display:block;text-align:center;margin-top:.25rem}

/* ---------- Kategorien (Startseite) ---------- */
.kategorien{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spalten)}
.kachel{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--hg)}
.kachel img{width:100%;height:100%;object-fit:cover}
@media(max-width:700px){.kachel{aspect-ratio:11/4}.kachel-label{bottom:auto;top:50%;transform:translate(-50%,-50%)}}   /* A19: mobil flache Kacheln wie Vorlage */
.kachel::before{content:"";position:absolute;inset:0;background:var(--weiss);opacity:0;transition:opacity var(--t);z-index:1}
.kachel:hover::before{opacity:.15}
.kachel-label{position:absolute;left:50%;bottom:14%;transform:translateX(-50%);max-width:90%;text-align:center;background:var(--brand);color:var(--weiss);font-family:var(--serif);font-weight:700;font-size:.9375rem;line-height:1.2;padding:.45rem .9rem;z-index:2}

/* ---------- Innenseiten, Shop, Produkt ---------- */
.seite{padding-top:3rem;padding-bottom:var(--abschnitt)}
.seite h1,.woocommerce-products-header__title{font-size:var(--h2);margin-bottom:2.5rem}
.woocommerce-result-count,.woocommerce-ordering{font-size:.8125rem;color:var(--grau)}
.woocommerce .woocommerce-breadcrumb{font-size:.75rem;color:var(--grau);margin-bottom:2rem}
.brotkrumen{font-size:.75rem;color:var(--grau);margin-bottom:2rem}.brotkrumen a{text-decoration:none;color:inherit}.brotkrumen a:hover{text-decoration:underline}
@media(max-width:1023px){.brotkrumen,.woocommerce .woocommerce-breadcrumb{display:none}}
.woocommerce nav.woocommerce-pagination ul{border:0}
.woocommerce nav.woocommerce-pagination ul li{border:0}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{padding:.6rem 1rem;font-size:.8125rem}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--brand);color:var(--weiss)}
.woocommerce div.product .product_title{font-family:var(--serif);font-size:var(--h3);font-weight:400}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--text);font-size:1.25rem}
.woocommerce div.product .woocommerce-tabs ul.tabs li{border-radius:0;background:transparent}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{border-bottom-color:var(--weiss)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select,.woocommerce-cart table.cart td.actions .coupon .input-text,select{border:1px solid var(--linie);border-radius:0;padding:.7rem .9rem;font-family:var(--sans);background-color:var(--weiss);color:var(--text)}
.woocommerce table.shop_table{border:0;border-collapse:collapse}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{border:0;border-bottom:1px solid var(--linie)}
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:var(--brand);background:var(--hg);border-radius:0}
.woocommerce-message::before,.woocommerce-info::before{color:var(--brand)}
.woocommerce .rios-preisgruppe{background:var(--hg);padding:1rem;border:1px solid var(--linie)}

/* ---------- Fuß ---------- */
.fuss{padding:4rem 0 2.5rem;text-align:center;border-top:1px solid var(--linie);margin-top:var(--abschnitt)}
body.home .fuss{margin-top:0}
.fuss-spalten{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spalten);margin-bottom:3rem}
.fuss h4{font-size:.8125rem;font-weight:700;text-transform:uppercase;margin:0 0 .75rem}
.fuss ul{list-style:none;margin:0;padding:0}
.fuss ul a{display:block;font-size:.875rem;line-height:2;color:var(--grau);transition:color var(--t)}
.fuss ul a:hover{color:var(--brand)}
.fuss-widerruf{margin:0 0 2.5rem}
.rios-drucken{margin:2rem 0 0}
@media print{.kopf,.fuss,.nach-oben,.rios-drucken,.woocommerce-breadcrumb{display:none!important}}
.fuss-hinweis{font-size:.8125rem;color:var(--grau);margin-bottom:.5rem}
.fuss-copy{font-size:.75rem;color:var(--grau)}

@media(max-width:1023px){.produkte,.woocommerce ul.products{grid-template-columns:repeat(2,1fr)}.kategorien{grid-template-columns:repeat(2,1fr)}}
@media(max-width:782px){.kategorien{grid-template-columns:1fr}.kopf-user .innen{gap:.75rem;font-size:.75rem}.nav ul{gap:1rem}.fuss-spalten{grid-template-columns:1fr}.intro h1{font-size:2.75rem}.intro p{font-size:1.125rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important}}

/* ---------- Verfügbarkeits-Ampel und ab-Preis ---------- */
.woocommerce div.product p.stock.rios-ampel{font-family:var(--sans);font-size:.8125rem;font-weight:600;display:inline-flex;align-items:center;gap:.5rem;color:var(--text)}
.rios-ampel::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#2e8b57;flex:none}
.rios-ampel-orange::before{background:#e08a00}
.rios-ampel-rot::before{background:#c0392b}
.woocommerce div.product p.stock.rios-ampel-rot{color:#c0392b}
.price .ab{font-size:.75em;color:var(--grau);margin-right:.15rem}

/* ---------- Produktseite (Vorlage Kreativdenker) ---------- */
.rios-produkt-oben{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:4rem;align-items:start;padding-bottom:3rem;border-bottom:1px solid var(--linie)}
.rios-produkt-galerie{min-width:0;overflow:hidden} /* Flexslider darf die Spalte nicht aufblasen */
.rios-produkt-galerie .woocommerce-product-gallery{width:100%!important;float:none;margin:0}
.rios-produkt-galerie .woocommerce-product-gallery__image img{object-fit:contain;background:var(--weiss)}
.rios-produkt-galerie .flex-control-thumbs{display:flex;gap:.75rem;justify-content:center;margin-top:1rem}
.rios-produkt-galerie .flex-control-thumbs li{width:6rem;margin:0;float:none;border:1px solid var(--linie);padding:.25rem}
.rios-produkt-galerie .flex-control-thumbs li img{opacity:1}
.rios-produkt-galerie .flex-control-thumbs li img.flex-active{border:0;outline:1px solid var(--brand)}
.rios-produkt-kauf{float:none;width:auto;margin:0}
.rios-artikelnummer{font-size:.75rem;color:var(--grau);text-align:right;margin:0 0 .5rem}
.rios-marke{font-size:.875rem;margin:-.25rem 0 1rem}.rios-markenhinweis{font-size:.75rem;color:var(--grau);margin:2rem 0 0}
.woocommerce div.product .rios-produkt-kauf .product_title{font-family:var(--serif);font-size:var(--h3);font-weight:400;padding-bottom:.6rem;border-bottom:1px solid var(--brand);margin-bottom:1.75rem}
.woocommerce div.product .rios-produkt-kauf>p.price{display:none}  /* Spanne oben weg, Preis steht im Kaufkasten */
.woocommerce div.product .rios-produkt-kauf .woocommerce-variation-price{display:block}
.woocommerce div.product .rios-produkt-kauf .woocommerce-variation-price .price{display:inline;font-size:1.5rem;color:var(--text)}
.woocommerce div.product form.cart table.variations{margin-bottom:1.5rem}
.woocommerce div.product form.cart table.variations tr{display:block;margin-bottom:1.25rem}
.woocommerce div.product form.cart table.variations th,.woocommerce div.product form.cart table.variations td{display:block;padding:0;line-height:1.4}
.woocommerce div.product form.cart table.variations th label{font-family:var(--sans);font-size:.75rem;font-weight:400;text-transform:uppercase;letter-spacing:.04em;color:var(--grau);margin-bottom:.4rem;display:block}
.woocommerce div.product form.cart table.variations select{width:100%;max-width:22rem;padding:.7rem .9rem;border:1px solid var(--linie);font-size:.8125rem;font-weight:600;background-color:var(--weiss);color:var(--text)}
.woocommerce div.product form.cart .reset_variations{font-size:.75rem;color:var(--grau)}
.woocommerce div.product form.cart .woocommerce-variation{margin-top:1rem}
.woocommerce div.product form.cart .woocommerce-variation-price .price{font-size:1.5rem;color:var(--text);font-weight:400}
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart,.woocommerce div.product form.cart:not(.variations_form){display:flex;align-items:center;gap:1rem;background:var(--hg);padding:1rem;margin-top:1rem}
.woocommerce div.product form.cart .single_variation_wrap{margin-top:1rem}
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .price{margin-right:auto}
.woocommerce div.product form.cart div.quantity{margin:0}
.woocommerce .quantity .qty{width:4.5rem;border:1px solid var(--linie);padding:.65rem .5rem;background:var(--weiss);text-align:center}
.woocommerce div.product form.cart .button{flex:1;text-align:center;background:var(--brand);color:var(--weiss);border-color:var(--brand);font-size:.8125rem;padding:.9rem 1.5rem}
.woocommerce div.product form.cart .button:hover{background:#000}
.woocommerce div.product form.cart .button.disabled,.woocommerce div.product form.cart .button:disabled{opacity:.5}
.woocommerce div.product .wc-gzd-additional-info,.woocommerce div.product .woocommerce-product-details__short-description{font-size:.75rem;color:var(--grau)}
.woocommerce div.product .rios-produkt-kauf .woocommerce-variation-description{background:var(--hg);padding:.75rem 1rem;font-size:.8125rem;margin-top:1rem}
.woocommerce div.product .rios-produkt-kauf .woocommerce-variation-description h3{display:none}
.woocommerce div.product .rios-produkt-kauf .woocommerce-variation-description ul{margin:0;padding-left:1.1rem}
.rios-produkt-unten{padding-top:2.5rem}
.rios-produkt-text{max-width:60rem}
.rios-produkt-text h3{font-family:var(--serif);font-size:1.75rem;font-weight:400;text-transform:uppercase;letter-spacing:.02em;margin:2rem 0 1rem}
.rios-produkt-text h3:first-child{margin-top:0}
.rios-produkt-text ul{list-style:disc;padding-left:1.25rem;margin:0 0 1rem}
.rios-produkt-text li{margin-bottom:.6rem;font-size:1rem}
.rios-produkt-text p{margin:0}
@media(max-width:900px){.rios-produkt-oben{grid-template-columns:1fr;gap:2rem}}

/* ---------- Textseiten (Impressum, AGB, Manufaktur, RIOS1931) ---------- */
.textseite{max-width:var(--wide)}
.textseite article{max-width:60rem}
.textseite h1{margin-bottom:2.5rem}
.textseite h2{font-size:var(--h3);margin:2.5rem 0 1rem}
.textseite h3{font-size:1.25rem;font-family:var(--sans);font-weight:600;margin:1.5rem 0 .5rem}
.textseite p,.textseite li{font-size:1rem;line-height:1.7}
.textseite .untertitel{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--grau);margin-top:-1rem}
.textseite .seite-block{margin-bottom:3rem}
.textseite .text-media{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.textseite .text-media figure{margin:0}
.textseite .galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spalten);margin:1rem 0}
.textseite .galerie figure{margin:0}
.textseite .galerie img{width:100%;aspect-ratio:4/3;object-fit:cover}
/* A17: Bildstrecken wie die Vorlage: 2 quer (5:4), 3 hochkant (4:5), 1 breit (natürliches Maß), Lightbox */
.textseite .galerie-1{grid-template-columns:1fr}
.textseite .galerie-2{grid-template-columns:repeat(2,1fr)}
.textseite .galerie-2 img{aspect-ratio:5/4}
.textseite .galerie-3 img{aspect-ratio:4/5}
.textseite .galerie-1 img{aspect-ratio:auto;height:auto}
.textseite .galerie a.lightbox{display:block;text-decoration:none}
.textseite .galerie a.lightbox img{transition:opacity .3s ease}
.textseite .galerie a.lightbox:hover img{opacity:.85}
dialog.lightbox{border:0;padding:0;background:transparent;max-width:min(96vw,1400px);max-height:96vh}
dialog.lightbox::backdrop{background:rgba(0,0,0,.85)}
dialog.lightbox img{display:block;max-width:96vw;max-height:90vh;width:auto;height:auto;margin:0 auto}
dialog.lightbox .lb-zu,dialog.lightbox .lb-vor,dialog.lightbox .lb-zurueck{position:fixed;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;font-size:2.5rem;line-height:1;cursor:pointer;padding:.5rem 1rem}
dialog.lightbox .lb-zurueck{left:.5rem}dialog.lightbox .lb-vor{right:.5rem}
dialog.lightbox .lb-zu{top:1.25rem;right:.75rem;transform:none;font-size:2rem}
.textseite figcaption{font-size:.875rem;color:var(--grau);margin-top:.5rem}
.textseite figure img{width:100%;height:auto}
.textseite a{text-decoration:underline;text-underline-offset:3px}
.textseite table{border-collapse:collapse;width:100%;font-size:.9375rem}
.textseite td,.textseite th{border-bottom:1px solid var(--linie);padding:.5rem .25rem;text-align:left}
@media(max-width:900px){.textseite .text-media{grid-template-columns:1fr}.textseite .galerie{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1023px){.textseite .galerie-2,.textseite .galerie-3{grid-template-columns:1fr}}

/* ---------- Filterleiste ---------- */
.filterleiste{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;background:var(--hg);padding:1rem;margin:0 0 2.5rem}
.filterleiste .filter-feld{flex:1 1 14rem;max-width:18rem}
.filterleiste .filter-titel{display:none}
.filterleiste select:not(.select2-hidden-accessible),.filterleiste .select2-container .select2-selection--single{width:100%!important;height:auto;border:1px solid var(--linie);border-radius:0;background:var(--weiss);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;padding:.7rem .9rem;color:var(--text)}
.filterleiste .select2-container .select2-selection--single .select2-selection__rendered{line-height:1.4;padding:0;color:var(--text)}
.filterleiste .select2-container .select2-selection--single .select2-selection__arrow{height:100%}
.filterleiste ul{list-style:none;margin:0;padding:0}
.woocommerce .woocommerce-result-count{display:none}
.woocommerce .woocommerce-ordering{float:right;margin:0 0 1rem}
.woocommerce .woocommerce-ordering select{font-size:.8125rem;padding:.5rem .75rem;border:1px solid var(--linie);background:var(--weiss)}

/* ---------- Kategorietext unter der Liste (FAQ, SEO) ---------- */
.kategorie-text{padding:var(--abschnitt) var(--pad) 0;max-width:60rem}
.kategorie-text h2{font-size:var(--h3);margin:0 0 1rem}
.kategorie-text h3{font-family:var(--sans);font-size:1rem;font-weight:600;margin:1.5rem 0 .5rem}
.kategorie-text details{border-top:1px solid var(--linie);padding:.9rem 0}
.kategorie-text details:last-of-type{border-bottom:1px solid var(--linie)}
.kategorie-text summary{cursor:pointer;font-weight:600;font-size:.9375rem;list-style:none;display:flex;justify-content:space-between;align-items:center}
.kategorie-text summary::-webkit-details-marker{display:none}
.kategorie-text summary::after{content:"";width:.6rem;height:.6rem;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);transition:transform var(--t);flex:none;margin-left:1rem}
.kategorie-text details[open] summary::after{transform:rotate(-135deg)}
.kategorie-text p,.kategorie-text li{font-size:.9375rem;line-height:1.7;color:var(--text)}

/* ---------- Startseite: Text links, Bild rechts (Handarbeit, Handnaht) ---------- */
.block-media{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.block-media img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media(max-width:900px){.block-media{grid-template-columns:1fr;gap:2rem}}

/* ---------- Block A (14.09.): Kopfzeilen-Symbole, Zurück nach oben, Stepper, Konto, Warenkorb-Info, Karten ---------- */
.kopf-user a img{width:1rem;height:1rem;display:inline-block}
body.home .kopf-user a img{filter:invert(1)}body.home .kopf-user .sprachwahl img{filter:none}   /* Flaggen nicht invertieren */
/* nach der Startseiten-Regel, sonst gewinnt deren top:0: angemeldet unter der WordPress-Leiste */
body.admin-bar .kopf,body.home.admin-bar .kopf{top:32px}@media(max-width:782px){body.admin-bar .kopf,body.home.admin-bar .kopf{top:46px}}
.nach-oben{position:fixed;right:1.5rem;bottom:1.5rem;width:2.75rem;height:2.75rem;border:1px solid var(--linie);background:var(--weiss);cursor:pointer;z-index:90;display:flex;align-items:center;justify-content:center;transition:border-color var(--t)}
.nach-oben::before{content:"";width:.7rem;height:.7rem;border-left:2px solid var(--brand);border-top:2px solid var(--brand);transform:translateY(3px) rotate(45deg)}
.nach-oben:hover{border-color:var(--brand)}
.nach-oben[hidden]{display:none}
@media(max-width:1023px){.nach-oben{display:none}}
.woocommerce .quantity{display:inline-flex;align-items:stretch;border:1px solid var(--linie);background:var(--weiss)}
.woocommerce .quantity .qty{width:3rem;border:0;padding:.65rem .25rem;text-align:center;-moz-appearance:textfield}
.woocommerce .quantity .qty::-webkit-outer-spin-button,.woocommerce .quantity .qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.woocommerce .quantity .qty-minus,.woocommerce .quantity .qty-plus{border:0;background:transparent;width:2rem;cursor:pointer;font-size:1rem;color:var(--text)}
.woocommerce .quantity .qty-minus:hover,.woocommerce .quantity .qty-plus:hover{background:var(--hg)}
.woocommerce ul.products li.product .wc-gzd-additional-info,.woocommerce ul.products li.product .price .wc-gzd-additional-info{display:none} /* A9 */
.woocommerce-info::before,.woocommerce-message::before{content:"i";font-family:var(--serif);font-weight:700;font-style:normal;width:1.25rem;height:1.25rem;border-radius:50%;background:#1e73be;color:#fff;text-align:center;line-height:1.25rem;font-size:.85rem;top:1em} /* A14 */
.woocommerce-cart-form button[name="update_cart"]{display:none} /* B3: Menge rechnet automatisch nach */
.woocommerce-account .u-columns .col-1,.woocommerce-account .u-columns .col-2{float:left;width:48%} /* A12: Anmelden | Registrieren */
.woocommerce-account .u-columns .col-2{float:right}
.woocommerce form.login,.woocommerce form.register{border:0;padding:0;margin:0}
.woocommerce form.login h2,.woocommerce form.register h2,.woocommerce-account h2{font-size:var(--h3);margin-bottom:1rem}
@media(max-width:782px){.woocommerce-account .u-columns .col-1,.woocommerce-account .u-columns .col-2{float:none;width:100%}}

/* ---------- Kontakt (Vorlage rios.kd): zwei Spalten, Anschrift mit Symbolen, Formular im Kasten ---------- */
.kontakt-spalten{display:grid;grid-template-columns:1fr 1.15fr;gap:4rem;align-items:start}
.kontakt-links h1{font-size:var(--h2)}
.kontakt-links p{max-width:34rem;margin-bottom:2.5rem}
.kontakt-daten{list-style:none;margin:0;padding:0}
.kontakt-daten li{display:flex;gap:.9rem;align-items:flex-start;margin-bottom:1.1rem;font-size:.9375rem;line-height:1.6}
.kontakt-daten img{width:1.25rem;height:1.25rem;flex:none;margin-top:.15rem}
.kontakt-daten a{text-decoration:underline;text-underline-offset:3px}
.kontakt-rechts{border:1px solid var(--linie);padding:2rem}
.kontakt-rechts h2{font-size:var(--h3);margin-bottom:1.5rem}
.wpcf7 form p{margin:0 0 1rem}
.wpcf7 form label{display:block;font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--grau);margin-bottom:.4rem}
.wpcf7 form .wpcf7-form-control-wrap{display:block}
.wpcf7 form input[type="text"],.wpcf7 form input[type="email"],.wpcf7 form input[type="tel"],.wpcf7 form textarea{width:100%;border:1px solid var(--linie);border-radius:0;padding:.75rem .9rem;font-family:var(--sans);font-size:.9375rem;background:var(--weiss);color:var(--text)}
.wpcf7 form textarea{min-height:9rem;resize:vertical}
.wpcf7 form .wpcf7-acceptance label{display:flex;gap:.6rem;align-items:flex-start;text-transform:none;letter-spacing:0;font-weight:400;font-size:.875rem;color:var(--text)}
.wpcf7 form .wpcf7-acceptance input{margin-top:.25rem}
.wpcf7 form .wpcf7-submit{display:inline-block;border:1px solid var(--brand);background:var(--brand);color:var(--weiss);font-family:var(--sans);font-size:.875rem;font-weight:600;text-transform:uppercase;padding:.875rem 2.25rem;border-radius:0;cursor:pointer}
.wpcf7 form .wpcf7-submit:hover{background:#000}
/* D7 Händlerregistrierung: eigenes Formular im gleichen Kleid wie das Kontaktformular */
.formular p{margin:0 0 1rem}
.formular label{display:block;font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--grau);margin-bottom:.4rem}
.formular input:not([type=checkbox]),.formular textarea{width:100%;border:1px solid var(--linie);border-radius:0;padding:.75rem .9rem;font-family:var(--sans);font-size:.9375rem;background:var(--weiss);color:var(--text)}
.formular textarea{min-height:8rem;resize:vertical}
.formular .feld-fehlt input,.formular .feld-fehlt textarea{border-color:#b3261e}
/* ALTCHA-Widget (inc/altcha.php): Haarlinie, keine Rundung, wie die Felder */
altcha-widget{display:block;margin:0 0 1rem;max-width:100%;--altcha-border-width:1px;--altcha-border-radius:0;--altcha-color-border:var(--linie);--altcha-color-base:var(--weiss);--altcha-color-text:var(--text);--altcha-color-border-focus:var(--brand)}
.formular .feld-akzept label{display:flex;gap:.6rem;align-items:flex-start;text-transform:none;letter-spacing:0;font-weight:400;font-size:.875rem;color:var(--text)}
.formular .feld-akzept input{margin-top:.25rem}
.formular .firmenname2{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.formular .button{display:inline-block;border:1px solid var(--brand);background:var(--brand);color:var(--weiss);font-family:var(--sans);font-size:.875rem;font-weight:600;text-transform:uppercase;padding:.875rem 2.25rem;border-radius:0;cursor:pointer}
.formular .button:hover{background:#000}
.haendler .pflicht-hinweis,.kontakt .pflicht-hinweis{font-size:.875rem;color:var(--grau)}
.haendler-punkte{margin:0 0 1.5rem 1.1rem;padding:0}.haendler-punkte li{margin-bottom:.5rem;font-size:.9375rem;line-height:1.6}
.haendler .klein{font-size:.875rem;color:var(--grau)}.haendler .klein a{text-decoration:underline;text-underline-offset:3px}
.hinweis-kasten{border:1px solid var(--linie);background:var(--hg);padding:1rem 1.25rem;margin-bottom:1.25rem}.hinweis-kasten.fehler{border-color:#b3261e}
/* A20: Bildchen in Warenkorb und Kassenübersicht in fester Größe, Gutscheinfeld lesbar */
.woocommerce-cart table.cart img{width:4.5rem;height:auto}
.woocommerce-checkout-review-order-table .product-name img{width:3.5rem;height:auto;vertical-align:middle;margin-right:.75rem}
.woocommerce-cart table.cart td.actions .coupon .input-text{width:12rem}
.woocommerce-cart table.cart td.actions .coupon .input-text:focus-visible{outline:2px solid var(--brand);outline-offset:2px}   /* BFSG: Fokus sichtbar */
.wpcf7 form .wpcf7-spinner{display:block;margin:.5rem 0}
.wpcf7 .wpcf7-response-output{border:1px solid var(--linie);background:var(--hg);padding:1rem;margin:1rem 0 0;font-size:.875rem}
@media(max-width:900px){.kontakt-spalten{grid-template-columns:1fr;gap:2rem}.kontakt-rechts{padding:1.25rem}}
/* C1 Sprachwahl im Kopf: Flagge + Kürzel, aktive Sprache fett */
.sprachwahl{display:inline-flex;gap:.6rem;margin-right:1.25rem}.sprachwahl a{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;letter-spacing:.04em;color:var(--grau)}.sprachwahl a[aria-current]{color:var(--text);font-weight:600}body.home .kopf:not(.ist-gescrollt) .sprachwahl a{color:rgba(255,255,255,.75)}body.home .kopf:not(.ist-gescrollt) .sprachwahl a[aria-current]{color:var(--weiss)}.sprachwahl img{width:18px;height:auto}
/* Produktnamen: die Striche „| Mod. 102 TOSCANA |" sind reine Gestaltung (Kevin 16.09.2026). Der Name selbst ist ohne Striche,
   damit Screenreader, Google, Rechnung und Mails sie nicht vorlesen/zeigen. Leerer Alternativtext nach dem Schrägstrich. */
.woocommerce div.product .product_title::before,.woocommerce ul.products li.product .woocommerce-loop-product__title::before,.produkt-titel::before{content:"| ";content:"| " / ""}
.woocommerce div.product .product_title::after,.woocommerce ul.products li.product .woocommerce-loop-product__title::after,.produkt-titel::after{content:" |";content:" |" / ""}
/* Endprüfung 30.09.2026: WooCommerce smallscreen (width:48%;float:left) aushebeln, Kachel füllt ihre Grid-Spalte */
body .woocommerce ul.products[class*=columns-] li.product,body .woocommerce-page ul.products[class*=columns-] li.product{width:auto;float:none;margin:0;clear:none}
/* Endprüfung: lange Wörter in Überschriften (Barrierefreiheitserklärung) am Handy trennen statt abschneiden */
@media(max-width:600px){h1,h2{overflow-wrap:break-word;hyphens:auto}}