/* 
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
*/

/* ============================================
   TABLE OF CONTENTS
   ============================================
   1. CSS Variables
   2. Base Styles
   3. Typography
      3.1 Headings (H1-H4)
      3.2 Body Text
      3.3 Specific Page Typography
   4. Layout
      4.1 Headers & Navigation
      4.2 Footer
   5. Components
      5.1 Buttons
      5.2 Cards & News Boxes
      5.3 Accordions
      5.4 Images
   6. Responsive Design
      6.1 Large Screens (1921px+)
      6.2 Tablet (max-width: 1024px)
      6.3 Mobile (max-width: 767px)
      6.4 Small Mobile (max-width: 480px)
============================================ */


/* ============================================
   1. CSS VARIABLES
   ============================================ */
:root {
    /* Header dimensions */
    --header-height: 45px;
    --admin-bar-height: 32px;
    
    /* Colors */
    --background-color: #ffffff;
    
    /* Effects */
    --shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    --transition-duration: 0.3s;
}


/* ============================================
   2. BASE STYLES
   ============================================ */
html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: visible;
    background-color: var(--background-color);
    overscroll-behavior: none;
    touch-action: pan-x pan-y;
    box-sizing: border-box;
}

html {
    font-size: clamp(14px, 1.2vw, 16px);
}

body {
    padding-top: var(--header-height);
}

body.admin-bar {
    padding-top: calc(var(--header-height) + var(--admin-bar-height));
}


footer .cls-1 {
	 fill: var(--e-global-color-primary);!important;
}

/* ============================================
   3. TYPOGRAPHY
   ============================================ */

/* 3.1 Headings (H1-H4) */

/* H1 - Default */
h1.elementor-heading-title {
    font-family: "Anybody Variable", Sans-serif !important;
    font-size: 2.75rem !important;
    font-weight: 800 !important;
    font-stretch: 140% !important;
    text-transform: uppercase !important;
    line-height: 2.75rem !important;
}

/* H2 - Default */
h2.elementor-heading-title {
    font-family: "Anybody Variable", Sans-serif !important;
    font-size: 1.75rem !important;
    font-weight: 800 !important;
    line-height: 1.75rem !important;
    text-transform: uppercase !important;
    font-stretch: 140% !important;
    padding-bottom: 10px !important;
}

/* H3 - Default */
h3.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    line-height: 1.75rem !important;
    text-transform: uppercase !important;
}

/* H4 - Default */
h4.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.55rem !important;
    line-height: 1.75rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

/* 3.2 Body Text */
p, li, figcaption {
    font-size: 1rem;
}

.bigger-p p {
    font-family: "Recursive", Sans-serif !important;
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.65rem;
    letter-spacing: -0.2px;
}

figcaption span {
    font-weight: 400 !important;
}

/* 3.3 Specific Page Typography */

/* Single Post */
.single-post h1.elementor-heading-title,
.single-our-work h1.elementor-heading-title{
    font-family: "Oswald", Sans-serif !important;
    font-size: 2.75rem !important;
    font-weight: 800 !important;
    line-height: 2.75rem !important;
    text-transform: uppercase !important;
    font-stretch: 140% !important;
}

.single-post h2.elementor-heading-title,
.single-our-work h2.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
}

.btn-custom {
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.25rem;
    border-radius: 10px 10px 10px 10px;
}

.btn-custom .wp-block-button__link {
  transition: 
    background-color 0.4s ease,
    transform 0.3s ease;
}

.btn-custom .wp-block-button__link:hover {
  background-color: #FDF49B !important;
}

/* Header Typography */
header h2.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.2rem !important;
    font-weight: 500 !important;
    line-height: 1.5rem;
	letter-spacing: 0.01rem !important;
}

/* Featured News */
.featurednews h2.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-weight: 800 !important;
    font-size: 2.75rem;
    line-height: 2.85rem;
}

/* News Box */
.newsbox h3.elementor-heading-title {
    font-size: 1.5rem !important;
    line-height: 1.65rem !important;
}

/* Typography Modifiers */
#to-top-button h2.elementor-heading-title {
    padding-bottom: 0px !important;
}

.smallerh2 h2.elementor-heading-title {
    font-size: 1.35rem !important;
    line-height: 1.5rem !important;
}

