/* ── Inner page components (ported from the static template's per-page styles) ── */

.jc-page-hero {
	position: relative;
	min-height: 340px;
	display: flex;
	align-items: center;
	background: var(--jc-bg-alt);
	border-bottom: 1px solid var(--jc-border-light);
	overflow: hidden;
}
.jc-page-hero::before {
	content: '';
	position: absolute; inset: 0;
	background: linear-gradient(105deg, rgba(161,98,7,0.08) 0%, transparent 55%);
	pointer-events: none;
}
.jc-page-hero__content {
	position: relative; z-index: 1;
	padding: var(--jc-space-9) var(--jc-space-5);
	max-width: 760px;
	color: var(--jc-fg);
}
.jc-page-hero__title {
	font-size: clamp(2rem, 4vw, 3.2rem);
	font-weight: 300;
	color: var(--jc-primary);
	letter-spacing: -0.02em;
	margin-bottom: var(--jc-space-4);
	line-height: 1.1;
}
.jc-page-hero__lead {
	font-size: 1rem;
	font-weight: 300;
	color: var(--jc-muted-fg);
	margin-bottom: var(--jc-space-6);
	line-height: 1.7;
	max-width: 540px;
}
.jc-page-hero__benefits {
	display: flex;
	flex-wrap: wrap;
	gap: var(--jc-space-3) var(--jc-space-6);
	margin-bottom: var(--jc-space-7);
}
.jc-page-hero__benefit {
	display: flex;
	align-items: center;
	gap: var(--jc-space-2);
	font-size: 0.82rem;
	font-weight: 400;
	color: var(--jc-secondary);
	letter-spacing: 0.02em;
}
.jc-page-hero__benefit::before {
	content: '';
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--jc-accent-light);
	flex-shrink: 0;
}

/* Product grid */
.jc-product-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--jc-space-5);
}
@media (max-width: 900px) { .jc-product-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 540px)  { .jc-product-grid { grid-template-columns: 1fr; } }

.jc-product-card {
	background: #fff;
	border: 1px solid var(--jc-border-light);
	transition: box-shadow 220ms, transform 220ms;
	cursor: pointer;
	display: block;
}
.jc-product-card:hover {
	box-shadow: var(--jc-shadow-lg);
	transform: translateY(-3px);
	border-color: var(--jc-accent);
}
.jc-product-card__img {
	aspect-ratio: 3/4;          /* portrait, matches the 800x1200 product photos */
	overflow: hidden;
	background: #fff;
	display: flex; align-items: center; justify-content: center;
}
.jc-product-card__img img {
	width: 100%; height: 100%;
	object-fit: contain;        /* show whole ring, never crop top/bottom */
	object-position: center;
	transition: transform 350ms;
}
.jc-product-card:hover .jc-product-card__img img { transform: scale(1.04); }
.jc-product-card__placeholder {
	width: 100%; height: 100%;
	background: linear-gradient(135deg, #F0EBE1 0%, #E2D9C8 60%, #D4C9B0 100%);
	display: flex; align-items: center; justify-content: center;
}
.jc-product-card__placeholder::after {
	content: '';
	width: 64px; height: 64px;
	border-radius: 50%;
	border: 2px solid rgba(161,98,7,0.3);
}
.jc-product-card__body { padding: var(--jc-space-4) var(--jc-space-5); }
.jc-product-card__title {
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--jc-primary);
	margin-bottom: var(--jc-space-1);
}
.jc-product-card__spec {
	font-size: 0.78rem;
	color: var(--jc-muted-fg);
	margin-bottom: var(--jc-space-3);
	line-height: 1.5;
}
.jc-product-card__price {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--jc-accent);
}

/* Content cols */
.jc-content-cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--jc-space-8);
	align-items: start;
}
@media (max-width: 768px) { .jc-content-cols { grid-template-columns: 1fr; } }
.jc-content-img {
	aspect-ratio: 4/3;
	overflow: hidden;
	background: var(--jc-bg-alt);
}
.jc-content-img img { width:100%;height:100%;object-fit:cover; }
.jc-content-img-placeholder {
	width:100%;height:100%;
	background: linear-gradient(135deg, #F7F7F7 0%, #ECECEC 100%);
	display:flex;align-items:center;justify-content:center;
	min-height: 280px;
}
.jc-content-img-placeholder::after {
	content:'';width:80px;height:80px;border-radius:50%;
	border:1.5px solid rgba(191,164,106,0.35);
}

/* Service icon cards */
.jc-service-icon-grid {
	display: grid;
	grid-template-columns: repeat(4,1fr);
	gap: var(--jc-space-4);
}
@media (max-width:900px) { .jc-service-icon-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width:480px) { .jc-service-icon-grid { grid-template-columns: repeat(2,1fr); } }

.jc-service-icon-card {
	background: #fff;
	border: 1px solid var(--jc-border-light);
	padding: var(--jc-space-6) var(--jc-space-5);
	text-align: center;
	transition: box-shadow 220ms, transform 220ms;
}
.jc-service-icon-card:hover {
	box-shadow: var(--jc-shadow);
	transform: translateY(-2px);
	border-color: var(--jc-accent);
}
.jc-service-icon-card__icon {
	width: 48px; height: 48px;
	margin: 0 auto var(--jc-space-4);
	color: var(--jc-accent);
}
.jc-service-icon-card__title {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--jc-primary);
	letter-spacing: 0.02em;
}

