.elementor-kit-19{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-6a3a5fc:#020617;--e-global-color-6d07b54:#0EA5FF;--e-global-color-2a152ed:#94A3B8;--e-global-color-2c381d3:#0B1736;--e-global-color-e61ac87:#BE8E23;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-19 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* =========================================================
   BUSINESS ARENA — MASTER STYLESHEET
   Consistent dark cosmic design for all sections
   ========================================================= */

/* ---------- DESIGN TOKENS (CSS Variables) ---------- */
:root {
	--ba-bg-deep:      #020617;
	--ba-bg-mid:       #0B1736;
	--ba-card-bg:      rgba(11, 23, 54, 0.55);
	--ba-card-bg-hover: rgba(14, 165, 255, 0.06);
	--ba-border:       rgba(14, 165, 255, 0.18);
	--ba-border-hover: rgba(14, 165, 255, 0.45);
	--ba-accent:       #0EA5FF;
	--ba-accent-soft:  rgba(14, 165, 255, 0.12);
	--ba-text:         #FFFFFF;
	--ba-text-soft:    #CBD5E1;
	--ba-text-muted:   #94A3B8;
	--ba-glow:         0 0 40px rgba(14, 165, 255, 0.15);
	--ba-glow-strong:  0 0 60px rgba(14, 165, 255, 0.25);
	--ba-radius:       14px;
	--ba-radius-sm:    10px;
	--ba-transition:   all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* =========================================================
   1. HERO SECTION (.ba-hero)
   ========================================================= */

.ba-hero {
	position: relative;
	overflow: hidden;
}

/* Subtle starfield effect using radial gradients (until you upload Earth image) */
.ba-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,0.4), transparent),
		radial-gradient(1px 1px at 60% 70%, rgba(255,255,255,0.3), transparent),
		radial-gradient(1px 1px at 80% 20%, rgba(255,255,255,0.5), transparent),
		radial-gradient(2px 2px at 40% 80%, rgba(255,255,255,0.3), transparent),
		radial-gradient(1px 1px at 90% 50%, rgba(255,255,255,0.4), transparent),
		radial-gradient(1px 1px at 15% 65%, rgba(255,255,255,0.35), transparent),
		radial-gradient(2px 2px at 70% 35%, rgba(255,255,255,0.4), transparent),
		radial-gradient(1px 1px at 35% 15%, rgba(255,255,255,0.3), transparent);
	background-size: 100% 100%;
	pointer-events: none;
	z-index: 0;
	opacity: 0.6;
}

/* Glow on right side where Earth will go */
.ba-hero::after {
	content: "";
	position: absolute;
	top: 50%;
	right: -10%;
	transform: translateY(-50%);
	width: 800px;
	height: 800px;
	background: radial-gradient(circle, rgba(14, 165, 255, 0.18) 0%, transparent 60%);
	pointer-events: none;
	z-index: 0;
	filter: blur(60px);
}

.ba-hero > .e-con-inner,
.ba-hero > .elementor-container {
	position: relative;
	z-index: 1;
}

/* Hero heading - enhanced text shadow for depth */
.ba-hero h1 {
	text-shadow: 0 2px 40px rgba(14, 165, 255, 0.2);
}

/* Subtitle max-width control */
.ba-hero-subtitle p {
	max-width: 580px;
}

/* =========================================================
   2. SECTION 2 — WHY BUSINESS ARENA (.ba-section-why)
   ========================================================= */

.ba-section-why {
	position: relative;
	overflow: hidden;
}

/* Subtle ambient glow at top */
.ba-section-why::before {
	content: "";
	position: absolute;
	top: -200px;
	left: 50%;
	transform: translateX(-50%);
	width: 1200px;
	height: 400px;
	background: radial-gradient(ellipse, rgba(14, 165, 255, 0.08) 0%, transparent 70%);
	pointer-events: none;
	z-index: 0;
	filter: blur(40px);
}

.ba-section-why > .e-con-inner,
.ba-section-why > .elementor-container {
	position: relative;
	z-index: 1;
}

/* =========================================================
   3. SHARED CARD STYLES — applies to all .e-con cards with blue border
   ========================================================= */

/* Target Elementor containers used as cards (those with the brand border color) */
.ba-section-why .e-con-inner > .e-con,
.ba-section-zones .e-con-inner > .e-con,
.ba-section-experience .e-con-inner > .e-con,
.elementor-element .e-con[data-border-color],
.ba-hero .elementor-widget-icon-box,
.ba-section-why .elementor-widget-icon-box {
	transition: var(--ba-transition);
}

