Programme "Apprendre pour vivre 2035"
L'alphabétisation inclusive au service de l'autonomie
Transformer l'éducation classique en levier de développement économique pour les personnes en situation de handicap, les femmes vulnérables et les jeunes déscolarisés à Yaoundé.
/* --- STYLES DE LA SECTION HERO --- */
.ease-hero-section {
position: relative;
width: 100%;
min-height: 80vh;
display: flex;
align-items: center;
justify-content: flex-start;
/* Image libre de droits (Unsplash) simulant une scène d'apprentissage ou de communauté */
background-image: url('https://images.unsplash.com/photo-1509062522246-3755977927d7?q=80&w=1920&auto=format&fit=crop');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed; /* Effet parallaxe natif */
overflow: hidden;
font-family: 'Poppins', sans-serif;
padding: 100px 4%;
box-sizing: border-box;
}
/* Superposition en dégradé linéaire selon votre charte */
.ease-hero-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, #1A2D54 60%, #0B6D43 100%);
opacity: 0.85;
z-index: 1;
}
/* Conteneur de contenu limité à gauche */
.ease-hero-container {
position: relative;
z-index: 2;
width: 100%;
max-width: 800px;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
}
/* --- COMPOSANTS DE TEXTE --- */
.ease-hero-badge {
background-color: rgba(240, 150, 9, 0.2);
border: 1px solid #F09609;
color: #F09609;
padding: 6px 16px;
border-radius: 50px;
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
}
.ease-hero-title {
color: #FFFFFF;
font-size: 3.5rem;
font-weight: 900;
line-height: 1.2;
margin: 0;
}
.ease-hero-text {
color: #E2E8F0;
font-size: 1.2rem;
line-height: 1.6;
margin: 0;
}
/* --- BOUTONS --- */
.ease-hero-buttons {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
.ease-btn {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 14px 28px;
font-size: 16px;
font-weight: 600;
border-radius: 50px;
text-decoration: none;
transition: all 0.3s ease;
cursor: pointer;
}
.ease-btn-primary {
background-color: #F09609;
color: #FFFFFF;
border: 2px solid #F09609;
}
.ease-btn-primary:hover {
background-color: #d68508;
border-color: #d68508;
transform: translateY(-3px);
}
.ease-btn-outline {
background-color: transparent;
color: #FFFFFF;
border: 2px solid #FFFFFF;
}
.ease-btn-outline:hover {
background-color: #FFFFFF;
color: #1A2D54;
transform: translateY(-3px);
}
/* --- VAGUE DECORATIVE (SHAPE DIVIDER) --- */
.ease-hero-wave {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
overflow: hidden;
line-height: 0;
z-index: 3;
}
.ease-hero-wave svg {
position: relative;
display: block;
width: calc(100% + 1.3px);
height: 80px;
}
.ease-hero-wave .wave-fill {
fill: #FFFFFF; /* Épouse parfaitement le fond de la section suivante */
}
/* --- ANIMATIONS EFFECT --- */
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(40px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.ease-animate {
opacity: 0;
animation: fadeInUp 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
animation-delay: var(--animation-delay);
}
/* --- ADAPTATION MOBILE (RESPONSIVE) --- */
@media (max-width: 768px) {
.ease-hero-section {
padding: 80px 6% 120px 6%;
background-attachment: scroll; /* Désactivé sur mobile pour la performance */
}
.ease-hero-title {
font-size: 2.2rem;
}
.ease-hero-text {
font-size: 1.1rem;
}
.ease-hero-buttons {
width: 100%;
flex-direction: column;
}
.ease-btn {
width: 100%;
justify-content: center;
}
}
Programme "Apprendre pour vivre 2035"
L'alphabétisation inclusive au service de l'autonomie
Transformer l'éducation classique en levier de développement économique pour les personnes en situation de handicap, les femmes vulnérables et les jeunes déscolarisés à Yaoundé.
