/* ═══════════════════════════════════════════════════════════
   PAGE CONTACT — Mobile-first
═══════════════════════════════════════════════════════════ */

/* ── HERO compact ─────────────────────────────────────────── */
.contact-hero {
  background: linear-gradient(145deg,#1a1d3b 0%,#2d1060 55%,#0f3460 100%);
  padding: clamp(90px,12vw,130px) 0 clamp(50px,7vw,80px);
  position: relative; overflow: hidden;
}
.contact-hero::before {
  content:''; position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 32px 32px; pointer-events:none;
}
.ch-orb { position:absolute; border-radius:50%; pointer-events:none; }
.ch-orb-1 { width:460px;height:460px;top:-160px;right:-100px;background:radial-gradient(circle,rgba(54,162,206,.2),transparent 70%); }
.ch-orb-2 { width:340px;height:340px;bottom:-100px;left:-60px; background:radial-gradient(circle,rgba(130,190,96,.15),transparent 70%); }

.ch-label {
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.7);font-size:.75rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  padding:7px 18px;border-radius:50px;margin-bottom:20px;
}
.contact-hero h1 {
  font-family:var(--font-heading);
  font-size:clamp(1.9rem,5vw,3.2rem);
  font-weight:800;color:#fff;line-height:1.15;margin-bottom:16px;
}
.contact-hero-sub {
  font-size:clamp(.9rem,1.8vw,1.05rem);
  color:rgba(255,255,255,.7);line-height:1.8;max-width:520px;margin-bottom:28px;
}
.ch-breadcrumb {
  display:flex;align-items:center;gap:8px;
  font-size:.78rem;color:rgba(255,255,255,.4);flex-wrap:wrap;
}
.ch-breadcrumb a { color:rgba(255,255,255,.55);text-decoration:none; }
.ch-breadcrumb a:hover { color:#fff; }

/* Pastilles rapides */
.ch-quick {
  display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;
}
.ch-quick-item {
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  border-radius:50px;padding:8px 16px;
  font-size:.8rem;color:rgba(255,255,255,.75);font-weight:600;
}
.ch-quick-item i { font-size:.75rem; }
.ch-quick-item.cq-green { border-color:rgba(130,190,96,.3);color:rgba(130,190,96,.9); }
.ch-quick-item.cq-blue  { border-color:rgba(54,162,206,.3); color:rgba(54,162,206,.9);  }

/* ── SECTION PRINCIPALE — Formulaire + Infos ──────────────── */
.section-contact-main { padding: clamp(64px,10vw,100px) 0; background:#fff; }

/* Colonne formulaire */
.contact-form-card {
  background: #fff;
  border-radius: 22px;
  border: 1.5px solid var(--c-border);
  padding: clamp(28px,4vw,48px);
  box-shadow: 0 8px 40px rgba(78,43,134,.07);
  position: relative; overflow:hidden;
}
.contact-form-card::before {
  content:''; position:absolute;top:0;left:0;right:0;height:4px;
  background:var(--grad-full);
}
.cf-title {
  font-family:var(--font-heading);font-size:clamp(1.15rem,2.5vw,1.5rem);
  font-weight:800;color:var(--c-navy);margin-bottom:6px;
}
.cf-sub { font-size:.88rem;color:var(--c-muted);margin-bottom:28px; }

/* Champs du formulaire */
.cf-row { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px; }
.cf-field { margin-bottom:16px; }
.cf-label {
  display:block;font-family:var(--font-heading);font-size:.8rem;
  font-weight:700;color:var(--c-navy);margin-bottom:6px;
}
.cf-label span { color:#ef4444; }
.cf-input, .cf-select, .cf-textarea {
  width:100%;padding:12px 16px;
  border:1.5px solid var(--c-border);border-radius:10px;
  font-family:var(--font-body);font-size:.92rem;color:var(--c-navy);
  background:#fff;
  transition:border-color .2s,box-shadow .2s;
  outline:none;
  -webkit-appearance:none;
}
.cf-input:focus, .cf-select:focus, .cf-textarea:focus {
  border-color:var(--c-blue);
  box-shadow:0 0 0 3px rgba(54,162,206,.12);
}
.cf-input.is-invalid, .cf-textarea.is-invalid { border-color:#ef4444; }
.cf-error { font-size:.76rem;color:#ef4444;margin-top:4px;display:block; }
.cf-textarea { resize:vertical;min-height:130px; }

/* Objet du message — sélect stylé */
.cf-select { cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%234e2b86' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px; }

/* Submit */
.cf-submit {
  width:100%;padding:14px;
  background:var(--grad-full);color:#fff;border:none;border-radius:12px;
  font-family:var(--font-heading);font-size:.95rem;font-weight:700;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;
  transition:transform .22s,box-shadow .22s;box-shadow:var(--shadow-btn);
  margin-top:8px;
}
.cf-submit:hover { transform:translateY(-2px);box-shadow:0 8px 28px rgba(78,43,134,.4); }
.cf-submit:active { transform:translateY(0); }

/* Mention RGPD */
.cf-rgpd { font-size:.74rem;color:var(--c-muted);text-align:center;margin-top:14px;line-height:1.6; }

/* ── Colonne infos ─────────────────────────────────────────── */
.contact-info { display:flex;flex-direction:column;gap:16px;height:100%; }

/* Carte info item */
.ci-card {
  background:#fff;border:1.5px solid var(--c-border);
  border-radius:16px;padding:22px 20px;
  display:flex;align-items:flex-start;gap:16px;
  transition:border-color .22s,box-shadow .22s;
  text-decoration:none;
}
.ci-card:hover { border-color:var(--c-blue);box-shadow:0 8px 28px rgba(54,162,206,.1); }
.ci-icon {
  width:48px;height:48px;border-radius:14px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.ci-green  .ci-icon { background:rgba(130,190,96,.14);color:var(--c-green);  }
.ci-blue   .ci-icon { background:rgba(54,162,206,.14); color:var(--c-blue);   }
.ci-purple .ci-icon { background:rgba(78,43,134,.1);   color:var(--c-purple); }
.ci-navy   .ci-icon { background:rgba(26,29,59,.07);   color:var(--c-navy);   }
.ci-wa     .ci-icon { background:rgba(37,211,102,.14); color:#25d366;         }

.ci-body {}
.ci-label { font-family:var(--font-heading);font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--c-muted);margin-bottom:4px; }
.ci-value { font-family:var(--font-heading);font-size:.95rem;font-weight:700;color:var(--c-navy);line-height:1.4; }
.ci-sub   { font-size:.78rem;color:var(--c-muted);margin-top:3px; }

/* WhatsApp card spéciale */
.ci-wa {
  background:linear-gradient(135deg,rgba(37,211,102,.08),rgba(37,211,102,.04));
  border-color:rgba(37,211,102,.25);
}
.ci-wa:hover { border-color:#25d366;box-shadow:0 8px 28px rgba(37,211,102,.15); }
.ci-wa .ci-value { color:#128c48; }

/* Horaires */
.ci-hours {
  background:var(--c-light);border:1.5px solid var(--c-border);
  border-radius:16px;padding:22px 20px;
}
.ci-hours-title {
  font-family:var(--font-heading);font-size:.8rem;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;color:var(--c-muted);
  margin-bottom:12px;display:flex;align-items:center;gap:8px;
}
.ci-hours-row {
  display:flex;justify-content:space-between;align-items:center;
  padding:8px 0;border-bottom:1px solid var(--c-border);
  font-size:.84rem;
}
.ci-hours-row:last-child { border-bottom:none; }
.ci-hours-row .day   { color:var(--c-text);font-weight:500; }
.ci-hours-row .time  { font-family:var(--font-heading);font-weight:700;color:var(--c-navy); }
.ci-hours-row .badge-open {
  display:inline-flex;align-items:center;gap:4px;
  background:rgba(130,190,96,.15);color:var(--c-green);
  font-size:.68rem;font-weight:800;padding:2px 8px;border-radius:50px;
}
.ci-hours-row .badge-open::before { content:'';width:5px;height:5px;border-radius:50%;background:var(--c-green); }

/* Réseaux sociaux */
.ci-socials {
  display:flex;gap:10px;flex-wrap:wrap;margin-top:4px;
}
.ci-social-btn {
  width:40px;height:40px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  font-size:.95rem;text-decoration:none;
  transition:all .22s;border:1.5px solid var(--c-border);
  color:var(--c-muted);background:#fff;
}
.ci-social-btn:hover { transform:translateY(-3px);border-color:transparent; }
.ci-social-btn.s-fb:hover  { background:#1877f2;color:#fff; }
.ci-social-btn.s-li:hover  { background:#0a66c2;color:#fff; }
.ci-social-btn.s-tw:hover  { background:#1da1f2;color:#fff; }
.ci-social-btn.s-ig:hover  { background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285aeb 90%);color:#fff; }
.ci-social-btn.s-yt:hover  { background:#ff0000;color:#fff; }



/* ── FAQ RAPIDE ───────────────────────────────────────────── */
.section-faq { padding: clamp(64px,8vw,90px) 0; background:var(--c-light); }
.faq-item {
  background:#fff;border-radius:14px;
  border:1.5px solid var(--c-border);
  overflow:hidden;margin-bottom:12px;
}
.faq-item:last-child { margin-bottom:0; }
.faq-q {
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 22px;cursor:pointer;
  font-family:var(--font-heading);font-size:.92rem;font-weight:700;color:var(--c-navy);
  user-select:none;
  transition:background .18s;
}
.faq-q:hover { background:var(--c-light); }
.faq-chevron {
  width:28px;height:28px;border-radius:50%;
  background:var(--c-light);display:flex;align-items:center;justify-content:center;
  color:var(--c-purple);font-size:.65rem;flex-shrink:0;
  transition:transform .25s,background .18s;
}
.faq-item.open .faq-chevron { transform:rotate(180deg);background:var(--c-purple);color:#fff; }
.faq-a {
  max-height:0;overflow:hidden;
  transition:max-height .3s ease,padding .3s ease;
  font-size:.88rem;color:var(--c-text);line-height:1.75;
  padding:0 22px;
}
.faq-item.open .faq-a { max-height:200px;padding:0 22px 18px; }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 991px) {
  .contact-info { margin-top: 40px; }

}
@media (max-width: 767px) {
  .cf-row { grid-template-columns:1fr; gap:0; }
  .contact-form-card { padding:24px 20px; }

  .ch-quick { gap:8px; }
  .ch-quick-item { font-size:.74rem;padding:6px 12px; }
}
@media (max-width: 480px) {
  .ci-card { flex-direction:column;gap:10px; }

  .cf-submit { font-size:.88rem; }
}