/* Glassy backdrop effect on all card-style containers */
.ba-section-why .e-con[style*="rgba(11, 23, 54"],
.ba-section-zones .e-con[style*="rgba(11, 23, 54"],
.ba-section-experience .e-con[style*="rgba(11, 23, 54"],
.ba-hero .elementor-widget-icon-box .elementor-icon-box-wrapper {
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

/* FORCE card borders to be visible across ALL sections */
.ba-section-why .e-con.e-con--column,
.ba-section-zones .e-con.e-con--column,
.ba-section-experience .e-con.e-con--column {
	border: 1px solid var(--ba-border) !important;
	border-radius: var(--ba-radius) !important;
	background-color: var(--ba-card-bg) !important;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	position: relative;
	overflow: hidden;
}

/* EXCEPTION: layout-only containers in Section 3 & 5 are NOT cards */
.ba-section-zones > .e-con-inner > .e-con:first-child,
.ba-section-zones > .elementor-container > .e-con:first-child,
.ba-section-zones > .e-con-inner > .e-con:last-child,
.ba-section-experience > .e-con-inner > .e-con:first-child,
.ba-section-experience > .elementor-container > .e-con:first-child,
.ba-section-experience > .e-con-inner > .e-con:last-child,
.ba-section-experience .ba-corners-hub > .e-con,
.ba-section-experience .ba-hub-center {
	border: none !important;
	background-color: transparent !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.ba-section-zones > .e-con-inner > .e-con:first-child::before,
.ba-section-zones > .e-con-inner > .e-con:last-child::before,
.ba-section-experience > .e-con-inner > .e-con:first-child::before,
.ba-section-experience > .e-con-inner > .e-con:last-child::before,
.ba-section-experience .ba-corners-hub > .e-con::before,
.ba-section-experience .ba-hub-center::before {
	display: none !important;
}

/* Subtle inner gradient edge for cards - the "glow line" effect */
.ba-section-why .e-con.e-con--column::before,
.ba-section-zones .e-con.e-con--column::before,
.ba-section-experience .e-con.e-con--column::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg,
		transparent 0%,
		rgba(14, 165, 255, 0.4) 50%,
		transparent 100%);
	pointer-events: none;
}

/* Card hover effects */
.ba-section-why .e-con.e-con--column:hover,
.ba-section-zones .e-con.e-con--column:hover,
.ba-section-experience .e-con.e-con--column:hover {
	border-color: var(--ba-border-hover) !important;
	background-color: var(--ba-card-bg-hover) !important;
	transform: translateY(-4px);
	box-shadow: var(--ba-glow-strong);
}

/* Layout wrappers — disable hover transforms */
.ba-section-zones > .e-con-inner > .e-con:first-child:hover,
.ba-section-zones > .elementor-container > .e-con:first-child:hover,
.ba-section-zones > .e-con-inner > .e-con:last-child:hover,
.ba-section-experience > .e-con-inner > .e-con:first-child:hover,
.ba-section-experience > .elementor-container > .e-con:first-child:hover,
.ba-section-experience > .e-con-inner > .e-con:last-child:hover,
.ba-section-experience .ba-corners-hub > .e-con:hover,
.ba-section-experience .ba-hub-center:hover {
	border-color: transparent !important;
	background-color: transparent !important;
	transform: none;
	box-shadow: none;
}

.ba-section-why .e-con.e-con--column:hover::before,
.ba-section-zones .e-con.e-con--column:hover::before,
.ba-section-experience .e-con.e-con--column:hover::before {
	background: linear-gradient(90deg,
		transparent 0%,
		rgba(14, 165, 255, 0.8) 50%,
		transparent 100%);
}

/* Hero stat cards hover */
.ba-hero .elementor-widget-icon-box {
	transition: var(--ba-transition);
}

.ba-hero .elementor-widget-icon-box:hover {
	transform: translateY(-2px);
}

/* =========================================================
   4. EYEBROW LABEL — small uppercase blue text with dot
   ========================================================= */

