/* ============================================================
   modern-plus.css  –  Extra-"Pep" (zweite Overlay-Ebene)
   ------------------------------------------------------------
   Liegt ueber modern.css. Komplett rueckgaengig machbar:
   die <link ...modern-plus.css>-Zeile in index.php entfernen
   -> du bist exakt wieder auf dem aktuellen Stand (modern.css).
   ============================================================ */

/* Modernere Schriften (Poppins fuer Ueberschriften, Inter fuer Text) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@500;600;700&display=swap');

body {
	font-family: 'Inter', 'Open Sans', 'Segoe UI', Arial, sans-serif !important;
}
h1, h2, h3, h4, .section-header, .navbar-brand,
.stage-text h1, .main-header h1 {
	font-family: 'Poppins', 'Raleway', sans-serif !important;
	letter-spacing: .3px;
}

/* ---------- sanfte Einblend-Animationen ---------- */
@keyframes pp-fade-up { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes pp-pop     { from { opacity: 0; transform: scale(.9); }        to { opacity: 1; transform: none; } }

/* Hinweis: Slider-Text (.stage-text) wird bewusst NICHT animiert –
   bxSlider blendet Slides aus/klont sie, wodurch eine fill-mode-Animation
   im Startzustand (opacity:0) haengen bleiben kann. */
.content-block .product-box { animation: pp-fade-up .7s ease both; }
.content-block .product-box:nth-child(2) { animation-delay: .08s; }
.content-block .product-box:nth-child(3) { animation-delay: .16s; }
.section-header { animation: pp-fade-up .6s ease both; }

/* ---------- Hero / Slider ----------
   Bewusst KEIN Eingriff in Position/Groesse (sonst verrutscht/clippt der
   Slider-Text und das Hintergrund-Logo). Nur ein dezenter Text-Schatten. */
.stage-text h1 { text-shadow: 0 3px 14px rgba(0,0,0,.22); }
.stage-text p  { text-shadow: 0 2px 10px rgba(0,0,0,.16); }

/* ---------- Buttons: Verlauf + dezenter Glanz ---------- */
.btn-primary {
	background: linear-gradient(135deg, #2f63a0 0%, #1f4470 100%) !important;
	box-shadow: 0 8px 20px rgba(43,89,144,.30) !important;
	position: relative;
	overflow: hidden;
}
.btn-primary:hover, .btn-primary:focus {
	background: linear-gradient(135deg, #357ac0 0%, #244e80 100%) !important;
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(43,89,144,.42) !important;
}
.btn-primary:after {
	content: '';
	position: absolute; top: 0; left: -120%;
	width: 60%; height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent);
	transform: skewX(-20deg);
	transition: left .6s ease;
}
.btn-primary:hover:after { left: 140%; }

/* ---------- Karten: Akzentstreifen + Icon-Badge ---------- */
.product-box {
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(20,40,70,.06) !important;
}
.product-box:before {
	content: '';
	position: absolute; top: 0; left: 0; right: 0; height: 5px;
	background: linear-gradient(90deg, #2b5990, #3d74b8);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .3s ease;
}
.product-box:hover:before { transform: scaleX(1); }
.product-box:hover { transform: translateY(-8px) !important; box-shadow: 0 20px 44px rgba(20,40,70,.20) !important; }

.product-box .big-icon {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 88px; height: 88px;
	border-radius: 50%;
	background: linear-gradient(135deg, #2b5990, #3d74b8) !important;
	color: #fff !important;
	font-size: 36px !important;
	margin: 4px 0 20px !important;
	box-shadow: 0 12px 26px rgba(43,89,144,.35);
	transition: transform .25s ease;
}
.product-box:hover .big-icon { transform: scale(1.08) rotate(-4deg); }

/* ---------- Navigation: animierter Unterstrich ---------- */
.navbar.navigation-main .navbar-nav > li > a { position: relative; }
.navbar.navigation-main .navbar-nav > li > a:before {
	content: '';
	position: absolute; left: 14px; right: 14px; bottom: 6px;
	height: 2px; border-radius: 2px;
	background: linear-gradient(90deg, #2b5990, #3d74b8);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}
.navbar.navigation-main .navbar-nav > li > a:hover:before,
.navbar.navigation-main .navbar-nav > li.menuactive > a:before { transform: scaleX(1); }

/* ---------- Seiten-Kopf der Unterseiten ---------- */
.main-header { position: relative; }
.main-header h1 { font-size: 40px; text-shadow: 0 3px 14px rgba(0,0,0,.18); }

/* ---------- Section-Header: etwas groesser ---------- */
.section-header { font-size: 30px !important; letter-spacing: .6px !important; }
.section-header:after { width: 70px !important; height: 4px !important; }

/* ---------- Maschinen-Kacheln: Glanz beim Hover ---------- */
.machine-container > div { position: relative; }
.machine-container:hover > div { box-shadow: 0 16px 36px rgba(20,40,70,.22) !important; }

/* ---------- Footer: Akzentlinie oben ---------- */
.footer2 { position: relative; }
.footer2:before {
	content: '';
	position: absolute; top: 0; left: 0; right: 0; height: 3px;
	background: linear-gradient(90deg, #2b5990, #3d74b8, #d01e1e);
}

/* ---------- Formularfelder: weicher Fokus ---------- */
.form-control:focus { box-shadow: 0 0 0 4px rgba(43,89,144,.16) !important; }
