/*
Theme Name: VORNEX Engineering
Theme URI: https://vornex-engineering.de
Author: VORNEX Engineering
Author URI: https://vornex-engineering.de
Description: Editierbares WordPress-Block-Theme für VORNEX Engineering. Optimiert für B2B-Engineering, Konstruktion und Fertigungskoordination.
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 8.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vornex-engineering
Tags: block-patterns, full-site-editing, custom-colors, custom-logo, wide-blocks
*/

:root {
	--vornex-navy: #0b1728;
	--vornex-navy-2: #12243a;
	--vornex-blue: #3975db;
	--vornex-blue-soft: #eaf2ff;
	--vornex-ink: #172235;
	--vornex-muted: #617087;
	--vornex-line: #dce4ee;
	--vornex-surface: #f4f7fb;
	--vornex-white: #ffffff;
	--vornex-shadow: 0 22px 60px rgba(11, 23, 40, .11);
}

html {
	scroll-behavior: smooth;
}

body {
	overflow-x: hidden;
}

a {
	text-underline-offset: .18em;
}

.wp-site-blocks {
	overflow: hidden;
}

/* HEADER */
.vornex-header {
	position: relative;
	z-index: 50;
	border-bottom: 1px solid rgba(220, 228, 238, .85);
	background: rgba(255, 255, 255, .95);
	backdrop-filter: blur(16px);
}

.vornex-header-inner {
	min-height: 82px;
}

.vornex-wordmark {
	display: inline-flex;
	align-items: flex-end;
	gap: 1px;
	color: var(--vornex-navy);
	font-size: 1.55rem;
	font-weight: 850;
	letter-spacing: .08em;
	line-height: .9;
	text-decoration: none;
}

.vornex-wordmark .vornex-x {
	color: var(--vornex-blue);
}

.vornex-wordmark small {
	display: block;
	margin: 0 0 .06rem .55rem;
	color: #78869a;
	font-size: .52rem;
	font-weight: 700;
	letter-spacing: .24em;
}

.vornex-nav a {
	color: var(--vornex-ink);
	font-size: .91rem;
	font-weight: 650;
	text-decoration: none;
}

.vornex-nav a:hover {
	color: var(--vornex-blue);
}

.vornex-header-phone a {
	display: inline-flex;
	align-items: center;
	min-height: 42px;
	padding: 0 16px;
	border: 1px solid var(--vornex-line);
	color: var(--vornex-navy);
	font-size: .82rem;
	font-weight: 750;
	text-decoration: none;
}

.vornex-header-phone a:hover {
	border-color: var(--vornex-blue);
	color: var(--vornex-blue);
}

