/* LinenLounge Magazin. Brand-Tokens, mobile-first. */

:root {
	--ll-green:  #455644;
	--ll-border: #DDD5C8;
	--ll-bg:     #F7F6F2;
	--ll-hover:  #8CA28B;
	--ll-gold:   #E79533;
	--ll-font:   "Source Sans 3", system-ui, -apple-system, sans-serif;
}

.ll-magazin-body,
.ll-summary,
.ll-toc,
.ll-cta {
	font-family: var(--ll-font);
}

/* Zusammenfassung */
.ll-summary {
	font-size: 1.15rem;
	line-height: 1.7;
	color: var(--ll-green);
	margin: 1.5rem 0 2rem;
}

/* Inhaltsverzeichnis */
.ll-toc {
	background: var(--ll-bg);
	border: 1px solid var(--ll-border);
	border-radius: 8px;
	padding: 1.25rem 1.5rem;
	margin: 0 0 2.5rem;
}
.ll-toc-title {
	display: block;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	font-size: .8rem;
	color: var(--ll-green);
	margin-bottom: .75rem;
}
.ll-toc ul { list-style: none; margin: 0; padding: 0; }
.ll-toc li { margin: .35rem 0; }
.ll-toc a {
	color: var(--ll-green);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color .2s;
}
.ll-toc a:hover { border-color: var(--ll-hover); }

/* Text */
.ll-block-text { margin: 0 0 2rem; }
.ll-h2 {
	color: var(--ll-green);
	font-size: 1.6rem;
	line-height: 1.3;
	margin: 2rem 0 1rem;
	scroll-margin-top: 90px; /* Sprungmarken sauber unter dem Sticky-Header */
}
.ll-text { line-height: 1.75; color: #2a2a2a; }
.ll-text p { margin: 0 0 1rem; }

/* Produkt-Bild (editorial): Bild, Titel drauf, ein Button drunter */
.ll-block-produkt {
	position: relative;
	min-height: 60vh;
	background-size: cover;
	background-position: center;
	border-radius: 10px;
	overflow: hidden;
	margin: 2.5rem 0;
	display: flex;
	align-items: flex-end;
}
.ll-block-produkt::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,.7) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,0) 75%);
}
.ll-produkt-overlay {
	position: relative;
	z-index: 1;
	padding: 2rem;
	color: #fff;
}
.ll-produkt-headline {
	font-size: 1.5rem;
	line-height: 1.25;
	margin: 0 0 1rem;
	color: #fff !important;
	max-width: 22ch;
	text-shadow: 0 1px 12px rgba(0,0,0,.55);
}
.ll-produkt-btn,
.ll-cta-btn {
	display: inline-block;
	background: var(--ll-green);
	color: #fff !important;
	text-decoration: none;
	padding: .7rem 1.4rem;
	border-radius: 4px;
	font-weight: 600;
	font-size: .95rem;
	transition: background .2s;
}
.ll-produkt-btn:hover,
.ll-cta-btn:hover {
	background: var(--ll-hover);
	color: #fff !important;
}

/* FAQ */
.ll-block-faq { margin: 2.5rem 0; }
.ll-faq-item {
	border-bottom: 1px solid var(--ll-border);
}
.ll-faq-item summary {
	cursor: pointer;
	padding: .9rem 0;
	font-weight: 600;
	color: var(--ll-green);
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.ll-faq-item summary::-webkit-details-marker { display: none; }
.ll-faq-item summary::after {
	content: "";
	flex: 0 0 auto;
	width: 9px;
	height: 9px;
	margin-left: 1rem;
	margin-top: -4px;
	border-right: 2px solid #1a1a1a;
	border-bottom: 2px solid #1a1a1a;
	transform: rotate(45deg);
	transition: transform .2s;
}
.ll-faq-item[open] summary::after {
	transform: rotate(-135deg);
	margin-top: 4px;
}
.ll-faq-antwort { padding: 0 0 1rem; line-height: 1.7; color: #2a2a2a; }

/* Direkter CTA. Genau ein Button. */
.ll-cta {
	background: var(--ll-bg);
	border: 1px solid var(--ll-border);
	border-radius: 10px;
	padding: 1.75rem;
	text-align: center;
	margin: 0 0 2.5rem;
}
.ll-cta-headline {
	font-size: 1.2rem;
	color: var(--ll-green);
	margin: 0 0 1rem;
}

/* Mobil (63 % des Traffics) */
@media (max-width: 640px) {
	.ll-block-produkt { min-height: 70vh; }
	.ll-produkt-overlay { padding: 1.25rem; }
	.ll-produkt-headline { font-size: 1.25rem; }
	.ll-h2 { font-size: 1.4rem; }
	.ll-summary { font-size: 1.05rem; }
}