/* ========================= */
/* SECTION TARIFS */
/* ========================= */

.tarifs{
padding:130px 0;
background:linear-gradient(180deg,#fafafa,#f3f4fb);
position:relative;
overflow:hidden;
}

.tarifs::before{
content:"";
position:absolute;
width:600px;
height:600px;
background:radial-gradient(circle,rgba(122,69,196,0.15),transparent 70%);
top:-200px;
left:-200px;
z-index:0;
}

/* GRID */

.tarifs-grid{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:45px;
max-width:1200px;
margin:auto;
position:relative;
z-index:2;
}

/* POSITION CARTES */

.tarif-card:nth-child(1){grid-column:1 / 3;}
.tarif-card:nth-child(2){grid-column:3 / 5;}
.tarif-card:nth-child(3){grid-column:5 / 7;}

.tarif-card:nth-child(4){grid-column:2 / 4;}
.tarif-card:nth-child(5){grid-column:4 / 6;}

/* CARTES */

.tarif-card{
background:white;
padding:45px;
border-radius:22px;
border:1px solid rgba(122,69,196,0.10);
border-bottom:4px solid rgba(122,69,196,0.25);
display:flex;
flex-direction:column;
min-height:540px;
box-shadow:
0 10px 30px rgba(0,0,0,0.06),
0 40px 80px rgba(0,0,0,0.05);
transition:
transform .35s cubic-bezier(.2,.8,.2,1),
box-shadow .35s cubic-bezier(.2,.8,.2,1),
border-color .35s ease,
opacity .7s ease;
position:relative;
will-change:transform, opacity;
}

.tarif-card:hover{
transform:translateY(-12px);
box-shadow:
0 20px 50px rgba(0,0,0,0.12),
0 50px 120px rgba(0,0,0,0.10);
border-bottom:4px solid var(--violet);
}

/* ANIMATIONS AU SCROLL */

.reveal{
opacity:0;
}

.reveal-left{
transform:translateX(-55px);
}

.reveal-right{
transform:translateX(55px);
}

.reveal-bottom{
transform:translateY(45px);
}

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

/* CARTES BAS PLUS PETITES */

.small{
min-height:380px;
text-align:center;
justify-content:center;
}

/* TITRES SECTIONS TARIFS */

.tarif-section-title{
font-size:32px;
color:var(--violet);
text-align:center;
margin-bottom:60px;
}

.tarif-section-title.second{
margin-top:120px;
}

/* BADGE */

.badge{
position:absolute;
top:-12px;
left:20px;
background:var(--vert);
color:white;
font-size:12px;
font-weight:600;
padding:6px 12px;
border-radius:20px;
box-shadow:0 4px 10px rgba(0,0,0,0.15);
}

/* HEADER */

.tarif-header{
text-align:center;
margin-bottom:35px;
}

.tarif-header h3{
color:var(--violet);
font-size:20px;
margin-bottom:10px;
}

/* PRIX */

.tarif-price{
font-size:48px;
font-weight:700;
background:linear-gradient(90deg,var(--violet),#9b73e3);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

/* LISTE */

.tarif-card ul{
list-style:none;
padding:0;
margin-bottom:35px;
display:flex;
flex-direction:column;
gap:9px;
}

.tarif-card li{
position:relative;
padding-left:24px;
color:#555;
}

.tarif-card li::before{
content:"✔";
position:absolute;
left:0;
color:var(--vert);
}

/* SECTION TITRES */

.section{
padding-left:0!important;
font-weight:600;
margin-top:15px;
font-size:13px;
text-transform:uppercase;
}

.section::before{
display:none;
}

/* PRIX SMALL */

.small-price{
font-size:38px;
font-weight:700;
color:var(--violet);
margin:15px 0;
}

/* BOUTON */

.tarif-card .btn{
margin-top:auto;
width:140px;
align-self:center;
background:linear-gradient(135deg,var(--violet),#9b73e3);
color:white;
border-radius:30px;
padding:11px 0;
text-decoration:none;
display:flex;
align-items:center;
justify-content:center;
}

/* ========================= */
/* DOCUMENTS */
/* ========================= */

.documents{
padding:120px 0;
background:white;
border-top:1px solid #eee;
}

.documents-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:90px;
max-width:1100px;
margin:auto;
}

.doc-card h2{
color:var(--violet);
font-size:22px;
margin-bottom:25px;
}

.doc-card ul{
list-style:none;
padding:0;
}

.doc-card li{
padding-left:24px;
margin-bottom:12px;
position:relative;
}

.doc-card li::before{
content:"✔";
position:absolute;
left:0;
color:var(--vert);
}

.doc-card p{
color:#555;
line-height:1.7;
}

/* RESPONSIVE */

@media(max-width:1000px){

.tarifs-grid{
grid-template-columns:repeat(2,1fr);
}

.tarif-card{
grid-column:auto!important;
}

.reveal-left,
.reveal-right,
.reveal-bottom{
transform:translateY(35px);
}

.reveal.show{
transform:translateY(0);
}

}

@media(max-width:700px){

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

.documents-grid{
grid-template-columns:1fr;
gap:50px;
}

}