/* IDF France Services — styles globaux (variables, curseur, tricolore, responsive pages intérieures) */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --blue: #002395;
  --blue2: #001a70;
  --blue3: #e8edf8;
  --blue4: #c8d4f0;
  --red: #ed2939;
  --red2: #c41e2e;
  --white: #ffffff;
  --off: #f7f8fc;
  --gray: #4a5568;
  --gray2: #8898aa;
  --gray3: #dde3ee;
  --black: #0d1117;
  --fd: "Barlow Condensed", sans-serif;
  --fb: "Barlow", sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--white);
  color: var(--black);
  font-family: var(--fb);
  overflow-x: hidden;
  cursor: auto;
}

/* Curseur custom : seulement souris précise + pas de préférence “réduire les animations” */
.cur,
.cur-ring {
  position: fixed;
  pointer-events: none;
  transform: translate(-50%, -50%);
  display: none;
}

.cur {
  width: 9px;
  height: 9px;
  background: var(--blue);
  border-radius: 50%;
  z-index: 9999;
  transition: width 0.18s, height 0.18s;
}

.cur-ring {
  width: 34px;
  height: 34px;
  border: 1.5px solid rgba(0, 35, 149, 0.3);
  border-radius: 50%;
  z-index: 9998;
  transition: all 0.1s ease;
}

@media (pointer: fine) and (prefers-reduced-motion: no-preference) {
  body {
    cursor: none;
  }
  .cur,
  .cur-ring {
    display: block;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  body {
    cursor: auto !important;
  }
  .cur,
  .cur-ring {
    display: none !important;
  }
}

@media (pointer: coarse) {
  body {
    cursor: auto !important;
  }
  .cur,
  .cur-ring {
    display: none !important;
  }
}

/* Clics lisibles sans curseur custom */
@media (pointer: coarse), (prefers-reduced-motion: reduce) {
  a,
  button,
  .nav-cta,
  .btn-primary,
  .btn-ghost,
  .btn-submit,
  .sticky,
  .ftab,
  .stab,
  .check-item,
  .qc-item,
  .france-band a,
  .cta-band a,
  .wa,
  label,
  input[type="checkbox"],
  input[type="radio"] {
    cursor: pointer !important;
  }
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    cursor: text !important;
  }
  .zcard {
    cursor: default !important;
  }
}

/* Barre tricolore */
.tri {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  z-index: 500;
  display: flex;
  flex-direction: column;
}
.tri span {
  flex: 1;
}
.tri span:nth-child(1) {
  background: var(--blue);
}
.tri span:nth-child(2) {
  background: var(--white);
}
.tri span:nth-child(3) {
  background: var(--red);
}

/* ── Responsive commun (pages intérieures) ── */
@media (max-width: 1100px) {
  .zones-grid {
    grid-template-columns: 1fr;
  }
  .map-wrap {
    position: relative;
    top: auto;
  }
  .svc-inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .svc-inner.rev {
    direction: ltr;
  }
  .parc-hero-photo {
    grid-template-columns: 1fr;
  }
  .parc-hero-photo .ph:nth-child(1),
  .parc-hero-photo .ph:nth-child(2) {
    height: 280px;
  }
}

@media (max-width: 900px) {
  nav {
    flex-wrap: wrap;
    height: auto !important;
    min-height: 56px;
    padding: 12px 20px !important;
    row-gap: 12px;
    column-gap: 16px;
  }
  .nav-logo {
    flex: 1 1 auto;
  }
  .nav-cta {
    flex-shrink: 0;
  }
  .nav-links {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
  }
  .nav-links a {
    font-size: 11px;
    padding: 6px 10px;
  }

  .page-hero {
    padding: 96px 24px 48px !important;
  }
  .legal-wrap {
    padding: 48px 24px 64px !important;
  }
  .form-sec,
  .zones-sec,
  .svc-sec,
  .parc-sec {
    padding: 48px 24px !important;
  }
  .cta-band {
    padding: 56px 24px !important;
  }
  footer {
    padding: 48px 24px 24px !important;
  }

  .form-layout {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
  .sidebar {
    position: static !important;
    top: auto !important;
  }
  .service-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .check-group {
    grid-template-columns: 1fr !important;
  }
  .form-row {
    grid-template-columns: 1fr !important;
  }
  .zones-grid {
    gap: 32px !important;
  }
  .depts-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .france-band {
    grid-template-columns: 1fr !important;
    text-align: center;
  }
  .france-band a {
    justify-self: center;
  }

  .services-nav {
    top: auto !important;
    position: relative !important;
    padding: 0 16px !important;
  }

  .vehicles-grid {
    grid-template-columns: 1fr !important;
  }
  .parc-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .certif-grid {
    grid-template-columns: 1fr !important;
  }

  .footer-top {
    grid-template-columns: 1fr !important;
  }
  .footer-bottom {
    flex-direction: column;
    gap: 14px;
    text-align: center;
    align-items: center;
  }

  .wa {
    bottom: 20px;
    right: 20px;
    width: 48px;
    height: 48px;
  }

  .sticky {
    max-width: calc(100vw - 32px);
    font-size: 12px;
    padding: 10px 18px;
  }
}

@media (max-width: 520px) {
  .service-tabs {
    grid-template-columns: 1fr !important;
  }
  .depts-grid {
    grid-template-columns: 1fr !important;
  }
  .parc-stats {
    grid-template-columns: 1fr !important;
  }
  .kpi {
    padding: 12px 8px;
  }
}

/* Photos réelles : le conteneur .ph en flex peut empêcher l’img de remplir la zone (hauteur %). */
.ph.ph--photo {
  display: block !important;
  position: relative;
}
.ph.ph--photo .ph-img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}