/* =========================================================
   QUANTUMIA - INTERNAL PAGES THEME
   Navy + Gold + Cyan
========================================================= */

:root {
	--q-bg: #020617;
	--q-bg-soft: #06101f;
	--q-panel: #081525;
	--q-panel-light: #0b1c30;

	--q-gold: #facc15;
	--q-gold-light: #fde047;
	--q-gold-dark: #f59e0b;

	--q-blue: #2563eb;
	--q-cyan: #38bdf8;
	--q-cyan-light: #7dd3fc;

	--q-green: #22c55e;
	--q-red: #ef4444;

	--q-white: #f8fafc;
	--q-text: #cbd5e1;
	--q-muted: #94a3b8;

	--q-border: rgba(148, 163, 184, 0.14);
	--q-border-blue: rgba(56, 189, 248, 0.22);
	--q-border-gold: rgba(250, 204, 21, 0.32);

	--q-radius: 18px;

	--q-shadow:
		0 25px 60px rgba(0, 0, 0, 0.34);
}


/* =========================================================
   GLOBAL
========================================================= */

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0 0 78px;

	background:
		radial-gradient(
			circle at 50% 0%,
			rgba(37, 99, 235, 0.12),
			transparent 30%
		),
		var(--q-bg);

	color: var(--q-text);

	font-family: "Work Sans", sans-serif;
}

body,
p,
li {
	color: var(--q-text);
}

::selection {
	background: var(--q-gold);
	color: var(--q-bg);
}

a {
	transition:
		color 0.25s ease,
		background 0.25s ease,
		border-color 0.25s ease,
		transform 0.25s ease;
}

.text-primary {
	color: var(--q-gold) !important;
}

.text-white {
	color: var(--q-white) !important;
}


/* =========================================================
   NAVBAR
========================================================= */

.site-nav {
	background: transparent;
}

.site-nav .menu-bg-wrap {
	background:
		linear-gradient(
			135deg,
			rgba(2, 6, 23, 0.95),
			rgba(8, 21, 37, 0.95)
		) !important;

	border:
		1px solid rgba(255, 255, 255, 0.08);

	box-shadow:
		0 12px 35px rgba(0, 0, 0, 0.24);

	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}

.site-nav .logo {
	color: var(--q-white) !important;
	font-weight: 700;
}

.site-nav .logo span {
	color: var(--q-gold) !important;
}

.site-nav .site-navigation .site-menu > li > a {
	color: #dbeafe !important;
}

.site-nav .site-navigation .site-menu > li > a:hover,
.site-nav .site-navigation .site-menu > li.active > a {
	color: var(--q-gold) !important;
}

.site-nav .call-us {
	color: var(--q-white) !important;
	cursor: pointer;
}

.site-nav .call-us .icon-phone {
	color: var(--q-gold) !important;
}

.site-nav .burger span,
.site-nav .burger span::before,
.site-nav .burger span::after {
	background: var(--q-white) !important;
}


/* =========================================================
   MOBILE MENU
========================================================= */

.site-mobile-menu {
	background: #06101f !important;
}

.site-mobile-menu .site-nav-wrap a {
	color: var(--q-text) !important;
}

.site-mobile-menu .site-nav-wrap a:hover {
	color: var(--q-gold) !important;
}


/* =========================================================
   HERO
========================================================= */

.quantum-page-hero {
	position: relative;

	min-height: 470px;

	display: flex;
	align-items: center;

	overflow: hidden;

	padding:
		150px 0 80px;

	background:
		radial-gradient(
			circle at 80% 20%,
			rgba(56, 189, 248, 0.17),
			transparent 32%
		),
		radial-gradient(
			circle at 10% 80%,
			rgba(250, 204, 21, 0.08),
			transparent 30%
		),
		linear-gradient(
			135deg,
			#020617 0%,
			#071426 50%,
			#04101f 100%
		);
}

.quantum-page-hero::before {
	content: "";

	position: absolute;

	width: 470px;
	height: 470px;

	right: -180px;
	top: -160px;

	border-radius: 50%;

	background:
		rgba(37, 99, 235, 0.08);

	filter: blur(25px);
}

.quantum-page-hero .container {
	position: relative;
	z-index: 2;
}

