/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */




.hero-section { position: relative; background: #2d2254; color: #fff; }
.hero-content { display: flex; align-items: center; justify-content: space-between; max-width: 1140px; margin: 0 auto; gap: 2rem; flex-wrap: wrap; padding-top: 50px; }
.hero-text-left { flex: 1 1 300px; animation: fadeInLeft 1s ease both; }
.hero-text-left h1 { margin: 0; font-size: 3rem; line-height: 1.2; }
.hero-text-right { flex: 1 1 300px; animation: fadeInRight 1s ease both; animation-delay: .25s; }
.hero-text-right p { margin: 0; font-size: 1.1rem; line-height: 1.6; }
.hero-image { flex: 1 1 100%; margin-top: 2rem; animation: fadeIn 1s ease both; animation-delay: .6s; text-align: center; z-index: 3; }
.hero-image img { max-width: 100%; height: auto; border-radius: 1rem; display: inline-block; width: 100%; margin-bottom: -25px; z-index: 2; }
.hero-divider { position: absolute; bottom: -1px; left: 0; width: 100%; height: 100px; overflow: hidden; line-height: 0; }
.hero-divider svg { position: relative; display: block; width: calc(100% + 1.3px); height: 100px; }
.hero-divider path { fill: #e8eff5; }

@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(-30px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}



.job-total { padding: 100px 0; max-width: 1140px; margin: auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 40px; }
.job-total-filter{width: 100%;}
.job-filter label { width: auto; }
.job-filter { background: #2d2254; color: white; padding: 20px; border-radius: 15px; }
.job-offers-list { display: flex; flex-wrap: wrap; gap: 20px; width: 100%; }
.job-offer { border-radius: 10px; padding: 20px; background-color: #fff; transition: box-shadow 0.3s ease; display: flex; flex-direction: column; justify-content: space-between; width: calc(33.33% - 14px); }
.job-offer:hover { box-shadow: 0 4px 10px rgba(0,0,0,0.3); }
.job-offers-list h1{width: 100%;}
.job-offer h2 { margin-top: 0; font-size: 26px; color: #2d2254; transition: all 0.3s; }
.job-offer h2 a { text-decoration: none; color: inherit; transition: all 0.3s; }
.job-offer:hover h2 a { color: #e9474e; }
.job-learn-more-button { margin-top: auto; display: inline-block; background-color: #2d2254; padding: 0.6rem 1.2rem; border-radius: 100px; font-weight: 600; text-align: center; text-decoration: none; transition: background-color 0.3s ease; margin-top: 10px; } 
a.job-learn-more-button { color: white; }
.job-learn-more-button:hover { background-color: #e9484e; }
a.job-learn-more-button:hover { color: white; }

.job-header{ display: flex; justify-content: space-between; align-items: center;padding-bottom: 10px; }
.job-single-wrapper { max-width: 1140px; margin: 0 auto; padding: 80px 0; }
.job-title { font-size: 34px; color: #2d2254; margin-bottom: 1rem; }
.job-meta { padding: 10px 2px; color: black; border-top: 1px solid #2d2254; }
.job-meta span { font-weight: 600; color: #e9474e; } .job-meta i { padding-right: 10px; }
.job-meta p { margin: 0.4rem 0; }
.job-description { margin-bottom: 2rem; line-height: 1.6;; padding: 0 20px; }
.job-apply { text-align: center; padding-top: 40px; }
.job-apply-button { display: inline-block; background-color: #e9474e; padding: 0.6rem 1.2rem; border-radius: 100px; font-weight: 600; text-align: center; text-decoration: none; transition: background-color 0.3s ease; }
a.job-apply-button{ color: white; }
.job-apply-button:hover { background-color: #2d2254; }
a.job-apply-button:hover { color: white; }
.single-job_offer .job-meta { padding: 10px 2px; color: black; border-top: 1px solid #2d2254; display: flex; gap: 40px; justify-content: center; }
.job-section{border-top: 1px solid #2d2254;; padding: 20px;}

.single-job_offer h2{color: #e9474e;}


.page-id-414 .job-offer, .page-id-75 .job-offer { background: #e8eff5; }
.page-id-414 .job-offers-list, .page-id-75 .job-offers-list{ width: 100%; }

@media(max-width:980px){
    .hero-content { padding: 20px; }
    .job-total { padding: 50px 20px; }
    .job-offer h2 { font-size: 20px; } 
    .job-single-wrapper { width: 100%; padding: 60px 20px; }
    .job-title { font-size: 26px;max-width: 75%;}
    .job-single-wrapper h2 { font-size: 24px; }
}

@media(max-width:769px){
.job-offer {width: 100%; }
    .job-total-filter { width: 100%; }
    .job-offers-list { width: 100%; }
    .job-single-wrapper {padding: 35px 20px; }
    .job-header { flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 0 0 30px; }
    .job-title { font-size: 24px; max-width: 100%; }
    .single-job_offer .job-meta { flex-direction: column; gap: 20px; padding-bottom: 40px; }
    .job-description{padding: 0;}
    .job-apply { padding-top: 20px; }
}