/* SHARED */
.vornex-eyebrow {
	margin: 0 0 1.25rem !important;
	color: var(--vornex-blue);
	font-size: .76rem !important;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.vornex-eyebrow::before {
	content: "";
	display: inline-block;
	width: 28px;
	height: 2px;
	margin: 0 10px 3px 0;
	background: currentColor;
}

.vornex-section-title {
	max-width: 760px;
	letter-spacing: -.045em;
}

.vornex-lead {
	max-width: 720px;
	color: var(--vornex-muted);
	font-size: clamp(1.05rem, 1.7vw, 1.25rem);
	line-height: 1.72;
}

.vornex-button .wp-block-button__link,
.wp-block-button.vornex-button .wp-block-button__link {
	border-radius: 0;
	padding: 15px 22px;
	font-size: .9rem;
	font-weight: 750;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.vornex-button .wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 30px rgba(57, 117, 219, .23);
}

.vornex-button-secondary .wp-block-button__link {
	border: 1px solid var(--vornex-line);
	background: var(--vornex-white) !important;
	color: var(--vornex-navy) !important;
}

.vornex-section {
	padding-top: clamp(76px, 9vw, 128px) !important;
	padding-bottom: clamp(76px, 9vw, 128px) !important;
}

.vornex-section-intro {
	margin-bottom: clamp(38px, 5vw, 68px) !important;
}

.vornex-card {
	height: 100%;
	padding: clamp(25px, 3vw, 38px);
	border: 1px solid var(--vornex-line);
	background: var(--vornex-white);
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.vornex-card:hover {
	transform: translateY(-5px);
	border-color: #b7ccec;
	box-shadow: var(--vornex-shadow);
}

.vornex-card-number {
	margin: 0 0 2.1rem !important;
	color: var(--vornex-blue);
	font-size: .72rem !important;
	font-weight: 850;
	letter-spacing: .15em;
}

.vornex-card h3 {
	margin-bottom: .9rem;
	letter-spacing: -.025em;
}

.vornex-card p {
	color: var(--vornex-muted);
}

.vornex-card ul {
	padding-left: 1.15rem;
	color: #48566a;
	font-size: .93rem;
}

.vornex-card li {
	margin-bottom: .45rem;
}

/* HERO */
.vornex-hero {
	position: relative;
	padding-top: clamp(86px, 10vw, 150px) !important;
	padding-bottom: clamp(80px, 9vw, 132px) !important;
	background:
		linear-gradient(115deg, rgba(234, 242, 255, .78), rgba(255,255,255,.15) 50%),
		var(--vornex-white);
}

.vornex-hero::before {
	content: "";
	position: absolute;
	inset: 0 0 0 auto;
	width: 43%;
	background:
		linear-gradient(rgba(57,117,219,.08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(57,117,219,.08) 1px, transparent 1px);
	background-size: 42px 42px;
	mask-image: linear-gradient(to left, #000 45%, transparent);
	pointer-events: none;
}

.vornex-hero-copy {
	position: relative;
	z-index: 2;
}

.vornex-hero h1 {
	max-width: 850px;
	margin-top: 0;
	margin-bottom: 1.6rem;
	color: var(--vornex-navy);
	font-size: clamp(3rem, 6.7vw, 6.35rem);
	line-height: .95;
	letter-spacing: -.066em;
}

.vornex-hero h1 strong {
	color: var(--vornex-blue);
	font-weight: inherit;
}

.vornex-hero-text {
	max-width: 690px;
	color: var(--vornex-muted);
	font-size: clamp(1.08rem, 1.8vw, 1.3rem);
	line-height: 1.7;
}

.vornex-hero-buttons {
	margin-top: 2rem !important;
}

.vornex-visual {
	position: relative;
	min-height: 470px;
	margin-left: 2rem;
	border: 1px solid #cfdced;
	background: linear-gradient(145deg, #eff5fd, #ffffff);
	box-shadow: var(--vornex-shadow);
}

.vornex-visual svg {
	width: 100%;
	height: 100%;
	min-height: 470px;
}

.vornex-mini-card {
	position: absolute;
	right: -22px;
	bottom: 30px;
	width: 210px;
	padding: 18px;
	border-left: 3px solid var(--vornex-blue);
	background: var(--vornex-navy);
	color: white;
	box-shadow: 0 20px 50px rgba(11, 23, 40, .24);
}

.vornex-mini-card small {
	display: block;
	margin-bottom: 5px;
	color: #91a5bf;
	font-size: .68rem;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.vornex-mini-card strong {
	font-size: .92rem;
}

.vornex-proofbar {
	position: relative;
	z-index: 3;
	margin-top: 44px !important;
	padding-top: 28px !important;
	border-top: 1px solid var(--vornex-line);
}

.vornex-proof {
	display: flex;
	align-items: flex-start;
	gap: 13px;
}

.vornex-proof strong {
	display: block;
	color: var(--vornex-navy);
	font-size: .92rem;
}

.vornex-proof span {
	display: block;
	color: var(--vornex-muted);
	font-size: .78rem;
}

.vornex-proof-icon {
	width: 8px;
	height: 8px;
	margin-top: 7px;
	flex: 0 0 auto;
	background: var(--vornex-blue);
}

/* POSITIONING */
.vornex-positioning {
	background: var(--vornex-navy);
	color: var(--vornex-white);
}

.vornex-positioning .vornex-eyebrow {
	color: #8fb6f4;
}

.vornex-positioning h2 {
	color: var(--vornex-white);
}

.vornex-positioning p {
	color: #aebbcf;
}

.vornex-position-panel {
	padding: clamp(30px, 5vw, 58px);
	border: 1px solid rgba(163, 190, 228, .18);
	background: rgba(255,255,255,.035);
}

.vornex-position-panel strong {
	color: white;
}

.vornex-position-list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: item;
}

.vornex-position-list li {
	position: relative;
	padding: 20px 0 20px 54px;
	border-top: 1px solid rgba(163,190,228,.17);
	color: #b7c4d6;
}

.vornex-position-list li:last-child {
	border-bottom: 1px solid rgba(163,190,228,.17);
}

.vornex-position-list li::before {
	counter-increment: item;
	content: "0" counter(item);
	position: absolute;
	left: 0;
	top: 22px;
	color: #6f9be4;
	font-size: .7rem;
	font-weight: 850;
	letter-spacing: .1em;
}

/* PROCESS */
.vornex-process-step {
	position: relative;
	min-height: 230px;
	padding: 28px 25px;
	border-top: 2px solid var(--vornex-blue);
	background: white;
	box-shadow: 0 14px 40px rgba(17, 35, 58, .055);
}

.vornex-process-step .step {
	display: block;
	margin-bottom: 2.4rem;
	color: var(--vornex-blue);
	font-size: .7rem;
	font-weight: 850;
	letter-spacing: .14em;
}

.vornex-process-step h3 {
	font-size: 1.18rem;
}

.vornex-process-step p {
	color: var(--vornex-muted);
	font-size: .9rem;
}

/* INDUSTRIES */
.vornex-industries {
	background: var(--vornex-surface);
}

.vornex-industry {
	padding: 24px 26px;
	border: 1px solid var(--vornex-line);
	background: rgba(255,255,255,.72);
}

.vornex-industry strong {
	display: block;
	margin-bottom: 6px;
	color: var(--vornex-navy);
}

.vornex-industry span {
	color: var(--vornex-muted);
	font-size: .86rem;
}

/* ABOUT */
.vornex-about-visual {
	position: relative;
	min-height: 500px;
	background:
		linear-gradient(135deg, rgba(57,117,219,.92), rgba(11,23,40,.97)),
		var(--vornex-navy);
	overflow: hidden;
}

.vornex-about-visual::before,
.vornex-about-visual::after {
	content: "";
	position: absolute;
	border: 1px solid rgba(255,255,255,.18);
	transform: rotate(28deg);
}

.vornex-about-visual::before {
	width: 330px;
	height: 560px;
	left: -80px;
	top: -80px;
}

.vornex-about-visual::after {
	width: 240px;
	height: 460px;
	right: -70px;
	bottom: -130px;
}

.vornex-about-mark {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: white;
	font-size: clamp(5rem, 13vw, 10rem);
	font-weight: 900;
	letter-spacing: -.09em;
}

.vornex-about-mark span {
	color: #8fb6f4;
}

.vornex-about-copy {
	padding-left: clamp(0px, 5vw, 76px);
}

.vornex-about-copy p {
	color: var(--vornex-muted);
}

.vornex-facts {
	margin-top: 30px !important;
}

.vornex-fact {
	padding: 18px 0;
	border-top: 1px solid var(--vornex-line);
}

.vornex-fact:last-child {
	border-bottom: 1px solid var(--vornex-line);
}

.vornex-fact strong {
	display: block;
	font-size: .93rem;
}

.vornex-fact span {
	color: var(--vornex-muted);
	font-size: .84rem;
}

/* CTA */
.vornex-cta {
	position: relative;
	overflow: hidden;
	background: var(--vornex-blue);
	color: white;
}

.vornex-cta::after {
	content: "";
	position: absolute;
	width: 440px;
	height: 440px;
	right: -180px;
	top: -190px;
	border: 1px solid rgba(255,255,255,.3);
	border-radius: 50%;
	box-shadow: 0 0 0 70px rgba(255,255,255,.045), 0 0 0 140px rgba(255,255,255,.03);
}

.vornex-cta h2,
.vornex-cta p {
	position: relative;
	z-index: 2;
	color: white;
}

.vornex-cta p {
	max-width: 690px;
	color: #e6efff;
}

.vornex-cta .wp-block-button__link {
	position: relative;
	z-index: 3;
	background: var(--vornex-navy) !important;
}

/* SUBPAGES */
.vornex-page-hero {
	padding-top: clamp(70px, 9vw, 120px) !important;
	padding-bottom: clamp(60px, 7vw, 92px) !important;
	background: linear-gradient(125deg, var(--vornex-surface), white);
}

.vornex-page-hero h1 {
	max-width: 880px;
	font-size: clamp(2.8rem, 6vw, 5.2rem);
	line-height: 1;
	letter-spacing: -.055em;
}

.vornex-page-content {
	padding-top: clamp(65px, 8vw, 110px) !important;
	padding-bottom: clamp(75px, 9vw, 125px) !important;
}

.vornex-detail-row {
	padding: 30px 0;
	border-top: 1px solid var(--vornex-line);
}

.vornex-detail-row:last-child {
	border-bottom: 1px solid var(--vornex-line);
}

.vornex-detail-row h2 {
	font-size: clamp(1.6rem, 3vw, 2.4rem);
}

.vornex-detail-row p,
.vornex-detail-row li {
	color: var(--vornex-muted);
}

.vornex-contact-card {
	padding: clamp(28px, 5vw, 50px);
	background: var(--vornex-navy);
	color: white;
}

.vornex-contact-card h2,
.vornex-contact-card a {
	color: white;
}

.vornex-contact-card p {
	color: #acbbcf;
}

.vornex-contact-list {
	padding: 0;
	list-style: none;
}

.vornex-contact-list li {
	padding: 13px 0;
	border-top: 1px solid rgba(163,190,228,.17);
}

.vornex-contact-list a {
	text-decoration: none;
}

.vornex-form {
	padding: clamp(26px, 5vw, 48px);
	border: 1px solid var(--vornex-line);
	background: white;
	box-shadow: var(--vornex-shadow);
}

.vornex-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.vornex-form-field {
	display: grid;
	gap: 7px;
}

.vornex-form-field.full {
	grid-column: 1 / -1;
}

.vornex-form label {
	color: var(--vornex-ink);
	font-size: .76rem;
	font-weight: 750;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.vornex-form input,
.vornex-form select,
.vornex-form textarea {
	width: 100%;
	padding: 13px 14px;
	border: 1px solid #cad5e3;
	border-radius: 0;
	background: #fbfcfe;
	color: var(--vornex-ink);
}

.vornex-form textarea {
	min-height: 150px;
	resize: vertical;
}

.vornex-form input:focus,
.vornex-form select:focus,
.vornex-form textarea:focus {
	outline: 3px solid rgba(57,117,219,.12);
	border-color: var(--vornex-blue);
}

.vornex-form button {
	margin-top: 17px;
	padding: 14px 20px;
	border: 0;
	border-radius: 0;
	background: var(--vornex-blue);
	color: white;
	font-weight: 780;
	cursor: pointer;
}

.vornex-form-notice {
	margin-bottom: 20px;
	padding: 13px 15px;
	border-left: 3px solid var(--vornex-blue);
	background: var(--vornex-blue-soft);
	color: var(--vornex-navy);
}

.vornex-form-notice.error {
	border-color: #c53d3d;
	background: #fff0f0;
}

.vornex-honeypot {
	position: absolute !important;
	left: -9999px !important;
}

.vornex-legal-warning {
	padding: 20px 22px;
	border-left: 4px solid #c77a00;
	background: #fff3dc;
	color: #704300;
}

/* FOOTER */
.vornex-footer {
	background: var(--vornex-navy);
	color: #aebbd0;
}

.vornex-footer-main {
	padding-top: 62px !important;
	padding-bottom: 48px !important;
}

.vornex-footer .vornex-wordmark {
	color: white;
}

.vornex-footer a {
	color: #aebbd0;
	text-decoration: none;
}

.vornex-footer a:hover {
	color: white;
}

.vornex-footer-title {
	color: white;
	font-size: .72rem !important;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.vornex-footer-bottom {
	padding-top: 19px !important;
	padding-bottom: 19px !important;
	border-top: 1px solid rgba(163,190,228,.17);
	font-size: .75rem;
}

/* WORDPRESS / ACCESSIBILITY */
.wp-block-navigation__responsive-container.is-menu-open {
	background: white !important;
	color: var(--vornex-ink) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1.25rem;
}

:focus-visible {
	outline: 3px solid rgba(57,117,219,.38);
	outline-offset: 3px;
}

/* RESPONSIVE */
@media (max-width: 1020px) {
	.vornex-header-phone {
		display: none;
	}

	.vornex-visual {
		margin: 35px 0 0;
	}

	.vornex-hero::before {
		width: 100%;
		opacity: .65;
	}

	.vornex-about-copy {
		padding: 30px 0 0;
	}
}

@media (max-width: 781px) {
	.vornex-header-inner {
		min-height: 70px;
	}

	.vornex-wordmark {
		font-size: 1.25rem;
	}

	.vornex-wordmark small {
		font-size: .44rem;
	}

	.vornex-hero {
		padding-top: 72px !important;
	}

	.vornex-hero h1 {
		font-size: clamp(3rem, 14vw, 5rem);
	}

	.vornex-visual,
	.vornex-visual svg {
		min-height: 350px;
	}

	.vornex-mini-card {
		right: 14px;
		bottom: 14px;
	}

	.vornex-form-grid {
		grid-template-columns: 1fr;
	}

	.vornex-form-field.full {
		grid-column: auto;
	}
}

@media (max-width: 520px) {
	.vornex-visual,
	.vornex-visual svg {
		min-height: 290px;
	}

	.vornex-mini-card {
		position: relative;
		right: auto;
		bottom: auto;
		width: auto;
		margin: -1px;
	}

	.vornex-proofbar {
		gap: 20px !important;
	}

	.vornex-footer-bottom {
		text-align: center;
	}
}
