/* ═══════════════════════════════════════════════════════════════
   automation-integration.php – Page Styles
   Extends the Acticon design system. Do not modify style-*.min.css.
   ═══════════════════════════════════════════════════════════════ */

/* ── Upper zone: structural wrapper only, no overlay ────────── */
.ai-upper-zone {
	position: relative;
}

/* ── Smooth scroll + anchor offset ─────────────────────────── */
html { scroll-behavior: smooth; }
#leistungen, #kontakt { scroll-margin-top: 4.5rem; }

/* ── Section Label ──────────────────────────────────────────── */
.ai-label {
	display: block;
	font-size: .7rem;
	font-weight: 800;
	letter-spacing: .2rem;
	text-transform: uppercase;
	color: rgb(23,24,215);
	margin-bottom: .875rem;
}
.ai-label-dim { color: rgba(255,255,255,.38); }

/* ── Hero ───────────────────────────────────────────────────── */
.ai-hero-sub {
	font-size: 1.25rem;
	font-weight: 700;
	color: #333;
	margin: .5rem 0 1.5rem;
	line-height: 1.25;
}

/* ── Trust Strip ────────────────────────────────────────────── */
.ai-trust-strip {
	display: flex;
	flex-wrap: wrap;
	gap: .375rem .875rem;
	align-items: center;
	margin-top: 1.5rem;
	padding-top: 1.375rem;
	border-top: .063rem solid rgba(0,0,0,.08);
}
.ai-trust-item {
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .04rem;
	color: #555;
	display: flex;
	align-items: center;
	gap: .35rem;
}
.ai-trust-item::before {
	content: "";
	display: inline-block;
	width: .5rem;
	height: .5rem;
	background: rgb(23,24,215);
	border-radius: 50%;
	flex-shrink: 0;
}

