/* ============================================
   BUSINESS HUB - STYLES
   Palette inspirée de groupefiscal.com
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');

:root{
    --primary-color:#073b73; /* deep navy */
    --secondary-color:#0f6fd6; /* vivid blue */
    --accent-color:#b02b24; /* warm gold */
    --dark-color:#0b2540;
    --light-bg:#f4f6fb;
    --white:#ffffff;
    --text-color:#1f2937;
    --text-light:#6b7280;
    --border-color:#e6edf8;
    --success-color:#16a34a;
    --gradient-primary:linear-gradient(135deg,var(--primary-color) 0%, #0b4ea0 100%);
    --gradient-secondary:linear-gradient(135deg,var(--accent-color) 0%, #e08b00 100%);
}

/* Reset & Base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{font-family:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,Arial;color:var(--text-color);line-height:1.6;-webkit-font-smoothing:antialiased}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ============================================
   HERO SECTION
   ============================================ */

.hero-business-hub{position:relative;background:none;color:var(--text-color);padding:100px 0 60px;overflow:hidden}
.hero-business-hub::before{content:'';position:absolute;inset:0;background:url('../img/hero-business-hub.jpg') center/cover no-repeat;z-index:0;opacity:1;filter:brightness(0.96) saturate(0.98)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,30,62,0.55) 0%, rgba(9,30,62,0.40) 40%, rgba(9,30,62,0.20) 75%);z-index:1}
.hero-content{position:relative;z-index:2;text-align:center;max-width:980px;margin:0 auto;padding:0 20px;padding-top: 50px;}
.hero-title{font-size:3rem;font-weight:700;margin-bottom:14px;letter-spacing:-0.6px;color:var(--white)}
.hero-subtitle{font-size:1.05rem;margin-bottom:20px;font-weight:500;color:var(--white)}
.hero-description{font-size:1.05rem;line-height:1.8;margin-bottom:28px;text-align:center;color:var(--white)}
.hero-description p{margin-bottom:12px}

.btn-primary-hub{display:inline-block;background:var(--accent-color);color:var(--white);padding:14px 36px;font-size:1.05rem;font-weight:700;text-decoration:none;border-radius:999px;transition:transform .18s ease,box-shadow .18s ease;box-shadow:0 10px 26px rgba(7,59,115,0.12)}
.btn-primary-hub:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(7,59,115,0.14);background:linear-gradient(90deg,var(--accent-color),#e08b00)}

/* ============================================
   SECTIONS COMMUNES
   ============================================ */

section{padding:80px 0}

.section-header{text-align:center;margin-bottom:48px}
.section-title{font-size:2rem;color:var(--dark-color);margin-bottom:12px;font-weight:700}
.title-underline{width:72px;height:4px;background:var(--accent-color);margin:0 auto;border-radius:4px}

/* ============================================
   SECTION MISSION
   ============================================ */

.section-mission{background:var(--light-bg)}
.mission-intro{text-align:center;font-size:1.05rem;margin-bottom:40px;color:var(--text-light)}
.mission-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-bottom:30px}
.mission-item{background:var(--white);padding:28px;border-radius:12px;text-align:center;transition:transform .22s ease,box-shadow .22s ease;box-shadow:0 8px 24px rgba(2,6,23,0.04)}
.mission-item:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(2,6,23,0.06)}
.mission-icon{width:64px;height:64px;background:var(--gradient-primary);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.5rem}
.mission-item h3{font-size:1.15rem;color:var(--dark-color);margin-bottom:10px}
.mission-item p{color:var(--text-light);line-height:1.6}
.mission-conclusion{text-align:center;font-size:1.05rem;color:var(--text-color);margin-top:28px;padding:18px;background:var(--white);border-radius:10px;border-left:4px solid rgba(246,168,0,0.12)}

/* ============================================
   SECTION DOMAINES
   ============================================ */

.section-domaines {
    background: var(--white);
}

