:root {
	--color-bg-dark: #11141E;
	--color-bg-dark-alt: #0F172A;
	--color-bg-light: #F8F8F8;
	--color-bg-card: #141D2F;
	--color-bg-card-alt: #1A2540;
	--color-primary: #3B82F6;
	--color-primary-hover: #2563EB;
	--color-accent-green: #22C55E;
	--color-accent-blue: #00A1E9;
	--color-accent-orange: #F97316;
	--color-text-white: #FFFFFF;
	--color-text-light: #CBD5E1;
	--color-text-muted: #94A3B8;
	--color-border: rgba(255,255,255,0.08);
	--color-border-light: rgba(255,255,255,0.12);
	--font-heading: 'Space Grotesk', sans-serif;
	--font-heading: 'Work Sans', sans-serif;
	--font-body: 'DM Sans', sans-serif;
	--font-body: 'Work Sans', sans-serif;
	--container-max: 1312px;
	--container-fmax: 1392px;
	--section-padding: 100px 0;
	
	
	--color-button-primary: #FAFAFA;
	--color-button-primary-hover: #0076A9;
	--color-white: #ffffff;
	--color-black: #141414;
	--color-grey: #ADB3BB;
	--color-lgrey: #F6F4F1;
	--color-l2grey: #565A60;
	--color-blue: #1E2337;
	--color-lblue: #0399DB;
	--color-dblue: #009DE3;
	--color-pblue: #0076A9;
	
	--spacing: 0.25rem;
	--inverted-boder-shadow-duration: .5s;
	--inverted-boder-shadow-color: #11141E;
	--aspect-video: 16/9;
	--radius-24: 1.5rem;
	--color-accent-yellow: #ffd453;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
	font-family: var(--font-body);
	background: var(--color-bg-dark);
	color: var(--color-text-light);
	line-height: 1.6;
	overflow-x: hidden;
	font-weight:400;
}

.container, .fcontainer {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: 0 16px;
}
.fcontainer {
	max-width: var(--container-fmax);
}

img { max-width: 100%; height: auto; display: block; }

a { text-decoration: none; color: inherit; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	color: var(--color-text-white);
	line-height: 1.2;
}

.btn-primary {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	background: var(--color-button-primary);
	color: var(--color-black);
	padding: 20px 32px;
	border-radius: 50px;
	font-weight: 500;
	font-size: 19px;
	border: none;
	cursor: pointer;
	transition: background 0.3s, transform 0.2s;
	font-family: var(--font-body);
	line-height: 1;
	text-align:center;
}
.btn-primary:hover { background: var(--color-button-primary-hover);color:var(--color-button-primary);text-decoration: underline; /*transform: translateY(-1px);*/ }

.btn-secondary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border:1px solid var(--color-blue);
 	background: var(--color-blue);
	color: var(--color-white);
	padding: 20px 32px;
	border-radius: 50px;
	font-weight: 500;
	font-size: 19px;
	cursor: pointer;
	transition: background 0.3s, transform 0.2s;
	font-family: var(--font-body);
	line-height: 1;
	text-align:center;
	
}
.btn-secondary:hover { background: transparent;color:var(--color-blue);text-decoration: underline;}


.section-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: var(--color-primary);
	margin-bottom: 16px;
}
.section-label .dot {
	width: 6px; height: 6px;
	background: var(--color-accent-green);
	border-radius: 50%;
}

/* Fade-in animation on scroll */
/*
.fade-up {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.7s ease, transform 0.7s ease;
}
.fade-up.visible {
	opacity: 1;
	transform: translateY(0);
}
*/
.stitle h1 {
  color:var(--color-lgrey);
  font-size: clamp(78px, 4vw, 54px);
  font-weight: 500;
  line-height: 105%;
}
.stitle h1 strong {
  font-weight: 500;
  background: linear-gradient(90deg, #ADB3BB 0%, #E8EEF6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}
.stitle.blk h1 strong {
  color:var(--color-black);
}

.stitle h2 {
  font-size: clamp(58px, 3.5vw, 46px);
  font-weight: 500;
  letter-spacing: -1.5px;
  color:var(--color-l2grey);
}
.stitle h2 strong {
  color:var(--color-white);
  font-weight: 500;
}
.stitle.blk h2 strong {
  color:var(--color-black);
  font-weight: 500;
}


.commontx1 {
	color: var(--color-grey);
	font-size: 14px;
	line-height:1.5;
	letter-spacing: -0.25px;
	font-weight:400;
}
.commontx2 {
	color: var(--color-grey);
	font-size: 16px;
	line-height:19.5px;
	font-weight:400;
}
.commontx {
	color: var(--color-grey);
	font-size: 19px;
	letter-spacing: -0.25px;
	line-height:1.5;
	font-weight:400;
}


.pad-cmn{padding:24px 0;}
.dspc40{padding:20px 0;}
.dspc56{padding:28px 0;}
.dspc64{padding:32px 0;}
.dspc80{padding:40px 0;}
.dspc112{padding:56px 0;}
.dspc120{padding:60px 0;}


@media (max-width: 1100px) {
.stitle h1{font-size:60px;}
.stitle h2{font-size:46px;}
.commontx,
.commontx1{font-size:14px;}

.mnospc{padding:1px 0 0;}	
.mpad-cmn{padding:24px 0;}
.mdspcno{padding:1px 0 0;}
.mdspc16{padding:8px 0;}
.mdspc32{padding:16px 0;}
.mdspc40{padding:20px 0;}
.mdspc64{padding:32px 0;}
.mdspc80{padding:40px 0;}
.mdspc112{padding:56px 0;}

}

@media (min-width: 992px) {
.ipadno{display:none !important;}
}
@media (min-width: 768px) {
.dsno{display:none !important;}
}

@media (max-width: 767px) {
.mbfl{width:100%;}
.mbno{display:none !important;}
.stitle h1{font-size:44px;}
.stitle h2{font-size:33px;}
.commontx,
.commontx1{font-size:12px;}
}


.hero-brand{
  margin-bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--color-white);
  text-transform: uppercase;
  letter-spacing: -1px;
}
.hero-brand.no{margin-bottom:0px;}
.hero-ttx{margin:32px 0 0;}
.hero-btn{margin:24px 0 0;}

@media (max-width: 767px){
.hero-ttx{margin:16px 0 0;}		
}