/*
 * windel-eimer.de – custom visual identity
 * Ratgeber · Vergleich · Affiliate für Windeleimer
 *
 * Palette:
 *   --wd-linen     #FAF6EF  Hintergrund
 *   --wd-ink       #2E2A26  Text
 *   --wd-sage      #6B8F71  Marke / Navigation / Links
 *   --wd-sage-dark #52705A  Hover-Zustand Sage
 *   --wd-clay      #D98E5C  CTA / Affiliate-Buttons
 *   --wd-clay-dark #C97A45  Hover-Zustand Clay
 *   --wd-sand      #F1E9DD  Karten / Boxen-Hintergrund
 *
 * Typo:
 *   Display: 'Fraunces' (warm, editorial Serife – Ratgeber-Charakter)
 *   Body/UI: 'Inter' (klar, gut lesbar – für Vergleichstabellen & Boxen)
 */

:root {
	--wd-linen: #FAF6EF;
	--wd-ink: #2E2A26;
	--wd-sage: #6B8F71;
	--wd-sage-dark: #52705A;
	--wd-clay: #D98E5C;
	--wd-clay-dark: #C97A45;
	--wd-sand: #F1E9DD;
}

/* ---------- Base ---------- */
body {
	background-color: var(--wd-linen);
	color: var(--wd-ink);
	font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .es-product-title-wrap, .site-title,
.woocommerce-loop-product__title, .product_title {
	font-family: 'Fraunces', serif;
	font-weight: 600;
	color: var(--wd-ink);
	letter-spacing: -0.01em;
}

a { color: var(--wd-sage-dark); }
a:hover, a:focus, a:active,
.woocommerce .price_label,
.woocommerce.single-product div.product .price,
.price, .woocommerce ul.products li.product .price {
	color: var(--wd-clay-dark) !important;
}

/* ---------- Signature: "Siegel"-Ring hinter Seitenüberschriften ---------- */
.custom-header .breadcrumb-trail,
.page .entry-header, .single .entry-header {
	position: relative;
}
.page .entry-header::before, .single .entry-header::before {
	content: "";
	position: absolute;
	top: -12px;
	left: -8px;
	width: 56px;
	height: 56px;
	border: 2px solid var(--wd-sage);
	border-radius: 50%;
	opacity: 0.35;
	z-index: 0;
}

/* ---------- Header / Navigation ---------- */
.es-main-menu-wrapper .mt-container,
#site-navigation ul.sub-menu,
#site-navigation ul.children,
.is-sticky .es-main-menu-wrapper,
#masthead .site-header-cart .cart-contents:hover,
.widget_search .search-submit,
#es-scrollup,
.easy_store_social_media a,
.widget .tagcloud a:hover,
.widget_tag_cloud .tagcloud a:hover {
	background: var(--wd-sage) !important;
}

#site-navigation ul li.current-menu-item > a,
#site-navigation ul li:hover > a,
#site-navigation ul li.current_page_ancestor > a,
#site-navigation ul li.current_page_item > a,
.home .es-home-icon a,
.es-home-icon a:hover {
	background: var(--wd-sage-dark) !important;
}

@media (max-width:768px){
	.es-main-menu-wrapper #site-navigation{ background: var(--wd-sage) !important; }
}

/* ---------- Buttons / CTAs (Affiliate-Fokus) ---------- */
.navigation .nav-links a,
.bttn, button, input[type='button'], input[type='reset'], input[type='submit'],
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.atkp-button {
	background-color: var(--wd-clay) !important;
	border-color: var(--wd-clay) !important;
	color: #fff !important;
	border-radius: 999px !important;
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	transition: background-color 0.2s ease, transform 0.15s ease;
}

.navigation .nav-links a:hover,
.bttn:hover, button:hover, input[type='button']:hover, input[type='reset']:hover, input[type='submit']:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover,
.atkp-button:hover {
	background-color: var(--wd-clay-dark) !important;
	border-color: var(--wd-clay-dark) !important;
	transform: translateY(-1px);
}

/* ---------- Karten / Produktboxen (Vergleich) ---------- */
.atkp-box {
	background-color: #fff !important;
	border: 1px solid var(--wd-sand) !important;
	border-radius: 14px !important;
	box-shadow: 0 2px 10px rgba(46, 42, 38, 0.06);
}
.atkp-ribbon span {
	background: var(--wd-clay) !important;
	border-radius: 999px;
}

.woocommerce ul.products li.product,
.product {
	background-color: #fff;
	border-radius: 14px;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.woocommerce ul.products li.product:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(46, 42, 38, 0.08);
}

.woocommerce span.onsale, .woocommerce ul.products li.product .onsale {
	background: var(--wd-clay) !important;
	border-radius: 999px;
}

/* ---------- Kategorie-Hubs / Sidebar ---------- */
.custom-header .breadcrumb-trail.breadcrumbs ul li a { color: var(--wd-sage-dark); }
.custom-header .breadcrumb-trail.breadcrumbs ul li a:hover { color: var(--wd-clay-dark); }

.entry-content-wrapper .entry-title a:hover,
.main-post-wrap .blog-content-wrapper .news-title a:hover,
.list-posts-wrap .blog-content-wrapper .news-title a:hover {
	color: var(--wd-clay-dark) !important;
}

/* ---------- Footer ---------- */
#footer-navigation ul li a:hover { color: var(--wd-sage); }

/* ---------- Hub-Seiten: Intro & Karten-Grid ---------- */
.wd-hub-intro {
	font-family: 'Fraunces', serif;
	font-size: 1.15em;
	font-style: italic;
	line-height: 1.6;
	color: var(--wd-ink);
	background: var(--wd-sand);
	border-left: 4px solid var(--wd-sage);
	padding: 1.2em 1.5em;
	border-radius: 0 12px 12px 0;
	margin-bottom: 1.8em;
}

.wd-hub-heading {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin-top: 1.6em;
	margin-bottom: 0.8em;
}
.wd-hub-heading .wd-hub-heading-icon { font-size: 1.1em; }

.wd-hub-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 14px;
	list-style: none;
	margin: 0 0 2em 0;
	padding: 0;
}

.wd-hub-card {
	display: flex;
	align-items: flex-start;
	gap: 0.7em;
	background: #fff;
	border: 1px solid var(--wd-sand);
	border-left: 4px solid var(--wd-sage);
	border-radius: 10px;
	padding: 14px 16px;
	text-decoration: none !important;
	color: var(--wd-ink) !important;
	font-weight: 600;
	line-height: 1.35;
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.wd-hub-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(46, 42, 38, 0.08);
	border-left-color: var(--wd-clay);
	color: var(--wd-clay-dark) !important;
}
.wd-hub-card-icon {
	font-size: 1.4em;
	line-height: 1;
	flex-shrink: 0;
}

.wd-hub-related {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.wd-hub-related a {
	display: inline-block;
	background: var(--wd-sand);
	color: var(--wd-sage-dark) !important;
	text-decoration: none !important;
	padding: 8px 16px;
	border-radius: 999px;
	font-size: 0.92em;
	font-weight: 600;
	transition: background 0.15s ease, color 0.15s ease;
}
.wd-hub-related a:hover {
	background: var(--wd-sage);
	color: #fff !important;
}