/* ── CTA Row & Buttons ──────────────────────────────────────── */
.ai-cta-row {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 2rem;
}
.ai-btn {
	display: inline-block;
	background: rgb(23,24,215);
	color: #fff;
	padding: .8rem 2.25rem .75rem;
	font-family: inherit;
	font-size: .875rem;
	font-weight: 800;
	letter-spacing: .1rem;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: .2rem;
	transition: background .2s;
	line-height: 1;
	white-space: nowrap;
}
.ai-btn:hover, .ai-btn:focus { background: #000; color: #fff; }
.ai-btn-ghost {
	background: transparent;
	color: rgb(23,24,215);
	border: .125rem solid rgb(23,24,215);
}
.ai-btn-ghost:hover, .ai-btn-ghost:focus { background: rgb(23,24,215); color: #fff; }
.ai-btn-white { background: #fff; color: rgb(23,24,215); }
.ai-btn-white:hover, .ai-btn-white:focus { background: rgb(23,24,215); color: #fff; }

/* ── Value Proposition ──────────────────────────────────────── */
.ai-value-wrap {
	background: rgba(2,5,22,.9);
	border: .063rem solid rgba(255,255,255,.13);
	border-top: .063rem solid rgba(255,255,255,.18);
	border-radius: .25rem;
	padding: 2.75rem 3rem 2.75rem;
	margin-top: 4rem;
	backdrop-filter: blur(2px) brightness(.82);
	-webkit-backdrop-filter: blur(2px) brightness(.82);
	box-shadow: 0 8px 40px rgba(0,0,14,.5), inset 0 1px 0 rgba(255,255,255,.07);
}
.ai-value-lead {
	font-size: 1.05rem;
	line-height: 1.75;
	color: rgba(255,255,255,.86);
	max-width: 50rem;
	margin: 0 0 2.5rem;
	border-bottom: .063rem solid rgba(255,255,255,.1);
	padding-bottom: 2.5rem;
}
.ai-value-lead strong { color: #fff; font-weight: 700; }
.ai-value-pillars {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
}
.ai-pillar {
	padding: 0 2.25rem 0 0;
	border-right: .063rem solid rgba(255,255,255,.08);
}
.ai-pillar:last-child { border-right: none; padding-right: 0; }
.ai-pillar:not(:first-child) { padding-left: 2.25rem; }
.ai-pillar-icon {
	display: block;
	width: 1.375rem;
	height: 1.375rem;
	color: rgba(150,168,255,.82);
	margin-bottom: .875rem;
	flex-shrink: 0;
}
.ai-pillar-lbl {
	display: block;
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .14rem;
	text-transform: uppercase;
	color: rgba(140,155,255,.85);
	margin-bottom: .75rem;
}
.ai-pillar p {
	font-size: .875rem;
	line-height: 1.7;
	color: rgba(255,255,255,.8);
	margin: 0;
}

/* ══════════════════════════════════════════════════════════════
   PIPELINE: 3-Column Horizontal Layout
   ══════════════════════════════════════════════════════════════ */
.ai-pipe-wrap {
	background: #02071a;
	padding: 4rem 0 4.5rem;
	margin-top: 6.875rem;
	position: relative;
	overflow: hidden;
}
.ai-pipe-wrap::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
	background-size: 2.5rem 2.5rem;
	pointer-events: none;
}
/* Radial glow behind engine column */
.ai-pipe-wrap::after {
	content: "";
	position: absolute;
	top: 58%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 34rem;
	height: 26rem;
	background: radial-gradient(ellipse at center, rgba(23,24,215,.3) 0%, transparent 68%);
	pointer-events: none;
	z-index: 0;
}
.ai-pipe-inner { position: relative; z-index: 1; }

/* 3-column grid: left / arrow / center / arrow / right */
.ai-pipe-cols {
	display: grid;
	grid-template-columns: 1fr 5rem 1.15fr 5rem 1fr;
	align-items: stretch;
	margin-top: 2.5rem;
}
.ai-pipe-col {
	display: flex;
	flex-direction: column;
	border: .063rem solid rgba(255,255,255,.1);
	overflow: hidden;
	position: relative;
}
/* Input: left accent stripe, no right border */
.ai-pipe-col--in {
	background: rgba(255,255,255,.035);
	border-right: none;
}
.ai-pipe-col--in::before {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: .2rem;
	height: 100%;
	background: linear-gradient(to bottom, transparent 5%, rgba(255,255,255,.32) 50%, transparent 95%);
	pointer-events: none;
	z-index: 1;
}
/* Output: right accent stripe, no left border */
.ai-pipe-col--out {
	background: rgba(23,24,215,.07);
	border-color: rgba(23,24,215,.22);
	border-left: none;
}
.ai-pipe-col--out::before {
	content: "";
	position: absolute;
	top: 0; right: 0;
	width: .2rem;
	height: 100%;
	background: linear-gradient(to bottom, transparent 5%, rgba(90,110,255,.5) 50%, transparent 95%);
	pointer-events: none;
	z-index: 1;
}
/* Engine center column – visual heart of the pipeline */
.ai-pipe-col--engine {
	background: linear-gradient(165deg, #1c1de6 0%, #1718d7 42%, #1012bb 100%);
	border-color: transparent;
	box-shadow:
		0 0 0 1px rgba(90,105,255,.45),
		0 0 3.5rem rgba(23,24,215,.65),
		0 0 .75rem rgba(23,24,215,.88),
		inset 0 1px 0 rgba(255,255,255,.15),
		inset 0 -1px 0 rgba(0,0,28,.45);
	position: relative;
	z-index: 2;
}
/* Inner border frame for depth */
.ai-pipe-col--engine::before {
	content: "";
	position: absolute;
	inset: .5rem;
	border: 1px solid rgba(255,255,255,.1);
	pointer-events: none;
	z-index: 0;
}
/* Animated scan sweep on engine body */
.ai-pipe-col--engine .ai-pipe-col-body::after {
	content: "";
	position: absolute;
	left: 0; right: 0;
	height: 50%;
	background: linear-gradient(to bottom, transparent 0%, rgba(255,255,255,.032) 50%, transparent 100%);
	animation: engineScan 5s ease-in-out infinite;
	pointer-events: none;
	z-index: 0;
}
.ai-pipe-col--engine .ai-pipe-col-body {
	position: relative;
	overflow: hidden;
}
@keyframes engineScan {
	0%, 100% { top: -55%; }
	50% { top: 115%; }
}

/* Horizontal arrow connectors */
.ai-pipe-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: .25rem;
	color: rgba(100,118,255,.82);
	position: relative;
}
/* Gradient connector line */
.ai-pipe-arrow::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0; right: 0;
	height: 1px;
	background: linear-gradient(to right, rgba(255,255,255,.06), rgba(80,100,255,.55), rgba(255,255,255,.06));
	transform: translateY(-50%);
}
/* Animated data packet flowing along the line */
.ai-pipe-arrow::after {
	content: "";
	position: absolute;
	top: 50%;
	width: .5rem;
	height: .5rem;
	border-radius: 50%;
	background: rgba(145,160,255,.95);
	box-shadow: 0 0 .5rem rgba(100,120,255,.9), 0 0 1.2rem rgba(80,100,255,.5);
	transform: translateY(-50%);
	animation: dataPacket 3s cubic-bezier(.4,0,.6,1) infinite;
}
@keyframes dataPacket {
	0% { left: 8%; opacity: 0; }
	12% { opacity: 1; }
	88% { opacity: 1; }
	100% { left: 86%; opacity: 0; }
}
.ai-pipe-arrow svg {
	width: 1.5rem;
	height: 1.5rem;
	position: relative;
	z-index: 1;
	background: #02071a;
	padding: .3rem;
	box-sizing: content-box;
	filter: drop-shadow(0 0 4px rgba(90,110,255,.6));
}
/* Column header */
.ai-pipe-col-head {
	padding: .875rem 1.375rem .75rem;
	border-bottom: .063rem solid rgba(255,255,255,.09);
	font-size: .6rem;
	font-weight: 800;
	letter-spacing: .2rem;
	text-transform: uppercase;
	color: rgba(255,255,255,.28);
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: .65rem;
}
.ai-pipe-col--engine .ai-pipe-col-head {
	color: rgba(255,255,255,.55);
	border-bottom-color: rgba(255,255,255,.15);
	justify-content: center;
	position: relative;
	z-index: 1;
}
.ai-pipe-col--out .ai-pipe-col-head { color: rgba(140,155,255,.5); border-bottom-color: rgba(23,24,215,.2); }
/* Step badge inside column header */
.ai-pipe-step {
	font-size: .5rem;
	font-weight: 900;
	color: rgba(255,255,255,.2);
	border: 1px solid rgba(255,255,255,.13);
	padding: .1rem .35rem;
	letter-spacing: .04rem;
	flex-shrink: 0;
}
.ai-pipe-col--engine .ai-pipe-step {
	color: rgba(255,255,255,.45);
	border-color: rgba(255,255,255,.25);
}
.ai-pipe-col--out .ai-pipe-step {
	color: rgba(130,148,255,.5);
	border-color: rgba(80,100,255,.25);
}
/* Column body */
.ai-pipe-col-body { padding: 1.25rem 1.375rem 1.5rem; flex: 1; }
/* Engine center body */
.ai-pipe-col--engine .ai-pipe-col-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 1.375rem;
}
.ai-engine-name {
	display: block;
	font-size: .78rem;
	font-weight: 900;
	letter-spacing: .24rem;
	text-transform: uppercase;
	color: #fff;
	line-height: 1.45;
	text-shadow: 0 0 2.5rem rgba(255,255,255,.45), 0 0 5rem rgba(255,255,255,.2);
	position: relative;
	z-index: 1;
}
.ai-engine-divider {
	width: 3rem;
	height: 1px;
	background: linear-gradient(to right, transparent, rgba(255,255,255,.45), transparent);
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.ai-engine-tools { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; position: relative; z-index: 1; }
.ai-engine-tool {
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .04rem;
	color: rgba(255,255,255,.88);
	background: rgba(255,255,255,.13);
	padding: .3rem .75rem;
	border-radius: .1rem;
	white-space: nowrap;
	border: 1px solid rgba(255,255,255,.17);
	transition: background .15s, border-color .15s;
}
.ai-engine-tool:hover { background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.3); }
/* Status badge – "Aktiv" indicator on engine */
.ai-engine-status {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-size: .58rem;
	font-weight: 700;
	letter-spacing: .14rem;
	text-transform: uppercase;
	color: rgba(140,255,175,.85);
	background: rgba(0,190,80,.1);
	border: 1px solid rgba(0,200,90,.22);
	padding: .22rem .7rem .22rem .55rem;
	border-radius: 2rem;
	position: relative;
	z-index: 1;
}
.ai-engine-status::before {
	content: "";
	width: .42rem;
	height: .42rem;
	border-radius: 50%;
	background: rgb(70,215,125);
	box-shadow: 0 0 .5rem rgb(70,215,125);
	flex-shrink: 0;
	animation: statusPulse 2.2s ease-in-out infinite;
}
@keyframes statusPulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: .45; transform: scale(.82); }
}
/* Tags (inputs / outputs) */
.ai-tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.ai-tag {
	display: inline-block;
	padding: .28rem .65rem;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .03rem;
	color: rgba(255,255,255,.72);
	background: rgba(255,255,255,.07);
	border: .063rem solid rgba(255,255,255,.13);
	border-radius: .1rem;
	transition: background .15s, color .15s, border-color .15s;
	cursor: default;
}
.ai-tag:hover { background: rgba(255,255,255,.13); color: #fff; border-color: rgba(255,255,255,.22); }
.ai-tag-out { color: rgba(195,210,255,.88); background: rgba(23,24,215,.18); border-color: rgba(23,24,215,.36); }
.ai-tag-out:hover { background: rgba(23,24,215,.35); color: #fff; border-color: rgba(80,100,255,.5); }

/* Pipeline CTA */
.ai-pipe-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
	border: .063rem solid rgba(255,255,255,.12);
	padding: 1.5rem 2rem;
	margin-top: 2.5rem;
	background: rgba(255,255,255,.03);
}
.ai-pipe-cta p {
	font-size: 1rem;
	font-weight: 700;
	color: rgba(255,255,255,.88);
	margin: 0;
	line-height: 1.4;
}

/* ── Service Section (light, isolated) ─────────────────────── */
.ai-svc-section {
	background: #eef0f6;
	padding: 5rem 0 5.5rem;
	position: relative;
	isolation: isolate;
}
/* Service Grid */
.ai-svc-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
	margin-top: 2.5rem;
}
.ai-svc-card {
	background: rgba(255,255,255,.78);
	border: .063rem solid rgba(0,0,0,.05);
	display: flex;
	flex-direction: column;
	min-height: 17rem;
	transition: box-shadow .2s, transform .2s, background .2s;
}
.ai-svc-card:hover {
	background: rgba(255,255,255,.96);
	box-shadow: 0 .25rem 1.5rem rgba(23,24,215,.1), 0 .063rem .25rem rgba(0,0,0,.06);
	transform: translateY(-.125rem);
}
.ai-svc-accent {
	height: .25rem;
	background: rgb(23,24,215);
	flex-shrink: 0;
	transition: height .2s;
}
.ai-svc-card:hover .ai-svc-accent { height: .375rem; }
.ai-svc-body { padding: 1.5rem 1.625rem 1rem; flex: 1; }
.ai-svc-title {
	display: block;
	font-size: .875rem;
	font-weight: 800;
	letter-spacing: .05rem;
	text-transform: uppercase;
	color: #000;
	margin-bottom: .75rem;
	line-height: 1.3;
	hyphens: auto;
}
.ai-svc-text { font-size: .875rem; line-height: 1.65; color: #404040; margin: 0; }
.ai-svc-footer {
	padding: .875rem 1.625rem 1.375rem;
	border-top: .063rem solid rgba(0,0,0,.06);
	margin-top: auto;
}
.ai-svc-link {
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .07rem;
	text-transform: uppercase;
	color: rgb(23,24,215);
	text-decoration: none;
	display: inline-block;
	position: relative;
}
.ai-svc-link::after {
	content: "";
	position: absolute;
	bottom: -.1rem; left: 0; right: 0;
	height: .063rem;
	background: rgb(23,24,215);
	transition: height .15s;
}
.ai-svc-link:hover::after { height: .18rem; }

/* Mid-Page CTA strip */
.ai-midcta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
	border: .063rem solid rgba(0,0,0,.1);
	padding: 1.625rem 2rem;
	margin-top: 4rem;
	background: rgba(255,255,255,.65);
}
.ai-midcta p {
	font-size: 1.05rem;
	font-weight: 700;
	color: #111;
	margin: 0;
	line-height: 1.4;
}

