/* Les actions du SMBVA */

/* hero shared with comprendre-risques violet variant */
.hero--violet{
    position:relative; min-height:778px;
    background:linear-gradient(180deg, #c5cbff 0%, #989fff 60%, var(--c-blue-soft) 100%);
    color:var(--c-white);
    overflow:hidden;
    border-bottom-left-radius:var(--r-xl);
    border-bottom-right-radius:var(--r-xl);
}
.hero--violet .hero-pattern{
    position:absolute; inset:0;
    background:url("../assets/img/pattern-pool.png") center/cover;
    opacity:.3; mix-blend-mode:plus-lighter; pointer-events:none;
}
.hero--violet .hero-content{
    position:relative; max-width:780px; margin:0 auto;
    padding:240px 20px 80px;
    text-align:center;
    display:flex; flex-direction:column; align-items:center; gap:32px;
}
.hero--violet .hero-title{ font-size:60px; letter-spacing:-1.2px; line-height:1.2; color:var(--c-white); }
.hero--violet .hero-lead{ color:var(--c-white); max-width:680px; }

/* Axes */
.section--axes{
    background:var(--c-white);
    border-radius:var(--r-xl) var(--r-xl) 0 0;
    margin-top:-50px; position:relative;
    padding:150px 20px;
}
.axes__head{
    max-width:780px; margin:0 auto 80px;
    text-align:center;
    display:flex; flex-direction:column; gap:20px;
}
.axes__head h2{ font-family:var(--f-display); font-weight:700; font-size:45px; color:var(--c-blue); }
.axes__head p{ color:var(--c-blue-2); font-size:16px; line-height:1.5; }

.axes-grid{
    max-width:1110px; margin:0 auto;
    display:grid; grid-template-columns:repeat(3, 1fr); gap:30px;
}
.axes-grid > .axe-card:nth-child(7){ grid-column:span 3; max-width:540px; margin:0 auto; }

.axe-card{
    border-radius:var(--r-md);
    padding:40px;
    display:flex; flex-direction:column; gap:16px;
    transition:transform .25s, box-shadow .25s;
}
.axe-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-soft); }
.axe-card--blue{ background:var(--c-blue-pale); }
.axe-card--violet{ background:#dde0ff; }
.axe-card--cyan{ background:var(--c-blue-light); }
.axe-card--yellow{ background:var(--c-yellow-pale); }
.axe-card--rose{ background:var(--c-rose-pale); }
.axe-card--mint{ background:var(--c-mint); }
.axe-card__num{
    align-self:flex-start;
    border:1.8px solid var(--c-blue); border-radius:45px;
    padding:7px 14px;
    font-family:var(--f-display); font-weight:600; font-size:18px;
    color:var(--c-blue);
}
.axe-card h3{
    font-family:var(--f-display); font-weight:700; font-size:25px; line-height:1.2;
    color:var(--c-blue);
}
.axe-card p{ font-size:16px; line-height:1.5; color:var(--c-blue-2); }

/* Financement */
.section--financement{
    padding:150px 20px;
    background:linear-gradient(180deg, var(--c-white) 0%, var(--c-blue-pale) 100%);
}
.financement__head{
    max-width:780px; margin:0 auto 80px;
    text-align:center;
    display:flex; flex-direction:column; gap:20px;
}
.financement__head h2{ font-family:var(--f-display); font-weight:700; font-size:45px; color:var(--c-blue); }
.financement__head p{ color:var(--c-blue-2); font-size:16px; line-height:1.5; }
.financement-grid{
    max-width:1110px; margin:0 auto;
    display:grid; grid-template-columns:repeat(3, 1fr); gap:30px;
}
.finance-card{
    background:var(--c-blue-light);
    border-radius:var(--r-md);
    padding:40px;
    height:260px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
    transition:transform .2s;
}
.finance-card:hover{ transform:translateY(-4px); }
.finance-card--rose{ background:var(--c-rose-pale); }
.finance-card__pct{
    font-family:var(--f-display); font-weight:700; font-size:60px; line-height:1.2;
    color:var(--c-blue);
}
.finance-card__lbl{
    font-family:var(--f-display); font-weight:400; font-size:16px;
    color:var(--c-blue-2); text-align:center;
}
.finance-card img{ object-fit:contain; mix-blend-mode:darken; max-width:100%; }

/* Travaux */
.section--travaux{ padding:150px 0; }
.travaux__head{ text-align:center; margin-bottom:60px; }
.travaux__head h2{ font-family:var(--f-display); font-weight:700; font-size:45px; color:var(--c-blue); }
.travaux-list{ max-width:780px; margin:0 auto; display:flex; flex-direction:column; gap:24px; }
.travaux-list li{
    display:grid; grid-template-columns:48px 1fr; gap:24px;
    background:var(--c-white);
    border:1px solid var(--c-blue-pale);
    border-radius:var(--r-md);
    padding:24px;
    transition:border-color .2s, transform .2s;
}
.travaux-list li:hover{ border-color:var(--c-blue); transform:translateX(4px); }
.travaux-list__num{
    width:48px; height:48px;
    background:var(--c-red); color:var(--c-white);
    border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:24px;
}
.travaux-list h3{
    font-family:var(--f-display); font-weight:700; font-size:20px; color:var(--c-blue);
    margin-bottom:8px;
}
.travaux-list p{ font-size:15px; line-height:1.5; color:var(--c-blue-2); }

@media (max-width: 980px){
    .hero--violet .hero-title{ font-size:36px; }
    .axes-grid, .financement-grid{ grid-template-columns:1fr; }
    .axes-grid > .axe-card:nth-child(7){ grid-column:auto; }
}