/*
Theme Name: Fischernezt
Theme URI: https://fischernezt.de
Description: WooCommerce-Theme für Fischernezt — professionelle Fischernetze in Handarbeit. Semantik-Kokon-Struktur.
Author: Rubicon Group
Author URI: https://fischernezt.de
Version: 2.0.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: fischernezt
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: e-commerce, custom-menu, featured-images
*/

/* ═══════════════════════════════════════
   FISCHERNEZT — CUSTOM STYLES
   Farben aus Logo: Gold #B8922D / #C9A84C
   ═══════════════════════════════════════ */

/* [FIX] Der @import der Google Fonts stand zusätzlich zum wp_enqueue_style()
   in der functions.php — die Schriften wurden also zweimal angefordert, und
   ein @import blockiert das Rendering zusätzlich. Der Ladevorgang läuft jetzt
   ausschließlich über functions.php. */

:root {
  --fn-bg:          #F7F5F0;
  --fn-bg-white:    #FFFDF8;
  --fn-bg-card:     #FAFAF6;
  --fn-dark:        #1A1814;
  --fn-dark2:       #2C261E;
  --fn-text:        #2A2520;
  --fn-text-mid:    #5A5448;
  --fn-text-light:  #7A7468;
  --fn-text-muted:  #9B9488;
  --fn-gold:        #B8922D;
  --fn-gold-light:  #C9A84C;
  --fn-gold-bright: #D4B65E;
  --fn-border:      #E8E3D9;
  --fn-border-light:#EDEAE2;
  --fn-serif:       'Libre Baskerville', Georgia, serif;
  --fn-sans:        'Outfit', system-ui, sans-serif;
}

/* ═══════════════════════════════════════
   [FIX] BASIS-RESET
   Im Standalone-Theme fehlte jede Grundlage: kein box-sizing, kein
   Zurücksetzen der body-Margin, keine responsiven Bilder. Als Child-Theme
   kam das von Astra — allein steht das Theme sonst auf Browser-Defaults.
   ═══════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
img, svg, video { max-width: 100%; height: auto; }
a { text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--fn-gold); outline-offset: 2px; }

/* ─── GLOBAL ─── */
body {
  background-color: var(--fn-bg) !important;
  font-family: var(--fn-sans) !important;
  color: var(--fn-text);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--fn-serif) !important;
  color: var(--fn-dark);
}

a { color: var(--fn-gold); }
a:hover { color: var(--fn-dark); }

/* ─── HEADER / ASTRA OVERRIDES ─── */
.ast-primary-header,
.site-header {
  background: var(--fn-bg-white) !important;
  border-bottom: 1px solid var(--fn-border) !important;
  box-shadow: 0 1px 12px rgba(0,0,0,0.04) !important;
}

.site-title a,
.ast-site-identity .site-title a {
  font-family: var(--fn-serif) !important;
  font-variant: small-caps;
  letter-spacing: 3px;
  color: var(--fn-dark) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

.site-description {
  font-family: var(--fn-sans) !important;
  font-size: 8px !important;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--fn-text-muted) !important;
}

/* Navigation */
.main-header-menu a,
.ast-header-sections-navigation a {
  font-family: var(--fn-sans) !important;
  font-size: 12.5px !important;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  font-weight: 500 !important;
  color: var(--fn-text-mid) !important;
}

.main-header-menu a:hover,
.main-header-menu .current-menu-item > a {
  color: var(--fn-gold) !important;
}

/* ─── ABOVE-HEADER (TOPBAR) ─── */
.ast-above-header {
  background: var(--fn-dark) !important;
  border-bottom: none !important;
}

.ast-above-header * {
  font-family: var(--fn-sans) !important;
  font-size: 11px !important;
  color: var(--fn-text-muted) !important;
  letter-spacing: 0.4px;
}

/* ─── BREADCRUMBS ─── */
.ast-breadcrumbs,
.woocommerce-breadcrumb {
  font-family: var(--fn-sans) !important;
  font-size: 12px !important;
  color: var(--fn-text-muted) !important;
  padding: 14px 0 !important;
}

.woocommerce-breadcrumb a { color: var(--fn-text-mid) !important; }
.woocommerce-breadcrumb a:hover { color: var(--fn-gold) !important; }

/* ─── WOOCOMMERCE SHOP / CATALOGUE ─── */
.woocommerce .products .product {
  background: var(--fn-bg-card) !important;
  border: 1px solid var(--fn-border) !important;
  border-radius: 8px !important;
  overflow: hidden;
  transition: all 0.35s ease !important;
  padding: 0 !important;
}

.woocommerce .products .product:hover {
  border-color: var(--fn-gold-light) !important;
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(139,115,50,0.1) !important;
}

.woocommerce .products .product .woocommerce-loop-product__title {
  font-family: var(--fn-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--fn-dark) !important;
  padding: 12px 16px 4px !important;
}

.woocommerce .products .product .price {
  font-family: var(--fn-serif) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #8B7332 !important;
  padding: 0 16px 16px !important;
}

.woocommerce .products .product img {
  border-radius: 0 !important;
  margin-bottom: 0 !important;
}

/* Add to Cart button (Catalogue) */
.woocommerce .products .product .button,
.woocommerce .products .product .add_to_cart_button {
  background: transparent !important;
  color: var(--fn-gold) !important;
  border: 1px solid var(--fn-border) !important;
  border-radius: 5px !important;
  font-family: var(--fn-sans) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 10px 20px !important;
  margin: 0 16px 16px !important;
  transition: all 0.3s !important;
}

.woocommerce .products .product .button:hover {
  background: var(--fn-gold) !important;
  color: #fff !important;
  border-color: var(--fn-gold) !important;
}

/* Sale badge */
.woocommerce span.onsale {
  background: var(--fn-gold) !important;
  color: var(--fn-dark) !important;
  font-family: var(--fn-sans) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px;
  border-radius: 4px !important;
  padding: 4px 12px !important;
  min-height: auto !important;
  min-width: auto !important;
  line-height: 1.4 !important;
}

/* ─── SINGLE PRODUCT PAGE ─── */
.woocommerce div.product .product_title {
  font-family: var(--fn-serif) !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  color: var(--fn-dark) !important;
}

.woocommerce div.product p.price {
  font-family: var(--fn-serif) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #8B7332 !important;
}

.woocommerce div.product .woocommerce-product-details__short-description {
  font-family: var(--fn-sans) !important;
  font-size: 13px !important;
  color: var(--fn-text-light) !important;
  line-height: 1.7;
  border-left: 3px solid var(--fn-gold);
  padding-left: 16px;
  margin: 16px 0;
}

/* Product attributes table */
.woocommerce table.shop_attributes {
  border: 1px solid var(--fn-border) !important;
  border-radius: 6px;
  overflow: hidden;
}

.woocommerce table.shop_attributes th {
  font-family: var(--fn-sans) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--fn-text-mid) !important;
  background: var(--fn-bg-card) !important;
  border-bottom: 1px solid var(--fn-border) !important;
  padding: 10px 16px !important;
}

.woocommerce table.shop_attributes td {
  font-family: var(--fn-sans) !important;
  font-size: 13px !important;
  color: var(--fn-text) !important;
  background: var(--fn-bg-white) !important;
  border-bottom: 1px solid var(--fn-border) !important;
  padding: 10px 16px !important;
}

/* Single Product: Add to Cart */
.woocommerce div.product form.cart .single_add_to_cart_button {
  background: linear-gradient(135deg, var(--fn-gold-light) 0%, var(--fn-gold-bright) 100%) !important;
  color: var(--fn-dark) !important;
  font-family: var(--fn-sans) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: none !important;
  border-radius: 5px !important;
  padding: 14px 32px !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
}

.woocommerce div.product form.cart .single_add_to_cart_button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(184,146,45,0.3) !important;
}

/* Quantity input */
.woocommerce .quantity .qty {
  border: 1px solid var(--fn-border) !important;
  border-radius: 5px !important;
  font-family: var(--fn-sans) !important;
  padding: 10px !important;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--fn-sans) !important;
  font-size: 12px !important;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-weight: 500 !important;
  color: var(--fn-text-mid) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--fn-gold) !important;
}

/* ─── SIDEBAR / FILTERS ─── */
.widget-area .widget {
  background: var(--fn-bg-white) !important;
  border: 1px solid var(--fn-border) !important;
  border-radius: 6px !important;
  padding: 20px !important;
  margin-bottom: 16px !important;
}

.widget-area .widget-title,
.widget-area .widget .widgettitle {
  font-family: var(--fn-sans) !important;
  font-size: 11px !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--fn-gold) !important;
  font-weight: 600 !important;
  margin-bottom: 12px !important;
}

/* ─── CART ─── */
.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th {
  font-family: var(--fn-sans) !important;
  border-top: 1px solid var(--fn-border) !important;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: linear-gradient(135deg, var(--fn-gold-light) 0%, var(--fn-gold-bright) 100%) !important;
  color: var(--fn-dark) !important;
  font-family: var(--fn-sans) !important;
  font-weight: 600 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 5px !important;
  border: none !important;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  box-shadow: 0 4px 20px rgba(184,146,45,0.3) !important;
}