.domaines-intro {
    text-align: center;
    font-size: 1.2rem;
    margin-bottom: 50px;
    color: var(--text-light);
}

.domaines-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 25px;
}

.domaine-card{background:var(--light-bg);padding:26px;border-radius:12px;border-left:6px solid rgba(7,59,115,0.06);transition:transform .2s ease,box-shadow .2s ease;position:relative;overflow:hidden}
.domaine-card::before{content:'';position:absolute;top:0;left:0;width:6px;height:100%;background:var(--accent-color);transform:scaleY(0);transition:transform .28s ease}
.domaine-card:hover::before{transform:scaleY(1)}
.domaine-card:hover{background:var(--white);box-shadow:0 10px 30px rgba(2,6,23,0.06);transform:translateY(-6px)}
.domaine-number{font-size:2rem;font-weight:700;color:var(--primary-color);opacity:0.12;margin-bottom:10px}
.domaine-card h3{font-size:1.15rem;color:var(--dark-color);margin-bottom:10px}
.domaine-card p{color:var(--text-light);line-height:1.6}

/* ============================================
   SECTION CGA
   ============================================ */

.section-cga{background:var(--dark-color);color:var(--white)}
.section-cga .section-title,.section-cga .cga-title{color:var(--white)}
.cga-wrapper{display:grid;grid-template-columns:2fr 1fr;gap:40px;align-items:center}
.cga-content{text-align:left}
.cga-title{font-size:1.6rem;margin-bottom:12px}
.cga-content>p{font-size:1.03rem;line-height:1.7;margin-bottom:18px}
.cga-benefits h2{margin-bottom:14px;color:var(--accent-color)}
.benefits-list{list-style:none;padding:0}
.benefits-list li{padding:10px 0;display:flex;align-items:flex-start;gap:12px}
.benefits-list i{color:var(--accent-color);font-size:1.1rem;margin-top:3px}
.cga-stats{display:flex;flex-direction:column;gap:18px}
.stat-box{background:rgba(255,255,255,0.08);backdrop-filter:blur(6px);padding:28px 20px;border-radius:12px;text-align:center;border:1px solid rgba(255,255,255,0.08)}
.stat-number{font-size:2.4rem;font-weight:700;color:var(--accent-color);margin-bottom:6px}
.stat-label{font-size:1rem;color:var(--white)}

/* ============================================
   SECTION PARTENARIATS
   ============================================ */

.section-partenariats {
    background: var(--light-bg);
}

.partenariats-intro {
    text-align: center;
    font-size: 1.2rem;
    margin-bottom: 50px;
    color: var(--text-light);
}

.partenaires-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-bottom: 40px;
}

.partenaire-card{background:var(--white);padding:28px 22px;border-radius:12px;text-align:center;transition:transform .22s ease,box-shadow .22s ease;box-shadow:0 10px 30px rgba(2,6,23,0.04)}
.partenaire-card.featured{background:var(--gradient-primary);color:var(--white);border:2px solid rgba(240,156,18,0.12)}
.partenaire-card.featured h3,.partenaire-card.featured p{color:var(--white)}
.partenaire-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(2,6,23,0.06)}
.partenaire-icon{width:64px;height:64px;background:var(--accent-color);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.4rem}
.partenaire-card.featured .partenaire-icon{background:var(--white);color:var(--primary-color)}
.partenaire-card h3{font-size:1.15rem;color:var(--dark-color);margin-bottom:12px}
.partenaire-card p{color:var(--text-light);line-height:1.6}

.partenariats-conclusion {
    text-align: center;
    font-size: 1.1rem;
    color: var(--text-color);
    margin-top: 30px;
}

/* ============================================
   SECTION PROGRAMMES
   ============================================ */

.section-programmes {
    background: var(--white);
}

.programmes-intro {
    text-align: center;
    font-size: 1.2rem;
    margin-bottom: 50px;
    color: var(--text-light);
}