.oswald h2.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
}

.anybodyitalic h3.elementor-heading-title {
    font-family: "Anybody Variable Italic", Sans-serif !important;
    font-size: 1.85rem !important;
    font-weight: 500 !important;
    line-height: 1.85rem !important;
    font-stretch: 80% !important;
}

.anybodyitalicsmall h3.elementor-heading-title {
    font-family: "Anybody Variable Italic", Sans-serif !important;
    font-size: 1.55rem !important;
    font-weight: 500 !important;
    line-height: 1.55rem !important;
    font-stretch: 80% !important;
}

/* About Us Section */
.tenprinciples h2.elementor-heading-title {
    font-family: "Anybody Variable", Sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.5rem !important;
    text-transform: uppercase !important;
    font-stretch: 140% !important;
    font-style: normal !important;
}

.about-us p {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.5rem !important;
    line-height: 1.5rem !important;
    font-weight: 600 !important;
}

/* Page-Specific Typography (Learning, Volunteering, etc.) */
.pagelearning .wp-page h3.elementor-heading-title,
.pagevolunteering .wp-page h3.elementor-heading-title,
.pageworking .wp-page h3.elementor-heading-title,
.pagemaking-a-change .wp-page h3.elementor-heading-title,
.pagecompeting .wp-page h3.elementor-heading-title {
    font-family: "Anybody Variable Italic", Sans-serif !important;
    font-size: 1.75rem !important;
    font-weight: 590 !important;
    font-stretch: 82% !important;
    text-transform: uppercase !important;
    line-height: 1.75rem !important;
    margin-top: 0.5rem !important;
}

/* Opportunity Categories Typography */
.opp-categ h2.elementor-heading-title,
.learning2 h2.elementor-heading-title,
.volunteering2 h2.elementor-heading-title,
.working2 h2.elementor-heading-title,
.making2 h2.elementor-heading-title,
.competing2 h2.elementor-heading-title,
.info-proj h2.elementor-heading-title,
.campaigns2 h2.elementor-heading-title,
.contact h2.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.5rem !important;
    line-height: 1.5rem !important;
    font-weight: 600 !important;
}

.campaigns1 h2.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.75rem !important;
    line-height: 1.5rem !important;
    font-weight: 600 !important;
}

.learning3 p,
.volunteering3 p,
.working3 p,
.making3 p,
.competing3 p {
    font-family: "Recursive", Sans-serif !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.5rem !important;
}

.contact p {
    font-size: 1.25rem !important;
}




.postinfo_custom ul.elementor-post-info li {
	background: #D9E3FB;
    padding: 1px 13px;
    border-radius: 10px;
	
}

.bluebg .postinfo_custom ul.elementor-post-info li {
	background: #fff;
	
}

.nonewscategorytag .postinfo_custom   {
	display:none!important;
	
}


/* ============================================
   4. LAYOUT
   ============================================ */

/* 4.1 Headers & Navigation */

/* Shared Header Styles */
.header-1, 
.header-2 {
    width: 100%;
    position: fixed;
    top: 0;
    height: var(--header-height);
    background-color: var(--background-color);
    box-shadow: var(--shadow);
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    transition: transform var(--transition-duration) ease, opacity var(--transition-duration) ease;
    will-change: transform, opacity;
}

/* Header 1 */
.header-1 {
    z-index: 1000;
    opacity: 1;
}

/* Header 2 */
.header-2 {
    z-index: 999;
    transform: translateY(-100%);
    opacity: 0;
    overflow: visible;
}

/* Scrolled State */
.scrolled .header-2 {
    transform: translateY(0);
    opacity: 1;
    z-index: 1001;
}

.scrolled .header-1 {
    z-index: 998;
}

/* Admin Bar Adjustments */
body.admin-bar .header-1,
body.admin-bar .header-2 {
    top: var(--admin-bar-height);
}

/* Hero Section */
.hero-section {
    margin-top: var(--header-height);
}

/* 4.2 Footer */
footer h3.elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 590 !important;
    font-stretch: 82% !important;
    text-transform: uppercase !important;
    line-height: 1.75rem !important;
    margin-top: 0.5rem !important;
}

.p_footer_mobile p {
    font-size: 1.4rem !important;
    font-weight: 500 !important;
}

