/*
 * PROD-DESIGN-001 — Glob-el visual system v1
 *
 * This file is intentionally dependency-free and is loaded after the existing
 * theme/plugin styles. It supplies a shared industrial token layer and small,
 * scoped overrides for the existing PHP-rendered components. No markup,
 * product data, SEO output or RC1 runtime is changed here.
 */

:root {
	/* Approved brand palette */
	--gl-teal-900: #00202a;
	--gl-teal-800: #013544;
	--gl-teal-700: #0a4a5e;
	--gl-teal-600: #12607a;
	--gl-teal-300: #8fb3bd;
	--gl-blue-500: #00bac2;
	--gl-blue-700: #008a90;
	--gl-blue-050: #effbfc;
	--gl-yellow-500: #ffae00;
	--gl-yellow-700: #b37a00;
	--gl-grey-050: #f2f2f2;
	--gl-grey-800: #333333;

	/* Semantic roles */
	--surface: #ffffff;
	--surface-alt: var(--gl-blue-050);
	--surface-inverse: var(--gl-teal-900);
	--text-primary: var(--gl-grey-800);
	--text-secondary: #526a72;
	--text-on-inverse: #f7fbfb;
	--text-tech: var(--gl-blue-700);
	--text-tech-inverse: var(--gl-teal-300);
	--action-primary: var(--gl-yellow-500);
	--action-primary-ink: var(--gl-teal-900);
	--action-secondary: var(--gl-teal-800);
	--border-subtle: #d7e4e7;
	--focus-ring: var(--gl-blue-700);

	/* 8 px rhythm, compact industrial radii and restrained depth */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;
	--space-9: 96px;
	--space-10: 128px;
	--radius-sm: 2px;
	--radius-md: 4px;
	--radius-lg: 8px;
	--shadow-sm: 0 2px 10px rgba(0, 32, 42, .08);
	--shadow-card: 0 8px 24px rgba(0, 32, 42, .08);
	--ease-standard: cubic-bezier(.2, .65, .3, 1);
	--duration-fast: 120ms;
	--duration-standard: 220ms;
	--duration-slow: 420ms;

	/* 12 / 14 / 16 / 20 / 25 / 31 / 39 / 49 / 61 reference scale */
	--fs-xs: 12px;
	--fs-sm: 14px;
	--fs-base: 16px;
	--fs-lg: 20px;
	--fs-xl: 25px;
	--fs-2xl: 31px;
	--fs-3xl: 39px;
	--fs-4xl: 49px;
	--fs-5xl: 61px;
	--font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--font-tech: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;

	/* Keep legacy component variables mapped to the same source of truth. */
	--installbox-ink: var(--text-primary);
	--installbox-deep: var(--gl-teal-800);
	--installbox-muted: var(--text-secondary);
	--installbox-accent: var(--gl-blue-500);
	--installbox-line: var(--border-subtle);
	--installbox-soft: var(--surface-alt);
}

html,
body {
	max-width: 100%;
	overflow-x: clip;
}

body {
	color: var(--text-primary);
	font-family: var(--font-ui);
	line-height: 1.6;
}

/* Shared visible focus. Menu/plugin styles previously removed native outlines. */
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--focus-ring) !important;
	outline-offset: 3px !important;
}

:where(button, input, select, textarea) {
	font: inherit;
}

/* The menu remains the existing information architecture; this only removes
 * the glass treatment and brings its geometry into the 2/4/8 px system. */
