/**
 * Theme Name:     Ostion Theme
 * Author:         Tom Usborne
 * Template:       generatepress
 * Text Domain:	   generatepress-child
 * Description:    GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
 */


@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
.playfair {
    font-family: "Playfair Display", serif;
    color: #F39C12;
    font-style: italic;
    font-weight: 600;
	
}
.cus_card details{
	backdrop-filter: blur(20px);
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .15);
}
/* =============================================
   STICKY HEADER
   ============================================= */

/* Default state — no fixed, no shadow, nothing */
.sticky_header {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    transition: none; /* No transition until sticky kicks in */
}

/* Only AFTER 500px scroll — apply sticky styles */
.sticky_header.is-sticky {
    position: fixed;
    left: 0;
	top: 0px;
    transition: background 0.3s ease, box-shadow 0.3s ease;
    animation: slideDown 0.3s ease forwards;
}
.sticky_header.is-sticky .e-con-inner{
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.15);
}
div#hfe-flyout-content-id-5f9eb95 , .hfe-flyout-overlay  {
    height: 100dvh;
}
.contact-form-modern label {
    font-weight: 400 !important;
    font-size: 16px !important;
}
.contact-form-modern input:not([type="submit"]), .contact-form-modern textarea {
    border: 1px solid #ee9c1b12;
}
.contact-form-modern input[type="text"]:focus, .contact-form-modern input[type="email"]:focus, .contact-form-modern input[type="url"]:focus, .contact-form-modern input[type="password"]:focus, .contact-form-modern input[type="search"]:focus, .contact-form-modern input[type="tel"]:focus, .contact-form-modern input[type="number"]:focus, .contact-form-modern textarea:focus, .contact-form-modern select:focus {
    background-color: white !important;
    border-color: #f39c12 !important;
}
.contact-form-modern .cf7-submit input[type="submit"] {
    background: #f39c12 !important;
    text-transform: uppercase !important;
}
.contact-form-modern textarea {
    height: 111px;
}
.blog_grid .wp-post-image {
    height: 250px;
    object-fit: cover;
}
.single-post .featured-image .wp-post-image {
    width: 100%;
    height: 350px;
    object-fit: cover;
}
.single-post div#page {
    max-width: 1300px;
}
/* Slide down animation when sticky activates */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

