/**
 * UTech Glass UI — site-wide expert glassmorphism
 * Brand solids only: #262261 / #EB7D23 (no color gradients)
 */
:root {
	--ug-navy: #262261;
	--ug-orange: #EB7D23;
	--ug-bg: #e9ebf5;
	--ug-muted: #565353;
	--ug-glass: rgba(255, 255, 255, 0.42);
	--ug-glass-strong: rgba(255, 255, 255, 0.62);
	--ug-glass-soft: rgba(255, 255, 255, 0.28);
	--ug-glass-navy: rgba(38, 34, 97, 0.55);
	--ug-glass-navy-strong: rgba(38, 34, 97, 0.72);
	--ug-border: rgba(255, 255, 255, 0.55);
	--ug-border-soft: rgba(255, 255, 255, 0.28);
	--ug-border-navy: rgba(38, 34, 97, 0.12);
	--ug-blur: blur(22px);
	--ug-shadow: 0 12px 40px rgba(38, 34, 97, 0.08);
	--ug-shadow-lg: 0 24px 56px rgba(38, 34, 97, 0.14);
}

/* —— Page canvas —— */
html {
	background-color: var(--ug-bg);
}

body {
	background-color: var(--ug-bg) !important;
}

/* Home uses solid white canvas (hero keeps its own navy) */
html:has(body.utech-home),
body.utech-home {
	background-color: #ffffff !important;
}

main,
.main-content,
.page-content,
.content,
.homepage-expert {
	position: relative;
	isolation: isolate;
}

/* Soft ambient wash behind content (not home hero canvas) */
body:not(.utech-home)::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: var(--ug-bg);
}

body:not(.utech-home)::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-color: transparent;
	box-shadow:
		inset 120px 80px 180px rgba(38, 34, 97, 0.08),
		inset -140px 40px 160px rgba(235, 125, 35, 0.06),
		inset 0 -120px 180px rgba(38, 34, 97, 0.05);
}

/* —— Glass surfaces (all pages except home) —— */
body:not(.utech-home) .card,
body:not(.utech-home) .card.bg-body,
body:not(.utech-home) .card.bg-white,
body:not(.utech-home) .card.bg-light,
body:not(.utech-home) .bg-white.card,
body:not(.utech-home) .shadow.card,
body:not(.utech-home) .shadow-sm.card,
body:not(.utech-home) .shadow-lg.card,
body:not(.utech-home) .modal-content,
body:not(.utech-home) .offcanvas,
body:not(.utech-home) .accordion-item,
body:not(.utech-home) .list-group-item,
body:not(.utech-home) .table,
body:not(.utech-home) .alert:not(.alert-danger):not(.alert-success):not(.alert-warning),
body:not(.utech-home) .form-control,
body:not(.utech-home) .form-select,
body:not(.utech-home) .input-group-text,
body:not(.utech-home) .pagination .page-link,
body:not(.utech-home) .nav-pills .nav-link,
body:not(.utech-home) .badge.bg-light,
body:not(.utech-home) .bg-light:not(.utech-header):not(.utech-header *),
body:not(.utech-home) .bg-white:not(.utech-header):not(.utech-header *),
body:not(.utech-home) .bg-body:not(.utech-header):not(.utech-header *),
body:not(.utech-home) .bg-secondary-grad,
body:not(.utech-home) .bg-light-gradient,
body:not(.utech-home) .bg-white-gradient {
	background: var(--ug-glass) !important;
	background-image: none !important;
	backdrop-filter: var(--ug-blur);
	-webkit-backdrop-filter: var(--ug-blur);
	border-color: var(--ug-border-navy) !important;
	box-shadow: var(--ug-shadow);
}

/* Header dropdowns keep readable glass, not washed by global .dropdown-menu rules */
.utech-header .dropdown-menu {
	background: rgba(255, 255, 255, 0.92) !important;
	backdrop-filter: blur(22px);
	-webkit-backdrop-filter: blur(22px);
	border: 1px solid rgba(38, 34, 97, 0.1) !important;
	box-shadow: 0 16px 40px rgba(38, 34, 97, 0.12) !important;
}

