.card{
transition:all .35s;
} 

.card:hover{
transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,.15);
}

.fade{
animation:fadeUp .8s ease;
}

@keyframes fadeUp{
from{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}
}
.parallax{
transform:translateY(0);
transition:transform .2s linear;
}
.reveal{
opacity:0;
transform:translateY(60px);
transition:all 1s ease;
}

.reveal.active{
opacity:1;
transform:translateY(0);
}

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

@media(max-width:1024px){

.zones-layout{
grid-template-columns:1fr;
}

.zones-menu{
order:2;
}

.zone-grid{
grid-template-columns:1fr 1fr;
}

}

@media(max-width:640px){

.zone-grid{
grid-template-columns:1fr;
}

.annuaire-filtres{
grid-template-columns:1fr;
}

#mapClusters{
height:420px;
}

}
body{
font-family:Arial;
background:#f4f4f4;
margin:0;
}

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

/* BLOCS TEXTE */

.info-section{
max-width:900px;
margin:5px auto 15px auto;
}

.info-header{

display:flex;
align-items:center;
gap:12px;
margin-bottom:10px;

}

.info-bar{

width:6px;
height:26px;
background:#F77F00;
border-radius:3px;

}

.info-header h2{

font-size:26px;
font-weight:700;
color:#1f2937;
margin:0;

}

.info-text{

font-size:15px;
line-height:1.7;
color:#4b5563;
margin-bottom:10px;

}
.banner{
margin-bottom:0;
}

/* CARTE */
.mapBlock{
  width:100%;
  margin:20px auto;
  padding:0;          /* important : pas de padding qui réduit la carte */
}

#mapClusters{
height:500px;
width:100%;
border-radius:10px;
}
/* LISTE + FICHE */

:root{

--orange-ci:#F77F00;
--vert-ci:#009E60;
--gris:#F5F5F5;

}

/* TITRES DE SECTION */

.section-title{

margin-bottom:25px;
max-width:700px;

}

.section-title h2{

font-size:32px;
font-weight:700;
color:#1f2937;
margin-bottom:8px;

}

.section-title p{

color:#6b7280;
font-size:15px;
line-height:1.6;

}

.section-bar{

display:block;
width:60px;
height:4px;
background:#F77F00;
margin-bottom:12px;
border-radius:2px;

}
.zones-layout{
display:grid;
grid-template-columns:280px 1fr;
gap:20px;
max-width:1200px;
margin:auto;
padding:25px 20px 10px 20px;
}
/* MENU */

.zones-menu{
background:white;
border-radius:12px;
box-shadow:0 8px 20px rgba(0,0,0,0.06);
}

.zones-menu ul{
list-style:none;
margin:0;
padding:0;
}

.zones-menu li{
padding:16px 20px;
cursor:pointer;
border-bottom:1px solid #eee;
transition:0.2s;
}

.zones-menu li:hover{
background:var(--gris);
}

.zones-menu li.active{
background:#e8f5ef;
color:var(--vert-ci);
font-weight:600;
}

/* FICHE */

.zone-fiche{
background:white;
border-radius:12px;
box-shadow:0 10px 30px rgba(0,0,0,0.08);
overflow:hidden;
}

/* IMAGE */

.zone-hero{
position:relative;
height:260px;
}

.zone-hero img{
width:100%;
height:100%;
object-fit:cover;
}

.zone-overlay{
position:absolute;
bottom:0;
left:0;
right:0;
padding:20px;
background:linear-gradient(to top, rgba(0,158,96,0.8), transparent);
color:white;
}

.zone-overlay h2{

font-size:26px;
font-weight:700;
letter-spacing:0.3px;

}
.section-text{

font-size:16px;
color:#4b5563;
line-height:1.7;
max-width:850px;

}
/* KPI */

.zone-kpi{
padding:25px;
}

.kpi-card{
background:var(--gris);
padding:20px;
border-radius:10px;
text-align:center;
}

.kpi-card span{
display:block;
font-size:12px;
color:#6b7280;
}

.kpi-card strong{
font-size:36px;
color:var(--vert-ci);
}

/* GRID */

.zone-grid{
padding:0 25px 25px 25px;
display:grid;
grid-template-columns:1fr 1fr 1fr;
gap:20px;
}

.zone-card{
background:var(--gris);
padding:18px;
border-radius:10px;
}

.zone-card h4{

font-size:16px;
font-weight:600;
margin-bottom:12px;
color:#374151;
border-left:4px solid #009E60;
padding-left:10px;

}