/* ─── FOOTER ─── */
.site-footer,
.ast-footer-overlay {
  background: var(--fn-dark) !important;
  color: #6A6560 !important;
  border-top: 1px solid rgba(201,168,76,0.15) !important;
}

.site-footer a { color: #6A6560 !important; }
.site-footer a:hover { color: var(--fn-gold-light) !important; }

.site-footer .widget-title {
  font-family: var(--fn-sans) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--fn-gold-light) !important;
}

.ast-small-footer {
  background: var(--fn-dark) !important;
  border-top: 1px solid rgba(255,255,255,0.05) !important;
}

.ast-small-footer * {
  font-family: var(--fn-sans) !important;
  font-size: 11px !important;
  color: #4A4640 !important;
}

/* ─── BUTTONS (GLOBAL) ─── */
.ast-button,
button,
input[type="submit"],
.button {
  font-family: var(--fn-sans) !important;
  font-weight: 600 !important;
  letter-spacing: 0.8px;
  border-radius: 5px !important;
}

/* ─── FISCHEREIRECHT NOTICE ─── */
.fn-legal-notice {
  background: rgba(184,146,45,0.05);
  border: 1px solid rgba(184,146,45,0.15);
  border-radius: 6px;
  padding: 14px 20px;
  font-family: var(--fn-sans);
  font-size: 11px;
  color: var(--fn-text-muted);
  line-height: 1.6;
  margin-top: 24px;
}

.fn-legal-notice::before {
  content: "⚖ ";
}

/* ─── MASSANFERTIGUNG CTA BOX ─── */
.fn-cta-box {
  background: linear-gradient(135deg, rgba(184,146,45,0.08) 0%, rgba(196,154,42,0.03) 100%);
  border: 1px solid rgba(184,146,45,0.2);
  border-radius: 8px;
  padding: 24px;
  text-align: center;
  margin: 24px 0;
}

.fn-cta-box h4 {
  font-family: var(--fn-serif) !important;
  color: var(--fn-gold) !important;
  font-size: 18px !important;
  margin-bottom: 8px !important;
}

.fn-cta-box p {
  font-family: var(--fn-sans) !important;
  font-size: 12px;
  color: var(--fn-text-muted);
  margin-bottom: 16px;
}

.fn-cta-box a.fn-cta-btn {
  display: inline-block;
  font-family: var(--fn-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--fn-dark);
  background: linear-gradient(135deg, var(--fn-gold-light), var(--fn-gold-bright));
  padding: 12px 28px;
  border-radius: 5px;
  transition: all 0.3s;
}

.fn-cta-box a.fn-cta-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(184,146,45,0.25);
}

/* ─── RESPONSIVE ─── */
@media (max-width: 921px) {
  .site-title a { font-size: 18px !important; }
  .woocommerce div.product .product_title { font-size: 22px !important; }
}



/* ═══════════════════════════════════════════════
   FRONT-PAGE STYLES
   ═══════════════════════════════════════════════ */
