/* Helm Design & Art – Galerie & Shop */
:root {
	--helm-ink: #1d1d1b;
	--helm-muted: #6b6b66;
	--helm-line: #e4e1da;
	--helm-available: #1f7a3a;
	--helm-reserved: #9a6700;
	--helm-sold: #a1261c;
}

/* Status-Hinweise */
.helm-badge {
	display: inline-block;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: .25em .7em;
	border-radius: 999px;
	border: 1px solid currentColor;
	line-height: 1.4;
	background: #fff;
}
.helm-badge--verfuegbar { color: var(--helm-available); }
.helm-badge--reserviert { color: var(--helm-reserved); }
.helm-badge--verkauft   { color: var(--helm-sold); }

.woocommerce ul.products li.product .helm-badge { margin: .6em 0 .2em; }
.helm-single-status { margin-bottom: .8em; }
.helm-note { color: var(--helm-muted); font-size: .95em; }

/* Galerie */
.helm-gallery { display: grid; gap: 3.5rem; margin: 2rem 0; }
.helm-gallery--zeilen .helm-artwork {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	gap: 2.5rem;
	align-items: center;
}
.helm-gallery--zeilen .helm-artwork:nth-child(even) .helm-artwork__image { order: 2; }
.helm-gallery--raster { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2rem; }
.helm-gallery--raster .helm-artwork__text { padding-top: .8rem; }
.helm-gallery--raster .helm-artwork__desc { display: none; }
.helm-gallery--raster .helm-button { font-size: .9rem; }
.helm-instagram-wrap { margin: 1.5rem 0; }
.helm-footer-bar .helm-instagram-wrap { margin: 0; }