/* BADGES */

.badge-container{
display:flex;
flex-wrap:wrap;
gap:8px;
}

.badge{
background:var(--orange-ci);
color:white;
padding:6px 10px;
border-radius:6px;
font-size:13px;
}

/*annuaires*/
.annuaire-section{
max-width:1100px;
margin:30px auto 10px auto;
padding:30px 20px;
}

.annuaire-title{
text-align:center;
font-size:30px;
font-weight:600;
margin-bottom:15px;
}

/* filtres */

.annuaire-filtres{

display:grid;
grid-template-columns:1fr 1fr 1fr;
gap:12px;
margin-bottom:25px;

}

.annuaire-filtres input,
.annuaire-filtres select{

padding:12px;
border:1px solid #e5e7eb;
border-radius:8px;
background:#fafafa;

}

/* table */

.table-container{

background:white;
border-radius:10px;
box-shadow:0 6px 20px rgba(0,0,0,0.06);

}

.annuaire-table{

width:100%;
border-collapse:collapse;

}

.annuaire-table th{

padding:14px;
font-weight:600;
border-bottom:1px solid #eee;
background:#fafafa;

}

.annuaire-table td{

padding:14px;
border-bottom:1px solid #f1f1f1;

}

.annuaire-table tr:hover{

background:#fafafa;

}

/* bouton */

.btn-popup{

border:1px solid #f97316;
color:#f97316;
background:white;
padding:6px 12px;
border-radius:6px;
cursor:pointer;

}

.btn-popup:hover{

background:#f97316;
color:white;

}

/* pagination */

.pagination{
margin-top:10px;
margin-bottom:0;
text-align:center;
}

.page-btn{

padding:6px 12px;
border-radius:6px;
border:1px solid #ddd;
background:white;
margin:3px;
cursor:pointer;

}

.page-btn:hover{

background:#f3f4f6;

}

/* popup */

.popup-overlay{

position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.35);
backdrop-filter:blur(3px);
display:flex;
align-items:center;
justify-content:center;

}

.popup-card{

background:white;
border-radius:12px;
width:380px;
box-shadow:0 10px 40px rgba(0,0,0,0.2);

}

.popup-header{

display:flex;
justify-content:space-between;
align-items:center;
padding:18px 22px;
border-bottom:1px solid #eee;

}

.popup-header h3{

font-size:20px;

}

.popup-header button{

border:none;
background:none;
font-size:18px;
cursor:pointer;

}

.popup-body{

padding:22px;

}

.popup-item{

margin-bottom:15px;

}

.popup-item span{

font-size:12px;
color:#6b7280;

}

.popup-item p{

font-weight:500;

}

.hidden{

display:none;

}

/* ===============================
SECTION ACTUALITES / EVENEMENTS
=============================== */

.news-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
align-items:start;
}

/* carte actualité */

.news-card{
display:block;
text-decoration:none;
color:#1f2937;
}

.news-card img{
width:100%;
height:210px;
object-fit:cover;
border-radius:10px;
margin-bottom:10px;
}

.news-date{
font-size:14px;
color:#111;
margin-bottom:5px;
}

.news-title{
font-size:18px;
font-weight:500;
line-height:1.3;
}

/* pagination */

.pagination{
margin-top:30px;
display:flex;
gap:8px;
}

.page-btn{
padding:8px 12px;
border-radius:6px;
border:1px solid #ddd;
background:white;
cursor:pointer;
}

.page-btn:hover{
background:#f2f2f2;
}


/* ===============================
SIDEBAR EVENEMENTS
=============================== */

.events-wrapper{
height:420px;
overflow:hidden;
margin-top:10px;
}

.events-grid{
display:flex;
flex-direction:column;
gap:14px;
}

/* carte evenement */

.event-item{
display:flex;
align-items:center;
gap:14px;
background:white;
padding:12px;
border-radius:14px;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
text-decoration:none;
color:#1f2937;
}

.event-item img{
width:70px;
height:70px;
object-fit:cover;
border-radius:12px;
}

/* texte evenement */

.event-date{
font-size:14px;
font-weight:600;
color:#009E60;
margin-bottom:4px;
}

.event-item h4{
font-size:15px;
font-weight:500;
line-height:1.3;
}


/* ===============================
IMAGE SIDEBAR
=============================== */

.sidebar-image{
margin-top:20px;
}

.sidebar-image img{
width:100%;
border-radius:14px;
object-fit:cover;
}