.fn-hero{position:relative;background:linear-gradient(165deg,#1A1814 0%,#2C261E 55%,#3D3428 100%);padding:80px 40px 90px;overflow:hidden;min-height:480px;display:flex;align-items:center}
.fn-hero-texture{position:absolute;top:0;left:0;width:100%;height:100%;opacity:.025;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath d='M0 30 L30 0 L60 30 L30 60 Z' fill='none' stroke='%238B7332' stroke-width='0.4'/%3E%3C/svg%3E");background-size:60px 60px}
.fn-hero-line{position:absolute;top:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent 0%,rgba(184,146,45,.15) 40%,rgba(184,146,45,.15) 60%,transparent 100%)}
.fn-hero-line--1{right:15%}.fn-hero-line--2{right:35%;background:linear-gradient(180deg,transparent 0%,rgba(184,146,45,.08) 30%,rgba(184,146,45,.08) 70%,transparent 100%)}
.fn-hero-bottom-line{position:absolute;bottom:40px;left:40px;right:40px;height:1px;background:linear-gradient(90deg,rgba(184,146,45,.3) 0%,rgba(184,146,45,.05) 60%,transparent 100%)}
.fn-hero-content{position:relative;z-index:2;max-width:640px}
.fn-fade-up{opacity:0;transform:translateY(30px);animation:fnFadeUp .9s cubic-bezier(.16,1,.3,1) .2s forwards}
@keyframes fnFadeUp{to{opacity:1;transform:translateY(0)}}
.fn-hero-visual{position:absolute;right:5%;top:50%;transform:translateY(-50%);opacity:0;animation:fnFadeIn 1.5s ease .5s forwards}
@keyframes fnFadeIn{to{opacity:.12}}
.fn-tag{font-family:var(--fn-sans);font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--fn-gold-light);margin-bottom:12px;display:flex;align-items:center;gap:12px}
.fn-tag--center{justify-content:center}
.fn-tag-line{width:24px;height:1px;background:var(--fn-gold-light);display:inline-block}
.fn-hero-title{font-family:var(--fn-serif);font-size:46px;font-weight:400;color:#F3F0E9;line-height:1.15;margin:0 0 24px;letter-spacing:-.5px}
.fn-hero-title em{color:var(--fn-gold-light);font-style:italic}
.fn-hero-text{font-family:var(--fn-sans);font-size:15px;color:var(--fn-text-muted);line-height:1.75;max-width:480px;margin:0 0 36px}
.fn-hero-buttons{display:flex;gap:14px;align-items:center}
.fn-btn{font-family:var(--fn-sans);font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;padding:14px 32px;border-radius:5px;cursor:pointer;display:inline-block;text-align:center;transition:transform .2s,box-shadow .2s,background .3s;border:none}
.fn-btn--gold{color:var(--fn-dark);background:linear-gradient(135deg,var(--fn-gold-light) 0%,var(--fn-gold-bright) 100%)}
.fn-btn--gold:hover{color:var(--fn-dark);transform:translateY(-1px);box-shadow:0 4px 20px rgba(184,146,45,.3)}
.fn-btn--outline{color:var(--fn-gold-light);border:1px solid rgba(201,168,76,.35);background:none}
.fn-btn--outline:hover{color:var(--fn-gold-light);background:rgba(201,168,76,.08);border-color:rgba(201,168,76,.6)}
.fn-usp-bar{background:var(--fn-bg-white);border-bottom:1px solid var(--fn-border);padding:0 40px;display:flex}
.fn-usp-item{flex:1;padding:24px 28px;display:flex;align-items:center;gap:16px}
.fn-usp-item--border{border-right:1px solid var(--fn-border)}
.fn-usp-icon{font-size:20px;color:var(--fn-gold);line-height:1}
.fn-usp-title{font-family:var(--fn-sans);font-size:13px;font-weight:600;color:var(--fn-text);letter-spacing:.3px}
.fn-usp-desc{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted);margin-top:2px}
.fn-section{padding:64px 40px;position:relative}
.fn-section--white{background:var(--fn-bg-white);border-top:1px solid var(--fn-border);border-bottom:1px solid var(--fn-border)}
.fn-section-header{margin-bottom:48px}
.fn-section-header--center{text-align:center}
.fn-section-header:not(.fn-section-header--center){display:flex;justify-content:space-between;align-items:flex-end}
.fn-section-title{font-family:var(--fn-serif);font-size:32px;font-weight:400;color:var(--fn-dark);margin:0;letter-spacing:-.3px}
.fn-section-title--sm{font-size:30px}
.fn-section-title em{font-style:italic;color:#8B7332}
.fn-link{font-family:var(--fn-sans);font-size:12px;font-weight:500;color:var(--fn-gold);cursor:pointer;display:flex;align-items:center;gap:6px;letter-spacing:.5px}
.fn-cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:960px;margin:0 auto}
.fn-cat-card{display:block;background:var(--fn-bg-card);border:1px solid var(--fn-border);border-radius:8px;padding:28px 24px;cursor:pointer;transition:all .35s ease;position:relative;overflow:hidden;color:inherit}
.fn-cat-card:hover{background:var(--fn-bg-white);border-color:var(--fn-gold-light);transform:translateY(-3px);box-shadow:0 8px 32px rgba(139,115,50,.08);color:inherit}
.fn-cat-icon{position:absolute;top:-20px;right:-10px;font-size:64px;opacity:.03;color:#8B7332;line-height:1;transition:opacity .3s}
.fn-cat-card:hover .fn-cat-icon{opacity:.08}
.fn-cat-content{position:relative;z-index:1}
.fn-cat-title{font-family:var(--fn-serif);font-size:17px;font-weight:600;color:var(--fn-dark);margin-bottom:6px}
.fn-cat-sub{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);margin-bottom:12px;line-height:1.5}
.fn-cat-footer{display:flex;justify-content:space-between;align-items:center}
.fn-cat-count{font-family:var(--fn-sans);font-size:11px;color:var(--fn-gold);font-weight:600;letter-spacing:.5px}
.fn-cat-arrow{color:#C5C0B5;transition:color .3s}.fn-cat-card:hover .fn-cat-arrow{color:var(--fn-gold)}
.fn-products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.fn-product-card{display:block;background:var(--fn-bg);border:1px solid var(--fn-border-light);border-radius:8px;overflow:hidden;transition:all .35s ease;cursor:pointer;color:inherit}
.fn-product-card:hover{border-color:var(--fn-gold-light);transform:translateY(-4px);box-shadow:0 12px 40px rgba(139,115,50,.1);color:inherit}
.fn-product-img{height:200px;background:linear-gradient(145deg,#EDEAE2 0%,#E4E0D5 100%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.fn-product-img img{width:100%;height:100%;object-fit:cover}
.fn-product-placeholder{opacity:.15}
.fn-badge{position:absolute;top:12px;left:12px;color:#fff;font-size:9px;font-family:var(--fn-sans);font-weight:600;padding:4px 12px;border-radius:4px;letter-spacing:.8px;text-transform:uppercase}
.fn-badge--gold{background:var(--fn-gold);color:var(--fn-dark)}.fn-badge--green{background:#4D7C5E}.fn-badge--teal{background:#3D8B6E}.fn-badge--gray{background:#6B8068}
.fn-product-tag{position:absolute;bottom:10px;right:10px;font-size:9px;font-family:var(--fn-sans);color:var(--fn-gold);background:rgba(255,255,255,.9);border:1px solid var(--fn-border);padding:2px 8px;border-radius:3px;letter-spacing:.5px}
.fn-product-info{padding:20px}
.fn-product-name{font-family:var(--fn-serif);font-size:15px;font-weight:600;color:var(--fn-dark);margin-bottom:8px;line-height:1.3}
.fn-product-specs{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted);margin-bottom:16px;line-height:1.5}
.fn-product-bottom{display:flex;justify-content:space-between;align-items:center}
.fn-product-price{font-family:var(--fn-serif);font-size:22px;font-weight:700;color:#8B7332}
.fn-product-price .woocommerce-Price-amount{color:#8B7332}
.fn-product-vat{font-family:var(--fn-sans);font-size:10px;color:var(--fn-text-faint);margin-top:1px}
.fn-product-cart-icon{width:40px;height:40px;border-radius:6px;border:1px solid #D8D3C7;display:flex;align-items:center;justify-content:center;color:var(--fn-text-muted);transition:all .3s}
.fn-product-card:hover .fn-product-cart-icon{background:var(--fn-gold);border-color:var(--fn-gold);color:#fff}
.fn-no-products{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-muted);text-align:center;padding:48px 0}
.fn-handarbeit{padding:72px 40px;display:flex;gap:56px;align-items:center;max-width:1040px;margin:0 auto}
.fn-handarbeit-img{width:400px;height:320px;flex-shrink:0;border-radius:8px;background:linear-gradient(145deg,#E8E3D9 0%,#DDD8CC 100%);display:flex;align-items:center;justify-content:center;border:1px solid #D8D3C7;position:relative;overflow:hidden}
.fn-handarbeit-photo{width:100%;height:100%;object-fit:cover;border-radius:7px}
.fn-handarbeit-img-pattern{position:absolute;inset:0;background:repeating-linear-gradient(45deg,transparent,transparent 20px,rgba(139,115,50,.03) 20px,rgba(139,115,50,.03) 21px)}
.fn-handarbeit-img-placeholder{text-align:center;position:relative;z-index:1}
.fn-small-text{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);letter-spacing:2px;text-transform:uppercase}
.fn-tiny-text{font-family:var(--fn-sans);font-size:10px;color:var(--fn-text-faint);margin-top:4px}
.fn-handarbeit-title{font-family:var(--fn-serif);font-size:30px;font-weight:400;color:var(--fn-dark);margin:0 0 20px;line-height:1.3}
.fn-handarbeit-title em{font-style:italic;color:#8B7332}
.fn-handarbeit-text{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-light);line-height:1.8;margin:0 0 28px;max-width:440px}
.fn-stats{display:flex;gap:32px;font-family:var(--fn-sans)}
.fn-stat-num{font-size:26px;font-weight:700;color:var(--fn-gold);line-height:1}
.fn-stat-label{font-size:10px;color:var(--fn-text-muted);margin-top:4px;letter-spacing:.5px;text-transform:uppercase}
.fn-blog-grid{display:flex;gap:18px;max-width:960px;margin:0 auto}
.fn-blog-card{flex:1;display:block;background:var(--fn-bg);border:1px solid var(--fn-border-light);border-radius:8px;padding:28px 24px;cursor:pointer;transition:all .3s;color:inherit}
.fn-blog-card:hover{border-color:var(--fn-gold-light);transform:translateY(-2px);box-shadow:0 6px 24px rgba(139,115,50,.06);color:inherit}
.fn-blog-tag{font-family:var(--fn-sans);font-size:10px;font-weight:600;color:var(--fn-gold);letter-spacing:1px;text-transform:uppercase;margin-bottom:12px;display:flex;align-items:center;gap:6px}
.fn-blog-tag-dot{width:8px;height:8px;border-radius:2px;background:rgba(184,146,45,.15);display:inline-block}
.fn-blog-title{font-family:var(--fn-serif);font-size:16px;font-weight:600;color:var(--fn-dark);line-height:1.4;margin-bottom:16px}
.fn-blog-link{font-family:var(--fn-sans);font-size:11px;color:var(--fn-gold);display:flex;align-items:center;gap:4px}
.fn-cta-section{background:linear-gradient(165deg,#1A1814 0%,#2C261E 100%);padding:64px 40px;text-align:center;position:relative;overflow:hidden}
.fn-cta-content{position:relative;z-index:2}
.fn-cta-title{font-family:var(--fn-serif);font-size:30px;font-weight:400;color:#F3F0E9;margin:20px 0 12px}
.fn-cta-title em{font-style:italic;color:var(--fn-gold-light)}
.fn-cta-text{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-muted);max-width:500px;margin:0 auto 32px;line-height:1.7}
.fn-cta-buttons{display:flex;gap:14px;justify-content:center}

/* ═══ ARCHIVE-PRODUCT ═══ */
.fn-breadcrumbs{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);padding:14px 40px}
.fn-breadcrumbs a{color:var(--fn-text-mid);transition:color .2s}.fn-breadcrumbs a:hover{color:var(--fn-gold)}
.fn-bc-sep{color:var(--fn-gold);margin:0 6px}.fn-bc-current{color:var(--fn-text-muted)}
.fn-archive-layout{display:flex;gap:32px;padding:0 40px 64px;position:relative}
.fn-sidebar{width:260px;flex-shrink:0}
.fn-sidebar-block{background:rgba(255,255,255,.5);border:1px solid var(--fn-border);border-radius:6px;padding:20px;margin-bottom:16px}
.fn-sidebar-title{font-family:var(--fn-sans)!important;font-size:11px!important;letter-spacing:2px;text-transform:uppercase;color:var(--fn-gold)!important;font-weight:600!important;margin-bottom:16px!important;display:flex;align-items:center;gap:8px}
.fn-nav-item{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-muted);border-radius:4px;border-left:2px solid transparent;margin-bottom:2px;transition:all .2s}
.fn-nav-item:hover{color:var(--fn-gold);background:rgba(184,146,45,.04)}
.fn-nav-item--active{color:var(--fn-gold)!important;background:rgba(184,146,45,.08);border-left-color:var(--fn-gold)}
.fn-nav-count{font-size:11px;opacity:.5}
.fn-nav-subs{padding-left:20px}
.fn-nav-sub{display:block;padding:5px 10px;font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);transition:color .2s}
.fn-nav-sub:hover{color:var(--fn-gold)}.fn-nav-sub--active{color:var(--fn-gold)!important;font-weight:600}
.fn-filter-group{margin-bottom:16px}
.fn-filter-label{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);margin-bottom:8px;font-weight:500}
.fn-filter-options{display:flex;flex-wrap:wrap;gap:4px}
.fn-filter-tag{font-family:var(--fn-sans);font-size:11px;padding:4px 10px;border-radius:3px;border:1px solid var(--fn-border);color:var(--fn-text-muted);transition:all .2s}
.fn-filter-tag:hover{border-color:var(--fn-gold);color:var(--fn-gold)}
.fn-filter-tag--active{background:var(--fn-gold)!important;color:#fff!important;border-color:var(--fn-gold)!important}
.fn-filter-hint{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-faint);font-style:italic;line-height:1.5}
.fn-sidebar-cta{background:linear-gradient(135deg,rgba(184,146,45,.08) 0%,rgba(196,154,42,.03) 100%);border:1px solid rgba(184,146,45,.2);border-radius:6px;padding:20px;text-align:center;margin-top:16px}
.fn-sidebar-cta-icon{font-size:20px;margin-bottom:8px}
.fn-sidebar-cta-title{font-family:var(--fn-serif);font-size:16px;font-weight:600;color:var(--fn-gold);margin-bottom:6px}
.fn-sidebar-cta-text{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted);line-height:1.5;margin-bottom:12px}
.fn-sidebar-cta-btn{display:inline-block;font-family:var(--fn-sans);font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--fn-gold);border:1px solid rgba(184,146,45,.3);padding:8px 16px;border-radius:4px;transition:all .3s}
.fn-sidebar-cta-btn:hover{background:var(--fn-gold);color:#fff}
.fn-archive-main{flex:1;min-width:0}
.fn-archive-header{margin-bottom:24px}
.fn-archive-title{font-family:var(--fn-serif)!important;font-size:28px!important;font-weight:400!important;color:var(--fn-dark)!important;margin:0 0 12px!important}
.fn-archive-desc{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-light);line-height:1.8;max-width:720px;padding:20px;background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px;margin-bottom:16px}
.fn-subcats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.fn-subcat-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--fn-sans);font-size:12px;font-weight:500;color:var(--fn-text-mid);background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:20px;padding:6px 16px;transition:all .3s}
.fn-subcat-chip:hover{border-color:var(--fn-gold);color:var(--fn-gold)}
.fn-subcat-count{font-size:10px;color:var(--fn-text-faint);background:var(--fn-bg);border-radius:10px;padding:1px 6px}
.fn-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(184,146,45,.08)}
.fn-toolbar-count{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted)}
.fn-toolbar-num{color:var(--fn-gold);font-weight:600}
.fn-toolbar-right{display:flex;align-items:center;gap:12px}
.fn-archive-main .woocommerce-ordering select{background:rgba(255,255,255,.5)!important;border:1px solid var(--fn-border)!important;color:var(--fn-text-muted)!important;padding:8px 14px!important;border-radius:4px!important;font-family:var(--fn-sans)!important;font-size:12px!important;cursor:pointer;outline:none!important}
.fn-archive-main ul.products{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:16px!important;padding:0!important;margin:0!important;list-style:none!important}
.fn-grid-product{background:var(--fn-bg-card)!important;border:1px solid var(--fn-border)!important;border-radius:8px!important;overflow:hidden;transition:all .35s ease!important;padding:0!important;margin:0!important;float:none!important;width:auto!important}
.fn-grid-product:hover{border-color:var(--fn-gold-light)!important;transform:translateY(-4px);box-shadow:0 12px 40px rgba(139,115,50,.1)!important}
.fn-grid-product-link{display:block;color:inherit!important}.fn-grid-product-link:hover{color:inherit!important}
.fn-grid-product-img{height:200px;background:linear-gradient(145deg,#EDEAE2,#E4E0D5);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.fn-grid-product-img img{width:100%!important;height:100%!important;object-fit:cover;margin:0!important}
.fn-grid-placeholder{opacity:.15}
.fn-grid-product-tag{position:absolute;bottom:10px;right:10px;font-size:9px;font-family:var(--fn-sans);color:var(--fn-gold);background:rgba(255,255,255,.92);border:1px solid var(--fn-border);padding:2px 8px;border-radius:3px;letter-spacing:.5px}
.fn-grid-product-info{padding:16px}
.fn-grid-product-name{font-family:var(--fn-serif);font-size:14px;font-weight:600;color:var(--fn-dark);margin-bottom:6px;line-height:1.3}
.fn-grid-product-specs{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted);margin-bottom:12px;letter-spacing:.3px;line-height:1.4}
.fn-grid-product-bottom{display:flex;justify-content:space-between;align-items:flex-end}
.fn-grid-product-price{font-family:var(--fn-serif)!important;font-size:20px!important;font-weight:700!important;color:#8B7332!important;line-height:1}
.fn-grid-product-price .woocommerce-Price-amount{color:#8B7332!important;font-size:20px!important}
.fn-grid-product-vat{font-family:var(--fn-sans);font-size:10px;color:var(--fn-text-faint);margin-top:2px}
.fn-grid-cart-btn{width:36px;height:36px;border-radius:4px;border:1px solid var(--fn-border);display:flex;align-items:center;justify-content:center;color:var(--fn-text-muted);transition:all .3s}
.fn-grid-product:hover .fn-grid-cart-btn{background:rgba(184,146,45,.15);border-color:rgba(184,146,45,.25);color:var(--fn-gold)}
.fn-archive-main .woocommerce-result-count,.fn-archive-main ul.products li.product .button,.fn-archive-main ul.products li.product .price,.fn-archive-main ul.products li.product .woocommerce-loop-product__title,.fn-archive-main ul.products li.product>a>img,.fn-archive-main ul.products li.product .star-rating,.fn-archive-main .woocommerce span.onsale{display:none!important}
.fn-pagination{margin-top:32px;text-align:center}
.fn-pagination ul{display:flex;justify-content:center;gap:4px;list-style:none;padding:0;margin:0}
.fn-pagination a,.fn-pagination span{display:inline-block;font-family:var(--fn-sans);font-size:12px;padding:8px 14px;border:1px solid var(--fn-border);border-radius:4px;color:var(--fn-text-mid);transition:all .2s}
.fn-pagination a:hover{border-color:var(--fn-gold);color:var(--fn-gold)}
.fn-pagination .current{background:var(--fn-gold);color:#fff;border-color:var(--fn-gold)}
.fn-no-results{text-align:center;padding:64px 24px;background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px}
.fn-no-results-icon{font-size:40px;color:var(--fn-border);margin-bottom:16px}
.fn-no-results h3{font-family:var(--fn-serif);font-size:22px;color:var(--fn-dark);margin:0 0 8px}
.fn-no-results p{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-muted);margin:0 0 24px}
.fn-seo-block{margin-top:40px}
.fn-seo-text{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-light);line-height:1.8;padding:24px;background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px}

/* ═══ MASSANFERTIGUNG ═══ */
.fn-mass-hero{position:relative;background:linear-gradient(165deg,#1A1814 0%,#2C261E 55%,#3D3428 100%);padding:64px 40px 72px;overflow:hidden;display:flex;align-items:center}
.fn-mass-hero-content{position:relative;z-index:2;max-width:580px}
.fn-mass-hero-title{font-family:var(--fn-serif);font-size:40px;font-weight:400;color:#F3F0E9;line-height:1.2;margin:0 0 20px}
.fn-mass-hero-title em{color:var(--fn-gold-light);font-style:italic}
.fn-mass-hero-text{font-family:var(--fn-sans);font-size:15px;color:var(--fn-text-muted);line-height:1.75;max-width:460px}
.fn-mass-steps{background:var(--fn-bg-white);border-bottom:1px solid var(--fn-border);padding:56px 40px}
.fn-mass-steps-inner{display:flex;gap:0;max-width:900px;margin:0 auto;justify-content:center;align-items:flex-start}
.fn-mass-step{flex:1;text-align:center;padding:0 24px;position:relative}
.fn-mass-step-num{font-family:var(--fn-sans);font-size:10px;font-weight:700;letter-spacing:2px;color:var(--fn-gold);margin-bottom:12px}
.fn-mass-step-icon{margin-bottom:16px}
.fn-mass-step-title{font-family:var(--fn-serif)!important;font-size:18px!important;font-weight:600!important;color:var(--fn-dark)!important;margin:0 0 8px!important}
.fn-mass-step-desc{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);line-height:1.6}
.fn-mass-step-arrow{position:absolute;top:52px;right:-12px}
.fn-mass-config{padding:64px 40px}
.fn-mass-config-inner{display:flex;gap:40px;max-width:1040px;margin:0 auto;align-items:flex-start}
.fn-mass-config-form{flex:1.6}
.fn-mass-config-info{flex:1;position:sticky;top:100px}
.fn-form{margin-top:24px}
.fn-form-group{margin-bottom:24px}
.fn-form-row{display:flex;gap:16px}
.fn-form-half{flex:1}
.fn-form-label{display:block;font-family:var(--fn-sans);font-size:13px;font-weight:600;color:var(--fn-text);margin-bottom:8px;letter-spacing:.3px}
.fn-req{color:var(--fn-gold)}
.fn-input,.fn-select,.fn-textarea{width:100%;font-family:var(--fn-sans);font-size:14px;color:var(--fn-text);background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:6px;padding:12px 16px;outline:none;transition:border-color .3s,box-shadow .3s}
.fn-input:focus,.fn-select:focus,.fn-textarea:focus{border-color:var(--fn-gold);box-shadow:0 0 0 3px rgba(184,146,45,.08)}
.fn-input--short{width:120px}
.fn-textarea{resize:vertical;min-height:100px}
.fn-form-hint{display:block;font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-faint);margin-top:4px}
.fn-form-options{display:flex;flex-wrap:wrap;gap:8px}
.fn-form-options--compact{gap:6px}
.fn-option{cursor:pointer}
.fn-option input[type="radio"]{display:none}
.fn-option-box{display:block;font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-mid);background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:6px;padding:12px 18px;transition:all .25s}
.fn-option-box strong{display:block;color:var(--fn-text);margin-bottom:2px}
.fn-option-box small{display:block;font-size:11px;color:var(--fn-text-muted)}
.fn-option--sm .fn-option-box{padding:8px 14px;font-size:12px}
.fn-option input:checked+.fn-option-box{border-color:var(--fn-gold);background:rgba(184,146,45,.06);color:var(--fn-gold);box-shadow:0 0 0 1px var(--fn-gold)}
.fn-option-box:hover{border-color:rgba(184,146,45,.4)}
.fn-form-check{margin-top:8px}
.fn-checkbox{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-light);line-height:1.5}
.fn-checkbox input{display:none}
.fn-checkbox-mark{width:18px;height:18px;border:1px solid var(--fn-border);border-radius:4px;flex-shrink:0;margin-top:1px;transition:all .2s;position:relative}
.fn-checkbox input:checked+.fn-checkbox-mark{background:var(--fn-gold);border-color:var(--fn-gold)}
.fn-checkbox input:checked+.fn-checkbox-mark::after{content:'✓';position:absolute;top:-1px;left:3px;color:#fff;font-size:12px;font-weight:700}
.fn-checkbox-text a{color:var(--fn-gold);text-decoration:underline}
.fn-form-divider{height:1px;background:var(--fn-border);margin:32px 0}
.fn-form-section-title{font-family:var(--fn-serif)!important;font-size:20px!important;font-weight:400!important;color:var(--fn-dark)!important;margin:0 0 20px!important}
.fn-btn--full{width:100%;display:block;margin-top:8px;font-size:13px}
.fn-form-note{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted);text-align:center;margin-top:12px;letter-spacing:.3px}
.fn-form-success{text-align:center;padding:48px 24px;background:rgba(77,124,94,.06);border:1px solid rgba(77,124,94,.2);border-radius:8px;margin-top:24px}
.fn-form-success-icon{width:48px;height:48px;border-radius:50%;background:#4D7C5E;color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.fn-form-success h3{font-family:var(--fn-serif);font-size:22px;color:var(--fn-dark);margin:0 0 8px}
.fn-form-success p{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-light)}
.fn-info-card{background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px;padding:24px;margin-bottom:16px}
.fn-info-card--highlight{background:linear-gradient(135deg,rgba(184,146,45,.05) 0%,rgba(196,154,42,.02) 100%);border-color:rgba(184,146,45,.2)}
.fn-info-card--contact{text-align:center}
.fn-info-card-title{font-family:var(--fn-serif)!important;font-size:17px!important;font-weight:600!important;color:var(--fn-dark)!important;margin:0 0 16px!important}
.fn-info-list{list-style:none;padding:0;margin:0}
.fn-info-list-item{display:flex;flex-direction:column;gap:2px;padding:10px 0;border-bottom:1px solid var(--fn-border)}
.fn-info-list-item:last-child{border-bottom:none}
.fn-info-label{font-family:var(--fn-sans);font-size:13px;font-weight:600;color:var(--fn-text)}
.fn-info-desc{font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted)}
.fn-info-usp{display:flex;align-items:center;gap:12px;padding:8px 0;font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-light)}
.fn-info-usp-icon{color:var(--fn-gold);font-size:14px;width:20px;text-align:center;flex-shrink:0}
.fn-info-card--contact p{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-muted);line-height:1.6;margin:0 0 16px}
.fn-info-phone{display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--fn-sans);font-size:18px;font-weight:600;color:var(--fn-gold)!important;margin-bottom:8px}
.fn-info-email{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-muted)!important}
.fn-mass-faq{background:var(--fn-bg-white);border-top:1px solid var(--fn-border);padding:64px 40px}
.fn-mass-faq-inner{max-width:720px;margin:0 auto}
.fn-faq-list{margin-top:32px}
.fn-faq-item{border:1px solid var(--fn-border);border-radius:6px;margin-bottom:8px;overflow:hidden;transition:border-color .3s}
.fn-faq-item:hover{border-color:rgba(184,146,45,.3)}
.fn-faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:none;padding:18px 20px;cursor:pointer;font-family:var(--fn-serif);font-size:15px;font-weight:600;color:var(--fn-dark);text-align:left;gap:12px}
.fn-faq-chevron{flex-shrink:0;transition:transform .3s;color:var(--fn-text-muted)}
.fn-faq--open .fn-faq-chevron{transform:rotate(180deg);color:var(--fn-gold)}
.fn-faq--open .fn-faq-question{color:var(--fn-gold)}
.fn-faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .3s;padding:0 20px}
.fn-faq--open .fn-faq-answer{max-height:300px;padding:0 20px 18px}
.fn-faq-answer p{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-light);line-height:1.7;margin:0}
.fn-mass-legal{padding:0 40px 48px;max-width:1040px;margin:0 auto}