.ba-section-why .elementor-heading-title[style*="color:#0EA5FF"],
.ba-section-why .elementor-heading-title[style*="color: #0EA5FF"] {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.ba-section-why h1.elementor-heading-title:before,
.ba-section-why h2.elementor-heading-title:before,
.ba-section-why h3.elementor-heading-title:before {
	content: none;
}

/* =========================================================
   5. ICON STYLING — Sharp blue accent icons + Badge effect
   ========================================================= */

/* CARD ICON BADGE — rounded square with blue border + glow */
.ba-section-why .ba-card-icon,
.ba-section-zones .ba-card-icon,
.ba-section-experience .ba-card-icon {
	width: fit-content;
	transition: var(--ba-transition);
}

.ba-section-why .ba-card-icon .elementor-icon,
.ba-section-zones .ba-card-icon .elementor-icon,
.ba-section-experience .ba-card-icon .elementor-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	background: rgba(14, 165, 255, 0.08);
	border: 1px solid var(--ba-border);
	border-radius: 12px;
	transition: var(--ba-transition);
	box-shadow: 0 0 20px rgba(14, 165, 255, 0.1);
}

.ba-section-why .ba-card-icon .elementor-icon i,
.ba-section-why .ba-card-icon .elementor-icon svg,
.ba-section-zones .ba-card-icon .elementor-icon i,
.ba-section-zones .ba-card-icon .elementor-icon svg,
.ba-section-experience .ba-card-icon .elementor-icon i,
.ba-section-experience .ba-card-icon .elementor-icon svg {
	color: var(--ba-accent) !important;
	fill: var(--ba-accent) !important;
}

/* Card hover - icon badge brightens */
.ba-section-why .e-con.e-con--column:hover .ba-card-icon .elementor-icon,
.ba-section-zones .e-con.e-con--column:hover .ba-card-icon .elementor-icon,
.ba-section-experience .e-con.e-con--column:hover .ba-card-icon .elementor-icon {
	background: rgba(14, 165, 255, 0.15);
	border-color: var(--ba-border-hover);
	box-shadow: 0 0 24px rgba(14, 165, 255, 0.35);
	transform: scale(1.05);
}

.ba-section-why .e-con.e-con--column:hover .ba-card-icon .elementor-icon i,
.ba-section-why .e-con.e-con--column:hover .ba-card-icon .elementor-icon svg,
.ba-section-zones .e-con.e-con--column:hover .ba-card-icon .elementor-icon i,
.ba-section-zones .e-con.e-con--column:hover .ba-card-icon .elementor-icon svg,
.ba-section-experience .e-con.e-con--column:hover .ba-card-icon .elementor-icon i,
.ba-section-experience .e-con.e-con--column:hover .ba-card-icon .elementor-icon svg {
	filter: drop-shadow(0 0 6px rgba(14, 165, 255, 0.8));
}

/* Section 5 smaller icon badges (corner cards are compact) */
.ba-section-experience .ba-card-icon .elementor-icon {
	width: 38px;
	height: 38px;
	border-radius: 8px;
}

/* Icon-list icons (in "Што можеш да очекуваш" block) */


/* Numbers/stat icons in bottom right block */
.ba-section-why .elementor-widget-icon-box .elementor-icon i,
.ba-section-why .elementor-widget-icon-box .elementor-icon svg {
	color: var(--ba-accent) !important;
	fill: var(--ba-accent) !important;
}

/* =========================================================
   6. BUTTON / LINK — "Погледни ја програмата →"
   ========================================================= */

.ba-section-why .elementor-button {
	transition: var(--ba-transition);
	position: relative;
}

.ba-section-why .elementor-button:hover {
	color: var(--ba-text) !important;
	transform: translateX(4px);
}

/* Underline on hover for the program link */
.ba-section-why .elementor-button::after {
	content: "";
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 0;
	height: 1px;
	background: var(--ba-text);
	transition: width 0.3s ease;
}

.ba-section-why .elementor-button:hover::after {
	width: 100%;
}

/* =========================================================
   7. ICON-LIST in "Што можеш да очекуваш" - bigger spacing
   ========================================================= */

.ba-section-why .elementor-icon-list-item {
	align-items: flex-start !important;
}

.ba-section-why .elementor-icon-list-icon {
	padding-top: 4px !important;
}

.ba-section-why .elementor-icon-list-text {
	line-height: 1.5;
}

/* =========================================================
   8. NUMBERS / STATS in Section 2 - bigger numbers
   ========================================================= */

.ba-section-why .elementor-widget-icon-box .elementor-icon-box-title {
	margin-bottom: 4px !important;
}

/* =========================================================
   8b. SECTION 3 — THREE ZONES (.ba-section-zones)
   ========================================================= */

.ba-section-zones {
	position: relative;
	overflow: hidden;
}

