/*
Theme Name: KannsteKnicken Theme Pro
Theme URI: https://kannsteknicken.de
Author: LGC Media
Author URI: https://kannsteknicken.de
Description: Amazon-Affiliate-Theme für Knicklichter. Enthält Startseiten-Template (front-page.php), Fallback-Template (index.php), Produkt-Grid, Vergleich, DSGVO-Basics. Diese Version enthält keine Bilder – lege deine Bilder in /assets/ ab.
Version: 1.3.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kannsteknicken
*/
:root{
  --bg:#0a0a0a; --txt:#e7fbe7; --muted:#a5bfa5;
  --brand:#0ff44f; --brand-2:#39a0ff;
  --card:#121212; --border:#1e1e1e; --shadow:0 10px 30px rgba(0,0,0,.35); --radius:14px;
}
*{box-sizing:border-box} html,body{background:var(--bg);color:var(--txt);font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;line-height:1.6;margin:0}
img{max-width:100%;height:auto} a{color:var(--brand)} .wrap{max-width:1100px;margin:0 auto;padding:0 16px}
.skip-link{position:absolute;left:-9999px} .skip-link:focus{left:16px;top:16px;padding:8px 12px;background:var(--brand);color:#000;border-radius:8px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,10,10,.7);backdrop-filter:saturate(1.3) blur(10px);border-bottom:1px solid var(--border)}
.site-header .wrap{display:flex;align-items:center;gap:16px;justify-content:space-between;padding:12px 16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none} .nav__toggle{display:none}
.nav__items{display:flex;gap:14px;list-style:none;margin:0;padding:0} .nav__items a{display:block;padding:8px 10px;border-radius:10px;text-decoration:none;color:var(--txt)}
.nav__items a:hover{background:var(--border)}
.hero{background:radial-gradient(1200px 300px at 20% 0%, rgba(15,244,79,.18), transparent 60%), radial-gradient(800px 300px at 80% 10%, rgba(57,160,255,.18), transparent 60%)}
.hero__inner{padding:64px 0 32px} .hero h1{font-size:clamp(28px,4vw,44px);line-height:1.15;margin:0 0 10px} .hero p{max-width:70ch}
.search{display:flex;gap:8px;margin:18px 0} .search input{flex:1;min-width:0;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--txt)}
.search button,.btn{padding:12px 16px;border-radius:12px;border:1px solid var(--border);background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#000;font-weight:700;cursor:pointer;box-shadow:var(--shadow)}
.affiliate-note{color:var(--muted);font-size:.9rem;margin:8px 0 0}
.trust{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:linear-gradient(90deg,rgba(15,244,79,.06),rgba(57,160,255,.06))}
.trust__inner{padding:14px 0} .trust__list{display:flex;gap:24px;justify-content:center;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.banner--header,.banner--footer{background-size:cover;background-position:center}
.banner--header{min-height:180px;border-bottom:1px solid var(--border)}
.banner--footer{min-height:160px;border-top:1px solid var(--border);margin-top:32px}
.products .filters{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0} .products .filters button{padding:8px 12px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--txt);cursor:pointer}
.products .filters button.active{outline:2px solid var(--brand)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px} .card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.card h3{margin:6px 0 4px;font-size:1.05rem} .price{font-weight:800;margin:8px 0}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0} .badge{font-size:.75rem;padding:4px 8px;border-radius:999px;border:1px solid var(--border);background:#141414;color:#a5bfa5}
.badge.is-symbol{border-color:#ffcc00;color:#ffd86a}
.actions{display:flex;gap:8px;margin-top:10px} .btn,.btn-secondary{display:inline-flex;justify-content:center;align-items:center;text-decoration:none}
.btn-secondary{padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:#151515;color:#fff}
.table-scroll{overflow:auto;border:1px solid var(--border);border-radius:var(--radius)} table{border-collapse:collapse;width:100%}
th,td{padding:12px 10px;border-bottom:1px solid var(--border);text-align:left} tbody tr:hover{background:#121212}
.blog{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:8px 0} .blog__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.faq details{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px;margin:8px 0} .faq summary{cursor:pointer;font-weight:700}
.site-footer{border-top:1px solid var(--border);margin-top:0} .site-footer .wrap{padding:18px 0;color:#a5bfa5}
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px;background:#101010;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}
.cookie-banner p{margin:0} .visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
@media (max-width:800px){
  .nav__toggle{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid var(--border);background:#141414;color:#fff}
  .nav__items{display:none;flex-direction:column;position:absolute;right:16px;top:56px;background:#0f0f0f;border:1px solid var(--border);border-radius:12px;padding:8px;min-width:220px}
  .nav__items.show{display:flex}
}