/* V74 — correctifs mobile ciblés repris de V31. Desktop intact. */

/* services.html */

@media (max-width:820px){
  /* Résumé 4 cartes : plus de grands carrés blancs vides */
  body main.svc-page .svc-summary-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
  body main.svc-page .svc-summary-grid>div{
    min-height:154px!important;
    height:auto!important;
    padding:16px 12px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    text-align:center!important;
    color:#fff!important;
    background:linear-gradient(155deg,#08234a 0%,#061832 58%,#150b3b 100%)!important;
    border:1px solid rgba(73,226,255,.34)!important;
    border-radius:24px!important;
    box-shadow:0 14px 30px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05)!important;
  }
  body main.svc-page .svc-summary-grid>div i{
    width:60px!important;height:60px!important;min-width:60px!important;
    display:grid!important;place-items:center!important;
    margin:0 0 2px!important;border-radius:17px!important;
    color:#51eaff!important;font-size:28px!important;
    background:linear-gradient(145deg,#0a477e,#092b5b)!important;
    border:1px solid rgba(76,236,255,.25)!important;
  }
  body main.svc-page .svc-summary-grid>div span{
    color:#fff!important;font-size:1.02rem!important;font-weight:900!important;line-height:1.12!important;
  }
  body main.svc-page .svc-summary-grid>div strong{
    color:#80e8ff!important;font-size:.78rem!important;font-weight:800!important;line-height:1.2!important;
  }
  body main.svc-page .svc-summary-grid>div .dm11-mobile-summary-extra{
    display:block!important;color:#d8e7f7!important;font-size:.72rem!important;font-weight:650!important;line-height:1.18!important;
  }

  /* Pour qui ? : cartes sombres lisibles au lieu de blanc sur blanc */
  body main.svc-page .svc-audience-grid{
    display:grid!important;grid-template-columns:1fr!important;gap:14px!important;
  }
  body main.svc-page .svc-audience-grid>article{
    min-height:0!important;height:auto!important;
    padding:20px 18px!important;
    color:#fff!important;
    background:linear-gradient(145deg,#08203f 0%,#07172f 65%,#140b35 100%)!important;
    border:1px solid rgba(65,215,255,.28)!important;
    border-radius:24px!important;
    box-shadow:0 14px 28px rgba(0,0,0,.23)!important;
  }
  body main.svc-page .svc-audience-grid>article i{
    color:#4cecff!important;background:#0b3d70!important;
    width:58px!important;height:58px!important;display:grid!important;place-items:center!important;border-radius:16px!important;
  }
  body main.svc-page .svc-audience-grid>article h3{
    color:#fff!important;opacity:1!important;margin:14px 0 8px!important;font-size:1.32rem!important;
  }
  body main.svc-page .svc-audience-grid>article p{
    color:#d9e6f5!important;opacity:1!important;line-height:1.55!important;margin:0!important;
  }

  /* Étapes : plus de grands panneaux blancs au texte invisible */
  body main.svc-page .svc-process{
    display:grid!important;grid-template-columns:1fr!important;gap:14px!important;
  }
  body main.svc-page .svc-process>div{
    position:relative!important;min-height:0!important;height:auto!important;
    padding:20px 18px!important;
    color:#fff!important;
    background:linear-gradient(145deg,#08203f 0%,#07172f 65%,#140b35 100%)!important;
    border:1px solid rgba(65,215,255,.28)!important;
    border-radius:24px!important;
  }
  body main.svc-page .svc-process>div>span{
    color:#5ca6ff!important;opacity:.72!important;font-size:1.7rem!important;font-weight:950!important;
  }
  body main.svc-page .svc-process>div i{
    color:#4cecff!important;background:#0b3d70!important;
    width:56px!important;height:56px!important;display:grid!important;place-items:center!important;border-radius:16px!important;
  }
  body main.svc-page .svc-process>div h3{
    display:block!important;color:#fff!important;opacity:1!important;margin:14px 0 8px!important;font-size:1.2rem!important;
  }
  body main.svc-page .svc-process>div p{
    color:#d9e6f5!important;opacity:1!important;line-height:1.5!important;margin:0!important;
  }
}


/* faq-depannage.html */

@media (max-width:820px){
  body.faq-page main .faq-item .faq-answer{
    color:#eaf4ff!important;
    background:linear-gradient(145deg,#08203f 0%,#07172f 68%,#140b35 100%)!important;
    border-top:1px solid rgba(76,236,255,.16)!important;
    line-height:1.62!important;
    opacity:1!important;
  }
  body.faq-page main .faq-item .faq-answer strong{color:#fff!important;opacity:1!important;}
  body.faq-page main .faq-item .faq-answer p,
  body.faq-page main .faq-item .faq-answer span{color:#eaf4ff!important;opacity:1!important;}
  body.faq-page main .faq-item .mini-cta a{
    color:#fff!important;background:#0b2b51!important;border:1px solid rgba(76,236,255,.28)!important;
  }
  body.faq-page main .faq-item .mini-cta a.primary{
    background:linear-gradient(135deg,#1677ff,#0bbde8)!important;color:#fff!important;
  }
}


/* rendez-vous.html */

@media (max-width:820px){
  body main .booking-consent{
    display:flex!important;align-items:flex-start!important;gap:12px!important;
    min-height:0!important;height:auto!important;
    padding:16px!important;margin-top:14px!important;
    background:linear-gradient(145deg,#08203f,#07172f 68%,#140b35)!important;
    border:1px solid rgba(76,236,255,.30)!important;
    border-radius:18px!important;
    box-shadow:none!important;
    color:#fff!important;
  }
  body main .booking-consent input{
    flex:0 0 auto!important;width:24px!important;height:24px!important;margin:2px 0 0!important;accent-color:#1677ff!important;
  }
  body main .booking-consent span{
    color:#eef7ff!important;opacity:1!important;font-weight:700!important;line-height:1.5!important;font-size:.96rem!important;
  }
}


/* devis.html */

@media (max-width:820px){
  body main form.form fieldset{
    display:grid!important;gap:4px!important;
    min-height:0!important;height:auto!important;
    padding:16px!important;
    background:linear-gradient(145deg,#08203f,#07172f 68%,#140b35)!important;
    border:1px solid rgba(76,236,255,.30)!important;
    color:#fff!important;
    border-radius:20px!important;
  }
  body main form.form fieldset legend{
    color:#66e8ff!important;background:#06182e!important;border-radius:10px!important;padding:5px 10px!important;
  }
  body main form.form fieldset label{
    display:flex!important;align-items:center!important;gap:10px!important;
    min-height:38px!important;margin:0!important;padding:6px 2px!important;
    color:#eef7ff!important;opacity:1!important;font-weight:700!important;line-height:1.35!important;
  }
  body main form.form fieldset label input[type="checkbox"]{
    width:22px!important;height:22px!important;flex:0 0 22px!important;accent-color:#1677ff!important;margin:0!important;
  }
}


/* assistance-distance.html */

@media (max-width:820px){
  body main a.btn.outline[href^="tel:"],
  body main a.svc-btn.light-outline[href^="tel:"]{
    color:#fff!important;
    background:linear-gradient(145deg,#0a2a50,#081b36)!important;
    border:1px solid rgba(76,236,255,.35)!important;
    box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
    text-shadow:none!important;
  }
  body main a.btn.outline[href^="tel:"] i,
  body main a.svc-btn.light-outline[href^="tel:"] i{color:#55eaff!important;}
}


/* pack-assistance.html */

@media (max-width:820px){
  /* Hero mobile sombre : fini le blanc sur blanc */
  body #packPage2026 .packhero{
    background:
      radial-gradient(circle at 86% 12%,rgba(27,126,255,.28),transparent 34%),
      linear-gradient(145deg,#06152f 0%,#071a38 58%,#140b37 100%)!important;
  }
  body #packPage2026 .packhero .pack-kicker{
    background:rgba(75,235,255,.10)!important;color:#5cecff!important;border:1px solid rgba(76,236,255,.22)!important;
  }
  body #packPage2026 .packhero h1{color:#fff!important;text-shadow:none!important;}
  body #packPage2026 .packhero h1 span{color:#2588ff!important;}
  body #packPage2026 .packhero .lead{color:#dbe8f7!important;opacity:1!important;}
  body #packPage2026 .packhero .btn.outline{
    color:#fff!important;background:#0a2446!important;border-color:rgba(76,236,255,.32)!important;
  }

  /* Note promo : texte toujours lisible */
  body #packPage2026 .pack-note{
    background:linear-gradient(145deg,#0a2446,#0b1b39 70%,#160d3b)!important;
    border:1px solid rgba(76,236,255,.28)!important;
    color:#dceaf8!important;
    box-shadow:0 12px 28px rgba(0,0,0,.18)!important;
  }
  body #packPage2026 .pack-note strong{color:#66e8ff!important;}

  /* Comparatif : les 3 colonnes visibles sur téléphone, contraste correct */
  body #packPage2026 .compare{
    overflow:hidden!important;
    background:linear-gradient(145deg,#071a37,#08152d 70%,#130b34)!important;
    border:1px solid rgba(76,236,255,.28)!important;
    border-radius:20px!important;
  }
  body #packPage2026 .compare table{
    width:100%!important;min-width:0!important;table-layout:fixed!important;border-collapse:collapse!important;
  }
  body #packPage2026 .compare th,
  body #packPage2026 .compare td{
    padding:11px 7px!important;
    color:#edf6ff!important;
    border-color:rgba(190,220,255,.20)!important;
    font-size:.78rem!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
    vertical-align:middle!important;
  }
  body #packPage2026 .compare th{
    background:#0b2b51!important;color:#fff!important;font-weight:900!important;
  }
  body #packPage2026 .compare th:first-child,
  body #packPage2026 .compare td:first-child{width:46%!important;text-align:left!important;}
  body #packPage2026 .compare th:nth-child(2),
  body #packPage2026 .compare td:nth-child(2),
  body #packPage2026 .compare th:nth-child(3),
  body #packPage2026 .compare td:nth-child(3){width:27%!important;text-align:center!important;}
  body #packPage2026 .compare .yes{color:#54e39b!important;}
  body #packPage2026 .compare .muted{color:#afbdd0!important;}
}


/* services V30 summary retained by V31 */

/* Desktop intact : le complément n'apparaît que sur téléphone */
.dm11-mobile-summary-extra{display:none!important;}

@media (max-width:700px){
  .svc-summary-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
  }
  .svc-summary-grid > div{
    min-height:178px!important;
    padding:16px 12px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    text-align:center!important;
    background:linear-gradient(160deg,#0a1d3e 0%,#07152c 58%,#120a33 100%)!important;
    border:1px solid rgba(76,236,255,.24)!important;
    border-radius:26px!important;
    box-shadow:0 15px 34px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.05)!important;
  }
  .svc-summary-grid > div i{
    width:66px!important;
    height:66px!important;
    min-width:66px!important;
    display:grid!important;
    place-items:center!important;
    margin:0 0 2px!important;
    border-radius:18px!important;
    font-size:29px!important;
    color:#dff8ff!important;
    background:linear-gradient(145deg,#1064aa,#08386d)!important;
    border:1px solid rgba(76,236,255,.22)!important;
    box-shadow:0 8px 22px rgba(0,0,0,.22),0 0 16px rgba(0,188,255,.09)!important;
  }
  .svc-summary-grid > div span{
    display:block!important;
    color:#fff!important;
    font-size:1.05rem!important;
    line-height:1.12!important;
    font-weight:850!important;
    text-align:center!important;
    text-wrap:balance!important;
  }
  .svc-summary-grid > div strong{
    display:block!important;
    color:#8fe7ff!important;
    font-size:.82rem!important;
    line-height:1.2!important;
    font-weight:750!important;
    text-align:center!important;
    text-wrap:balance!important;
  }
  .svc-summary-grid > div .dm11-mobile-summary-extra{
    display:block!important;
    color:#dbeaff!important;
    font-size:.73rem!important;
    line-height:1.22!important;
    font-weight:600!important;
    text-align:center!important;
    opacity:.93!important;
  }
}