.news-more{
display:inline-block;
margin-top:6px;
font-size:14px;
color:#009E60;
font-weight:600;
}

.news-more:hover{
text-decoration:underline;
}



/* ===============================
PAGE ARTICLE ACTUALITE
=============================== */

.actu-cover{
width:100%;
height:380px;
object-fit:cover;
border-radius:12px;
margin-bottom:15px;
}

.actu-date{
font-size:14px;
color:#009E60;
font-weight:600;
margin-bottom:8px;
}

.actu-title{
font-size:32px;
font-weight:700;
margin-bottom:20px;
color:#1f2937;
}

.actu-content{
font-size:16px;
line-height:1.8;
color:#374151;
}

.actu-content p{
margin-bottom:16px;
}

/* sidebar actu */

.actu-sidebar{
display:flex;
flex-direction:column;
gap:14px;
margin-top:10px;
}

.actu-side-item{
display:flex;
gap:12px;
background:white;
padding:10px;
border-radius:12px;
box-shadow:0 4px 10px rgba(0,0,0,0.08);
text-decoration:none;
color:#1f2937;
}

.actu-side-item img{
width:70px;
height:70px;
object-fit:cover;
border-radius:10px;
}


/* ticker actualites */

.recent-wrapper{
height:300px;
overflow:hidden;
margin-top:10px;
}

.recent-grid{
display:flex;
flex-direction:column;
gap:14px;
}

.recent-item{
display:flex;
align-items:center;
gap:12px;
background:white;
padding:10px;
border-radius:12px;
box-shadow:0 4px 10px rgba(0,0,0,0.08);
text-decoration:none;
color:#1f2937;
}

.recent-item img{
width:70px;
height:70px;
object-fit:cover;
border-radius:10px;
}


/* inudstrie presentation */
.analyse-section{
margin-top:60px;
}

.chart-block{
height:220px;
margin-bottom:15px;
position:relative;
}

.chart-block canvas{
width:100%!important;
height:100%!important;
}

.stat-number{
font-size:14px;
font-weight:600;
}

.card:hover{
transform:translateY(-6px);
box-shadow:0 15px 35px rgba(0,0,0,.15);
transition:all .3s;
}

/* ================= CHART SECTION ================= */

.chart-large{
height:260px;
margin-bottom:20px;
}

.chart-card{
transition:all .4s;
}

.chart-card:hover{
transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,.15);
}

/* animation apparition */

.fade{
opacity:0;
transform:translateY(40px);
transition:all .8s ease;
}

.fade.show{
opacity:1;
transform:translateY(0);
}


/* ================= SIDEBAR ================= */

.sidebar{
display:flex;
flex-direction:column;
gap:20px;
height:100%;
}

/* ================= TITRE ================= */

.info-header{
display:flex;
align-items:center;
gap:10px;
margin-bottom:10px;
}

.info-bar{
width:6px;
height:20px;
background:#15803d;
}

.info-header h2{
font-size:18px;
font-weight:600;
color:#1f2937;
}


/* ================= SCROLL EVENEMENTS ================= */

.recent-wrapper{
position:relative;
overflow:hidden;
height:420px;
}

.recent-grid{
display:flex;
flex-direction:column;
gap:14px;
transition:transform .4s;
}


/* ================= EVENEMENT ================= */

.recent-item{
display:flex;
gap:12px;
align-items:flex-start;
text-decoration:none;
padding:6px 0;
border-bottom:1px solid #e5e7eb;
}

/* IMAGE */

.recent-item img{
width:70px;
height:70px;
object-fit:cover;
border-radius:6px;
flex-shrink:0;
}

/* DATE */

.event-date{
font-size:12px;
color:#15803d;
font-weight:600;
margin-bottom:2px;
}

/* TITRE */

.recent-item h4{
font-size:14px;
font-weight:600;
color:#111827;
line-height:1.2;
margin-bottom:3px;
}

/* DESCRIPTION */

.event-desc{
font-size:12px;
color:#6b7280;
line-height:1.3;
}


/* ================= IMAGE BAS SIDEBAR ================= */

.sidebar-image img{
width:100%;
border-radius:8px;
object-fit:cover;
}

/* categories appel d'offres*/

.news-category{
background:#7c3aed !important;
color:#fff !important;
padding:4px 10px;
border-radius:6px;
font-size:12px;
font-weight:600;
display:inline-block;
margin-bottom:6px;
}