/* ═══ RESPONSIVE (ALL PAGES) ═══ */
@media(max-width:1024px){.fn-archive-main ul.products{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:900px){
  .fn-hero,.fn-mass-hero{padding:48px 24px 56px;min-height:auto}
  .fn-hero-title{font-size:32px}.fn-mass-hero-title{font-size:30px}
  .fn-hero-visual{display:none}
  .fn-usp-bar{flex-wrap:wrap;padding:0 20px}
  .fn-usp-item{flex:1 1 50%}.fn-usp-item:nth-child(2){border-right:none}
  .fn-section{padding:48px 24px}
  .fn-cat-grid{grid-template-columns:repeat(2,1fr)}
  .fn-products-grid{grid-template-columns:repeat(2,1fr)}
  .fn-handarbeit{flex-direction:column;padding:48px 24px}
  .fn-handarbeit-img{width:100%;height:240px}
  .fn-blog-grid{flex-direction:column}
  .fn-section-header:not(.fn-section-header--center){flex-direction:column;align-items:flex-start;gap:16px}
  .fn-archive-layout{flex-direction:column;padding:0 20px 48px}
  .fn-sidebar{width:100%;display:flex;flex-wrap:wrap;gap:12px}
  .fn-sidebar-block{flex:1 1 calc(50% - 6px)}.fn-sidebar-cta{flex:1 1 100%}
  .fn-breadcrumbs{padding:14px 20px}
  .fn-mass-steps-inner{flex-direction:column;gap:32px}
  .fn-mass-step-arrow{display:none}
  .fn-mass-config{padding:48px 24px}
  .fn-mass-config-inner{flex-direction:column}
  .fn-mass-config-info{position:static}
  .fn-mass-faq{padding:48px 24px}
  .fn-mass-legal{padding:0 24px 48px}
}
@media(max-width:600px){
  .fn-hero-title{font-size:28px}.fn-mass-hero-title{font-size:26px}
  .fn-hero-buttons,.fn-cta-buttons{flex-direction:column;width:100%}
  .fn-btn{width:100%;text-align:center}
  .fn-cat-grid,.fn-products-grid{grid-template-columns:1fr}
  .fn-archive-main ul.products{grid-template-columns:1fr!important}
  .fn-stats{flex-direction:column;gap:16px}
  .fn-usp-item{flex:1 1 100%;border-right:none!important;border-bottom:1px solid var(--fn-border)}
  .fn-sidebar-block{flex:1 1 100%}
  .fn-toolbar{flex-direction:column;gap:8px;align-items:flex-start}
  .fn-form-row{flex-direction:column;gap:0}
}

/* ═══ WPFORMS STYLING ═══ */
.wpforms-container{font-family:var(--fn-sans)!important}
.wpforms-container .wpforms-field-label{font-family:var(--fn-sans)!important;font-size:13px!important;font-weight:600!important;color:var(--fn-text)!important;letter-spacing:.3px;margin-bottom:6px!important}
.wpforms-container .wpforms-field-sublabel{font-size:11px!important;color:var(--fn-text-faint)!important}
.wpforms-container .wpforms-required-label{color:var(--fn-gold)!important}
.wpforms-container input[type="text"],.wpforms-container input[type="email"],.wpforms-container input[type="tel"],.wpforms-container input[type="number"],.wpforms-container select,.wpforms-container textarea{font-family:var(--fn-sans)!important;font-size:14px!important;color:var(--fn-text)!important;background:var(--fn-bg-white)!important;border:1px solid var(--fn-border)!important;border-radius:6px!important;padding:12px 16px!important;transition:border-color .3s,box-shadow .3s!important}
.wpforms-container input:focus,.wpforms-container select:focus,.wpforms-container textarea:focus{border-color:var(--fn-gold)!important;box-shadow:0 0 0 3px rgba(184,146,45,.08)!important;outline:none!important}
.wpforms-container .wpforms-field-radio ul li,.wpforms-container .wpforms-field-checkbox ul li{margin-bottom:6px!important}
.wpforms-container .wpforms-field-radio ul li label,.wpforms-container .wpforms-field-checkbox ul li label{font-family:var(--fn-sans)!important;font-size:13px!important;color:var(--fn-text-mid)!important;padding:10px 16px!important;border:1px solid var(--fn-border)!important;border-radius:6px!important;display:block!important;cursor:pointer;transition:all .25s!important}
.wpforms-container .wpforms-field-radio ul li label:hover,.wpforms-container .wpforms-field-checkbox ul li label:hover{border-color:rgba(184,146,45,.4)!important}
.wpforms-container .wpforms-field-radio ul li input:checked+label,.wpforms-container .wpforms-field-checkbox ul li input:checked+label{border-color:var(--fn-gold)!important;background:rgba(184,146,45,.06)!important;color:var(--fn-gold)!important;box-shadow:0 0 0 1px var(--fn-gold)!important}
.wpforms-container .wpforms-field-divider h3{font-family:var(--fn-serif)!important;font-size:20px!important;font-weight:400!important;color:var(--fn-dark)!important;border-bottom:1px solid var(--fn-border)!important;padding-bottom:12px!important}
.wpforms-container button[type="submit"].wpforms-submit{width:100%!important;font-family:var(--fn-sans)!important;font-size:13px!important;font-weight:600!important;letter-spacing:1.5px!important;text-transform:uppercase!important;color:var(--fn-dark)!important;background:linear-gradient(135deg,var(--fn-gold-light) 0%,var(--fn-gold-bright) 100%)!important;border:none!important;border-radius:5px!important;padding:16px 32px!important;cursor:pointer!important;transition:transform .2s,box-shadow .2s!important}
.wpforms-container button[type="submit"]:hover{transform:translateY(-1px)!important;box-shadow:0 4px 20px rgba(184,146,45,.3)!important}
.wpforms-container .wpforms-field-description{font-family:var(--fn-sans)!important;font-size:11px!important;color:var(--fn-text-faint)!important}
.wpforms-confirmation-container-full{background:rgba(77,124,94,.06)!important;border:1px solid rgba(77,124,94,.2)!important;border-radius:8px!important;padding:32px!important}
.wpforms-container .wpforms-error{border-color:#c0392b!important}
.wpforms-container label.wpforms-error{color:#c0392b!important;font-size:11px!important}

/* ═══════════════════════════════════════════════
   MATRIARCH-SEITE (Kokon Level 1)
   ═══════════════════════════════════════════════ */

/* 4 Netztyp-Karten (UX: 4 statt 10) */
.fn-type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1040px;margin:0 auto}
.fn-type-card{display:block;background:var(--fn-bg-card);border:1px solid var(--fn-border);border-radius:10px;padding:32px 24px;cursor:pointer;transition:all .35s ease;position:relative;overflow:hidden;color:inherit}
.fn-type-card:hover{background:var(--fn-bg-white);border-color:var(--fn-gold-light);transform:translateY(-4px);box-shadow:0 12px 40px rgba(139,115,50,.1);color:inherit}
.fn-type-icon{font-size:36px;color:var(--fn-gold);opacity:.55;line-height:1;margin-bottom:16px}
.fn-type-card:hover .fn-type-icon{opacity:1}
.fn-type-name{font-family:var(--fn-serif);font-size:20px;font-weight:600;color:var(--fn-dark);margin-bottom:4px}
.fn-type-tag{font-family:var(--fn-sans);font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--fn-gold);margin-bottom:12px}
.fn-type-desc{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-light);line-height:1.6;margin-bottom:20px;min-height:62px}
.fn-type-footer{display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid var(--fn-border)}
.fn-type-count{font-family:var(--fn-sans);font-size:12px;font-weight:600;color:var(--fn-gold)}
.fn-type-arrow{color:#C5C0B5;transition:transform .3s,color .3s}
.fn-type-card:hover .fn-type-arrow{color:var(--fn-gold);transform:translateX(3px)}

/* Vergleich einwandig/dreiwandig */
.fn-compare{max-width:820px;margin:0 auto}
.fn-compare-head{text-align:center;margin-bottom:32px}
.fn-compare-head .fn-tag{justify-content:center}
.fn-compare-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.fn-compare-col{background:var(--fn-bg);border:1px solid var(--fn-border);border-radius:8px;padding:24px}
.fn-compare-label{font-family:var(--fn-serif);font-size:16px;font-weight:600;color:var(--fn-gold);margin-bottom:10px}
.fn-compare-col p{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-light);line-height:1.7;margin:0}
.fn-compare-note{text-align:center;font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-muted);margin-top:24px;font-style:italic}

