/*
Theme Name: Haushaltshilfe SBH
Theme URI: https://www.haushaltshilfe-sbh.de/
Description: Regionales Childtheme für Haushaltshilfe und Alltagshilfe im Schwarzwald-Baar-Kreis.
Author: TBS
Template: tbs-affiliate-neon
Version: 1.0.0
Text Domain: haushaltshilfe-sbh
*/

:root {
	--hh-forest: #173f37;
	--hh-forest-soft: #2d675b;
	--hh-cream: #fbf7ee;
	--hh-sand: #ead8bd;
	--hh-coral: #d66d4f;
	--hh-ink: #172621;
}
html, body { overflow-x: hidden; }
body { background: var(--hh-cream); color: var(--hh-ink); }
.site-header { background: rgba(18, 48, 42, .98); border-bottom-color: var(--hh-sand); }
.site-title a, .main-navigation a { color: #fff; }
.site-description { color: #deebe5; }
.site-search-bar { background: #f1e7d8; border-color: #d8c2a2; }
.site-search-bar__form input { background: #fff; border-color: #bda27a; color: var(--hh-ink); }
.site-search-bar__form button { background: var(--hh-coral); color: #fff; }

.hh-home { width: 100%; max-width: none; padding: 0; }
.hh-hero { min-height: clamp(570px, 68vw, 780px); position: relative; display: grid; align-items: center; overflow: hidden; isolation: isolate; }
.hh-hero__image, .hh-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hh-hero__image { object-fit: cover; z-index: -2; transition: opacity .75s ease; }
.hh-hero__image.is-changing { opacity: 0; }
.hh-hero__shade { z-index: -1; background: linear-gradient(90deg, rgba(12,35,30,.9) 0%, rgba(12,35,30,.69) 42%, rgba(12,35,30,.08) 72%); }
.hh-hero__content, .hh-section { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.hh-hero__content { padding: 76px 0; color: #fff; }
.hh-eyebrow { margin: 0 0 12px; color: #f3bb68; text-transform: uppercase; letter-spacing: .15em; font-size: .82rem; font-weight: 850; }
.hh-hero h1 { max-width: 780px; margin: 0; color: #fff; font-size: clamp(2.6rem, 6vw, 5.4rem); line-height: 1; letter-spacing: -.04em; }
.hh-hero__lead { max-width: 700px; font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.65; }
.hh-search { display: flex; max-width: 720px; gap: 10px; margin-top: 28px; padding: 8px; border-radius: 18px; background: rgba(255,255,255,.95); box-shadow: 0 18px 50px rgba(0,0,0,.2); }
.hh-search input { flex: 1; min-width: 0; border: 0; padding: 13px 16px; background: transparent; color: var(--hh-ink); }
.hh-search button, .hh-button { border: 0; border-radius: 12px; padding: 13px 20px; background: var(--hh-coral); color: #fff; font-weight: 850; text-decoration: none; }
.hh-section { padding: 74px 0; }
.hh-section h2 { margin: 0 0 18px; color: var(--hh-forest); font-size: clamp(2rem, 4vw, 3.35rem); line-height: 1.08; }
.hh-intro { max-width: 820px; font-size: 1.12rem; line-height: 1.75; }
.hh-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 34px; }
.hh-cards article { padding: 27px; background: #fff; border: 1px solid #e2d4c0; border-radius: 22px; box-shadow: 0 18px 45px rgba(34,74,63,.08); }
.hh-cards span { display: inline-grid; place-items: center; width: 45px; height: 45px; border-radius: 50%; background: #e5f0eb; color: var(--hh-forest); font-weight: 900; }
.hh-cards h3 { color: var(--hh-forest); margin: 17px 0 8px; }
.hh-cards p { color: #385149; }
.hh-partner { background: var(--hh-forest); color: #eff7f3; }
.hh-partner .hh-section { display: grid; grid-template-columns: 1.25fr .75fr; gap: 50px; align-items: center; }
.hh-partner h2 { color: #fff; }
.hh-partner__copy > p:not(.hh-eyebrow) { max-width: 750px; line-height: 1.72; }
.hh-disclosure { font-size: .9rem; color: #c9ddd5; }
.hh-button { display: inline-flex; margin-top: 12px; }
.hh-partner__steps { display: grid; gap: 12px; }
.hh-partner__steps div { display: flex; align-items: center; gap: 14px; padding: 16px; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background: rgba(255,255,255,.07); }
.hh-partner__steps strong { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border-radius: 50%; background: #f3bb68; color: var(--hh-ink); }
.hh-latest { background: #e7f0eb; }
.hh-latest .posts-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 360px)); margin-top: 30px; }
.hh-latest .post-card {
	width: 100%;
	background: #fff;
	border-color: #ca8fc4;
	box-shadow: 0 16px 36px rgba(22, 63, 55, .14);
}
.hh-latest .post-card__body { color: #20342f; }
.hh-latest .post-card__title a { color: #075d6f; }
.hh-latest .post-card__title a:hover, .hh-latest .post-card__title a:focus-visible { color: #873073; text-shadow: none; }
.hh-latest .post-card__meta { color: #53645f; font-weight: 650; }
.hh-latest .post-card__excerpt { color: #263a35; }
.hh-latest .post-card__more { color: #075d6f; }
.hh-latest .post-card__title { font-size: clamp(1.25rem, 2vw, 1.55rem); line-height: 1.25; overflow-wrap: anywhere; }
.hh-more { display: inline-block; margin-top: 28px; color: var(--hh-forest); font-weight: 850; }

.hh-related-products { margin: clamp(3rem, 7vw, 5rem) 0 1rem; padding: clamp(1.35rem, 3vw, 2.5rem); border: 1px solid #b8d0c6; border-radius: 24px; background: #edf5f1; color: #20342f; }
.hh-related-products__head { max-width: 800px; }
.hh-related-products__head h2 { margin: 0 0 .65rem; color: var(--hh-forest); font-size: clamp(1.55rem, 3vw, 2.3rem); }
.hh-related-products__head > p:not(.hh-eyebrow) { margin: 0; color: #3d544d; }
.hh-related-products__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.hh-product-card { overflow: hidden; border: 1px solid #bdd1c7; border-radius: 18px; background: #fff; box-shadow: 0 10px 25px rgba(22, 63, 55, .1); }
.hh-product-card__image { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; padding: 12px; background: #f7fbf8; }
.hh-product-card__image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.hh-product-card__body { padding: 18px; }
.hh-product-card h3 { margin: 0 0 .6rem; color: #18483e; font-size: 1.05rem; line-height: 1.3; }
.hh-product-card p { margin: 0 0 1rem; color: #40564f; font-size: .92rem; line-height: 1.5; }
.hh-product-card__link { color: #075d6f; font-weight: 850; }

@media (max-width: 1050px) {
	.hh-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
	.hh-hero { min-height: 680px; align-items: end; }
	.hh-hero__shade { background: linear-gradient(0deg, rgba(12,35,30,.94) 0%, rgba(12,35,30,.62) 64%, rgba(12,35,30,.12) 100%); }
	.hh-hero__content, .hh-section { width: min(100% - 28px, 1180px); }
	.hh-search { flex-direction: column; }
	.hh-cards, .hh-partner .hh-section { grid-template-columns: 1fr; }
	.hh-related-products__grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.hh-hero__image { transition: none; }
}