.gdpr p {
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	line-height: 1rem;
}

.gdpr span {
	font-size: 0.75rem !important;
	font-weight: 500 !important;
    line-height: 1rem;
}


/* ============================================
   5. COMPONENTS
   ============================================ */

/* 5.1 Buttons */
.elementor-26 .elementor-element.elementor-element-9713905 .elementor-heading-title {
    font-family: "Oswald", Sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* 5.2 Cards & News Boxes */
/* Handled in Typography section */

/* 5.3 Accordions (See Some Projects Dropdown) */
details {
    margin-left: -30px;
}

details .e-n-accordion-item-title-text,
details .e-n-accordion-item-title-icon {
    transition: all 0.3s ease;
}

details summary {
    margin-left: 30px;
    max-width: 250px;
    padding: 10px 10px 10px 10px !important;
    border-radius: 10px 10px 0 0 !important;
    transition: all 0.3s ease;
    background: rgba(255, 255, 255, 0);
}

details[open] summary {
    background: rgba(255, 255, 255, 1);
}

details .contenuaccordeon {
    background: rgba(255, 255, 255, 0);
}

details[open] .contenuaccordeon {
    border-radius: 10px 10px 10px 10px !important;
    background: rgba(255, 255, 255, 1);
}



/* reset for contact us pro */
.pro details {
    margin-left: 0px;
}


.pro details summary {
    margin-left: 0px;
    max-width: 1250px;
    padding: 20px 10px 10px 20px !important;
    border-radius: 10px 10px 0 0 !important;
    transition: all 0.3s ease;
    background: rgba(255, 255, 255, 0);
}

.pro details[open] summary {
    background: rgba(255, 255, 255, 1);
}

.pro details .contenuaccordeon {
    background: rgba(255, 255, 255, 0);
	
}

.pro details[open] .contenuaccordeon {
    border-radius: 0px 0px 10px 10px !important;
    background: rgba(255, 255, 255, 1);
	padding-left:60px;
}

.pro details[open] .contenuaccordeon .e-con-inner {
	padding-top:20px
}

/* 5.4 Images */
.widthauto img {
    width: auto !important;
    max-width: none;
}


/* ============================================
   6. RESPONSIVE DESIGN
   ============================================ */

/* 6.1 Large Screens (1921px+) */
@media (min-width: 1921px) {
    header + div > div,
    footer > footer,
    .elementor-element-2ae3ffde {
        padding-inline: 10vw !important;
    }
	
	.elementor-element-2ae3ffde {
		 padding-inline: 0vw !important;
	}
}

/* 6.2 Tablet (max-width: 1024px) */
@media (max-width: 1024px) {
    h2.elementor-heading-title {
        font-size: 1.25rem !important;
    }
}

/* 6.3 Mobile (max-width: 767px) */
@media (max-width: 767px) {
    /* Base Typography */
    h1.elementor-heading-title {
        font-size: 2.2rem !important;
		 font-size: 2rem !important;
        font-weight: 800;
        line-height: 2.3rem !important;
    }

    h2.elementor-heading-title {
        font-family: "Anybody Variable", Sans-serif !important;
        font-size: 1.75rem !important;
        line-height: 1.85rem !important;
        text-transform: uppercase !important;
    }

    h3.elementor-heading-title {
        font-family: "Oswald", Sans-serif !important;
        font-size: 1.5rem !important;
        font-weight: 600 !important;
        line-height: 1.5rem !important;
        text-transform: uppercase !important;
    }

    p {
        font-family: "Recursive", Sans-serif !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        line-height: 1.5rem !important;
    }

    .bigger-p p {
        font-size: 1.25rem !important;
        line-height: 1.75rem !important;
    }
	
	/* Team members names (About Us Page) */
	
	.membersname p {
        font-weight: 700 !important;
    }

    /* Featured News */
    .featurednews h2.elementor-heading-title {
        font-size: 1.75rem;
        line-height: 1.85rem;
    }

    /* Cards */
    .cards h2.elementor-heading-title {
        font-size: 2rem !important;
        line-height: 2.15rem !important;
    }

    /* News Box */
    .newsbox h3.elementor-heading-title {
        font-size: 1.15rem !important;
        line-height: 1.35rem !important;
    }

    /* Page-Specific Typography */
    .pagelearning h1.elementor-heading-title,
    .pagevolunteering h1.elementor-heading-title,
    .pageworking h1.elementor-heading-title,
    .pagemaking-a-change h1.elementor-heading-title,
    .pagecompeting h1.elementor-heading-title {
        font-size: 2.2rem !important;
        line-height: 2.3rem;
    }

    .pagelearning h2.elementor-heading-title,
    .pagevolunteering h2.elementor-heading-title,
    .pageworking h2.elementor-heading-title,
    .pagemaking-a-change h2.elementor-heading-title,
    .pagecompeting h2.elementor-heading-title {
        font-size: 1.65rem !important;
        line-height: 1.75rem;
    }

    /* Header Adjustments */
    :root {
        --header-height: 40px;
    }

    .header-1, .header-2 {
        font-size: 0.9rem;
    }

    .hero-section {
        margin-top: var(--header-height);
    }

    /* Mobile Navigation */
    #elementor-popup-modal-32593,
    #elementor-popup-modal-32527 {
        justify-content: flex-end;
        position: fixed;
        z-index: 9999999;
    }
	
	.elementor-nav-menu--dropdown li {
		padding-bottom: 17px !important;
    }
	
	.elementor-nav-menu--dropdown li a {
        font-size: 22px !important;
		font-weight: 500 !important;
    }

    .elementor-nav-menu--dropdown .sub-menu li {
        padding-bottom: 1px !important;
    }

    .elementor-nav-menu--dropdown .sub-menu li a {
        font-size: 16px !important;
        font-family: "Recursive", Sans-serif !important;
        font-weight: 500 !important;
    }

    /* Buttons */
    .elementor-button-icon {
        display: none !important;
    }
	
	.elementor-widget-eurodesk_opportunity_finder .eurodesk-opportunity-finder	.owl-prev,
	.elementor-widget-eurodesk_opportunity_finder .eurodesk-opportunity-finder	.owl-next {
		background:none!important;
		
	}

    /* Accordions */
    details {
        margin-left: 0px;
    }

    details summary {
        margin-left: 0px;
    }

    details[open] .contenuaccordeon {
        border-radius: 0px 10px 10px 10px !important;
    }

    /* Specific Element Adjustments */
    .elementor-32129 .elementor-element.elementor-element-763b74a1.e-con,
	.elementor-38084 .elementor-element.elementor-element-85c97a2.e-con {
        --e-con-transform-rotateZ: 0deg !important;
        --align-self: center;
    }

    .elementor-29643 .elementor-element.elementor-element-0df7862 > .elementor-widget-container,
	.elementor-42690 .elementor-element.elementor-element-0df7862 > .elementor-widget-container ,
	.elementor-widget-container {
        --e-transform-rotateZ: 0deg !important;
    }
	
	
	
	.tenkeyprinciples .elementor-element.elementor-arrows-position-outside .swiper, 
	.tenkeyprinciples .elementor-lightbox.elementor-arrows-position-outside .swiper {
    width: calc(100% - 140px);
		}
	
	.tenkeyprinciples  .elementor-image-carousel-caption {
       font-size: 1rem!important;
     
   }
	
	
	
	    .team .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image {
              width: 70%!important;
    	}
		
		.team .elementor-image-carousel-caption {
       font-size: 1rem!important;
        }
	

.elementor-widget-n-carousel .elementor-swiper-button.elementor-swiper-button-next:hover svg,
.elementor-widget-n-carousel .elementor-swiper-button.elementor-swiper-button-prev:hover svg, 
.elementor-widget-loop-carousel .elementor-swiper-button.elementor-swiper-button-prev:hover svg ,
.elementor-widget-loop-carousel .elementor-swiper-button.elementor-swiper-button-next:hover svg {
    fill: var(--e-global-color-primary);!important;
}
	
	footer .cls-1 {
	 fill: #fff;!important;
}
	
} /* max 767 */

/* 6.4 Small Mobile (max-width: 480px) */
@media (max-width: 480px) {
    :root {
        --header-height: 35px;
    }

    .header-1, .header-2 {
        justify-content: center;
    }

    body {
        padding-top: var(--header-height);
    }

    .hero-section {
        margin-top: var(--header-height);
    }
}