.quantum-page-hero .eyebrow {
	display: inline-flex;

	align-items: center;

	gap: 0.45rem;

	padding:
		0.42rem 0.85rem;

	margin-bottom: 1rem;

	border:
		1px solid var(--q-border-gold);

	border-radius: 999px;

	background:
		rgba(250, 204, 21, 0.06);

	color: var(--q-gold);

	font-size: 0.8rem;
	font-weight: 700;

	letter-spacing: 0.08em;

	text-transform: uppercase;
}

.quantum-page-hero h1,
.quantum-page-hero h2 {
	color: var(--q-white) !important;

	font-weight: 800;

	font-size:
		clamp(2.3rem, 5vw, 4rem);

	line-height: 1.08;
}

.quantum-page-hero p {
	max-width: 690px;

	color: var(--q-text) !important;

	font-size: 1.08rem;

	line-height: 1.8;
}

.quantum-page-hero .hero-image {
	position: relative;

	padding: 10px;

	border:
		1px solid var(--q-border-blue);

	border-radius: 1.4rem;

	background:
		linear-gradient(
			145deg,
			#0b1c30,
			#040b16
		);

	box-shadow:
		var(--q-shadow);
}

.quantum-page-hero .hero-image img {
	display: block;

	width: 100%;
	height: auto;

	border-radius: 1rem;
}


/* =========================================================
   BUTTONS
========================================================= */

.quantum-btn {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	gap: 0.5rem;

	padding:
		0.8rem 1.35rem;

	border:
		1px solid var(--q-gold);

	border-radius: 12px;

	background:
		linear-gradient(
			135deg,
			var(--q-gold-light),
			var(--q-gold-dark)
		);

	color: #07111e !important;

	font-weight: 800;

	text-decoration: none;

	box-shadow:
		0 12px 30px rgba(250, 204, 21, 0.16);
}

.quantum-btn:hover {
	transform: translateY(-2px);

	filter: brightness(1.05);

	color: #07111e !important;

	box-shadow:
		0 16px 38px rgba(250, 204, 21, 0.27);
}

.quantum-btn-outline {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	gap: 0.5rem;

	padding:
		0.8rem 1.35rem;

	border:
		1px solid rgba(56, 189, 248, 0.35);

	border-radius: 12px;

	background:
		rgba(56, 189, 248, 0.06);

	color: var(--q-white) !important;

	font-weight: 700;

	text-decoration: none;
}

.quantum-btn-outline:hover {
	background:
		rgba(56, 189, 248, 0.14);

	border-color:
		var(--q-cyan);

	transform:
		translateY(-2px);
}


/* =========================================================
   PAGE CONTENT
========================================================= */

.quantum-content-section {
	position: relative;

	padding:
		5rem 0;

	background:
		linear-gradient(
			180deg,
			#020617 0%,
			#06101f 100%
		);
}

.quantum-content-header {
	max-width: 760px;

	margin:
		0 auto 3rem;

	text-align: center;
}

.quantum-content-header .eyebrow {
	display: inline-block;

	margin-bottom: 0.8rem;

	color: var(--q-gold);

	font-size: 0.8rem;
	font-weight: 700;

	letter-spacing: 0.08em;

	text-transform: uppercase;
}

.quantum-content-header h2 {
	color: var(--q-white);

	font-size:
		clamp(2rem, 4vw, 3rem);

	font-weight: 800;
}

.quantum-content-header p {
	color: var(--q-muted);

	line-height: 1.75;
}


/* =========================================================
   GENERIC CARDS
========================================================= */

.quantum-card {
	height: 100%;

	padding: 2rem;

	border:
		1px solid var(--q-border);

	border-radius: var(--q-radius);

	background:
		linear-gradient(
			145deg,
			#0b1c30,
			#06101f
		);

	box-shadow:
		0 20px 50px rgba(0, 0, 0, 0.24);

	transition:
		transform 0.3s ease,
		border-color 0.3s ease,
		box-shadow 0.3s ease;
}

.quantum-card:hover {
	transform:
		translateY(-5px);

	border-color:
		var(--q-border-gold);

	box-shadow:
		0 28px 65px rgba(0, 0, 0, 0.34);
}

.quantum-card h2,
.quantum-card h3,
.quantum-card h4 {
	color: var(--q-white);
}

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