/* Kokon-Perelinkung (matriarchale Links) */
.fn-cocoon-links{margin-top:40px;padding:24px;background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px}
.fn-cocoon-up{margin-bottom:14px}
.fn-cocoon-label{font-family:var(--fn-sans);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--fn-text-muted);margin-right:10px}
.fn-cocoon-parent{font-family:var(--fn-serif);font-size:16px;font-weight:600;color:var(--fn-gold)}
.fn-cocoon-parent:hover{color:var(--fn-dark)}
.fn-cocoon-siblings{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fn-cocoon-chip{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-mid);background:var(--fn-bg);border:1px solid var(--fn-border);border-radius:16px;padding:6px 14px;transition:all .25s}
.fn-cocoon-chip:hover{border-color:var(--fn-gold);color:var(--fn-gold)}

@media(max-width:900px){
  .fn-type-grid{grid-template-columns:repeat(2,1fr)}
  .fn-compare-cols{grid-template-columns:1fr}
  .fn-type-desc{min-height:auto}
}
@media(max-width:600px){
  .fn-type-grid{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════
   RATGEBER — Netz-Selector (Brücke in den Kokon)
   ═══════════════════════════════════════════════ */
.fn-selector{max-width:640px;margin:0 auto;position:relative}
.fn-q{display:none;animation:fnQIn .4s ease}
.fn-q--active{display:block}
@keyframes fnQIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.fn-q-num{font-family:var(--fn-sans);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--fn-gold);margin-bottom:12px}
.fn-q-title{font-family:var(--fn-serif);font-size:24px;font-weight:400;color:var(--fn-dark);margin:0 0 24px;line-height:1.3}
.fn-q-options{display:flex;flex-direction:column;gap:10px}
.fn-q-opt{display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px;padding:18px 22px;cursor:pointer;transition:all .25s;width:100%;min-height:44px}
.fn-q-opt:hover{border-color:var(--fn-gold);background:rgba(184,146,45,.04);transform:translateX(4px)}
.fn-q-opt-title{font-family:var(--fn-serif);font-size:16px;font-weight:600;color:var(--fn-dark);margin-bottom:2px}
.fn-q-opt-desc{font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted)}
.fn-q-opt:hover .fn-q-opt-title{color:var(--fn-gold)}