.installbox-mega-menu-global .installbox-glass-nav {
	border-radius: var(--radius-lg) !important;
	background: var(--surface) !important;
	box-shadow: var(--shadow-sm) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.installbox-mega-menu-global .installbox-mega-menu-app [data-slot="navigation-menu-viewport"],
.installbox-mega-menu-global .installbox-mega-menu-app [data-slot="navigation-menu-content"],
.installbox-mega-menu-global .installbox-mega-menu-app [data-slot="navigation-menu-content"] > div {
	border-color: var(--border-subtle) !important;
	border-radius: var(--radius-lg) !important;
	box-shadow: var(--shadow-card) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

/* Generic page rhythm for non-home routes. The homepage keeps its approved
 * RC1 stage and section layout while sharing the same tokens and focus state. */
body:not(.home) .installbox-theme-page,
body:not(.home) .installbox-product-archive,
body:not(.home) .installbox-product-single,
body:not(.home) .installbox-applications-page,
body:not(.home) .installbox-rfq-page,
body:not(.home) .installbox-legal-page {
	font-family: var(--font-ui);
}

body:not(.home) .installbox-theme-page h1,
body:not(.home) .installbox-product-archive h1,
body:not(.home) .installbox-product-single h1,
body:not(.home) .installbox-applications-page h1,
body:not(.home) .installbox-rfq-page h1,
body:not(.home) .installbox-w1-page h1 {
	letter-spacing: -.035em;
	line-height: 1.02;
}

/* Archive / selector */
.installbox-product-archive {
	--ib-archive-deep: var(--gl-teal-800);
	--ib-archive-ink: var(--text-primary);
	--ib-archive-muted: var(--text-secondary);
	--ib-archive-accent: var(--gl-blue-700);
	--ib-archive-yellow: var(--action-primary);
	--ib-archive-yellow-ink: var(--action-primary-ink);
	--ib-archive-focus: var(--focus-ring);
	background: var(--surface);
}

.installbox-product-archive-hero {
	border-bottom: 1px solid var(--border-subtle);
	background: var(--surface-alt);
}

.installbox-product-archive-kicker,
.installbox-product-archive-filters label,
.installbox-product-archive-card-kicker,
.installbox-product-archive-card-label {
	color: var(--text-tech) !important;
}

.installbox-product-archive h1 {
	max-width: 16ch;
	font-size: clamp(var(--fs-4xl), 5vw, var(--fs-5xl));
	font-weight: 750;
}

.installbox-product-archive-hero p:last-child {
	max-width: 68ch;
	color: var(--text-secondary);
	font-size: var(--fs-base);
	line-height: 1.65;
}

.installbox-product-archive-filters {
	border-color: var(--border-subtle);
	border-radius: var(--radius-lg);
	background: var(--surface-alt);
	box-shadow: none;
}

.installbox-product-archive-search input,
.installbox-product-archive-filter-fields select,
.installbox-product-archive-filters button {
	border-color: #b8cdd2;
	border-radius: var(--radius-md);
}

.installbox-product-archive-search input:focus,
.installbox-product-archive-filter-fields select:focus {
	border-color: var(--gl-blue-700);
	box-shadow: 0 0 0 3px rgba(0, 138, 144, .18);
}

.installbox-product-archive-filter-actions button,
.installbox-product-archive-card-view {
	border-color: var(--action-primary) !important;
	border-radius: var(--radius-md) !important;
	background: var(--action-primary) !important;
	color: var(--action-primary-ink) !important;
	transition: box-shadow var(--duration-standard) var(--ease-standard),
		transform var(--duration-fast) var(--ease-standard);
}

.installbox-product-archive-filter-actions button:hover,
.installbox-product-archive-card-view:hover,
.installbox-product-archive-card-rfq:hover {
	transform: translateY(-1px);
	box-shadow: var(--shadow-sm);
}

.installbox-product-archive-card-rfq {
	transition: box-shadow var(--duration-standard) var(--ease-standard),
		transform var(--duration-fast) var(--ease-standard);
}

.installbox-product-archive-reset,
.installbox-product-archive-card-rfq,
.installbox-product-archive-docs a {
	color: var(--text-tech) !important;
}

.installbox-product-archive-table-wrap {
	border-color: var(--border-subtle);
	border-radius: var(--radius-lg);
}

.installbox-product-archive-table thead th {
	background: var(--surface-alt);
}

.installbox-product-archive-table tbody th a {
	color: var(--gl-teal-800);
}

.installbox-product-archive-rfq,
.installbox-product-archive-card-rfq {
	border-color: var(--gl-blue-700) !important;
	border-radius: var(--radius-md) !important;
	color: var(--gl-blue-700) !important;
}

.installbox-product-archive-empty {
	border-color: var(--border-subtle);
	border-radius: var(--radius-md);
	background: var(--surface-alt);
}

.installbox-product-archive-card {
	border-color: var(--border-subtle);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-card);
}

.installbox-product-archive-card-image {
	border-color: var(--border-subtle);
	border-radius: var(--radius-md);
	background: var(--surface-alt);
}

.installbox-product-archive-card-specs > div {
	border-top-color: var(--border-subtle);
}

.installbox-product-archive-card h2,
.installbox-product-archive-dimension,
.installbox-product-archive-card dd {
	font-family: var(--font-tech);
	font-variant-numeric: tabular-nums;
}

.installbox-product-archive-card h2 {
	font-size: clamp(var(--fs-xl), 3vw, var(--fs-2xl));
}

/* Product detail cards, panels and technical tables */
.installbox-product-single {
	--ib-product-deep: var(--gl-teal-800);
	--ib-product-muted: var(--text-secondary);
	--ib-product-line: var(--border-subtle);
}

.installbox-product-panel,
.installbox-product-quick-card,
.installbox-product-related-model-grid a,
.installbox-product-related-grid a,
.installbox-product-rfq-box {
	border-color: var(--border-subtle) !important;
	border-radius: var(--radius-lg) !important;
	box-shadow: var(--shadow-card) !important;
}

.installbox-product-image-frame,
.installbox-product-gallery-frame,
.installbox-product-hero-image-frame {
	border-radius: var(--radius-lg) !important;
}

.installbox-product-rfq-button,
.installbox-product-secondary-button,
.installbox-product-related-links a,
.installbox-product-rfq-box .installbox-product-rfq-button {
	border-radius: var(--radius-md) !important;
	transition: box-shadow var(--duration-standard) var(--ease-standard),
		transform var(--duration-fast) var(--ease-standard);
}

.installbox-product-rfq-button:hover,
.installbox-product-secondary-button:hover,
.installbox-product-related-links a:hover,
.installbox-product-rfq-box .installbox-product-rfq-button:hover {
	transform: translateY(-1px);
	box-shadow: var(--shadow-sm);
}

.installbox-product-rfq-button {
	border-color: var(--action-primary) !important;
	background: var(--action-primary) !important;
	color: var(--action-primary-ink) !important;
}

.installbox-product-secondary-button {
	border-color: var(--gl-teal-800) !important;
	color: var(--gl-teal-800) !important;
}

.installbox-product-spec-table-wrap {
	border-color: var(--border-subtle) !important;
	border-radius: var(--radius-lg) !important;
}

.installbox-product-spec-table td,
.installbox-product-spec-value,
.installbox-product-quick-card strong {
	font-family: var(--font-tech);
	font-variant-numeric: tabular-nums;
}

/* Shared component styling for the application, technical, about, contact and
 * RFQ families. Selectors are limited to existing component names. */
.installbox-w1-category-item,
.installbox-w1-process-card,
.installbox-w1-knowledge-item,
.installbox-w1-option,
.installbox-feature-tile,
.installbox-applications-pathway-card,
.installbox-applications-market-panel,
.installbox-rfq-hero-panel,
.installbox-rfq-card-grid,
.installbox-contact-form,
.installbox-legal-section,
.installbox-interactive-scene-section .installbox-scene__stage {
	border-color: var(--border-subtle) !important;
	border-radius: var(--radius-lg) !important;
	box-shadow: var(--shadow-card);
}

.installbox-w1-button,
.installbox-w1-button-secondary,
.installbox-applications-button,
.installbox-applications-button-secondary,
.installbox-rfq-button,
.installbox-rfq-button-secondary,
.installbox-rfq-submit,
.installbox-contact-submit {
	border-radius: var(--radius-md) !important;
	transition: background-color var(--duration-standard) var(--ease-standard),
		border-color var(--duration-standard) var(--ease-standard),
		color var(--duration-standard) var(--ease-standard),
		box-shadow var(--duration-standard) var(--ease-standard),
		transform var(--duration-fast) var(--ease-standard);
}

.installbox-w1-button,
.installbox-applications-button,
.installbox-rfq-button,
.installbox-rfq-submit,
.installbox-contact-submit {
	background: var(--action-primary) !important;
	border-color: var(--action-primary) !important;
	color: var(--action-primary-ink) !important;
}

.installbox-w1-button-secondary,
.installbox-applications-button-secondary,
.installbox-rfq-button-secondary {
	border-color: var(--gl-teal-800) !important;
	color: var(--gl-teal-800) !important;
}

.installbox-w1-button:hover,
.installbox-w1-button-secondary:hover,
.installbox-applications-button:hover,
.installbox-applications-button-secondary:hover,
.installbox-rfq-button:hover,
.installbox-rfq-button-secondary:hover,
.installbox-rfq-submit:hover,
.installbox-contact-submit:hover {
	transform: translateY(-1px);
	box-shadow: var(--shadow-sm);
}

.installbox-w1-section-head,
.installbox-applications-section-head,
.installbox-rfq-section-head {
	max-width: 72ch;
}

.installbox-w1-section p,
.installbox-applications-section p,
.installbox-rfq-section p,
.installbox-legal-section p {
	max-width: 72ch;
}

/* Footer is shared by every route; link structure remains plugin-owned. */
.installbox-minimal-footer-root {
	--color-bg: var(--surface-inverse);
	--color-bg-soft: var(--surface-inverse);
	--color-surface: var(--surface-inverse);
	--color-text: var(--text-on-inverse);
	--color-text-muted: var(--gl-teal-300);
	--color-primary: var(--gl-blue-500);
	--color-primary-hover: var(--gl-blue-700);
	--color-border: rgba(143, 179, 189, .35);
}

.installbox-footer {
	border-top-color: var(--border-subtle) !important;
}

.installbox-footer-cta {
	border-radius: var(--radius-md) !important;
}

/* The homepage keeps its composition and RC1 mechanics, but its secondary
 * buttons/footers use the same compact industrial geometry. */
body.home .ib-home-v2-button,
body.home .ib-home-v2-button-primary,
body.home .ib-home-v2-button-light,
body.home .installbox-scroll-story__button,
body.home .installbox-footer-cta {
	border-radius: var(--radius-md) !important;
}

/* Preserve technical alignment wherever existing markup exposes a value. */
.installbox-product-single [class*="dimension"],
.installbox-product-single [class*="spec"],
.installbox-product-single [class*="model"],
.installbox-product-archive [class*="dimension"],
.installbox-product-archive [class*="spec"],
.installbox-product-archive [class*="model"] {
	font-variant-numeric: tabular-nums;
}

@media (max-width: 767px) {
	:root {
		--fs-4xl: 39px;
		--fs-5xl: 49px;
	}

	.installbox-theme-page,
	.installbox-product-archive-section {
		padding-bottom: var(--space-9);
	}

	.installbox-product-archive h1 {
		max-width: 15ch;
		font-size: clamp(39px, 11vw, 49px);
	}

	.installbox-product-archive-card-actions a {
		min-height: 46px;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
}