.elementor-1252 .elementor-element.elementor-element-1ca6a87{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-3148a88 *//* === Variables (change juste --accent pour ta couleur) === */
:root{
  --accent: #2563eb;            /* bleu pro */
  --accent-2: #06b6d4;          /* cyan léger */
  --bg: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --card: #ffffff;
  --ring: 24, 100%, 61%;
}

/* === Section & titres === */
.svc2{max-width:1200px;margin:0 auto;padding:40px 16px;color:var(--text)}
.svc2-head{margin:0 0 18px}
.svc2-head h1{margin:0 0 6px;font-size:clamp(24px,3.2vw,36px);letter-spacing:-.02em}
.svc2-sub{margin:0;color:var(--muted)}

/* === Grille === */
.svc2-grid{
  display:grid;gap:18px;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
@media (max-width:1024px){ .svc2-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .svc2-grid{grid-template-columns:1fr} }

/* === Carte === */
.svc2-card{
  position:relative; overflow:hidden;
  background: var(--card);
  border-radius:20px;
  box-shadow: 0 10px 30px rgba(2,6,23,.06);
  padding:22px;
  display:flex; flex-direction:column; gap:10px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  border:1px solid rgba(2,6,23,.06);
}
.svc2-card::before{
  /* halo dégradé subtil en fond */
  content:""; position:absolute; inset:-2px;
  background:
    radial-gradient(1200px 120px at -10% 0%, rgba(37,99,235,.06), transparent 60%),
    radial-gradient(800px 100px at 110% -20%, rgba(6,182,212,.08), transparent 60%);
  z-index:0;
}
.svc2-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(2,6,23,.12);
}

/* === Icône circulaire === */
.svc2-icon{
  z-index:1;
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;
  color:var(--accent);
  background: radial-gradient(120px 60px at 30% 20%, rgba(37,99,235,.15), rgba(6,182,212,.12));
  box-shadow: inset 0 0 0 6px rgba(37,99,235,.06);
}
.svc2-icon svg{width:24px;height:24px}

/* === Textes === */
.svc2-card h2{z-index:1;margin:6px 0 2px;font-size:clamp(18px,2.2vw,22px);letter-spacing:-.01em}
.svc2-card p{z-index:1;margin:0;color:var(--muted);line-height:1.55}
.svc2-list{z-index:1;margin:6px 0 0;padding-left:18px;color:#334155}
.svc2-list li{margin:4px 0}

/* === Lien "En savoir plus" === */
.svc2-link{
  z-index:1; margin-top:auto; align-self:flex-start;
  display:inline-flex; align-items:center; gap:8px;
  text-decoration:none; font-weight:700;
  color: var(--accent);
  padding:8px 12px; border-radius:10px;
  background: rgba(37,99,235,.06);
  transition: background .15s ease, color .15s ease, transform .15s ease;
  border:1px solid rgba(37,99,235,.12);
}
.svc2-link:hover{ background: rgba(37,99,235,.12); transform: translateY(-1px) }
.svc2-arrow{transition:transform .15s ease}
.svc2-link:hover .svc2-arrow{transform: translateX(2px)}

/* === CTA bas de section === */
.svc2-actions{display:flex;gap:12px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.svc2-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 16px;border-radius:12px;text-decoration:none;
  border:1px solid rgba(2,6,23,.12); color:var(--text); background:#f8fafc; font-weight:700;
}
.svc2-btn--primary{background:var(--accent); border-color:var(--accent); color:#fff}
.svc2-btn--primary:hover{filter:brightness(.96)}/* End custom CSS */