/* =========================================================
   CONTACT
========================================================= */

.contact-grid {
	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap: 1.5rem;
}

.contact-card {
	text-align: center;
}

.contact-icon {
	width: 64px;
	height: 64px;

	margin:
		0 auto 1.25rem;

	display: flex;

	align-items: center;
	justify-content: center;

	border:
		1px solid var(--q-border-gold);

	border-radius: 18px;

	background:
		rgba(250, 204, 21, 0.07);

	color: var(--q-gold);

	font-size: 1.7rem;
}

.contact-card h3 {
	margin-bottom: 0.7rem;

	color: var(--q-white);

	font-size: 1.25rem;
}

.contact-card p,
.contact-card a {
	color: var(--q-text);

	text-decoration: none;
}

.contact-card a:hover {
	color: var(--q-gold);
}


/* =========================================================
   FAQ
========================================================= */

.faq-list {
	display: grid;

	grid-template-columns: 1fr;

	gap: 1rem;

	max-width: 1050px;

	margin: 0 auto;
}

.faq-item {
	overflow: hidden;

	border:
		1px solid var(--q-border);

	border-radius: 16px;

	background:
		linear-gradient(
			145deg,
			#0b1c30,
			#06101f
		);

	box-shadow:
		0 15px 38px rgba(0, 0, 0, 0.20);
}

.faq-item summary {
	position: relative;

	display: flex;

	align-items: center;

	gap: 1rem;

	padding:
		1.35rem 1.5rem;

	color: var(--q-white);

	font-size: 1.03rem;
	font-weight: 700;

	cursor: pointer;

	list-style: none;
}

.faq-item summary::-webkit-details-marker {
	display: none;
}

.faq-item summary::before {
	content: "?";

	width: 32px;
	height: 32px;

	display: inline-flex;

	align-items: center;
	justify-content: center;

	flex-shrink: 0;

	border-radius: 50%;

	background:
		rgba(250, 204, 21, 0.10);

	color: var(--q-gold);

	font-weight: 800;
}

.faq-item summary::after {
	content: "+";

	margin-left: auto;

	color: var(--q-gold);

	font-size: 1.4rem;
}

.faq-item[open] summary::after {
	content: "−";
}

.faq-answer {
	padding:
		0 1.5rem 1.5rem 4.55rem;

	border-top:
		1px solid rgba(148, 163, 184, 0.08);
}

.faq-answer p {
	color: var(--q-text);

	line-height: 1.75;
}

.faq-answer strong {
	color: var(--q-gold-light);
}

.faq-answer ul {
	color: var(--q-text);
}

.faq-answer li {
	margin-bottom: 0.45rem;
}


/* =========================================================
   TERMS
========================================================= */

.terms-card {
	max-width: 1100px;

	margin: 0 auto;

	padding:
		clamp(1.4rem, 4vw, 3rem);

	border:
		1px solid var(--q-border);

	border-radius: 20px;

	background:
		linear-gradient(
			145deg,
			#09192a,
			#050d19
		);

	box-shadow:
		var(--q-shadow);
}

.terms-intro {
	margin-bottom: 2rem;

	padding: 1.3rem;

	border:
		1px solid rgba(250, 204, 21, 0.25);

	border-left:
		4px solid var(--q-gold);

	border-radius: 12px;

	background:
		rgba(250, 204, 21, 0.05);

	color: #fde68a;

	line-height: 1.7;
}

.terms-card h3 {
	margin:
		2.1rem 0 1rem;

	color: var(--q-gold);

	font-size: 1.2rem;
	font-weight: 800;
}

.terms-card h5 {
	margin-top: 2rem;

	color: var(--q-white);
}

.terms-card p {
	margin-bottom: 0.9rem;

	color: var(--q-text);

	line-height: 1.75;
}


/* =========================================================
   CTA SECTION
========================================================= */

.page-cta {
	padding:
		4rem 0;

	background:
		radial-gradient(
			circle at 50% 0%,
			rgba(37, 99, 235, 0.16),
			transparent 45%
		),
		#030b16;

	text-align: center;
}

.page-cta-inner {
	max-width: 820px;

	margin: 0 auto;

	padding:
		2.5rem;

	border:
		1px solid var(--q-border-blue);

	border-radius: 22px;

	background:
		linear-gradient(
			145deg,
			#0b1c30,
			#06101f
		);

	box-shadow:
		var(--q-shadow);
}

