/*
Theme Name: Cross Client Solutions
Template: twentytwentyfive
Theme URI: https://interactive-design.gr
Author: George Nikolopoulos
Author URI: https://interactive-design.gr
Description: CCS website theme
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.3.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/* Common classes */
:where(.wp-site-blocks :focus) {
	outline-style: none !important;
}

ul li::marker {
	font-size: 20px;
	line-height: 1;
}

header {
  padding-top: 0 !important;
  position: sticky;
  z-index: 999;
  top: 0;
  left: 0;
  right: 0;
}

nav.main-menu a:hover {
	text-decoration: none;
	color: #141843 !important;
}

footer {
  padding: 0 !important;
}

nav.footer-menu a:hover {
	text-decoration: none;
	color: #ffffff99 !important;
}

a {
  text-decoration: none;
}

.list-unstyled {
  list-style: none;
  list-style-type: none;
}

.hero::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 420px;
  height: 420px;
  background: #eeeef6;
  clip-path: polygon(100% 0, 0 0, 100% 100%);
  pointer-events: none;
  opacity: 0.6;
}

.hero-inner::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 620px;
  height: 620px;
  background: #fff;
  clip-path: polygon(100% 0, 0 0, 100% 100%);
  pointer-events: none;
  opacity: 0.1;
  transform: rotate(270deg);
}

.hero-operations::after {
  content: url('assets/images/icon-white.png');
  position: absolute;
  top: 280px;
  right: 200px;
  pointer-events: none;
  opacity: 0.08;
  transform: scale(1.5);
}

.hero-systems::after {
  content: url('assets/images/icon-white.png');
  position: absolute;
  top: 350px;
  right: 200px;
  pointer-events: none;
  opacity: 0.08;
  transform: scale(1.5);
}

.hero-separator {
	width: 36px;
}

.lane-1,
.lane-2 {
	position: relative;
	cursor: pointer;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lane-1:hover,
.lane-2:hover {
	transform: translateY(-5px);
	box-shadow: 0 24px 64px rgba(20,24,67,0.18);
}

.lane-1:before,
.lane-2:before {
	font-family: 'Playfair Display', serif;
	font-size: 200px;
	font-weight: 600;
	position: absolute;
	bottom: -40px;
	right: -8px;
	opacity: 0.06;
	line-height: 1;
	pointer-events: none;
	color: #fff;
}

.lane-1:before {
	content: '2';
}

.lane-2:before {
	content: '1';
}

.red-dots li::marker {
	color: #e94424 !important;
	font-size: 20px;
	line-height: 1;
}

.yellow-dots li::marker {
	color: #facc41 !important;
	font-size: 20px;
	line-height: 1;
}

.btn-primary a:hover {
	background-color: #c33a1d !important;
}

.btn-secondary a:hover {
	background-color: #fff;
	border: 1px solid #141843 !important;
}

.btn-tetriary a:hover {
	background-color: #1c2258 !important;
}

.process-container:hover {
	background-color: #1c2258;
}

.service-item:hover {
	border-color: #e94424 !important;
}

@media screen and (max-width: 600px) {
	.hide-on-mobile {
		display: none !important;
	}

	.alignfull {
		padding-left: 24px !important;
		padding-right: 24px !important;
	}
	
	.is-layout-grid {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	
	.header-container {
		padding: 24px 0 !important;
	}

	.hero::after {
    	width: 200px;
    	height: 200px;
	}
	
	.process-container {
		border-right: none;
		border-bottom: 1px solid #ffffff21;
	}
}