.fn-result{text-align:center;padding:8px 0}
.fn-result-icon{font-size:36px;color:var(--fn-gold);margin-bottom:12px}
.fn-result-title{font-family:var(--fn-serif);font-size:28px;font-weight:400;color:var(--fn-dark);margin:8px 0 12px}
.fn-result-desc{font-family:var(--fn-sans);font-size:14px;color:var(--fn-text-light);line-height:1.7;max-width:480px;margin:0 auto 24px}
.fn-result-secondary{margin-top:20px;font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-muted)}
.fn-result-secondary a{color:var(--fn-gold);margin-left:6px}
.fn-result-restart{margin-top:20px;background:none;border:none;font-family:var(--fn-sans);font-size:12px;color:var(--fn-text-muted);text-decoration:underline;cursor:pointer}
.fn-result-restart:hover{color:var(--fn-gold)}

.fn-selector-progress{margin-top:32px;height:3px;background:var(--fn-border);border-radius:2px;overflow:hidden}
.fn-selector-bar{height:100%;background:linear-gradient(90deg,var(--fn-gold),var(--fn-gold-bright));border-radius:2px;transition:width .4s ease}

.fn-guide-blocks{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
.fn-guide-block{background:var(--fn-bg);border:1px solid var(--fn-border);border-radius:8px;padding:24px}
.fn-guide-block h3{font-family:var(--fn-serif);font-size:17px;font-weight:600;color:var(--fn-dark);margin:0 0 8px}
.fn-guide-block p{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-light);line-height:1.7;margin:0}
.fn-guide-block a{color:var(--fn-gold)}

@media(max-width:900px){.fn-guide-blocks{grid-template-columns:1fr}}

/* ═══════════════════════════════════════════════
   GLOSSAR (Entity-Hub)
   ═══════════════════════════════════════════════ */
.fn-glossar-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:960px;margin:0 auto}
.fn-glossar-item{background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:8px;padding:24px;scroll-margin-top:100px;transition:border-color .3s}
.fn-glossar-item:hover{border-color:var(--fn-gold-light)}
.fn-glossar-item:target{border-color:var(--fn-gold);box-shadow:0 0 0 3px rgba(184,146,45,.08)}
.fn-glossar-term{font-family:var(--fn-serif);font-size:18px;font-weight:600;color:var(--fn-dark);margin:0 0 10px}
.fn-glossar-def{font-family:var(--fn-sans);font-size:13px;color:var(--fn-text-light);line-height:1.7;margin:0 0 14px}
.fn-glossar-link{font-family:var(--fn-sans);font-size:12px;font-weight:600;color:var(--fn-gold)}
.fn-glossar-link:hover{color:var(--fn-dark)}
@media(max-width:900px){.fn-glossar-grid{grid-template-columns:1fr}}

/* ═══════════════════════════════════════════════
   STANDALONE: HEADER / FOOTER / BASIS
   ═══════════════════════════════════════════════ */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link{position:absolute;left:-9999px;z-index:999;padding:12px 20px;background:var(--fn-gold);color:#fff}
.skip-link:focus{left:10px;top:10px}

.fn-topbar{background:var(--fn-dark);padding:7px 40px;display:flex;justify-content:space-between;align-items:center;font-family:var(--fn-sans);font-size:11px;color:var(--fn-text-muted);letter-spacing:.4px}
.fn-topbar a{color:var(--fn-text-muted)}
.fn-topbar a:hover{color:var(--fn-gold-light)}
.fn-topbar-left{display:flex;gap:16px;align-items:center}
.fn-topbar-sep{opacity:.25}

.fn-site-header{background:var(--fn-bg-white);border-bottom:1px solid var(--fn-border);position:sticky;top:0;z-index:100;box-shadow:0 1px 12px rgba(0,0,0,.04)}
.fn-header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 40px;max-width:1280px;margin:0 auto}
.fn-logo-link{display:flex;align-items:center;gap:14px;color:inherit}
.fn-logo-text{display:flex;flex-direction:column}
.fn-logo-name{font-family:var(--fn-serif);font-size:21px;font-weight:700;letter-spacing:3.5px;color:var(--fn-dark);line-height:1;font-variant:small-caps}
.fn-logo-sub{font-family:var(--fn-sans);font-size:8px;letter-spacing:3px;color:var(--fn-text-muted);text-transform:uppercase;margin-top:3px}

