/* ==========================================================================
   Crunchmas – Seiten-CSS (Page ID 30643)
   Alle Regeln sind auf body.page-id-30643 gescoped, damit nichts andere
   Seiten beeinflusst. Einfach ins Child-Theme legen und einbinden
   (siehe functions.php-Schnipsel).
   ========================================================================== */
:root{
		--crunchmas-cream: #F6F0E4;
	--crunchmas-cream-light: #FBF3E9;
	--crunchmas-forest: #1F3529;
	--crunchmas-bordeaux: #7A1F2B;
	--crunchmas-gold: #C9A24B;
	--crunchmas-text: #241B14;
	--crunchmas-text-muted: #6B5B4E;
	--crunchmas-text-soft: #8A7A68;
	--crunchmas-border: #E4D7BF;
}
body.page-id-30643 {

	background-color: var(--crunchmas-cream);
}

/* ==========================================================================
   Header (Badge, Titel, Intro)
   Als "Extra Class Name" bei der Row: crunchmas-header
   Innerhalb: Text-Element mit Klasse crunchmas-badge fürs Badge,
   Überschrift mit Klasse crunchmas-title, Text mit crunchmas-intro
   ========================================================================== */
body.page-id-30643 #main {
	background-color: var(--crunchmas-cream);
	background-repeat: repeat;
	background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22240%22%20height%3D%22240%22%3E%3Cg%20stroke%3D%22%23C9A24B%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22round%22%20fill%3D%22none%22%3E%3Cg%20transform%3D%22translate%2825%2C35%29%20rotate%2815%29%22%20opacity%3D%220.5%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%28140%2C15%29%20rotate%28-20%29%20scale%280.55%29%22%20opacity%3D%220.35%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%28200%2C90%29%20rotate%2830%29%20scale%281.2%29%22%20opacity%3D%220.3%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%2870%2C150%29%20rotate%28-10%29%20scale%280.7%29%22%20opacity%3D%220.45%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%28180%2C190%29%20rotate%2845%29%20scale%280.9%29%22%20opacity%3D%220.4%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%2815%2C205%29%20rotate%28-35%29%20scale%280.5%29%22%20opacity%3D%220.5%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Ccircle%20cx%3D%22110%22%20cy%3D%22110%22%20r%3D%221.3%22%20fill%3D%22%23C9A24B%22%20stroke%3D%22none%22%20opacity%3D%220.5%22%2F%3E%3Ccircle%20cx%3D%22215%22%20cy%3D%22140%22%20r%3D%221%22%20fill%3D%22%23C9A24B%22%20stroke%3D%22none%22%20opacity%3D%220.4%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
}

body.page-id-30643 .crunchmas-header{
	padding: 56px 40px 48px;
	text-align: center;
}

.crunchmas-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--crunchmas-bordeaux, #7A1F2B);
	color: #F3E3B8;
	padding: 8px 18px;
	border-radius: 999px;
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
}

body.page-id-30643 .crunchmas-title {
	margin: 16px 0 0;
	
	color: var(--crunchmas-text);
}

body.page-id-30643 .crunchmas-intro {
	
	color: #6B4A35;
	max-width: 560px;

	margin: 12px auto 0;
}

/* ==========================================================================
   Produktgrid (WooCommerce-Shortcode [products ...])
   Kein Extra-Class-Name nötig, greift automatisch auf dieser Seite
   ========================================================================== */
body.page-id-30643 ul.products li.product {

}

body.page-id-30643 ul.products li.product .price {
	color: var(--crunchmas-text-soft);
}

/* ==========================================================================
   Dunkler Story-Banner
   Als "Extra Class Name" bei der Row: crunchmas-dark-banner
   Innerhalb: Überschrift mit crunchmas-dark-banner__title,
   Text mit crunchmas-dark-banner__text, Button mit crunchmas-cta
   ========================================================================== */
.crunchmas-dark-banner {
	background-color: var(--crunchmas-forest);
	background-repeat: repeat;
	background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22220%22%20height%3D%22220%22%3E%0A%3Cg%20fill%3D%22%23C9A24B%22%20stroke%3D%22none%22%3E%0A%20%20%3Cg%20transform%3D%22translate%2835%2C40%29%20scale%280.9%29%22%20opacity%3D%220.22%22%3E%3Cpath%20d%3D%22M0%20-7L2%20-2%207%200%202%202%200%207%20-2%202%20-7%200%20-2%20-2Z%22%2F%3E%3C%2Fg%3E%0A%20%20%3Cg%20transform%3D%22translate%28150%2C25%29%20scale%280.55%29%20rotate%2815%29%22%20opacity%3D%220.16%22%3E%3Cpath%20d%3D%22M0%20-7L2%20-2%207%200%202%202%200%207%20-2%202%20-7%200%20-2%20-2Z%22%2F%3E%3C%2Fg%3E%0A%20%20%3Cg%20transform%3D%22translate%28190%2C110%29%20scale%280.7%29%20rotate%28-10%29%22%20opacity%3D%220.2%22%3E%3Cpath%20d%3D%22M0%20-7L2%20-2%207%200%202%202%200%207%20-2%202%20-7%200%20-2%20-2Z%22%2F%3E%3C%2Fg%3E%0A%20%20%3Cg%20transform%3D%22translate%2870%2C160%29%20scale%280.6%29%20rotate%2825%29%22%20opacity%3D%220.18%22%3E%3Cpath%20d%3D%22M0%20-7L2%20-2%207%200%202%202%200%207%20-2%202%20-7%200%20-2%20-2Z%22%2F%3E%3C%2Fg%3E%0A%20%20%3Ccircle%20cx%3D%22110%22%20cy%3D%2270%22%20r%3D%221.6%22%20opacity%3D%220.25%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2220%22%20cy%3D%22120%22%20r%3D%221.3%22%20opacity%3D%220.2%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22180%22%20cy%3D%22190%22%20r%3D%221.5%22%20opacity%3D%220.22%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22130%22%20cy%3D%22200%22%20r%3D%221.2%22%20opacity%3D%220.2%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E');
	padding: 80px 40px;
	text-align: center;
}

