/* ==========================================================================
   Presstivo : adaptation mobile (smartphones et tablettes), pensée pour une
   future application (Play Store, App Store) : zones tactiles confortables,
   champs sans zoom automatique sur iOS, encoches (safe-area), fenêtres en
   feuille du bas. Chargé en dernier sur toutes les pages.
   ========================================================================== */

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: rgba(11, 63, 184, .12); overscroll-behavior-y: none; }
a, button, label, summary, select, input { touch-action: manipulation; }
img, video, svg, canvas { max-width: 100%; }
table { max-width: 100%; }
.table-wrap, .cmp-wrap { -webkit-overflow-scrolling: touch; }

/* ---------- Encoches et barres système (iPhone, Android) ---------- */
.site-header { padding-top: env(safe-area-inset-top); }
.site-footer, footer.site-footer { padding-bottom: env(safe-area-inset-bottom); }
.container { padding-left: max(0px, env(safe-area-inset-left)); padding-right: max(0px, env(safe-area-inset-right)); }
.ds-side { padding-top: calc(22px + env(safe-area-inset-top)); padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
.ds-top { padding-top: calc(12px + env(safe-area-inset-top)); }
.ds-content { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
.toast, #toast, .app-toast { bottom: calc(18px + env(safe-area-inset-bottom)); }

/* ---------- Tablettes ---------- */
@media (max-width: 1024px) {
  .container, .container.narrow { width: min(100% - 40px, var(--container)); }
}

/* ---------- Téléphones et tablettes : champs, boutons, fenêtres ---------- */
@media (max-width: 900px) {
  /* 16 px minimum : iOS ne zoome pas la page quand on touche un champ. */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select, textarea, .f-input, .f-select, .f-textarea,
  .phone-field input, .ds-search input { font-size: 16px; }

  .btn { min-height: 46px; }
  .btn-sm { min-height: 42px; }
  .icon-btn, .pv-close, .pw-toggle, .ds-burger, .ds-bell { min-width: 44px; min-height: 44px; }
  .ds-row-actions .icon-btn, .ds-photo-actions .icon-btn { width: 44px; height: 44px; }
  .main-nav a, .ds-nav a, .footer-grid a { min-height: 44px; display: flex; align-items: center; }
  .faq summary { min-height: 44px; }
  .pg-btn, .pg-num { min-height: 44px; min-width: 44px; }
  .check input, .toggle input { min-width: 22px; min-height: 22px; }
  .check input[type="checkbox"] { width: 22px; height: 22px; }

  /* Fenêtres : feuille du bas, presque plein écran. */
  dialog.pv-modal {
    width: calc(100% - 16px); max-width: 640px; max-height: calc(100dvh - 24px);
    margin: auto auto calc(8px + env(safe-area-inset-bottom)); border-radius: 22px;
  }
  .pv-modal-body { padding: 18px 16px calc(22px + env(safe-area-inset-bottom)); }
  .pv-modal-head { padding: 14px 16px; }
}

/* ---------- Téléphones ---------- */
@media (max-width: 640px) {
  .container, .container.narrow { width: calc(100% - 32px); }
  .section { padding: 40px 0; }
  h1 { overflow-wrap: anywhere; }

  /* Services : la ligne passe à la ligne au lieu de déborder. */
  .ds-svc-row { flex-wrap: wrap; align-items: center; row-gap: 8px; }
  .ds-svc-row > span { flex: 1 1 100%; min-width: 0; overflow-wrap: anywhere; }
  .ds-svc-row .ds-row-actions { margin-left: auto; }

  /* Espaces : en-tête, cartes et tableaux. */
  .ds-top { gap: 10px; padding-left: 14px; padding-right: 14px; }
  .ds-search { min-width: 0; }
  .ds-user-txt { display: none; }
  .ds-content { padding: 18px 14px 40px; }
  .ds-hello { gap: 10px; }
  .ds-card { padding: 18px 16px; border-radius: 16px; }
  .ds-card-head { align-items: flex-start; }
  .ds-card-tools { width: 100%; justify-content: space-between; }
  .ds-kpis { grid-template-columns: 1fr 1fr; gap: 12px; }
  .ds-kpi { padding: 16px; }
  .ds-kpi strong { font-size: 1.5rem; }
  .ds-period { padding: 14px; }
  .ds-period .f-field, .ds-period-custom, .ds-period-custom .f-field { width: 100%; min-width: 0; }
  .ds-period-custom .btn { width: 100%; }
  .ds-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .req-list { grid-template-columns: 1fr; }
  .tbl th, .tbl td { padding: 10px 12px; }
  .dash-filters, .ds-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .dash-filters::-webkit-scrollbar, .ds-tabs::-webkit-scrollbar { display: none; }
  .dash-chip, .ds-tab { flex: none; }

  /* Pages publiques. */
  .form-grid, .prov-grid { grid-template-columns: 1fr; }
  .hero-cta, .cta-row, .ph-cta { flex-direction: column; align-items: stretch; }
  .hero-cta .btn, .cta-row .btn, .ph-cta .btn { width: 100%; }
  .about-cta { padding: 26px 20px; text-align: center; }
  .contact-card { flex-wrap: wrap; }
  .contact-card .contact-act { width: 100%; }
  .contact-card .contact-act .btn { width: 100%; }
  .pay-lines div { font-size: .85rem; }
  .pg-head h2 { font-size: 1.35rem; }
  .step-card, .price-card, .help-card { padding: 22px 18px; }
  .cmp { font-size: .82rem; }
  .cmp th, .cmp td { padding: 10px 12px; }
}

/* ---------- Petits téléphones ---------- */
@media (max-width: 380px) {
  .ds-kpis { grid-template-columns: 1fr; }
  .logo-text strong { font-size: 1.15rem; }
  .btn-lg { padding: 14px 18px; }
  .pay-card, .pr-card, .cx-card { padding-left: 14px; padding-right: 14px; }
}

/* ---------- Paysage sur téléphone : fenêtres défilantes ---------- */
@media (max-height: 520px) and (orientation: landscape) {
  dialog.pv-modal { max-height: calc(100dvh - 12px); }
  .ds-side { overflow-y: auto; }
}

/* ---------- Appareils tactiles : pas d'effet de survol collant ---------- */
@media (hover: none) {
  .step-card:hover, .price-card:hover, .info-card:hover, .pro-card:hover, .req-card:hover, .ds-kpi:hover,
  .how-card:hover, .contact-card:hover, .offer-card:hover { transform: none; }
  .btn:hover { transform: none; }
}

/* Champ piège anti-spam : invisible pour les personnes, rempli par les robots. */
.hp { position: absolute !important; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }