/* Pages de service (création de site à Villeurbanne, logiciel sur mesure...) — préfixe sv- */
.sv-fil { padding:20px 48px 0; font-size:13px; color:#888; }
.sv-fil a { color:#888; }
.sv-hero { padding:24px 48px 40px; max-width:820px; }
.sv-hero h1 { font-size:34px; color:#378ADD; line-height:1.25; margin:0 0 16px; }
.sv-hero p.desc { max-width:680px; }
.sv-section { padding:8px 48px 36px; }
.sv-section h2 { font-size:22px; font-weight:600; margin:0 0 14px; }
.sv-section > p { font-size:16px; color:#444; line-height:1.75; max-width:760px; margin:0 0 12px; }
.sv-grille { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:18px; }
.sv-carte { background:#fafaf9; border:0.5px solid #e2e2df; border-radius:12px; padding:22px; }
.sv-carte h3 { font-size:16px; font-weight:600; margin:0 0 8px; }
.sv-carte p { font-size:14px; color:#555; line-height:1.65; margin:0; }
.sv-liste { list-style:none; padding:0; margin:14px 0 0; max-width:760px; }
.sv-liste li { position:relative; padding:0 0 10px 26px; font-size:15px; color:#444; line-height:1.6; }
.sv-liste li::before { content:"✓"; position:absolute; left:0; color:#185FA5; font-weight:700; }
.sv-demo { display:flex; gap:24px; align-items:center; justify-content:space-between; flex-wrap:wrap; background:#fff; border:1px solid #B5D4F4; border-radius:12px; padding:22px 24px; margin-top:6px; }
.sv-demo p { margin:0; color:#444; max-width:600px; line-height:1.6; }
.sv-demo strong { color:#0C447C; }
.sv-faq details { border-bottom:0.5px solid #e2e2df; padding:14px 0; max-width:820px; }
.sv-faq summary { cursor:pointer; font-weight:600; font-size:16px; list-style:none; position:relative; padding-right:28px; }
.sv-faq summary::-webkit-details-marker { display:none; }
.sv-faq summary::after { content:"+"; position:absolute; right:0; top:-2px; font-size:22px; color:#185FA5; font-weight:400; }
.sv-faq details[open] summary::after { content:"−"; }
.sv-faq details p { margin:10px 0 0; color:#555; line-height:1.7; font-size:15px; }
.sv-grille-4 { grid-template-columns:repeat(4, 1fr); }
.sv-demo a:not(.btn-primary) { color:#185FA5; font-weight:500; }
@media (max-width: 1000px) { .sv-grille-4 { grid-template-columns:repeat(2, 1fr); } }
@media (max-width: 860px) { .sv-grille, .sv-grille-4 { grid-template-columns:1fr; } }
@media (max-width: 640px) {
  .sv-fil, .sv-hero, .sv-section { padding-left:20px; padding-right:20px; }
  .sv-hero h1 { font-size:27px; }
}
