/*
Theme Name: hse-solution
Text Domain: hse-solution
Description: Individuelles HSE-SOLUTION Theme für die sicherheitstechnische Betreuung kleiner Betriebe.
Version: 1.0.15
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
WPVibe: yes
*/

html { scroll-behavior: smooth; }

/* Hero refinement inspired by the approved HSE-SOLUTION concept */
.hse-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: 560px;
	padding: 54px 0 0 !important;
	background: #eef3f4 !important;
}
.hse-office-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 48%;
	filter: saturate(.96) brightness(1.01);
	transform: scale(1.01);
	pointer-events: none;
}
.hse-hero::before { content: none !important; }
.hse-hero::after {
	content: "" !important;
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 1;
	background:
		linear-gradient(90deg, rgba(247,248,248,.24) 0%, rgba(247,248,248,.15) 34%, rgba(247,248,248,.05) 58%, rgba(247,248,248,0) 82%),
		linear-gradient(180deg, rgba(255,255,255,.025) 0%, rgba(255,255,255,0) 100%) !important;
}
.hse-hero-grid {
	position: relative;
	z-index: 2;
	grid-template-columns: 1.05fr .95fr !important;
	gap: 28px !important;
	align-items: end !important;
}
.hse-hero-copy { padding: 8px 0 40px; }
.hse-hero .hse-kicker { margin-bottom: 10px; color: #0b2742; }
.hse-hero h1 {
	font-size: clamp(2.8rem,5vw,4.6rem) !important;
	line-height: .98 !important;
	letter-spacing: -.03em !important;
	color: #0b2742 !important;
	max-width: 690px !important;
}
.hse-hero h1 span { display: inline-block; margin-top: .20em; color: #2ea63a !important; }
.hse-hero .hse-lead {
	margin-top: 18px !important;
	max-width: 660px;
	font-size: 1.08rem !important;
	line-height: 1.55 !important;
	color: #4c5b63 !important;
}
.hse-trust-row {
	margin-top: 18px !important;
	gap: 14px 22px !important;
	font-size: .98rem !important;
	color: #183a58 !important;
}
.hse-trust-row span {
	display: inline-flex;
	align-items: center;
	max-width: 180px;
	line-height: 1.25;
}
.hse-trust-row span::before {
	display: inline-grid;
	place-items: center;
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	margin-right: 8px !important;
	border-radius: 999px;
	background: #2eaf45;
	color: #fff !important;
	font-size: .72rem;
}
.hse-actions { margin-top: 20px !important; gap: 12px !important; }
.hse-actions .hse-button { min-height: 46px; padding: 14px 22px !important; border-radius: 14px !important; font-weight: 600 !important; }
.hse-actions .hse-button-primary { box-shadow: 0 10px 26px rgba(46,175,69,.18) !important; }
.hse-actions .hse-button-ghost { background: rgba(255,255,255,.74) !important; backdrop-filter: blur(4px); border-color: rgba(23,58,95,.28) !important; }
.hse-portrait-card {
	min-height: 0 !important;
	height: 500px;
	border-radius: 0 !important;
	overflow: visible !important;
	background: transparent !important;
	box-shadow: none !important;
}
.hse-hero-photo {
	position: absolute;
	bottom: 0;
	left: 5%;
	width: min(78%,490px);
	height: auto;
	max-height: 490px;
	transform: translateY(6px);
	object-fit: contain;
	object-position: bottom center;
	display: block;
	filter: drop-shadow(0 16px 28px rgba(24,43,57,.10));
}
.hse-hero-note {
	right: 0 !important;
	top: 58px !important;
	width: 184px !important;
	transform: rotate(-2deg) !important;
	line-height: 1.12 !important;
}
.hse-hero-note::before {
	font-size: 1.26rem !important;
	font-weight: 600 !important;
}
.hse-hero-note::after {
	width: 126px !important;
	height: 3px !important;
	margin: 9px 0 8px !important;
}
.hse-hero-note strong {
	font-size: .96rem !important;
	font-weight: 600 !important;
	margin-left: 32px !important;
}
.hse-person-card {
	top: 76px;
	right: 0;
	left: auto !important;
	bottom: auto !important;
	width: 180px;
	padding: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	transform: rotate(-2deg);
}
.hse-person-card strong,
.hse-person-card span { display: none !important; }
.hse-person-card::before {
	content: "Verlässlicher\A Arbeitsschutz.\A Persönlich.";
	white-space: pre;
	display: block;
	font-family: "Segoe Print", "Bradley Hand", cursive;
	font-size: 1.4rem;
	line-height: 1.05;
	font-weight: 500;
	color: #164069;
}
.hse-person-card::after {
	content: "Frank Reichert";
	display: block;
	margin-top: 30px;
	padding-top: 11px;
	border-top: 3px solid #35b84a;
	font-family: "Segoe Print", "Bradley Hand", cursive;
	font-size: 1.05rem;
	color: #164069;
}

@media (max-width: 960px) {
	.hse-hero { min-height: 0; padding-top: 42px !important; }
	.hse-hero-copy { padding-bottom: 20px; }
	.hse-portrait-card { height: 430px; }
	.hse-hero-photo { left: 10%; width: 62%; max-height: 430px; transform: translateY(4px); }
	.hse-hero-note { right: 5% !important; top: 56px !important; width: 168px !important; }
	.hse-hero-note::before { font-size: 1.14rem !important; }
	.hse-hero-note strong { font-size: .9rem !important; margin-left: 24px !important; }
}

@media (max-width: 767px) {
	.hse-header-inner { min-height: 74px !important; gap: 8px !important; }
	.hse-header-claim { display: none !important; }
	.hse-brand-logo { width: 155px !important; max-width: 42vw !important; }
	.hse-header-cta { flex: 0 0 150px !important; width: 150px !important; min-width: 150px !important; max-width: 150px !important; min-height: 44px !important; padding: 0 8px !important; font-size: .86rem !important; line-height: 1.1 !important; border-radius: 10px !important; }
	.hse-header-cta span { display: none !important; }

	.hse-hero { padding-top: 28px !important; }
	.hse-hero h1 { font-size: clamp(2.3rem,11vw,3.15rem) !important; line-height: 1 !important; }
	.hse-hero .hse-lead { font-size: 1rem !important; line-height: 1.45 !important; }
	.hse-trust-row { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
	.hse-trust-row span { max-width: none !important; }
	.hse-actions { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
	.hse-actions .hse-button { width: 100% !important; min-width: 0 !important; }
	.hse-portrait-card { display: flex !important; }
	.hse-hero-photo { position: relative !important; left: auto !important; right: auto !important; bottom: auto !important; width: min(96%,360px) !important; max-width: 360px !important; max-height: none !important; transform: none !important; }
	.hse-hero-note { display: none !important; }
}

@media (max-width: 767px) and (orientation: portrait) {
	.hse-portrait-card { display: none !important; }
}

@media (max-width: 960px) and (orientation: landscape) {
	.hse-hero-grid { grid-template-columns: 1.08fr .92fr !important; gap: 18px !important; align-items: end !important; }
	.hse-hero-copy { padding-bottom: 24px !important; }
	.hse-portrait-card { display: flex !important; position: relative !important; height: 390px !important; margin-top: 0 !important; align-items: flex-end !important; justify-content: center !important; }
	.hse-hero-photo { position: absolute !important; left: 8% !important; right: auto !important; bottom: 0 !important; width: 82% !important; max-width: 360px !important; max-height: 390px !important; transform: none !important; }
	.hse-hero-note { display: none !important; }
}

.hse-legacy-form { display: none !important; }
.hse-fluent-form .ff-el-group { margin-bottom: 14px; }
.hse-fluent-form .ff-el-form-control { width: 100%; border: 1px solid rgba(255,255,255,.24); border-radius: 10px; padding: 12px 14px; background: rgba(255,255,255,.98); color: #243036; }
.hse-fluent-form .ff-el-input--label label { color: #fff; font-weight: 750; }
.hse-fluent-form .ff-btn-submit { border: 0; border-radius: 10px; padding: 13px 18px; background: #76b82a !important; color: #fff !important; font-weight: 850; cursor: pointer; }
.hse-fluent-form .ff-message-success { background: #f1f8e8; color: #243036; border-radius: 10px; padding: 14px; }