body:not(.utech-home) .card,
body:not(.utech-home) .modal-content,
body:not(.utech-home) .offcanvas,
body:not(.utech-home) .dropdown-menu,
body:not(.utech-home) .accordion-item {
	border: 1px solid var(--ug-border) !important;
	border-radius: 18px !important;
	box-shadow: var(--ug-shadow) !important;
}

body:not(.utech-home) .card:hover {
	background: var(--ug-glass-strong) !important;
	box-shadow: var(--ug-shadow-lg) !important;
}

body:not(.utech-home) .card-header,
body:not(.utech-home) .card-footer,
body:not(.utech-home) .modal-header,
body:not(.utech-home) .modal-footer,
body:not(.utech-home) .accordion-button,
body:not(.utech-home) .list-group-item + .list-group-item {
	background: rgba(255, 255, 255, 0.28) !important;
	border-color: rgba(38, 34, 97, 0.08) !important;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

body:not(.utech-home) .accordion-button:not(.collapsed) {
	background: rgba(38, 34, 97, 0.08) !important;
	color: var(--ug-navy) !important;
	box-shadow: none !important;
}

/* Form fields: clearer glass (non-home) */
body:not(.utech-home) .form-control,
body:not(.utech-home) .form-select {
	border-radius: 12px !important;
	border: 1px solid rgba(38, 34, 97, 0.12) !important;
	background: rgba(255, 255, 255, 0.55) !important;
	box-shadow: none !important;
}

body:not(.utech-home) .form-control:focus,
body:not(.utech-home) .form-select:focus {
	border-color: var(--ug-orange) !important;
	box-shadow: 0 0 0 0.2rem rgba(235, 125, 35, 0.18) !important;
	background: rgba(255, 255, 255, 0.78) !important;
}

/* Primary / accent solids */
.bg-primary,
.bg-primary-grad,
.btn-primary,
.btn-primary-grad,
.badge.bg-primary,
.badge.bg-primary-grad {
	background: var(--ug-navy) !important;
	background-image: none !important;
	border-color: transparent !important;
}

.btn-primary,
.btn-primary-grad {
	background: var(--ug-orange) !important;
	color: #fff !important;
	border: 1px solid transparent !important;
	box-shadow: 0 10px 24px rgba(38, 34, 97, 0.14);
}

body:not(.utech-home) .btn-primary,
body:not(.utech-home) .btn-primary-grad {
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

.btn-primary:hover,
.btn-primary-grad:hover {
	background: var(--ug-navy) !important;
	color: #fff !important;
}

body:not(.utech-home) .btn-outline-primary,
body:not(.utech-home) .btn-light,
body:not(.utech-home) .btn-outline-secondary {
	background: var(--ug-glass) !important;
	border: 1px solid var(--ug-border) !important;
	backdrop-filter: var(--ug-blur);
	-webkit-backdrop-filter: var(--ug-blur);
	color: var(--ug-navy) !important;
}

.utech-home .btn-outline-primary,
.utech-home .btn-light,
.utech-home .btn-outline-secondary {
	background: #ffffff !important;
	border: 1px solid rgba(38, 34, 97, 0.15) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	color: var(--ug-navy) !important;
}

/* Navy glass panels (CTA / process / dark strips) — non-home */
body:not(.utech-home) .bg-dark,
body:not(.utech-home) .bg-primary-grad.text-white,
body:not(.utech-home) .card.bg-primary-grad,
body:not(.utech-home) .card.bg-primary,
body:not(.utech-home) .text-bg-primary,
body:not(.utech-home) .text-bg-dark {
	background: var(--ug-glass-navy) !important;
	background-image: none !important;
	color: #fff !important;
	border: 1px solid rgba(255, 255, 255, 0.16) !important;
	backdrop-filter: var(--ug-blur);
	-webkit-backdrop-filter: var(--ug-blur);
	box-shadow: 0 20px 48px rgba(38, 34, 97, 0.2);
}

/* Orange accent chips stay solid orange with glass edge */
.badge.bg-warning,
.badge.text-bg-warning {
	background: var(--ug-orange) !important;
	color: #fff !important;
}

/* Tables */
.table {
	--bs-table-bg: transparent;
	--bs-table-striped-bg: rgba(255, 255, 255, 0.28);
	--bs-table-hover-bg: rgba(255, 255, 255, 0.4);
	overflow: hidden;
	border-radius: 16px;
}

.table > :not(caption) > * > * {
	background: transparent !important;
	border-bottom-color: rgba(38, 34, 97, 0.08) !important;
}

/* Pagination / pills */
.pagination .page-link {
	border-radius: 10px !important;
	margin: 0 0.15rem;
	color: var(--ug-navy) !important;
}

.pagination .page-item.active .page-link,
.nav-pills .nav-link.active {
	background: var(--ug-orange) !important;
	color: #fff !important;
	border-color: transparent !important;
}

/* Modals & dropdowns sit above glass (non-home) */
body:not(.utech-home) .modal-content,
body:not(.utech-home) .dropdown-menu {
	background: rgba(255, 255, 255, 0.78) !important;
	backdrop-filter: blur(28px);
	-webkit-backdrop-filter: blur(28px);
}

/* Utility helpers for page authors (non-home) */
body:not(.utech-home) .utech-glass,
body:not(.utech-home) .ug-glass {
	background: var(--ug-glass) !important;
	border: 1px solid var(--ug-border) !important;
	backdrop-filter: var(--ug-blur) !important;
	-webkit-backdrop-filter: var(--ug-blur) !important;
	box-shadow: var(--ug-shadow) !important;
	border-radius: 20px;
}

body:not(.utech-home) .utech-glass-strong,
body:not(.utech-home) .ug-glass-strong {
	background: var(--ug-glass-strong) !important;
	border: 1px solid var(--ug-border) !important;
	backdrop-filter: var(--ug-blur) !important;
	-webkit-backdrop-filter: var(--ug-blur) !important;
}

body:not(.utech-home) .utech-glass-navy,
body:not(.utech-home) .ug-glass-navy {
	background: var(--ug-glass-navy) !important;
	border: 1px solid rgba(255, 255, 255, 0.16) !important;
	color: #fff !important;
	backdrop-filter: var(--ug-blur) !important;
	-webkit-backdrop-filter: var(--ug-blur) !important;
}

body:not(.utech-home) .utech-glass-panel {
	padding: 1.5rem;
	border-radius: 22px;
	background: var(--ug-glass);
	border: 1px solid var(--ug-border);
	backdrop-filter: var(--ug-blur);
	-webkit-backdrop-filter: var(--ug-blur);
	box-shadow: var(--ug-shadow);
}

/* Footer always solid brand navy (never glass wash) */
.footer-expert,
footer.footer-expert {
	background: #262261 !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

/* Home page: NO glass UI — solid surfaces only */
html:has(body.utech-home),
body.utech-home {
	background-color: #ffffff !important;
}

body.utech-home::before,
body.utech-home::after {
	display: none !important;
	content: none !important;
	box-shadow: none !important;
}

.utech-home .section-wrapper:not(:has(.uh-hero)),
.utech-home .component-wrapper > section:not(.uh-hero),
.utech-home .bg-light-gradient {
	background: #f4f5f8 !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.utech-home .uh-hero,
.utech-home .section-wrapper:has(.uh-hero),
.utech-home .component-wrapper:has(.uh-hero) {
	background: #262261 !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.utech-home .bg-white-gradient {
	background: #ffffff !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.utech-home .card,
.utech-home .service-card-expert,
.utech-home .client-card,
.utech-home .client-logo-item,
.utech-home .client-showcase-card,
.utech-home .client-stat-box,
.utech-home .trust-badge-box,
.utech-home .project-card,
.utech-home .project-card-expert,
.utech-home .testimonial-card,
.utech-home .testimonial-card-expert,
.utech-home .pricing-card,
.utech-home .price-card-expert,
.utech-home .faq-item,
.utech-home .faq-accordion-item,
.utech-home .faq-cta-section,
.utech-home .about-floating-stats,
.utech-home .stat-card,
.utech-home .value-card,
.utech-home .mission-card,
.utech-home .about-card,
.utech-home .utech-glass,
.utech-home .ug-glass,
.utech-home .utech-glass-strong,
.utech-home .ug-glass-strong,
.utech-home .utech-glass-panel,
.utech-home .bg-white,
.utech-home .bg-light,
.utech-home .bg-body,
.utech-home .modal-content,
.utech-home .dropdown-menu,
.utech-home .accordion-item,
.utech-home .list-group-item,
.utech-home .form-control,
.utech-home .form-select,
.utech-home .card-header,
.utech-home .card-footer,
.utech-home .accordion-button {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	background-image: none !important;
}

.utech-home .bg-white,
.utech-home .bg-body,
.utech-home .card,
.utech-home .modal-content,
.utech-home .dropdown-menu,
.utech-home .accordion-item,
.utech-home .list-group-item {
	background: #ffffff !important;
}

.utech-home .bg-light {
	background: #f4f5f8 !important;
}

.utech-home .form-control,
.utech-home .form-select {
	background: #ffffff !important;
}

.utech-home .card-header,
.utech-home .card-footer,
.utech-home .accordion-button {
	background: #f4f5f8 !important;
}

.utech-home .service-card-expert,
.utech-home .project-card-expert,
.utech-home .testimonial-card-expert,
.utech-home .price-card-expert,
.utech-home .client-logo-item,
.utech-home .client-logos-grid-container,
.utech-home .trust-badge-box,
.utech-home .value-card,
.utech-home .mission-card,
.utech-home .stat-card {
	background: #ffffff !important;
	border: 1px solid rgba(38, 34, 97, 0.1) !important;
	box-shadow: 0 10px 28px rgba(38, 34, 97, 0.08) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.utech-home .client-logos-grid-container {
	background: #f4f5f8 !important;
}

/* Keep dark hero solid navy */
.utech-home .uh-hero,
.utech-home .uh-hero * {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

/* Dark theme */
[data-bs-theme="dark"] body {
	background-color: #1a1838 !important;
}

[data-bs-theme="dark"] body:not(.utech-home)::before,
[data-bs-theme="dark"] body:not(.utech-home)::after {
	background: #1a1838;
	box-shadow:
		inset 120px 80px 180px rgba(38, 34, 97, 0.35),
		inset -140px 40px 160px rgba(235, 125, 35, 0.08);
}

[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .accordion-item,
[data-bs-theme="dark"] .list-group-item,
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .bg-white,
[data-bs-theme="dark"] .bg-body,
[data-bs-theme="dark"] .bg-secondary-grad,
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark"] .pagination .page-link {
	background: rgba(38, 34, 97, 0.45) !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #e2e8f0;
}

[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer,
[data-bs-theme="dark"] .accordion-button {
	background: rgba(255, 255, 255, 0.06) !important;
	color: #e2e8f0 !important;
}

/* Reduced motion: keep glass on non-home, drop heavy blur cost optionally */
@media (prefers-reduced-motion: reduce) {
	body:not(.utech-home) .card,
	body:not(.utech-home) .modal-content,
	body:not(.utech-home) .utech-glass,
	body:not(.utech-home) .ug-glass {
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
	}
}

/* Don't glass the WebGL / immersive hero */
.utech-home .uh-hero,
.utech-home .uh-hero *,
.utech-home canvas {
	backdrop-filter: none;
}