/* Push page content down so sticky header doesn't overlap */
.sticky_header.is-sticky ~ * {
    margin-top: 0;
}  padding: 10px 0;
}
.gradient_text span{
	 background-clip: text !important;
    -webkit-background-clip: text;
    color: transparent;
    background: linear-gradient(180deg, #c2c2c2, transparent);
}
.services-slider-section {
            background: #fff;
            contain: layout style;
        }
       .services-slider-section .services-swiper {
            margin: 0 auto;
            padding-bottom: 60px !important;
            position: relative;
        }
/*        .services-slider-section .service-container {
            padding: 0 50px;
        } */
        .service-header {
            text-align: center;
            margin-bottom: 40px;
        }
       .services-slider-section .service-header h2 {
            font-size: 38px;
            font-weight: 700;
            color: #1a1a1a;
            margin-bottom: 12px;
        }
       .services-slider-section .service-short-desc {
            font-size: 17px;
            color: #666;
            max-width: 700px;
            margin: 0 auto;
            line-height: 1.7;
        }
       .services-slider-section .service-content {
            display: flex;
            gap: 60px;
            align-items: center;
        }
       .services-slider-section .service-image {
            flex: 1;
/*             border-radius: 12px; */
            overflow: hidden;
            box-shadow: 0 8px 30px rgba(0,0,0,0.1);
            aspect-ratio: 3 / 2;
        }
       .services-slider-section .service-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
      .services-slider-section  .no-image {
            background: #f0f0f0;
            height: 400px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #999;
            font-size: 16px;
        }
      .services-slider-section  .service-details {
            flex: 1;
        }
      .services-slider-section  .service-details h3 {
            font-size: 40px;
            font-weight: 700;
            color: #1a1a1a;
            margin-bottom: 16px;
        }
       .services-slider-section .service-long-desc {
            font-size: 16px;
            color: #272727;
            line-height: 1.8;
            margin-bottom: 20px;
        }
       .services-slider-section .service-price {
            font-size: 18px;
            color: #333;
            margin-bottom: 24px;
        }
       .services-slider-section .service-btn {
           padding: 18px 20px 18px 20px;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Rajdhani';
    text-transform: uppercase;
    color: #FFFFFF;
			background: #f39c12;
        }
       .services-slider-section .service-btn:hover {
            background: #005a87;
            color: #fff;
        }
       .services-slider-section .swiper-pagination-bullet {
            width: 10px;
            height: 10px;
            background: #ccc;
            opacity: 1;
        }
       .services-slider-section .swiper-pagination-bullet-active {
            background: #0073aa;
        }
       .services-slider-section .swiper-button-prev,
       .services-slider-section .swiper-button-next {
            color: #0073aa;
        }
       .services-slider-section .swiper-button-prev:hover,
       .services-slider-section .swiper-button-next:hover {
            color: #005a87;
        }
.cf7-grid-row {
    display: flex;
    gap: 20px; /* Adjusts the space between the columns */
    margin-bottom: 15px;
}
.wpcf7-not-valid-tip{
	    color: #dc3232;
    font-size: 14px;
    font-weight: normal;
    display: block;
    font-family: 'Rubik';
}
.cf7-grid-column {
    flex: 1; /* Makes both columns equal width */
}
.cf7-grid-column  input , .cf7-grid-column-full textarea{
	width: 100%;
	color: #000000;
    background-color: #ffffff;
    border-color: #1a2e4c;
    font-size: 15px;
}
.cf7-grid-column textarea.wpcf7-form-control.wpcf7-textarea {
    height: 45px;
	    color: #000000;
    background-color: #ffffff;
    border-color: #1a2e4c;
    font-size: 15px;
}
.cf7-grid-column-full textarea{
	height: 137px;
}
.wpcf7-response-output {
    font-size: 12px;
}
.cf7-grid-column input.wpcf7-form-control.wpcf7-submit.has-spinner {
    background: #F39C12;
    color: white;
    border-color: #F39C12;
    font-weight: 600;
    font-size: 17px;
}
.cf7-grid-full {
    margin-bottom: 15px;
}
.cf7-grid-column p{
	margin-bottom: 0px;
}

/* career */
/* Filter Bar Styles */
.job-filters-wrapper {
	max-width: 800px;
	margin: 20px auto;
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	background: #f4f7f9;
	padding: 16px;
	border-radius: 6px;
	border: 1px solid #e0e0e0;
	font-family: system-ui, sans-serif;
}

.job-filter-group {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
	min-width: 200px;
}

.job-filter-group label {
	font-size: 0.85rem;
	font-weight: 600;
	color: #333;
}

.job-filter-select {
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #fff;
	font-size: 0.95rem;
	color: #444;
	outline: none;
	cursor: pointer;
}

/* Career Container */
.job-accordion-container {
	max-width: 800px;
	margin: 20px auto;
	font-family: system-ui, sans-serif;
}

.job-accordion-item {
	background: #f9f9f9;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	margin-bottom: 12px;
	overflow: hidden;
	transition: all 0.2s ease;
}

.job-accordion-item[open] {
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

/* Hidden class for filter engine */
.job-accordion-item.is-hidden {
	display: none !important;
}

.job-summary {
	padding: 18px 24px;
	cursor: pointer;
	font-weight: 600;
	font-size: 1.1rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	list-style: none;
	user-select: none;
}

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

.job-title-wrapper {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.job-tags {
	display: flex;
	gap: 8px;
	font-size: 14px;
	font-weight: 500;
	color: #666;
	margin-top: 4px;
}

.job-tag {
	background: #eef2f3;
	padding: 2px 8px;
	border-radius: 4px;
	font-family: 'Rubik';
	font-weight: 400;
	color: black;
}

.job-toggle-icon {
	font-size: 1.3rem;
	color: #333;
	transition: transform 0.2s ease;
}

.job-accordion-item[open] .job-toggle-icon {
	transform: rotate(45deg);
}

.job-content {
	padding: 0 24px 24px 24px;
	border-top: 1px solid #f0f0f0;
	margin-top: 10px;
	color: #444;
	line-height: 1.6;
	font-family: 'Rubik';
}

/* Apply Now Button Design */
.job-apply-actions {
	margin-top: 20px;
	padding-top: 15px;
	border-top: 1px dashed #e0e0e0;
	text-align: right;
}

.job-apply-btn {
	background-color: var( --e-global-color-accent );
	color: #fff;
	border: 1px solid var( --e-global-color-accent );
	padding: 10px 20px;
	font-size: 15px;
	font-weight: 600;
	border-radius: 0px;
	cursor: pointer;
	transition: background 0.2s ease;
}

.job-apply-btn:hover {
	background-color: #fff;
	color: #000;
	
}
.cf7-grid-column-full{
	width: 100%;
}
/* No Results Message */
#jobNoResults {
	text-align: center;
	padding: 30px;
	color: #666;
	font-family: 'Rubik';
	display: none;
}

/* Popup Modal Layer CSS */
.job-modal {
	display: none;
	position: fixed;
	z-index: 99999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(2px);
	align-items: center;
	justify-content: center;
}

.job-modal.is-visible {
	display: flex;
}

.job-modal-content {
	background-color: #fff;
	padding: 30px;
	border-radius: 8px;
	width: 100%;
	max-width: 700px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
	position: relative;
	animation: jobModalSlide 0.3s ease;
}

.job-modal-close {
	position: absolute;
	right: 20px;
	top: 15px;
	font-size: 28px;
	font-weight: bold;
	color: #aaa;
	cursor: pointer;
	user-select: none;
}

.job-modal-close:hover {
	color: #333;
}

.job-modal h3 {
	margin-top: 0;
	margin-bottom: 5px;
	color: #111;
	font-size: 1.4rem;
}

.job-modal-subtitle {
	color: #666;
	margin-bottom: 20px;
	font-size: 0.9rem;
}

@keyframes jobModalSlide {
	from {
		transform: translateY(-30px);
		opacity: 0;
	}

	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.swiper-button-next , .swiper-button-prev {
    background: #ffffff78;
	    top: 49%;
/*     left: auto;  */
/* 	right: auto; */
	z-index: 2;
	color: var(--e-global-color-accent) !important;
}
.alpha-timeline-wrap {
	max-width: 1200px;
	margin: 60px auto;
	padding: 20px;
	position: relative;
}

.alpha-timeline-header {
	text-align: center;
	margin-bottom: 70px;
}

.alpha-timeline-header h2 {
	font-size: 42px;
	margin-bottom: 10px;
	font-weight: 700;
}

.alpha-timeline-header p {
	color: #666;
	font-size: 18px;
}

.alpha-timeline {
	position: relative;
}

.alpha-timeline:before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	width: 4px;
	height: 100%;
	background: #d9d9d9;
	transform: translateX(-50%);
}

.alpha-item {
	position: relative;
	width: 50%;
	padding: 20px 50px;
	box-sizing: border-box;
	margin-bottom: 50px;
}

.alpha-item.left {
	left: 0;
	text-align: right;
}

.alpha-item.right {
	left: 50%;
}

.alpha-dot {
	position: absolute;
	top: 45px;
	width: 20px;
	height: 20px;
	background: #192c4c;
	border: 4px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 4px #192c4c;
	z-index: 2;
}

.alpha-item.left .alpha-dot {
	right: -10px;
}

.alpha-item.right .alpha-dot {
	left: -10px;
}

.alpha-year {
	display: inline-block;
	background: linear-gradient(135deg, #f39c12, #ef9300);
	color: #fff;
	padding: 10px 24px;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 15px;
}

.alpha-card {
	background: #fff;
	padding: 30px;
	border-radius: 5px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
}

.alpha-card h3 {
	margin: 0 0 15px;
	font-size: 24px;
	color: #222;
}

.alpha-card p {
	font-size: 14px;
	margin: 0;
	color: #666;
	line-height: 1.8;
}
.premium-button-text-icon-wrapper {
    display: flex;
	    z-index: 9;
}
a.premium-button {
    overflow: hidden !important;
}
/* single blog start */
.single-post h2 {
    font-size: 28px;
}
.single-post h3 {
    font-size: 22px;
}
.single-post p {
    font-size: 16px;
}
/* single blog end */
/* Makes it stack vertically on mobile screens */
@media (max-width: 600px) {
	.single-post .inside-article , .single-post aside{
		padding: 15px !important;
	}
	.single-post h1 {
		font-size: 35px;
	}
	.single-post h2 {
		font-size: 25px;
	}
	.single-post h3 {
		font-size: 20px;
	}
	.single-post p {
		font-size: 14px;
	}
	.single-post .entry-meta {
		font-size: 13px;
	}
	.wp-block-latest-posts__list a.wp-block-latest-posts__post-title {
		font-size: 16px;
	}
	.single-post .widget ul li {
    	list-style-type: disc;
		margin-left: 18px;
	}
    .cf7-grid-row {
        flex-direction: column;
        gap: 0;
    }
}
        @media ( max-width: 768px ) {
			.alpha-timeline:before {
				left: 20px;
			}
			.contact-form-modern {
				padding: 20px 10px !important;
				margin-bottom: 0 !important;
			}
			.contact-form-modern .cf7-row {
				gap: 10px !important;
				margin-bottom: 10px !important;
			}
			.contact-form-modern label {
				font-size: 14px !important;
			}
			.contact-form-modern .cf7-submit input[type="submit"]{
				font-size: 13px;
			}

			.alpha-item,
			.alpha-item.left,
			.alpha-item.right {
				width: 100%;
				left: 0;
				padding-left: 40px;
				padding-right: 0px;
				text-align: left;
			}
			.alpha-year{
				font-size: 13px;
			}
			.alpha-card h3 {
				font-size: 18px;
			}
			.alpha-card {
				padding: 20px 10px;
			}
			.alpha-card p {
				font-size: 13px;
				line-height: 1.4rem;
			}
			.alpha-item .alpha-dot {
				left: 12px !important;
			}
			.alpha-item{
				margin-bottom: 0px;
			}
			.alpha-dot {
				width: 15px;
				height: 15px;
			}
			.alpha-timeline-wrap{
				    margin: 30px auto;
				    padding: 20px 10px;
			}
			.alpha-timeline-header h2 {
				font-size: 28px;
			}
			.alpha-timeline-header p {
				color: #666;
				font-size: 14px;
				margin-bottom: 0;
			}
			.alpha-timeline-header {
			margin-bottom: 32px;
		}
			.swiper-button-next:after, .swiper-button-prev:after {
				font-size: 19px;
			}
			.services-slider-section .swiper-pagination-bullet {
				width: 8px;
				height: 8px;
			}
			.services-slider-section .services-swiper {
				margin: 0 auto;
				padding-bottom: 40px !important;
				position: relative;
			}
           .services-slider-section .service-content {
                flex-direction: column; 
			   gap: 12px;
            }
           .services-slider-section .service-container {
                padding: 0px;
            }
           .services-slider-section .service-header h2 {
                font-size: 26px;
            }
           .services-slider-section .service-details h3 {
                font-size: 18px;
            }
           .services-slider-section .service-image {
                width: 100%;
            }
			.services-slider-section .service-btn{
				font-size: 13px;
				padding: 12px 20px; 
			}
			.service-long-desc p{
				font-size: 13px;
			}
			.job-filters-wrapper {
				display: grid;
				gap: 6px;
			}
			.job-filters-wrapper h6 {
				margin-bottom: 5px;
			}
			.job-filter-select {
				 font-size: 14px;
			}
			.job-summary {
    			padding: 15px 10px; 
			}
			.job-title-wrapper h3 {
				font-size: 18px;
				margin-bottom: 10px;
			}
			.job-content {
				padding: 20px 10px 20px 13px;
				margin-top: 0px;
				font-size: 13px !important;
			}
			.job-content p {
				font-size: 13px !important;
				margin: 0px;
			}
			.job-column h3 , .job-benefits-panel h3 {
				font-size: 16px !important;
			}
			.job-column{
				padding: 0px !important;
			}
			.job-details-grid{
				gap: 10px !important;
    			margin-bottom: 0 !important;
			}
			#customJobModal .cf7-grid-row {
				gap: 10px !important;
				margin-bottom: 10px !important;
			}
			#customJobModal input.wpcf7-form-control.wpcf7-submit , .job-apply-btn {
				font-size: 13px;
			}
			#customJobModal .cf7-grid-column  input, #customJobModal .cf7-grid-column-full textarea {
					font-size: 14px;
				}
			.job-tags {
				font-size: 13px;
			}
        }