/* Ambient glow on the right side (behind zone cards) */
.ba-section-zones::before {
	content: "";
	position: absolute;
	top: 50%;
	right: -10%;
	transform: translateY(-50%);
	width: 600px;
	height: 600px;
	background: radial-gradient(circle, rgba(14, 165, 255, 0.06) 0%, transparent 60%);
	pointer-events: none;
	z-index: 0;
	filter: blur(50px);
}

.ba-section-zones > .e-con-inner,
.ba-section-zones > .elementor-container {
	position: relative;
	z-index: 1;
}

/* Zone image placeholder styling — adds blue border tint */
.ba-zone-image img {
	width: 100%;
	height: auto;
	border: 1px solid rgba(14, 165, 255, 0.15);
	transition: var(--ba-transition);
	display: block;
}

.ba-section-zones .e-con.e-con--column:hover .ba-zone-image img {
	border-color: var(--ba-border-hover);
	box-shadow: 0 8px 24px rgba(14, 165, 255, 0.2);
}

/* Smaller icon-badge for zone cards (slightly more compact than section 2) */
.ba-section-zones .ba-card-icon .elementor-icon {
	    width: 50px;
    height: 50px;
    border-radius: 31px;
    background-color: #020617;
}

/* Zone cards uppercase title spacing */
.ba-section-zones h3 {
	margin-top: 4px;
}

/* =========================================================
   8c. SECTION 5 — EXPERIENCE ZONE HUB (.ba-section-experience)
   ========================================================= */

.ba-section-experience {
	position: relative;
	overflow: hidden;
}

/* Centered ambient glow behind the hub */
.ba-section-experience::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 15%;
	transform: translateY(-50%);
	width: 500px;
	height: 500px;
	background: radial-gradient(circle, rgba(14, 165, 255, 0.1) 0%, transparent 60%);
	pointer-events: none;
	z-index: 0;
	filter: blur(60px);
}

.ba-section-experience > .e-con-inner,
.ba-section-experience > .elementor-container {
	position: relative;
	z-index: 1;
}

/* HUB CENTER BADGE — glowing pill in the middle */
.ba-hub-center {
	position: relative;
}

/* Decorative glow ring around the hub */
.ba-hub-center::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 280px;
	height: 280px;
	background: radial-gradient(circle, rgba(14, 165, 255, 0.18) 0%, transparent 65%);
	pointer-events: none;
	z-index: 0;
	filter: blur(30px);
}

/* The badge itself - pill with blue border and glow */
.ba-hub-badge {
	display: inline-block !important;
	padding: 14px 32px !important;
	border: 1.5px solid var(--ba-accent) !important;
	border-radius: 999px !important;
	background: rgba(14, 165, 255, 0.08) !important;
	box-shadow:
		0 0 30px rgba(14, 165, 255, 0.35),
		inset 0 0 20px rgba(14, 165, 255, 0.1) !important;
	position: relative;
	z-index: 1;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	animation: baHubPulse 3s ease-in-out infinite;
}

@keyframes baHubPulse {
	0%, 100% {
		box-shadow:
			0 0 30px rgba(14, 165, 255, 0.35),
			inset 0 0 20px rgba(14, 165, 255, 0.1);
	}
	50% {
		box-shadow:
			0 0 45px rgba(14, 165, 255, 0.55),
			inset 0 0 25px rgba(14, 165, 255, 0.18);
	}
}

/* Corner cards: smaller compact look */
.ba-section-experience .e-con.e-con--column {
	min-height: 140px;
}

.ba-section-experience h4 {
	margin-top: 2px;
}

/* =========================================================
   8d. TESTIMONIAL SECTION (.ba-section-testimonial)
   ========================================================= */

.ba-section-testimonial {
	position: relative;
	overflow: hidden;
}

/* Soft ambient glow behind the testimonial */
.ba-section-testimonial::before {
	content: "";
	position: absolute;
	top: 30%;
	left: 10%;
	width: 500px;
	height: 500px;
	background: radial-gradient(circle, rgba(14, 165, 255, 0.08) 0%, transparent 60%);
	pointer-events: none;
	z-index: 0;
	filter: blur(60px);
}

.ba-section-testimonial > .e-con-inner,
.ba-section-testimonial > .elementor-container {
	position: relative;
	z-index: 1;
}

/* Big stylized quotation mark */
.ba-quote-mark {
	line-height: 0.6 !important;
	margin-bottom: -10px !important;
	opacity: 0.9;
	text-shadow: 0 0 30px rgba(14, 165, 255, 0.4);
}

