/* =====================================================================
   CartSoft Theme „Werkstatt“ – kräftig, direkt, kantig
   Ergänzt das Basis-Stylesheet (wird danach geladen).
   Farben: Signalgelb #f5b800, Anthrazit #15171c, Stahl #2a2e36, Text #3f444d
   Schrift: Inter / Inter Display (lokal, SIL OFL 1.1)
   ===================================================================== */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-400.woff) format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-500.woff) format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-600.woff) format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-700.woff) format("woff")}
@font-face{font-family:"Inter Display";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/inter-display-800.woff) format("woff")}
@font-face{font-family:"Inter Display";font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/inter-display-900.woff) format("woff")}

:root{
  --primary:#f5b800;
  --primary-hover:#ffc61a;
  --primary-ink:#8a5a00;          /* Gelb-Braun für Text auf Weiß (Kontrast ≥ 4,5:1) */
  --primary-soft:#fff6d6;
  --primary-soft-2:#fffbeb;
  --on-primary:#15171c;
  --primary-deep:#6b4600;
  --primary-line:#f1d27a;
  --primary-line-2:#f6e3a6;
  --primary-glow:rgba(245,184,0,.35);
  --primary-ring:rgba(245,184,0,.30);
  --primary-tint:rgba(245,184,0,.14);
  --cart-btn:#15171c;
  --cart-btn-hover:#000;
  --dark:#15171c;
  --black:#0d0e11;
  --steel:#2a2e36;
  --text:#3f444d;
  --text-strong:#1d2026;
  --muted:#5f656e;
  --line:#dcdfe3;
  --line-2:#e9ebee;
  --bg-alt:#f2f3f5;
  --radius:3px;
  --radius-sm:2px;
  --radius-lg:4px;
  --shadow-sm:none;
  --shadow:0 4px 0 rgba(21,23,28,.08);
  --shadow-lg:0 10px 0 rgba(21,23,28,.08);
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-head:"Inter Display","Inter",system-ui,sans-serif;
  --header-h:84px;
}
body{color:var(--text)}
h1,h2,h3,.cat-name,.footer-title{font-family:var(--font-head);font-weight:800;letter-spacing:-.01em}
h1,h2{text-transform:uppercase;letter-spacing:-.005em}
:focus-visible{outline:3px solid var(--dark);outline-offset:2px;box-shadow:0 0 0 6px var(--primary)}
::selection{background:var(--primary);color:var(--dark)}
.ws-label{display:inline-block;margin:0 0 12px;padding:3px 8px;background:var(--primary);color:var(--dark);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.ws-label-dark{background:var(--dark);color:var(--primary)}

/* Buttons: eckig, fett */
.btn{border-radius:2px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:.86rem;border-width:2px}
.btn-primary{box-shadow:0 3px 0 #b88a00}
.btn-primary:hover{box-shadow:0 3px 0 #b88a00}
.btn-primary:active{box-shadow:none;transform:translateY(3px)}
.btn-outline{border-color:var(--dark);color:var(--dark);background:#fff}
.btn-outline:hover{background:var(--dark);color:var(--primary);border-color:var(--dark)}
.btn-dark{background:var(--dark);color:#fff}
.btn-dark:hover{background:#000;color:var(--primary)}
.btn.btn-cart .icon{color:var(--primary);stroke:var(--primary)}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=search],input[type=date],select,textarea{border-radius:2px;border:2px solid #cfd3d8}
input:focus,select:focus,textarea:focus{border-color:var(--dark);box-shadow:0 0 0 3px var(--primary-ring)}

/* Topbar */
.ws-topbar{background:var(--black);color:#c3c7cd;border-bottom:0;box-shadow:inset 0 -1px 0 #000}
.ws-topbar .topbar-text,.ws-topbar .topbar-links a{color:#c3c7cd}
.ws-topbar .topbar-text .icon,.ws-topbar .topbar-links .icon{color:var(--primary)}
.ws-topbar .topbar-links b{color:#fff}
.ws-topbar .topbar-links a:hover{color:var(--primary)}

/* Header dunkel */
.ws-header{background:var(--dark);box-shadow:none}
.ws-header .header-row{min-height:var(--header-h);padding-top:14px;padding-bottom:14px;gap:24px}
.ws-header.is-compact .header-row{min-height:68px;padding-top:8px;padding-bottom:8px}
.ws-header .logo{background:#fff;padding:8px 12px;border-radius:2px}
.ws-header .logo img{max-height:46px;max-width:240px}
.ws-header.is-compact .logo img{max-height:38px}
.ws-header .logo-text{color:var(--dark);font-family:var(--font-head);font-weight:900;text-transform:uppercase;font-size:1.25rem}
.ws-header .search-form{max-width:none;flex:1 1 auto}
.ws-header .search-form input{background:#fff;border:0;border-radius:2px;min-height:50px;padding-right:64px}
.ws-header .search-btn{border-radius:0 2px 2px 0;right:0;top:0;transform:none;height:50px;width:56px;color:var(--dark)}
.ws-header .icon-btn{color:#fff}
.ws-header .icon-btn:hover{background:var(--steel);color:var(--primary)}
.ws-header .icon-label{color:#c3c7cd}
.ws-header .cart-count{box-shadow:0 0 0 2px var(--dark)}

/* Menü gelb */
.ws-header .main-nav{background:var(--primary)}
.ws-header .menu{flex-wrap:wrap;--nav-gap:24px}
.ws-header .menu-item>a{height:var(--bar-h);padding:0;color:var(--dark);font-weight:800;text-transform:uppercase;font-size:.74rem;letter-spacing:.02em}
.ws-header .main-nav{--nav-ul-color:var(--dark);--nav-ul-h:3px;--nav-ul-bottom:8px}
.ws-header .menu-item:hover>a,.ws-header .menu-item:focus-within>a,.ws-header .menu-item.is-active>a{color:var(--dark)}
.ws-header .menu-blog .icon{color:var(--dark)}
.mega{border-top:0;box-shadow:0 18px 0 rgba(21,23,28,.06),0 24px 40px rgba(21,23,28,.18)}
.mega-cat{border-radius:2px}
.mega-cat:hover{background:var(--bg-alt)}
.mega-visual{border-radius:2px;background:var(--bg-alt)}
.mega-sub a{border-radius:2px;background:var(--bg-alt)}
.mega-sub a:hover{background:var(--dark);color:var(--primary)}

/* Hero */
.ws-hero{position:relative;background:linear-gradient(110deg,rgba(13,14,17,.96) 0%,rgba(13,14,17,.88) 55%,rgba(13,14,17,.7) 100%),var(--hero-img,none),var(--steel);background-size:cover;background-position:center;color:#fff;overflow:hidden}
.ws-hero::before{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:repeating-linear-gradient(-45deg,var(--primary) 0 18px,var(--dark) 18px 36px)}
.ws-hero-inner{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center;padding-top:clamp(40px,6vw,80px);padding-bottom:clamp(50px,7vw,96px)}
.ws-hero h1{color:#fff;font-size:clamp(2.1rem,1.3rem + 3vw,3.8rem);line-height:1.02;margin:0 0 .4em;font-weight:900}
.ws-hero-sub{color:#c3c7cd;font-size:1.08rem;max-width:580px;margin:0 0 1.8rem}
.ws-facts{display:flex;flex-wrap:wrap;gap:12px;list-style:none;margin:2.2rem 0 0;padding:0}
.ws-facts li{display:flex;flex-direction:column;padding:12px 18px;border:2px solid #3a3f48;min-width:130px}
.ws-facts b{font-family:var(--font-head);font-weight:900;font-size:1.7rem;color:var(--primary);line-height:1.1}
.ws-facts span{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:#aeb3ba;font-weight:600}
.ws-hero-photo .hero-photo{max-width:none;border-radius:0;border-top:6px solid var(--primary);box-shadow:0 24px 50px rgba(0,0,0,.4)}
.ws-quick{background:#fff;color:var(--text);padding:24px;border-top:6px solid var(--primary)}
.ws-quick h2{font-size:1.15rem;margin:0 0 14px;color:var(--dark)}
.ws-quick-search{max-width:none}
.ws-quick-search input{border:2px solid var(--dark);border-radius:2px;background:#fff;min-height:50px}
.ws-quick-search .search-btn{border-radius:0;right:0;top:0;transform:none;width:52px;height:50px}
.ws-quick-links{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ws-quick-links a{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:9px 10px;background:var(--bg-alt);color:var(--dark);font-weight:600;font-size:.84rem;line-height:1.25;border-left:3px solid transparent}
.ws-quick-links a:hover{border-left-color:var(--primary);background:var(--primary-soft);color:var(--dark)}

/* Vorteile */
.ws-usps{background:var(--steel);color:#fff}
.ws-usps ul{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;margin:0;padding:0}
.ws-usps li{display:flex;align-items:center;gap:12px;padding:18px 16px;font-weight:600;font-size:.9rem;line-height:1.35}
.ws-usps li+li{border-left:1px solid #3a3f48}
.ws-usp-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;background:var(--primary);color:var(--dark);flex-shrink:0}

/* Abschnitte */
.section-head h2{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.2rem)}
.link-arrow{color:var(--dark);text-transform:uppercase;font-size:.84rem;font-weight:800;letter-spacing:.04em;border-bottom:3px solid var(--primary);padding-bottom:2px}
.link-arrow:hover{color:var(--dark)}

/* Kategorien: kantige Boxen mit Nummer */
.ws-cat-grid{counter-reset:wscat;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0;border-top:2px solid var(--dark);border-left:2px solid var(--dark)}
.ws-cat-grid .cat-tile{counter-increment:wscat;border:0;border-right:2px solid var(--dark);border-bottom:2px solid var(--dark);border-radius:0;box-shadow:none;position:relative}
.ws-cat-grid .cat-tile::before{content:counter(wscat,decimal-leading-zero);position:absolute;top:10px;left:12px;z-index:1;font-family:var(--font-head);font-weight:900;font-size:.9rem;color:var(--dark);background:var(--primary);padding:1px 6px}
.cat-tile{border-radius:2px}
.cat-tile:hover{box-shadow:none;background:var(--primary-soft-2)}
.cat-visual{background:#fff;border-bottom:2px solid var(--line-2)}
.cat-name{text-transform:uppercase;font-size:1rem}
.cat-go{border-radius:0;background:var(--dark);color:var(--primary)}
.cat-tile:hover .cat-go{background:var(--primary);color:var(--dark)}

/* Produkte: dicht, kantig */
.ws-product-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.product-card{border:2px solid var(--line);border-radius:2px;box-shadow:none}
.product-card:hover{border-color:var(--dark);box-shadow:var(--shadow)}
.pc-media{border-bottom:2px solid var(--line-2)}
.pc-cat{color:var(--primary-ink);font-weight:800}
.pc-title{font-weight:700}
.price{font-family:var(--font-head);font-weight:900;color:var(--dark)}
.badge{border-radius:0;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.badge-variants{background:var(--dark);color:var(--primary);box-shadow:none}
.badge-sale{background:#d92d20}
.pc-actions .btn{min-height:42px;font-size:.78rem}

/* Ratgeber */
.post-card{border-radius:2px;border:2px solid var(--line);box-shadow:none}
.post-card:hover{border-color:var(--dark)}
.post-cat{color:var(--primary-ink)}

/* Shopseiten */
.opt{border-radius:2px;border-width:2px}
.opt:has(input:checked),.opt.is-checked{border-color:var(--dark);background:var(--primary-soft);box-shadow:inset 0 0 0 1px var(--dark)}
.checkout-steps .is-done span{color:var(--dark)}

/* Kontakt-Band + Footer */
.ws-cta{background:var(--primary);color:var(--dark)}
.ws-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;padding-top:30px;padding-bottom:30px}
.ws-cta .ws-label{background:var(--dark);color:var(--primary)}
.ws-cta h2{margin:0;font-size:clamp(1.3rem,1rem + 1vw,1.9rem);color:var(--dark)}
.ws-cta-hours{margin:6px 0 0;font-weight:600}
.ws-cta-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ws-cta-phone{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:900;font-size:clamp(1.3rem,1rem + 1vw,1.9rem);color:var(--dark)}
.ws-cta-phone:hover{color:var(--dark);text-decoration:underline}
.ws-footer{background:var(--black);color:#aeb3ba}
.ws-footer .footer-title{color:var(--primary);text-transform:uppercase;font-size:.9rem;letter-spacing:.06em}
.ws-footer .footer-links a,.ws-footer .footer-contact a{color:#c3c7cd}
.ws-footer .footer-links a:hover,.ws-footer .footer-contact a:hover{color:var(--primary)}
.ws-footer .footer-contact .icon{color:var(--primary)}
.ws-footer .footer-links .more{color:var(--primary)}
.ws-footer .footer-logo img{border-radius:2px}
.ws-footer .footer-logo .logo-text{color:#fff;font-family:var(--font-head);font-weight:900;text-transform:uppercase}
.ws-footer .footer-bottom{border-top:4px solid var(--primary)}
.ws-footer .footer-bottom a,.ws-footer .footer-powered{color:#aeb3ba}
.ws-footer .footer-bottom a:hover{color:var(--primary)}

@media (max-width:991px){
  :root{--header-h:60px}
  .ws-header .header-row{gap:8px;padding-top:10px;padding-bottom:10px}
  .ws-header .logo{padding:5px 8px}
  .ws-header .logo img{max-height:32px;max-width:160px}
  .ws-header .search-form input{min-height:44px}
  .ws-header .search-btn{height:44px;width:50px}
  .ws-hero-inner{grid-template-columns:1fr;gap:28px}
  .ws-usps ul{grid-template-columns:1fr 1fr}
  .ws-usps li:nth-child(3){border-left:0}
  .ws-usps li:nth-child(n+3){border-top:1px solid #3a3f48}
}
@media (max-width:767px){
  .ws-hero h1{font-size:clamp(1.8rem,8vw,2.4rem)}
  .ws-facts li{min-width:0;flex:1 1 30%;padding:10px 12px}
  .ws-facts b{font-size:1.3rem}
  .ws-facts span{font-size:.6rem;letter-spacing:.02em}
  .ws-quick{padding:18px}
  .ws-quick-links{grid-template-columns:1fr}
  .ws-usps li{padding:14px 10px;font-size:.8rem;gap:8px}
  .ws-usp-icon{width:34px;height:34px}
  .ws-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ws-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .ws-cta-phone{font-size:1.35rem}
}
/* Standard-Logo (helle Variante) direkt auf dem dunklen Kopf – eigene Logos behalten die weiße Fläche */
.ws-header .logo:has(img[src*="logo-cartsoft-hell"]){background:transparent;padding:0}

/* Links beim Überfahren: dunkler Farbton statt Signalgelb (Kontrast auf Weiß) */
main a:not(.btn):hover{color:var(--primary-ink)}