.programmes-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.programme-card{background:var(--light-bg);padding:28px 22px;border-radius:12px;transition:transform .22s ease,box-shadow .22s ease;box-shadow:0 10px 28px rgba(2,6,23,0.04);position:relative}
.programme-card.highlight{background:var(--gradient-secondary);color:var(--white);border:2px solid rgba(7,59,115,0.06)}
.programme-card.highlight h3,.programme-card.highlight p{color:var(--white)}
.programme-badge{background:var(--white);color:var(--accent-color);padding:6px 18px;border-radius:999px;font-size:0.9rem;font-weight:600;display:inline-block;margin-bottom:14px}
.programme-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(2,6,23,0.06)}
.programme-card h3{font-size:1.15rem;color:var(--dark-color);margin-bottom:10px}
.programme-card p{color:var(--text-light);line-height:1.6;margin-bottom:12px}

.programme-meta {
    display: flex;
    gap: 20px;
    font-size: 0.9rem;
}

.meta-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.meta-item i {
    color: var(--white);
}

/* ============================================
   SECTION PUBLIC CIBLE
   ============================================ */

.section-public {
    background: var(--light-bg);
}

.public-intro {
    text-align: center;
    font-size: 1.2rem;
    margin-bottom: 50px;
    color: var(--text-light);
}

.public-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
}

.public-card {
    background: var(--white);
    padding: 35px 25px;
    border-radius: 10px;
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.public-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    background: var(--accent-color);
    color: var(--white);
}

.public-card:hover h3,
.public-card:hover p {
    color: var(--white);
}

.public-card:hover .public-icon {
    background: var(--secondary-color);
}

.public-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 1.8rem;
    transition: all 0.3s ease;
}

.public-card h3 {
    font-size: 1.3rem;
    color: var(--dark-color);
    margin-bottom: 15px;
}

.public-card p {
    color: var(--text-light);
    line-height: 1.6;
}

/* ============================================
   SECTION CONTACT & CTA
   ============================================ */


.section-contact-hub{background:var(--dark-color);color:var(--white)}
.contact-wrapper{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:center}


.contact-content h2{font-size:1.6rem;margin-bottom:12px;color:var(--white)}
.contact-content p{font-size:1.03rem;line-height:1.7;margin-bottom:18px;color:rgba(255,255,255,0.92)}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 1.1rem;
}

.contact-item i {
    color: var(--accent-color);
    font-size: 1.3rem;
}

.contact-item a {
    color: var(--white);
    text-decoration: none;
    transition: color 0.3s ease;
}

.contact-item a:hover {
    color: var(--accent-color);
}

.contact-cta {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.btn-cta-large{display:inline-block;background:linear-gradient(90deg,var(--accent-color),#e08b00);color:var(--white);padding:14px 34px;font-size:1.05rem;font-weight:700;text-decoration:none;text-align:center;border-radius:999px;transition:transform .18s ease,box-shadow .18s ease;box-shadow:0 12px 32px rgba(7,59,115,0.08)}
.btn-cta-large:hover{transform:translateY(-4px);box-shadow:0 22px 48px rgba(7,59,115,0.1)}
.btn-secondary-hub{display:inline-block;background:transparent;color:var(--white);padding:12px 34px;font-size:1rem;font-weight:600;text-decoration:none;text-align:center;border-radius:999px;border:2px solid rgba(255,255,255,0.16);transition:all .18s ease}
.btn-secondary-hub:hover{background:var(--white);color:var(--dark-color)}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width:992px){.hero-title{font-size:2.4rem}.hero-subtitle{font-size:1.05rem}.section-title{font-size:1.6rem}.cga-wrapper,.contact-wrapper{grid-template-columns:1fr}.mission-grid,.domaines-list,.partenaires-grid,.programmes-list,.public-grid{grid-template-columns:1fr}}
@media (max-width:768px){section{padding:60px 0}.hero-business-hub{padding:80px 0 50px}.hero-title{font-size:1.8rem}.hero-description{font-size:1rem}.btn-primary-hub,.btn-cta-large{padding:12px 22px;font-size:1rem}}