.fn-nav-list{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.fn-nav-list a{font-family:var(--fn-sans);font-size:12.5px;letter-spacing:.8px;text-transform:uppercase;font-weight:500;color:var(--fn-text-mid);transition:color .25s}
.fn-nav-list a:hover{color:var(--fn-gold)}
.fn-nav-list li{position:relative}
.fn-nav-list .sub-menu{display:none;position:absolute;top:100%;left:0;background:var(--fn-bg-white);border:1px solid var(--fn-border);border-radius:6px;padding:8px 0;min-width:220px;list-style:none;box-shadow:0 8px 32px rgba(0,0,0,.08);z-index:50}
.fn-nav-list li:hover>.sub-menu{display:block}
.fn-nav-list .sub-menu a{display:block;padding:8px 18px;text-transform:none;letter-spacing:.2px;font-size:13px}

.fn-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:10px;min-width:44px;min-height:44px}
.fn-burger,.fn-burger::before,.fn-burger::after{display:block;width:22px;height:2px;background:var(--fn-text-mid);transition:.25s}
.fn-burger::before,.fn-burger::after{content:'';position:relative}
.fn-burger::before{top:-7px}
.fn-burger::after{top:5px}

.fn-cart-link{position:relative;color:var(--fn-text-mid);display:flex;align-items:center}
.fn-cart-link:hover{color:var(--fn-gold)}
.fn-cart-badge{position:absolute;top:-6px;right:-8px;background:var(--fn-gold);color:#fff;border-radius:50%;width:16px;height:16px;font-size:9px;display:flex;align-items:center;justify-content:center;font-weight:700;font-family:var(--fn-sans)}

.fn-site-content{min-height:50vh}

.fn-site-footer{background:var(--fn-dark);padding:48px 40px 24px;border-top:1px solid rgba(201,168,76,.15)}
.fn-footer-grid{display:flex;gap:48px;margin-bottom:40px;max-width:1280px;margin-left:auto;margin-right:auto}
.fn-footer-brand{flex:1.3}
.fn-footer-brand-logo{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.fn-footer-brand-name{font-family:var(--fn-serif);font-size:16px;font-weight:700;letter-spacing:2.5px;color:var(--fn-gold-light);font-variant:small-caps}
.fn-footer-brand-text{font-family:var(--fn-sans);font-size:12px;color:#6A6560;line-height:1.7;max-width:280px}
.fn-footer-col{flex:1}
.fn-footer-col-title{font-family:var(--fn-sans);font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--fn-gold-light);margin-bottom:14px}
.fn-footer-col a{display:block;font-family:var(--fn-sans);font-size:12px;color:#6A6560;margin-bottom:9px;transition:color .2s}
.fn-footer-col a:hover{color:var(--fn-gold-light)}
.fn-footer-bottom{border-top:1px solid rgba(255,255,255,.05);padding-top:20px;display:flex;justify-content:space-between;align-items:center;gap:16px;max-width:1280px;margin:0 auto;flex-wrap:wrap}
.fn-footer-copy,.fn-footer-legal{font-family:var(--fn-sans);font-size:11px;color:#4A4640}

@media(max-width:960px){
  .fn-menu-toggle{display:block}
  .fn-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--fn-bg-white);border-bottom:1px solid var(--fn-border);padding:16px 24px;box-shadow:0 8px 24px rgba(0,0,0,.06)}
  .fn-nav--open{display:block}
  .fn-nav-list{flex-direction:column;gap:4px}
  .fn-nav-list a{display:block;padding:12px 0;min-height:44px}
  .fn-nav-list .sub-menu{display:block;position:static;border:none;box-shadow:none;padding:0 0 0 16px;min-width:0}
  .fn-header-inner{padding:12px 20px;flex-wrap:wrap}
  .fn-topbar{padding:7px 20px;font-size:10px}
  .fn-topbar-right{display:none}
  .fn-footer-grid{flex-direction:column;gap:28px}
  .fn-site-footer{padding:36px 20px 20px}
}


/* ═══════════════════════════════════════
   [FIX] ERGÄNZUNGEN / KORREKTUREN
   ═══════════════════════════════════════ */

/* Kontrast: #6A6560 auf #1A1814 ergab 3,1:1, die Copyright-Zeile mit #4A4640
   sogar nur 1,9:1. WCAG AA verlangt 4,5:1 für Fließtext. */
.fn-footer-brand-text,
.fn-footer-col a        { color: #A8A199; }
.fn-footer-copy,
.fn-footer-legal        { color: #8C867E; }
.site-footer,
.ast-footer-overlay     { color: #A8A199 !important; }
.site-footer a          { color: #A8A199 !important; }
.ast-small-footer *     { color: #8C867E !important; }

/* Die Hero-Einblendung startete mit opacity:0 und 0,2 s Verzögerung. Da die
   H1 in der Regel das LCP-Element ist, verschob das den Largest Contentful
   Paint um gut eine Sekunde. Kürzere Animation, keine Verzögerung. */
.fn-fade-up { animation-delay: 0s; animation-duration: .5s; }

/* Nutzer mit "Bewegung reduzieren" bekamen die Animation trotzdem. */
@media (prefers-reduced-motion: reduce) {
  .fn-fade-up { animation: none !important; opacity: 1; transform: none; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Honeypot-Feld des Anfrageformulars: für Menschen unsichtbar, für Bots da.
   Kein display:none — manche Bots ignorieren ausgeblendete Felder. */
.fn-hp {
  position: absolute !important;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Fehlermeldung des Anfrageformulars (Gegenstück zu .fn-form-success) */
.fn-form-error {
  background: #FDF3F2;
  border: 1px solid #E9C4C0;
  border-left: 3px solid #C0554B;
  border-radius: 8px;
  padding: 20px 24px;
  margin-bottom: 24px;
  font-family: var(--fn-sans);
  font-size: 14px;
  color: var(--fn-text);
}
.fn-form-error h3 { font-size: 15px; margin: 0 0 6px; }
.fn-form-error p  { margin: 0; color: var(--fn-text-light); }

/* Pflege-Tab auf der Produktseite (früher komplett per Inline-Style) */
.fn-care-tab {
  font-family: var(--fn-sans);
  font-size: 14px;
  line-height: 1.8;
  color: var(--fn-text-light);
}

/* WooCommerce-Breadcrumb (früher per Inline-Style im Filter) */
.fn-wc-breadcrumb {
  font-family: var(--fn-sans);
  font-size: 12px;
  padding: 14px 0;
}
.fn-wc-breadcrumb .fn-bc-sep { color: var(--fn-gold); margin: 0 6px; }

/* Kategorie-Intro auf Archivseiten */
.fn-category-intro {
  font-family: var(--fn-sans);
  font-size: 14px;
  line-height: 1.8;
  color: var(--fn-text-light);
  max-width: 720px;
  margin: 0 0 32px;
  padding: 24px;
  background: var(--fn-bg-white);
  border: 1px solid var(--fn-border);
  border-radius: 8px;
}

/* "In den Warenkorb" auf der Produktkachel — im Archiv gab es bisher gar
   keine Möglichkeit, ein Produkt direkt in den Warenkorb zu legen. */
.fn-grid-product-action { padding: 0 18px 18px; }
.fn-grid-product-action .button {
  display: block;
  width: 100%;
  text-align: center;
  padding: 11px 16px;
  border-radius: 5px;
  background: var(--fn-gold);
  color: #fff;
  font-family: var(--fn-sans);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .6px;
  border: none;
  cursor: pointer;
  transition: background .2s;
}
.fn-grid-product-action .button:hover { background: var(--fn-dark); color: #fff; }
.fn-grid-product-action .added_to_cart {
  display: block;
  margin-top: 8px;
  text-align: center;
  font-family: var(--fn-sans);
  font-size: 12px;
}

/* Anriss im Blog-Archiv (index.php gibt jetzt Excerpts statt Volltext aus) */
.fn-blog-excerpt {
  font-family: var(--fn-sans);
  font-size: 13px;
  line-height: 1.7;
  color: var(--fn-text-light);
  margin: 10px 0 14px;
}
.fn-blog-card .fn-blog-title { display: block; color: inherit; }

/* Widgets in der Shop-Sidebar */
.fn-widget { margin-top: 20px; }
.fn-widget-title {
  font-family: var(--fn-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--fn-text-muted);
  margin: 0 0 12px;
}
.fn-widget ul { list-style: none; margin: 0; padding: 0; }
.fn-widget li { padding: 7px 0; font-family: var(--fn-sans); font-size: 13px; }

/* Touch-Ziele: 44×44 px ist die von WCAG 2.2 empfohlene Mindestgröße. */
@media (max-width: 600px) {
  .fn-filter-tag, .fn-subcat-chip, .fn-cocoon-chip { min-height: 36px; display: inline-flex; align-items: center; }
  .fn-q-opt { min-height: 44px; }
}


/* ═══════════════════════════════════════
   [FIX] ZENTRIERUNG — EIN CONTAINER FÜR ALLES

   Vorher: .fn-header-inner und die Footer-Raster lagen bei max-width:1280px,
   .fn-section / .fn-hero / .fn-archive-layout / .fn-topbar hatten dagegen nur
   padding:X 40px und liefen randlos über die volle Breite. Auf einem 1920er
   Monitor stand die Kopfzeile also zentriert über randlosem Inhalt.

   Der Trick unten hält den Hintergrund randlos (wichtig für .fn-hero und
   .fn-section--white) und zentriert nur den Inhalt: sobald das Fenster breiter
   als der Container ist, wächst das Padding auf beiden Seiten mit.
   ═══════════════════════════════════════ */

:root {
  /* 1200 und nicht 1280: .fn-header-inner ist 1280 px breit, hat aber selbst
     40 px Innenabstand — der Text der Kopfzeile steht also auf 1200 px. Mit
     1200 fluchtet der Inhalt der Sektionen exakt mit Logo und Navigation. */
  --fn-container: 1200px;
  --fn-gutter: 40px;
}

.fn-topbar,
.fn-hero,
.fn-usp-bar,
.fn-section,
.fn-cta-section,
.fn-breadcrumbs,
.fn-archive-layout,
.fn-mass-hero,
.fn-mass-steps,
.fn-mass-config,
.fn-mass-faq,
.fn-site-footer,
.fn-wc-wrap {
  padding-left:  max(var(--fn-gutter), calc((100% - var(--fn-container)) / 2));
  padding-right: max(var(--fn-gutter), calc((100% - var(--fn-container)) / 2));
}

/* Die Footer-Raster brauchen ihre eigene Begrenzung jetzt nicht mehr —
   sonst wären sie doppelt eingerückt und säßen schmaler als die Kopfzeile. */
.fn-footer-grid,
.fn-footer-bottom {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

@media (max-width: 768px) {
  :root { --fn-gutter: 24px; }
}

/* ── WooCommerce: Produktseite, Warenkorb, Kasse, Konto ──
   Diese Seiten liefen komplett ohne Container. Der Wrapper kommt aus der
   functions.php, die Breite von hier. */
.fn-wc-wrap {
  padding-top: 28px;
  padding-bottom: 72px;
}
.fn-wc-main { display: block; }

/* Lange Produktnamen wie "Dreiwandiges Monofil-Stellnetz 30mm — 2,0×25m |
   Schwimmschnur" sprengten die Spalte, weil im Serif-Titel nichts umbrechen
   durfte. */
.fn-wc-wrap .product_title,
.fn-wc-wrap h1,
.fn-wc-wrap h2 {
  overflow-wrap: break-word;
  hyphens: auto;
}

.fn-wc-wrap .woocommerce-breadcrumb {
  font-family: var(--fn-sans);
  font-size: 12px;
  color: var(--fn-text-muted);
  margin-bottom: 24px;
}
.fn-wc-wrap .woocommerce-breadcrumb a { color: var(--fn-text-muted); }
.fn-wc-wrap .woocommerce-breadcrumb a:hover { color: var(--fn-gold); }

/* Warenkorb und Kasse liegen auf normalen Seiten und landen darum in
   index.php → .fn-section. Nur die Tabellenbreite muss noch mit. */
.fn-section .woocommerce { max-width: 100%; }
.fn-section .woocommerce table.shop_table { width: 100%; }

/* Sicherheitsnetz: ein einzelnes zu breites Element (Tabelle, iframe,
   eingebettete Karte) erzeugt sonst horizontales Scrollen auf der ganzen
   Seite — genau das war im Screenshot zu sehen. */
body { overflow-x: clip; }


/* ═══════════════════════════════════════
   [FIX] PRODUKTSEITE ALS SCHMALE, ZENTRIERTE SPALTE

   Wunsch: das einzelne Produkt soll nicht über die volle Breite laufen,
   sondern als schmälere Spalte mittig stehen. Gilt für beide Fälle —
   das eigene .fn-wc-wrap UND das Standard-#primary von WooCommerce,
   falls das Template-Override (noch) nicht greift.
   ═══════════════════════════════════════ */

:root { --fn-product-width: 1160px; } /* [FIX] passt zum 1200er Seitencontainer */

/* Der äußere Container bleibt voll, zentriert aber seinen Inhalt. */
.single-product #primary,
.single-product .fn-wc-main,
.single-product #main.site-main {
  max-width: var(--fn-product-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--fn-gutter);
  padding-right: var(--fn-gutter);
  box-sizing: border-box;
}

/* Galerie + Zusammenfassung nebeneinander.
   [FIX] Vorher 1fr : 1fr — dadurch war die Galerie in ihrer Spalte klein und
   die rechte Spalte (Titel/Preis) zu breit, der Titel blähte sich auf.
   Jetzt bekommt die Galerie mehr Platz und der Titel eine feste, ruhige Größe. */
.single-product div.product {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
}
.single-product div.product .woocommerce-product-gallery {
  margin: 0;
  width: 100% !important;   /* WooCommerce setzt inline float:left + 48% Breite */
  float: none !important;
}
.single-product div.product .summary {
  margin: 0;
  width: 100% !important;
  float: none !important;
}

/* Titel: in der schmalen Spalte darf er nicht zum Plakat werden. */
.single-product div.product .product_title,
.single-product div.product h1.entry-title {
  font-size: 26px !important;
  line-height: 1.25 !important;
  margin: 0 0 12px !important;
  overflow-wrap: break-word;
  hyphens: auto;
}
.single-product div.product p.price { font-size: 24px !important; }

/* Elemente, die über die ganze Breite der schmalen Spalte gehen sollen. */
.single-product div.product .woocommerce-tabs,
.single-product div.product .related.products,
.single-product div.product .fn-legal-notice,
.single-product .woocommerce-breadcrumb {
  grid-column: 1 / -1;
}

/* Der "Angebot!"-Sticker sitzt absolut — Bezug ist das Grid-Item. */
.single-product div.product { position: relative; }

/* Ab Tablet abwärts: eine Spalte, Galerie über der Zusammenfassung. */
@media (max-width: 860px) {
  .single-product div.product {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* Ähnliche Produkte innerhalb der schmalen Spalte trotzdem als Raster. */
.single-product .related.products ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin: 0;
}
.single-product .related.products ul.products::before,
.single-product .related.products ul.products::after { content: none; }
.single-product .related.products ul.products li.product {
  width: auto;
  margin: 0;
  float: none;
}
@media (max-width: 600px) {
  .single-product .related.products ul.products { grid-template-columns: repeat(2, 1fr); }
}


/* ═══════════════════════════════════════
   [FIX] ARCHIV-RASTER: GLEICH HOHE KARTEN, SAUBERE REIHEN

   Problem: In der ersten Reihe standen 2 statt 3 Karten. Ursache war nicht
   die Spaltenzahl (die steht korrekt auf 3), sondern unterschiedlich hohe
   Karten — die erste mit echtem Foto, die folgenden mit SVG-Platzhalter.
   WooCommerce vergibt zusätzlich first/last-Klassen und Clearfixes, die im
   Grid nichts verloren haben und den Umbruch verschieben.

   Lösung: Grid-Elemente auf gleiche Höhe strecken, WooCommerce-Clearfix im
   Grid abschalten, Kartenhöhe über Flex vereinheitlichen.
   ═══════════════════════════════════════ */

.fn-archive-main ul.products {
  align-items: stretch !important;   /* alle Karten einer Reihe gleich hoch */
}

/* WooCommerce setzt ::before/::after als Clearfix — im Grid erzeugt das
   Phantom-Zellen, die eine Spalte "verbrauchen" und die Reihe auf 2 kürzen. */
.fn-archive-main ul.products::before,
.fn-archive-main ul.products::after {
  content: none !important;
  display: none !important;
}

/* Karte selbst als Flex-Spalte: Bild oben, Info darunter, Button unten. */
.fn-archive-main ul.products li.fn-grid-product {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  clear: none !important;   /* neutralisiert die first/last-Clearfixes */
}
.fn-archive-main ul.products li.fn-grid-product .fn-grid-product-link {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
.fn-archive-main ul.products li.fn-grid-product .fn-grid-product-info {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
/* Preis/Warenkorb-Zeile ans untere Ende, egal wie lang der Name ist. */
.fn-archive-main ul.products li.fn-grid-product .fn-grid-product-bottom {
  margin-top: auto !important;
}

/* Bildbereich immer exakt gleich hoch — Foto und SVG-Platzhalter gleichziehen. */
.fn-archive-main ul.products li.fn-grid-product .fn-grid-product-img {
  height: 200px !important;
  flex: 0 0 auto !important;
}

/* [Nutzerwunsch] Zusatzinfos (inkl. MwSt. / Versand) etwas einrücken. */
.products .wc-gzd-additional-info {
  padding: 0 16px;
}

@media (max-width: 900px) {
  .fn-archive-main ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 560px) {
  .fn-archive-main ul.products { grid-template-columns: 1fr !important; }
}