.page-cta h2 {
	color: var(--q-white);

	font-weight: 800;
}

.page-cta p {
	color: var(--q-muted);
}


/* =========================================================
   RISK BAR
========================================================= */

.risk-bar {
	position: fixed;

	left: 0;
	bottom: 0;

	z-index: 9999;

	width: 100%;

	padding:
		8px 14px;

	border-top:
		2px solid #d4af37;

	background:
		rgba(5, 8, 13, 0.97);

	color: #e5e7eb;

	text-align: center;

	font-family: Arial, sans-serif;

	font-size: 11px;

	line-height: 1.4;

	backdrop-filter: blur(8px);
}

.risk-bar strong {
	color: #fff;
}

.risk-bar a {
	color: #d4af37;

	text-decoration: underline;
}


/* =========================================================
   WHATSAPP
========================================================= */

.whatsapp-button {
	position: fixed;

	right: 1.5rem;
	bottom: 90px;

	z-index: 10000;

	width: 58px;
	height: 58px;

	display: flex;

	align-items: center;
	justify-content: center;

	border-radius: 50%;

	background:
		linear-gradient(
			135deg,
			#25d366,
			#16a34a
		);

	box-shadow:
		0 8px 30px rgba(37, 211, 102, 0.32);

	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease;
}

.whatsapp-button:hover {
	transform: scale(1.08);

	box-shadow:
		0 12px 40px rgba(37, 211, 102, 0.48);
}

.whatsapp-button img {
	width: 31px;
	height: 31px;

	object-fit: contain;
}


/* =========================================================
   FOOTER
========================================================= */

.site-footer {
	background:
		linear-gradient(
			180deg,
			#030b16 0%,
			#020617 100%
		) !important;

	border-top:
		1px solid var(--q-border);

	padding-bottom:
		4rem;
}

.site-footer h3 {
	color: var(--q-white) !important;
}

.site-footer p,
.site-footer address {
	color: var(--q-muted) !important;
}

.site-footer a {
	color: var(--q-text) !important;
}

.site-footer a:hover {
	color: var(--q-gold) !important;
}

.site-footer .social li a {
	background: #0b1c30 !important;

	border:
		1px solid var(--q-border);

	color: var(--q-gold) !important;
}

.site-footer .social li a:hover {
	background: var(--q-gold) !important;

	border-color: var(--q-gold) !important;

	color: var(--q-bg) !important;
}


/* =========================================================
   PRELOADER
========================================================= */

#overlayer {
	background: var(--q-bg) !important;
}

.loader .spinner-border {
	color: var(--q-gold) !important;
}


/* =========================================================
   SCROLLBAR
========================================================= */

::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-track {
	background: var(--q-bg);
}

::-webkit-scrollbar-thumb {
	background:
		linear-gradient(
			180deg,
			#334155,
			#1e3a5f
		);

	border:
		2px solid var(--q-bg);

	border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--q-gold);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

	.quantum-page-hero {
		min-height: auto;

		padding:
			130px 0 65px;
	}

	.contact-grid {
		grid-template-columns: 1fr;
	}

	.quantum-page-hero .hero-image {
		margin-top: 2rem;
	}

}

@media (max-width: 767px) {

	body {
		padding-bottom: 95px;
	}

	.quantum-page-hero {
		padding:
			120px 0 55px;
	}

	.quantum-page-hero h1,
	.quantum-page-hero h2 {
		font-size: 2.25rem;
	}

	.quantum-page-hero p {
		font-size: 0.96rem;
	}

	.quantum-content-section {
		padding:
			3.5rem 0;
	}

	.quantum-card {
		padding: 1.5rem;
	}

	.faq-item summary {
		padding:
			1.15rem;

		font-size: 0.95rem;
	}

	.faq-answer {
		padding:
			0 1.15rem 1.2rem;
	}

	.whatsapp-button {
		right: 1rem;
		bottom: 100px;

		width: 50px;
		height: 50px;
	}

	.whatsapp-button img {
		width: 27px;
		height: 27px;
	}

	.risk-bar {
		font-size: 9px;

		padding:
			6px 8px;
	}

}