.crunchmas-dark-banner__title,
body.single-product h2.crunchmas-dark-banner__title{
	color: var(--crunchmas-cream);

	margin: 0 0 18px;
}

.crunchmas-dark-banner__text {
	color: #E7DCC7;

	max-width: 640px;
	margin: 0 auto 18px;
}

body.page-id-30643 .crunchmas-dark-banner__trust {
	color: #D9C48A;
	font-size: 13px;
	letter-spacing: 0.04em;
	margin-bottom: 8px;
}

body.page-id-30643 .crunchmas-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--crunchmas-gold);
	color: var(--crunchmas-forest);
	padding: 12px 28px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
}

body.page-id-30643 .crunchmas-cta:hover {
	background: #B8862E;
	color: var(--crunchmas-cream);
}

/* ==========================================================================
   Lieferung & Abholung
   Als "Extra Class Name" bei der Row: crunchmas-delivery
   Innerhalb: crunchmas-delivery__eyebrow (kleiner Text über der
   Überschrift), 3 Spalten/Boxen jeweils mit crunchmas-delivery__card
   ========================================================================== */
body.page-id-30643 .crunchmas-delivery {
	background: #EBE4D8;
	padding: 72px 40px;
}

body.page-id-30643 .crunchmas-delivery__eyebrow {
	display: block;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--crunchmas-text-soft);
	margin-bottom: 12px;
}

body.page-id-30643 .crunchmas-delivery h3 {
	margin: 0 0 28px;
	
	
	color: var(--crunchmas-text);
	font-family: Georgia, 'Times New Roman', serif;
}

body.page-id-30643 .crunchmas-delivery__card {
	background: #ffffff;
	border-radius: 8px;
	padding: 32px 28px;
}

body.page-id-30643 .crunchmas-delivery__card .crunchmas-delivery__label {
	display: block;
	font-size: 19px;
	font-weight: 600;
	color: var(--crunchmas-text);
	font-family: Georgia, 'Times New Roman', serif;
	margin-bottom: 10px;
}

body.page-id-30643 .crunchmas-delivery__card p {

	color: var(--crunchmas-text-muted);

	margin: 0;
}

/* ==========================================================================
   Einzelproduktseiten von Weihnachts-Produkten
   Dezenter Creme-Hintergrund + Schneeflocken-Muster, gleiche Optik wie
   die Crunchmas-Seite. Der Badge (.crunchmas-badge, oben global definiert)
   wird per functions.php automatisch vor dem Produkttitel ausgegeben.
   ========================================================================== */
body.crunchmas-product {
	background-color: #F6F0E4;
	background-repeat: repeat;
	background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22240%22%20height%3D%22240%22%3E%3Cg%20stroke%3D%22%23C9A24B%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22round%22%20fill%3D%22none%22%3E%3Cg%20transform%3D%22translate%2825%2C35%29%20rotate%2815%29%22%20opacity%3D%220.5%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%28140%2C15%29%20rotate%28-20%29%20scale%280.55%29%22%20opacity%3D%220.35%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%28200%2C90%29%20rotate%2830%29%20scale%281.2%29%22%20opacity%3D%220.3%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%2870%2C150%29%20rotate%28-10%29%20scale%280.7%29%22%20opacity%3D%220.45%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%28180%2C190%29%20rotate%2845%29%20scale%280.9%29%22%20opacity%3D%220.4%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate%2815%2C205%29%20rotate%28-35%29%20scale%280.5%29%22%20opacity%3D%220.5%22%3E%3Cpath%20d%3D%22M0%20-8v16M-6.9%20-4l13.8%208M6.9%20-4l-13.8%208%22%2F%3E%3C%2Fg%3E%3Ccircle%20cx%3D%22110%22%20cy%3D%22110%22%20r%3D%221.3%22%20fill%3D%22%23C9A24B%22%20stroke%3D%22none%22%20opacity%3D%220.5%22%2F%3E%3Ccircle%20cx%3D%22215%22%20cy%3D%22140%22%20r%3D%221%22%20fill%3D%22%23C9A24B%22%20stroke%3D%22none%22%20opacity%3D%220.4%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
}

body.crunchmas-product .crunchmas-badge {
	margin-bottom: 12px;
}

/* ==========================================================================
   Feine goldene Trennlinie mit Schneeflocke, z. B. unter Sektions-
   Überschriften auf Weihnachts-Produktseiten. Global nutzbar (kein
   Extra-Class-Name-Umweg nötig), einfach dieses HTML einfügen:
   <div class="crunchmas-divider"><span>&#10052;</span></div>
   ========================================================================== */
.crunchmas-divider {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 14px 0 22px;
	color: #C9A24B;
}

.crunchmas-divider::before,
.crunchmas-divider::after {
	content: "";
	flex: 1;
	height: 1px;
	background: #C9A24B;
	opacity: 0.5;
}

.crunchmas-divider span {
	font-size: 15px;
	line-height: 1;
}