/*
Theme Name: Bildpunktfabrik
Theme URI: https://bildpunktfabrik.de
Author: Bildpunktfabrik
Author URI: https://bildpunktfabrik.de
Description: Eigenes Block-Theme fuer die Bildpunktfabrik-Agenturseite. Industrielle, "Bildpunktfabrik"-inspirierte Gestaltung mit dem Roboter-Maskottchen als Wiedererkennungszeichen. Fokus auf realistische Webprojekte fuer Selbststaendige, Handwerksbetriebe und Vereine.
Requires at least: 6.6
Tested up to: 6.7
Requires PHP: 7.4
Version: 0.2.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bildpunktfabrik
Tags: block-theme, full-site-editing, one-page, portfolio, business

Bildpunktfabrik ist ein handgebautes Block-Theme (Full Site Editing).
Design-Tokens (Farben, Schriften, Abstaende) liegen in theme.json,
diese Datei traegt nur den Theme-Header und ein paar Layout-Helfer,
die sich nicht sauber ueber theme.json abbilden lassen.
*/

/* Pixel-Punkt-Trenner: dezentes Raster-Motiv, das den Markennamen
   ("Bildpunkt") als wiederkehrendes Gestaltungselement aufgreift. */
.is-style-pixel-divider {
	position: relative;
	height: 1px;
	border: none;
	background-image: radial-gradient(currentColor 1.5px, transparent 1.5px);
	background-size: 14px 1px;
	background-repeat: repeat-x;
	color: var(--wp--preset--color--line);
	opacity: 1;
}

/* Fabrikkarte: Karten-Look fuer Leistungen/Prozess-Schritte */
.is-style-fabrikkarte {
	border: 2px solid var(--wp--preset--color--black);
	border-radius: 0;
	box-shadow: 6px 6px 0 0 var(--wp--preset--color--amber);
	transition: transform .15s ease, box-shadow .15s ease;
}
.is-style-fabrikkarte:hover {
	transform: translate(-2px, -2px);
	box-shadow: 8px 8px 0 0 var(--wp--preset--color--amber);
}
/* Gleich hohe Karten in einer Reihe (Leistungen, Referenzen, Blog-Teaser):
   die Spalte/Grid-Zelle stretcht bereits per Flex/Grid-Default, die Karte
   selbst muss diese Hoehe nur noch uebernehmen. */
.is-style-fabrikkarte {
	height: 100%;
	box-sizing: border-box;
}

/* Nummerierte Prozess-Schritte (01, 02, 03 ...) */
.bpf-step-number {
	font-family: var(--wp--preset--font-family--space-grotesk);
	font-weight: 700;
	-webkit-text-stroke: 1.5px var(--wp--preset--color--black);
	color: var(--wp--preset--color--paper);
	line-height: 1;
}

/* Sticky Header */
.bpf-header {
	position: sticky;
	top: 0;
	z-index: 100;
}

/* Skip-Link Position fix bei sticky Header */
.skip-link.screen-reader-text {
	z-index: 1000;
}

/* Bildpunkt-Raster: subtiles Punktmuster, das den Markennamen aufgreift.
   Wird auf Hero- und CTA-Sections als dekorativer Hintergrund eingesetzt. */
.bpf-dotgrid {
	background-image: radial-gradient(rgba(16, 16, 16, 0.16) 2px, transparent 2px);
	background-size: 26px 26px;
	background-position: -6px -6px;
}
.bpf-dotgrid.has-black-background-color {
	background-image: radial-gradient(rgba(251, 184, 7, 0.35) 2px, transparent 2px);
}

/* Robot-Icon Badge, z.B. in der Prozess-Section */
.bpf-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	border: 2px solid var(--wp--preset--color--black);
	background: var(--wp--preset--color--white);
}

@media (max-width: 600px) {
	.bpf-step-number {
		-webkit-text-stroke: 1px var(--wp--preset--color--black);
	}
}