.helm-artwork__image { display: block; overflow: hidden; background: #f4f2ee; }
.helm-artwork__image img { display: block; width: 100%; height: auto; transition: transform .4s ease; }
.helm-artwork__image:hover img { transform: scale(1.02); }
.helm-artwork--verkauft .helm-artwork__image img { filter: grayscale(.35); }
.helm-artwork__title { margin: .5em 0 .3em; }
.helm-artwork__desc p { margin: .4em 0; }

.helm-details { display: grid; grid-template-columns: auto 1fr; gap: .15em 1em; margin: .6em 0; font-size: .95em; }
.helm-details dt { color: var(--helm-muted); }
.helm-details dd { margin: 0; }

.helm-price { font-weight: 600; margin: .8em 0; }
.helm-price__frame { font-weight: 400; color: var(--helm-muted); }

.helm-button {
	display: inline-block;
	padding: .65em 1.2em;
	border: 1px solid var(--helm-ink);
	color: var(--helm-ink);
	text-decoration: none;
	transition: background .2s, color .2s;
}
.helm-button:hover, .helm-button:focus { background: var(--helm-ink); color: #fff; }
a.helm-loop-button, .woocommerce a.helm-loop-button {
	display: inline-block; font-size: .9rem; padding: .55em 1.1em; margin-top: .6em;
	border: 1px solid var(--helm-ink); color: var(--helm-ink); background: transparent;
	text-decoration: none; border-radius: 0;
}
a.helm-loop-button:hover { background: var(--helm-ink); color: #fff; }

@media (max-width: 760px) {
	.helm-gallery--zeilen .helm-artwork { grid-template-columns: 1fr; gap: 1rem; }
	.helm-gallery--zeilen .helm-artwork:nth-child(even) .helm-artwork__image { order: 0; }
}

/* Rahmen-Auswahl */
.helm-frame { border: 1px solid var(--helm-line); padding: .8em 1em; margin: 0 0 1.2em; width: 100%; }
.helm-frame legend { font-weight: 600; padding: 0 .3em; }
.helm-frame label { display: flex; flex-wrap: wrap; gap: .4em; align-items: baseline; margin: .3em 0; cursor: pointer; }
.helm-frame small { color: var(--helm-muted); }
.helm-frame__price { margin-left: auto; font-weight: 600; }

/* Instagram */
.helm-instagram {
	display: inline-flex; align-items: center; gap: .5em;
	padding: .55em 1em; border: 1px solid currentColor; border-radius: 999px;
	text-decoration: none; color: inherit;
}
.helm-instagram:hover { opacity: .8; }
.helm-instagram-float {
	position: fixed; right: 18px; bottom: 18px; z-index: 9990;
	width: 48px; height: 48px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: var(--helm-ink); color: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.2);
}
.helm-instagram-float svg { width: 24px; height: 24px; }
.helm-instagram-float:hover { color: #fff; transform: translateY(-2px); }

/* Rechtliches */
.helm-footer-bar {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem;
	padding: 2rem 16px 5rem; border-top: 1px solid var(--helm-line); font-size: .9rem;
	max-width: 1200px; margin: 3rem auto 0;
}
.helm-footer-brand { font-weight: 600; }
.helm-legal { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }
.helm-legal a { color: inherit; }

/* Kasse */
.helm-shipping-note td { font-size: .9em; color: var(--helm-muted); }
.helm-thankyou { border-left: 3px solid var(--helm-ink); padding: .6em 1em; margin: 1em 0 2em; background: #f7f6f3; }

/* Lightbox */
.helm-lightbox {
	position: fixed; inset: 0; z-index: 99999; background: rgba(15,15,15,.92);
	display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px;
}
.helm-lightbox img { max-width: 100%; max-height: 85vh; object-fit: contain; }
.helm-lightbox p { color: #eee; margin-top: .8em; }
.helm-lightbox button {
	position: absolute; top: 12px; right: 16px; background: none; border: 0; color: #fff; font-size: 2rem; cursor: pointer;
}

/* ---------- Kontaktformular ---------- */
.helm-form { max-width: 820px; margin: 2rem 0; }
.helm-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 1.4rem; }
.helm-form__field { display: flex; flex-direction: column; gap: .4rem; margin: 0; }
.helm-form__field--wide { grid-column: 1 / -1; }
.helm-form label { font-weight: 600; font-size: .95rem; }
.helm-form label small { font-weight: 400; color: var(--helm-muted); }
.helm-form input[type="text"], .helm-form input[type="email"], .helm-form input[type="tel"], .helm-form select, .helm-form textarea {
	width: 100%; box-sizing: border-box; font: inherit; padding: .8em 1em;
	border: 1.5px solid var(--helm-line); border-radius: 10px; background: rgba(255, 255, 255, .7); color: inherit;
}
.helm-form input:focus, .helm-form select:focus, .helm-form textarea:focus { outline: 2px solid var(--accent, var(--helm-ink)); outline-offset: 1px; }
.helm-form [aria-invalid="true"] { border-color: #c0392b; }
.helm-form__error { color: #c0392b; font-size: .88rem; }
.helm-form__alert { border-left: 4px solid #c0392b; background: rgba(192, 57, 43, .08); padding: .8em 1em; margin-bottom: 1.2rem; }
.helm-form__consent { margin: 1.4rem 0 1rem; font-size: .92rem; }
.helm-form__consent label { display: flex; gap: .7em; align-items: flex-start; font-weight: 400; }
.helm-form__consent input { margin-top: .25em; width: 1.1em; height: 1.1em; flex-shrink: 0; }
.helm-form__submit { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.helm-form__submit small { color: var(--helm-muted); }
.helm-form__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.helm-form--done { border: 2px solid var(--helm-available); padding: 1.4rem 1.6rem; border-radius: 12px; }
.helm-form__done-title { font-size: 1.4rem; font-weight: 700; margin: 0 0 .3rem; }
.helm-question { margin-top: 1.2rem; font-size: .95rem; }
@media (max-width: 640px) { .helm-form__grid { grid-template-columns: 1fr; } }

/* ---------- Über mich ---------- */
.helm-portrait { margin: 0; position: relative; }
.helm-portrait img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.helm-portrait figcaption { font-size: .85rem; color: var(--helm-muted); margin-top: .5rem; }
.helm-portrait--empty span { display: block; aspect-ratio: 4 / 5; background: linear-gradient(135deg, #e9e2d5, #d8cfbf); }
.helm-kicker { text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; font-weight: 600; color: var(--helm-muted); margin-bottom: .6rem; }
.helm-lead { font-size: 1.2rem; line-height: 1.6; }
.helm-about-cards { gap: 1.5rem !important; margin-top: 3rem !important; }
.helm-about-card { padding: 1.8rem; border: 1.5px solid var(--helm-line); border-radius: 16px; }
.helm-about-steps { counter-reset: helm-step; list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1.2rem; }
.helm-about-steps li { counter-increment: helm-step; padding: 1.2rem 1.2rem 1.2rem 1.2rem; border-top: 3px solid var(--accent, var(--helm-ink)); }
.helm-about-steps li::before { content: "0" counter(helm-step); display: block; font-size: 2rem; font-weight: 800; line-height: 1; margin-bottom: .5rem; }
.helm-about-steps strong { display: block; margin-bottom: .2rem; }
.helm-about-cta { text-align: center; padding: 3rem 1.5rem; margin-top: 3rem !important; border-radius: 20px; background: rgba(0, 0, 0, .04); }
.helm-about-cta__links { display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem; }
.helm-contact-direct { margin-top: 2rem; }
