/*
	ForecastriX Custom Color Scheme
	
	Brand Colors:
	- Main (logo): #1D3351 (dark navy)
	- Accent (logo): #838A95 (gray)
	- Background: #F8F9FA (light gray)
	- Accent: #B74E91 (magenta)
	- Highlight: #B74E91 (magenta)
*/

/* Visually hidden but accessible for SEO */
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Background color */
body {
	background: #F8F9FA;
}

/* Text colors */
body, input, select, textarea {
	color: #1D3351;
}

h1, h2, h3, h4, h5, h6 {
	color: #1D3351;
}

/* Links */
a {
	color: #B74E91;
}

a:hover {
	color: #B74E91;
}

/* Buttons - primary style */
.button.primary {
	background-color: #B74E91;
	color: #FFFFFF !important;
}

.button.primary:hover {
	background-color: #B74E91;
}

/* Regular buttons */
.button {
	border: solid 1px #1D3351 !important;
	border-color: #1D3351 !important;
	color: #1D3351 !important;
}

.button:hover {
	background-color: rgba(183, 78, 145, 0.1);
	border-color: #B74E91 !important;
	color: #B74E91 !important;
}

/* Sidebar */
#sidebar {
	background: #1D3351;
}

#sidebar nav a {
	color: #838A95;
}

#sidebar nav a:hover,
#sidebar nav a.active {
	color: #FFFFFF;
}

/* Intro section */
#intro {
	background: #F8F9FA;
}

/* Section style1 */
.wrapper.style1 {
	background-color: #F8F9FA;
}

/* Section style2 (team spotlights) */
.wrapper.style2 .spotlights > section > .content {
	background-color: #F8F9FA;
}

/* Section style3 (What we do) */
.wrapper.style3 {
	background-color: #1D3351;
	background-image: linear-gradient(to right, #1D3351, #2a4a6d);
}

.wrapper.style3 h2,
.wrapper.style3 h3,
.wrapper.style3 p {
	color: #FFFFFF;
}

/* Features icons */
.features section span.icon {
	color: #B74E91;
}

/* Form labels */
label {
	color: #1D3351;
}

/* Form inputs */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
select,
textarea {
	border-color: #838A95;
	color: #1D3351;
	background-color: #FFFFFF;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
select:focus,
textarea:focus {
	border-color: #B74E91;
}

/* Footer */
#footer {
	background-color: #1D3351;
}

#footer,
#footer a,
#footer .menu li {
	color: #FFFFFF;
}

/* Social icons */
.icons a {
	border-color: #838A95;
	color: #838A95;
}

.icons a:hover {
	border-color: #B74E91;
	color: #B74E91;
}

/* Scrolly button gradient override */
.button.scrolly {
	border: solid 1px #B74E91 !important;
	border-color: #B74E91 !important;
	color: #B74E91 !important;
	background-color: transparent;
}

.button.scrolly:hover {
	background-color: rgba(183, 78, 145, 0.15);
	border-color: #B74E91 !important;
	color: #B74E91 !important;
}

/* Submit button */
.button.submit {
	background-color: #B74E91;
	border-color: #B74E91;
	color: #FFFFFF !important;
}

.button.submit:hover {
	background-color: #B74E91;
	border-color: #B74E91;
}

/* Team member titles */
#one h3 {
	color: #B74E91;
}

/* Contact section headings */
.contact h3 {
	color: #B74E91;
}

.contact,
.contact a,
.contact span {
	color: #FFFFFF;
}

/* Contact section in light background (style1) */
.wrapper.style1 .contact,
.wrapper.style1 .contact a,
.wrapper.style1 .contact span,
.wrapper.style1 .contact h3 {
	color: #1D3351;
}

.wrapper.style1 .contact h3 {
	color: #B74E91;
}

/* Wrapper style1-alt (footer) */
.wrapper.style1-alt {
	background-color: #152538;
}

/* Spotlight sections background */
#one.wrapper.style2 > section:nth-child(odd) {
	background-color: #FFFFFF;
}

#one.wrapper.style2 > section:nth-child(even) {
	background-color: #F8F9FA;
}

/* Customer logos grid */
.customer-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 3em 4em;
	padding: 3em 0;
	align-items: center;
}

.customer-grid a {
	display: flex;
	align-items: center;
	justify-content: center;
	border: none !important;
}

.customer-grid img {
	height: 100px;
	max-width: 200px;
	object-fit: contain;
	filter: grayscale(100%);
	opacity: 0.7;
	transition: all 0.3s ease;
}

.customer-grid a:hover img {
	filter: grayscale(0%);
	opacity: 1;
	transform: scale(1.05);
}

/* Responsive: Tablets */
@media screen and (max-width: 980px) {
	.customer-grid {
		gap: 2em 3em;
	}
	
	.customer-grid img {
		height: 80px;
		max-width: 160px;
	}
}

/* Responsive: Mobile */
@media screen and (max-width: 736px) {
	/* Logo sizing */
	#intro img {
		max-width: 250px !important;
	}
	
	.customer-grid {
		gap: 1.5em 2em;
	}
	
	.customer-grid img {
		height: 60px;
		max-width: 130px;
	}
}

/* Responsive: Small phones */
@media screen and (max-width: 480px) {
	#intro img {
		max-width: 200px !important;
	}
	
	.customer-grid {
		gap: 1.5em;
	}
	
	.customer-grid img {
		height: 50px;
		max-width: 150px;
	}
}

/* Footer styling */
#footer .menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5em 1.5em;
}

@media screen and (max-width: 736px) {
	#footer .menu {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 0.5em;
	}
	
	#footer .menu li {
		border: none;
		padding: 0.25em 0;
	}
}

/* Language Switcher in Footer */
.language-switcher {
	display: inline;
}

.language-switcher a {
	color: #FFFFFF;
	border: none !important;
}

.language-switcher a:hover {
	color: #B74E91;
}

.language-switcher span.active {
	color: #B74E91;
	font-weight: 600;
}