/* ── Examples: horizontal scroll rail ──────────────────────── */

/* Section backdrop – sits above the fixed background artwork in document
   flow, creating a clean, calm surface for the content to rest on.     */
.ai-ex-section {
	position: relative;
	isolation: isolate;
	background: rgba(3,6,24,.72);
}

/* Dark-box refinement within the examples section */
.ai-ex-section .dark-box {
	background: rgba(5,9,32,.96);
	border: 1px solid rgba(255,255,255,.07);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px rgba(255,255,255,.03);
}

.ai-rail-wrap { margin-top: 2rem; position: relative; }
.ai-rail {
	display: flex;
	gap: 1.125rem;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: rgba(255,255,255,.2) transparent;
	padding-bottom: .875rem;
	cursor: grab;
}
.ai-rail:active { cursor: grabbing; }
.ai-rail::-webkit-scrollbar { height: .25rem; }
.ai-rail::-webkit-scrollbar-track { background: rgba(255,255,255,.04); border-radius: .25rem; }
.ai-rail::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: .25rem; }
.ai-ex-card {
	flex: 0 0 calc(33.33% - .75rem);
	min-width: 18rem;
	scroll-snap-align: start;
	background: rgba(255,255,255,.09);
	border: .063rem solid rgba(255,255,255,.14);
	border-top: .063rem solid rgba(255,255,255,.2);
	padding: 1.375rem 1.5rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: .625rem;
	transition: background .2s, border-color .2s, box-shadow .2s;
	box-shadow: 0 1px 8px rgba(0,0,0,.3);
}
.ai-ex-card:hover {
	background: rgba(30,40,220,.24);
	border-color: rgba(80,100,255,.42);
	box-shadow: 0 2px 18px rgba(23,24,215,.22);
}
/* Category badges – crisper, better contrast */
.ai-ex-cat {
	display: inline-block;
	font-size: .63rem;
	font-weight: 800;
	letter-spacing: .1rem;
	text-transform: uppercase;
	color: rgba(200,215,255,.92);
	border: .063rem solid rgba(165,180,255,.38);
	padding: .18rem .55rem;
	border-radius: .1rem;
	align-self: flex-start;
}
.ai-ex-cat--migration { color: #5dc98e; border-color: rgba(55,162,110,.42); }
.ai-ex-cat--cloud     { color: #22d4cf; border-color: rgba(18,180,175,.42); }
.ai-ex-cat--prod      { color: #e0a82a; border-color: rgba(210,155,32,.42); }
.ai-ex-cat--process   { color: #aa7df4; border-color: rgba(140,72,250,.42); }
.ai-ex-cat--doc       { color: rgba(255,255,255,.68); border-color: rgba(255,255,255,.24); }
.ai-ex-flow { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.ai-ex-from {
	display: inline-block;
	font-size: .72rem; font-weight: 800; letter-spacing: .04rem;
	text-transform: uppercase;
	color: rgba(255,255,255,.9); background: rgba(255,255,255,.13);
	padding: .22rem .55rem; border-radius: .1rem; white-space: nowrap;
}
.ai-ex-to {
	display: inline-block;
	font-size: .72rem; font-weight: 800; letter-spacing: .04rem;
	text-transform: uppercase;
	color: rgba(205,218,255,.96); background: rgba(35,45,220,.42);
	padding: .22rem .55rem; border-radius: .1rem; white-space: nowrap;
}
.ai-ex-arrow { color: rgba(255,255,255,.48); font-size: .875rem; flex-shrink: 0; }
.ai-ex-desc { font-size: .85rem; line-height: 1.65; color: rgba(255,255,255,.84); margin: 0; flex: 1; }
.ai-rail-hint {
	font-size: .72rem; font-weight: 700; letter-spacing: .1rem;
	text-transform: uppercase; color: rgba(255,255,255,.44);
	text-align: right; margin-top: .75rem;
}

/* ── Why Acticon (refined, pattern-accented) ────────────────── */
.ai-why-section {
	background: #f4f5fb;
	padding: 5rem 0 5.5rem;
	position: relative;
	isolation: isolate;
}
.ai-why-section::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle, rgba(23,24,215,.07) 1px, transparent 1px);
	background-size: 1.5rem 1.5rem;
	pointer-events: none;
	z-index: 0;
}
.ai-why-section > * { position: relative; z-index: 1; }
.ai-why-intro {
	text-align: center;
	max-width: 46rem;
	margin: 0 auto;
}
.ai-why-lead {
	font-size: 1.05rem;
	line-height: 1.65;
	color: #505060;
	margin: 1.25rem 0 0;
}
.ai-why-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
	margin-top: 2.5rem;
	text-align: left;
}
.ai-why-card {
	background: rgba(255,255,255,.88);
	padding: 1.875rem 1.875rem 1.875rem 2.125rem;
	border-left: .25rem solid rgb(23,24,215);
	border: .063rem solid rgba(23,24,215,.1);
	border-left: .25rem solid rgb(23,24,215);
	transition: box-shadow .2s, background .2s;
}
.ai-why-card:hover {
	background: #fff;
	box-shadow: 0 .375rem 1.5rem rgba(23,24,215,.1);
}
.ai-why-title {
	display: block;
	font-size: .95rem;
	font-weight: 800;
	letter-spacing: .03rem;
	color: #000;
	margin-bottom: .625rem;
	line-height: 1.3;
}
.ai-why-card p { font-size: .875rem; line-height: 1.65; color: #444; margin: 0; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 62rem) {
	.ai-value-wrap { padding: 2rem 2rem; }
	.ai-pipe-cols { grid-template-columns: 1fr; }
	.ai-pipe-arrow { display: none; }
	.ai-pipe-col { margin-bottom: .063rem; border-right: .063rem solid rgba(255,255,255,.1); border-left: .063rem solid rgba(255,255,255,.1); }
	.ai-pipe-col--out { border-color: rgba(23,24,215,.22); }
	.ai-pipe-col--engine { box-shadow: 0 0 2rem rgba(23,24,215,.5); }
	.ai-pipe-col--engine::before { display: none; }
	.ai-pipe-col-body { padding: 1.125rem 1.25rem 1.375rem; }
	.ai-pipe-col--engine .ai-pipe-col-body { text-align: left; align-items: flex-start; }
	.ai-pipe-wrap::after { display: none; }
}
@media (max-width: 54.74rem) {
	.ai-value-pillars { grid-template-columns: 1fr; gap: 0; }
	.ai-pillar { border-right: none; border-top: .063rem solid rgba(255,255,255,.1); padding: 1.25rem 0; }
	.ai-pillar:first-child { border-top: none; padding-top: 0; }
	.ai-pillar:not(:first-child) { padding-left: 0; }
	.ai-svc-grid { grid-template-columns: repeat(2, 1fr); }
	.ai-ex-card { flex: 0 0 calc(50% - .5625rem); }
	.ai-why-grid { grid-template-columns: 1fr; }
	.ai-midcta { flex-direction: column; align-items: flex-start; padding: 1.375rem 1.5rem; }
	.ai-pipe-cta { flex-direction: column; align-items: flex-start; padding: 1.375rem 1.5rem; }
}
@media (max-width: 37.49rem) {
	.ai-svc-grid { grid-template-columns: 1fr; }
	.ai-ex-card { flex: 0 0 85%; }
	.ai-cta-row { flex-direction: column; align-items: flex-start; }
	.ai-value-lead { font-size: 1rem; }
	.ai-hero-sub { font-size: 1.1rem; }
	.ai-value-wrap { padding: 1.75rem 1.375rem; }
}
@media (max-width: 30rem) {
	.ai-pipe-wrap { padding: 2.5rem 0 3rem; }
	.ai-pipe-col-body { padding: 1rem .875rem 1.25rem; }
}


/* ── Kontakt-Headline: mobile Worttrennung ──────────────────── */
/* Scoped auf #kontakt – kein Einfluss auf andere Seiten         */
#kontakt .mainheadline {
	hyphens: auto;
	-webkit-hyphens: auto;
	overflow-wrap: break-word;
}
@media (max-width: 30rem) {
	#kontakt .mainheadline {
		font-size: 1.625rem;
		line-height: 1.25;
	}
}