/* ✳ Bloc contact (fin de la page d'accueil) : titre à gauche, formulaire court à droite ; empilés sur téléphone */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start;margin:clamp(40px,6vw,90px) 3.3% clamp(30px,4vw,60px);padding:clamp(26px,3.4vw,48px);border:1px solid var(--line);border-radius:20px;scroll-margin-top:80px}
.contact-title{margin:0 0 14px;font:800 clamp(34px,4.6vw,72px)/.92 "Barlow Condensed","Arial Narrow",Impact,sans-serif;text-transform:uppercase;letter-spacing:-.5px;color:var(--lime);text-wrap:balance}
.contact-lead{margin:0 0 22px;max-width:38ch;font-size:clamp(15px,1.2vw,18px);line-height:1.55;color:var(--fg)}
.contact-mail{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;font-weight:600;color:var(--fg);border-bottom:1px solid var(--line);transition:color .2s,border-color .2s}
.contact-mail:hover,.contact-mail:focus-visible{color:var(--lime);border-color:var(--lime)}
.contact-form{display:grid;gap:14px;min-width:0}
.cf-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.cf-field{display:grid;gap:7px;min-width:0;font-size:13px;color:var(--muted)}
.cf-field input,.cf-field select,.cf-field textarea{width:100%;min-height:46px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#1b1d18;color:var(--fg);font:inherit;font-size:15px;transition:border-color .2s}
.cf-field textarea{min-height:120px;resize:vertical;line-height:1.5}
.cf-field select{appearance:none;background-image:linear-gradient(45deg,#0000 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,#0000 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px;cursor:pointer}
.cf-field :is(input,select,textarea):hover{border-color:#4a4d44}
.cf-field :is(input,select,textarea):focus-visible{outline:2px solid var(--lime);outline-offset:1px;border-color:var(--lime)}
.cf-field [aria-invalid="true"]{border-color:#ff8a8a}
.cf-err{font-size:13px;line-height:1.4;color:#ff8a8a}
.cf-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-challenge:empty{display:none}
.cf-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.cf-send{min-height:48px;padding:14px 24px;font-size:14px}
.cf-send:disabled{opacity:.6;cursor:wait}
.cf-note{margin:0;font-size:12px;color:var(--muted)}
.cf-note a{text-decoration:underline;text-underline-offset:2px}
.cf-status{margin:0;min-height:1.4em;font-size:14px;color:var(--fg)}
.cf-status[data-kind="error"]{color:#ff8a8a}
.cf-status[data-kind="ok"]{color:var(--lime)}
@media (max-width:900px){.contact{grid-template-columns:minmax(0,1fr)}}
@media (max-width:700px){
  .contact{margin:32px 5% 24px;padding:22px 18px;border-radius:16px}
  .contact-title{font-size:clamp(30px,10vw,44px)}
  .cf-row{grid-template-columns:minmax(0,1fr)}
  .cf-field input,.cf-field select,.cf-field textarea{font-size:16px} /* iPhone : pas de zoom au toucher */
  .cf-send{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.contact-mail,.cf-field :is(input,select,textarea){transition:none}}
/* Téléphone : la flèche « remonter » (coin bas droit) ne cache jamais le champ en cours de saisie */
@media (max-width:700px){html{scroll-padding-bottom:80px}}