/* Service photo cards (when a Leistung has a featured image) */
.jc-service-photo-card {
	background: #fff;
	border: 1px solid var(--jc-border-light);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow 220ms, transform 220ms, border-color 220ms;
}
.jc-service-photo-card:hover {
	box-shadow: var(--jc-shadow);
	transform: translateY(-2px);
	border-color: var(--jc-accent);
}
.jc-service-photo-card__img {
	aspect-ratio: 4/3;
	background: #f3f3f3;
	overflow: hidden;
}
.jc-service-photo-card__img img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 400ms ease;
}
.jc-service-photo-card:hover .jc-service-photo-card__img img { transform: scale(1.04); }
.jc-service-photo-card__body { padding: var(--jc-space-5); }
.jc-service-photo-card__title {
	font-size: 1rem;
	font-weight: 600;
	color: var(--jc-primary);
	margin: 0 0 var(--jc-space-2);
}
.jc-service-photo-card__text {
	font-size: 0.85rem;
	color: var(--jc-muted-fg);
	line-height: 1.55;
	margin: 0;
}

/* Process steps */
.jc-steps {
	display: grid;
	grid-template-columns: repeat(4,1fr);
	gap: var(--jc-space-5);
	counter-reset: steps;
}
@media (max-width:768px) { .jc-steps { grid-template-columns: repeat(2,1fr); } }
.jc-step { position: relative; }
.jc-step::before {
	counter-increment: steps;
	content: counter(steps);
	display: flex;
	align-items: center; justify-content: center;
	width: 40px; height: 40px;
	border: 1.5px solid var(--jc-accent);
	color: var(--jc-accent);
	font-size: 0.82rem;
	font-weight: 600;
	margin-bottom: var(--jc-space-4);
}
.jc-step__title {
	font-size: 0.95rem;
	font-weight: 600;
	margin-bottom: var(--jc-space-2);
	color: var(--jc-primary);
}
.jc-step__text {
	font-size: 0.85rem;
	color: var(--jc-muted-fg);
	line-height: 1.65;
}

/* Form */
.jc-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--jc-space-4); }
@media (max-width:540px) { .jc-form__row { grid-template-columns: 1fr; } }
.jc-form__field { display: flex; flex-direction: column; gap: var(--jc-space-1); margin-bottom: var(--jc-space-4); }
.jc-form__label { font-size: 0.78rem; font-weight: 600; color: var(--jc-primary); letter-spacing: 0.06em; text-transform: uppercase; }
.jc-form__input {
	padding: 12px 16px;
	border: 1.5px solid var(--jc-border);
	background: #fff;
	font-family: var(--jc-font-sans);
	font-size: 0.9rem;
	color: var(--jc-fg);
	min-height: 44px;
	transition: border-color 150ms;
	border-radius: 0;
	appearance: none;
	width: 100%;
}
.jc-form__input:focus { outline: none; border-color: var(--jc-accent); }
textarea.jc-form__input { resize: vertical; min-height: 120px; }
.jc-form__field--checkbox .jc-form__checkbox-label {
	display: flex; gap: var(--jc-space-3); align-items: flex-start;
	font-size: 0.82rem; color: var(--jc-muted-fg); cursor: pointer; line-height: 1.5;
}
.jc-form__field--checkbox input { flex-shrink: 0; margin-top: 3px; accent-color: var(--jc-accent); }
.jc-form__field--checkbox a { color: var(--jc-accent); text-decoration: underline; }
.jc-form__check {
	display: flex; gap: var(--jc-space-3); align-items: flex-start;
	font-size: 0.82rem; color: var(--jc-muted-fg); cursor: pointer;
	line-height: 1.5; margin-bottom: var(--jc-space-2);
}
.jc-form__check input { flex-shrink: 0; margin-top: 3px; accent-color: var(--jc-accent); }

/* Materials strip */
.jc-materials {
	display: flex; gap: var(--jc-space-3); flex-wrap: wrap;
	margin-top: var(--jc-space-5);
}
.jc-material {
	padding: var(--jc-space-2) var(--jc-space-4);
	border: 1px solid var(--jc-border);
	font-size: 0.78rem; font-weight: 500;
	color: var(--jc-secondary);
	letter-spacing: 0.04em;
	cursor: pointer;
	transition: border-color 150ms, color 150ms, background 150ms;
}
.jc-material:hover, .jc-material.active {
	border-color: var(--jc-accent);
	color: var(--jc-accent);
	background: rgba(161,98,7,0.04);
}

/* Info boxes */
.jc-info-box {
	background: var(--jc-bg-alt);
	border-left: 3px solid var(--jc-accent);
	padding: var(--jc-space-5) var(--jc-space-6);
	margin: var(--jc-space-6) 0;
}
.jc-info-box p { margin: 0; font-size: 0.92rem; color: var(--jc-secondary); line-height: 1.7; }

/* Advantages list */
.jc-advantages { display: flex; flex-direction: column; gap: var(--jc-space-3); }
.jc-advantage {
	display: flex; gap: var(--jc-space-4); align-items: flex-start;
	padding: var(--jc-space-4); border: 1px solid var(--jc-border-light);
	background: #fff;
}
.jc-advantage__dot {
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--jc-accent); flex-shrink: 0; margin-top: 6px;
}
.jc-advantage__title { font-size: 0.92rem; font-weight: 600; margin-bottom: 4px; color: var(--jc-primary); }
.jc-advantage__text  { font-size: 0.85rem; color: var(--jc-muted-fg); line-height: 1.6; margin: 0; }