.ba-quote-mark .elementor-heading-title {
	font-family: Georgia, 'Times New Roman', serif !important;
	font-size: 140px !important;
	display: inline-block;
}

/* Quote text - subtle italic feel via line height */
.ba-quote-text p {
	font-style: normal;
	letter-spacing: 0.1px;
}

/* Testimonial card - exclude from generic card styling, has its own */
.ba-section-testimonial .ba-testi-card {
	border: 1px solid var(--ba-border) !important;
	border-radius: 16px !important;
	background-color: var(--ba-card-bg) !important;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	position: relative;
	overflow: hidden;
}

/* Top glow line for testi card */
.ba-section-testimonial .ba-testi-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg,
		transparent 0%,
		rgba(14, 165, 255, 0.5) 50%,
		transparent 100%);
	pointer-events: none;
}

/* Inner wrapper containers (left/right of testi card) - no card styling */
.ba-section-testimonial .ba-testi-card > .e-con {
	border: none !important;
	background-color: transparent !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.ba-section-testimonial .ba-testi-card > .e-con::before {
	display: none !important;
}

/* Attribution block - keep clean */
.ba-section-testimonial .ba-testi-attribution {
	border-top: 1px solid rgba(14, 165, 255, 0.15);
	padding-top: 20px !important;
	margin-top: 10px;
}

/* Testimonial photo */
.ba-testi-photo img {
	max-width: 320px;
	width: 100%;
	height: auto;
	display: block;
	filter: drop-shadow(0 20px 40px rgba(14, 165, 255, 0.15));
}

/* Footer bar (Sweden Embassy) */
.ba-section-testimonial .ba-footer-bar {
	border: 1px solid var(--ba-border) !important;
	border-radius: 12px !important;
	background-color: var(--ba-card-bg) !important;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

/* Footer inner containers - no border */
.ba-section-testimonial .ba-footer-bar > .e-con {
	border: none !important;
	background-color: transparent !important;
	backdrop-filter: none !important;
}

.ba-section-testimonial .ba-footer-bar > .e-con::before {
	display: none !important;
}

/* Crown icon next to embassy text */
.ba-footer-icon .elementor-icon {
	color: var(--ba-accent) !important;
	display: inline-flex;
	align-items: center;
}

.ba-footer-icon .elementor-icon i,
.ba-footer-icon .elementor-icon svg {
	color: var(--ba-accent) !important;
	fill: var(--ba-accent) !important;
}

/* Sweden flag SVG wrapper */
.ba-sweden-flag {
	display: inline-flex;
	align-items: center;
}

.ba-sweden-flag svg {
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
	display: block;
}

/* Tablet/mobile: stack the photo above the quote */
@media (max-width: 1024px) {
	.ba-testi-photo img {
		max-width: 240px;
	}
}

@media (max-width: 767px) {
	.ba-quote-mark .elementor-heading-title {
		font-size: 80px !important;
	}
	
	.ba-testi-photo img {
		max-width: 200px;
	}
	
	.ba-section-testimonial .ba-footer-bar {
		flex-direction: column !important;
		align-items: flex-start !important;
	}
}

@media (max-width: 1024px) {
	.ba-hero::after {
		width: 500px;
		height: 500px;
		opacity: 0.5;
	}
	
	.ba-section-zones::before {
		width: 400px;
		height: 400px;
		opacity: 0.7;
	}
	
	.ba-section-experience::before {
		width: 350px;
		height: 350px;
	}
}

@media (max-width: 767px) {
	.ba-hero::before,
	.ba-hero::after {
		display: none;
	}
	
	.ba-section-why::before,
	.ba-section-zones::before,
	.ba-section-experience::before {
		display: none;
	}
	
	.ba-hub-badge {
		padding: 12px 24px !important;
		font-size: 14px !important;
	}
}

/* =========================================================
   10. ANIMATIONS — Subtle entrance fade
   ========================================================= */

@keyframes baFadeUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.ba-hero h1,
.ba-hero .ba-hero-subtitle,
.ba-section-why h2,
.ba-section-zones h2,
.ba-section-experience h2,
.ba-section-testimonial .ba-quote-text {
	animation: baFadeUp 0.8s ease-out forwards;
}

.ba-section-why h2,
.ba-section-zones h2,
.ba-section-experience h2,
.ba-section-testimonial .ba-quote-text {
	animation-delay: 0.1s;
}

/* =========================================================
   11. SMOOTH SCROLL
   ========================================================= */

html {
	scroll-behavior: smooth;
}/* End custom CSS */