/* =========================================================================
   NSX Kompetenz — V1 « Clair & Éditorial » — STYLES SPÉCIFIQUES (pages B)
   Contact (formulaire + double entrée), FAQ (accordéons), En construction.
   Chargé APRÈS v1.css. N'édite jamais v1.css ni charte-2026.css.
   Aucune animation en boucle. Interactions au SURVOL/focus uniquement.
   ========================================================================= */

/* -------------------------------------------------- CONTACT — disposition */
.v1-contact-grid{
  display:grid;grid-template-columns:1.25fr .85fr;gap:clamp(28px,4vw,52px);
  align-items:start;
}

/* Carte formulaire */
.v1-formcard{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(26px,3.4vw,40px);box-shadow:var(--sh-sm);
}

/* Double entrée talent / employeur */
.v1-entry-tabs{
  display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px;
}
.v1-entry-tabs button{
  flex:1;min-width:160px;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--font-head);font-weight:800;font-size:.96rem;
  padding:.78em 1.1em;border-radius:var(--radius-pill);
  border:2px solid var(--line-strong);background:#fff;color:var(--c-navy);cursor:pointer;
  transition:border-color .26s var(--ease),color .26s var(--ease),background .26s var(--ease),box-shadow .26s var(--ease);
}
.v1-entry-tabs button svg{width:18px;height:18px}
.v1-entry-tabs button:hover{border-color:var(--eb,var(--c-orange));color:var(--eb,var(--c-orange))}
.v1-entry-tabs button.active{background:var(--eb,var(--c-orange));border-color:var(--eb,var(--c-orange));color:#fff;box-shadow:var(--eb-sh,var(--sh-orange))}
.v1-entry-tabs button.e-talent{--eb:var(--c-green);--eb-sh:var(--sh-green)}
.v1-entry-tabs button.e-employeur{--eb:var(--c-blue);--eb-sh:var(--sh-blue)}

/* Formulaire */
.v1-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.v1-field{display:flex;flex-direction:column;gap:7px}
.v1-field.full{grid-column:1 / -1}
.v1-field label{
  font-family:var(--font-head);font-weight:700;font-size:.88rem;color:var(--c-navy);
}
.v1-field input,
.v1-field textarea{
  font-family:var(--font-body);font-size:1rem;color:var(--ink);
  background:#FBFAF7;border:1.5px solid var(--line-strong);border-radius:14px;
  padding:.82em 1em;width:100%;
  transition:border-color .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease);
}
.v1-field textarea{min-height:128px;resize:vertical;line-height:1.55}
.v1-field input:hover,
.v1-field textarea:hover{border-color:var(--c-orange)}
.v1-field input:focus,
.v1-field textarea:focus{outline:none;border-color:var(--c-orange);background:#fff;box-shadow:0 0 0 3px var(--focus-ring)}
.v1-field input[readonly]{background:#f0f3f6;color:var(--muted);cursor:default}
.v1-field input[readonly]:hover{border-color:var(--line-strong)}

/* Consentement RGPD */
.v1-consent{
  grid-column:1 / -1;display:flex;gap:12px;align-items:flex-start;
  font-size:.92rem;line-height:1.55;color:var(--muted);
}
.v1-consent input{flex-shrink:0;width:20px;height:20px;margin-top:2px;accent-color:var(--c-orange);cursor:pointer}
.v1-form-submit{grid-column:1 / -1}

/* Bouton d'envoi — couleur par entrée (talent=vert, employeur=bleu) */
.v1-btn--talent{background:var(--c-green);color:#fff}
.v1-btn--talent:hover{transform:translateY(-2px);box-shadow:var(--sh-green)}
.v1-btn--employeur{background:var(--c-blue);color:#fff}
.v1-btn--employeur:hover{transform:translateY(-2px);box-shadow:var(--sh-blue)}

/* Carte coordonnées (aside) */
.v1-contact-info{
  background:var(--c-navy);color:rgba(255,255,255,.85);
  border-radius:var(--radius-lg);padding:clamp(26px,3.2vw,36px);
  position:relative;overflow:hidden;box-shadow:var(--sh-md);
}
.v1-contact-info::before{
  content:"";position:absolute;inset:0;background:url("../img/motif-petales.svg") repeat;
  background-size:240px;opacity:.10;pointer-events:none;
}
.v1-contact-info>*{position:relative;z-index:1}
.v1-contact-info h3{color:#fff;font-size:1.35rem;margin-bottom:20px}
.v1-contact-info p{display:flex;gap:11px;align-items:flex-start;margin:0 0 16px;font-size:.95rem;line-height:1.5}
.v1-contact-info svg{width:19px;height:19px;flex-shrink:0;margin-top:2px;color:var(--c-orange)}
.v1-contact-info a{color:rgba(255,255,255,.92);text-decoration:none;transition:color .2s var(--ease)}
.v1-contact-info a:hover{color:var(--c-orange)}
.v1-contact-legal{
  margin-top:6px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);
  font-size:.88rem;opacity:.82;
}

/* ------------------------------------------------------------- FAQ */
.v1-faq{display:flex;flex-direction:column;gap:14px;max-width:880px}
.v1-faq details{
  background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:0;overflow:hidden;
  transition:border-color .26s var(--ease),box-shadow .26s var(--ease);
}
.v1-faq details:hover{border-color:var(--fc,var(--c-orange));box-shadow:var(--sh-sm)}
.v1-faq details[open]{border-color:var(--fc,var(--c-orange));box-shadow:var(--sh-sm)}
.v1-faq summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;
  font-family:var(--font-head);font-weight:800;font-size:1.06rem;color:var(--c-navy);
  padding:20px 22px;
}
.v1-faq summary::-webkit-details-marker{display:none}
.v1-faq summary::after{
  content:"";flex-shrink:0;margin-left:auto;width:13px;height:13px;
  border-right:2.4px solid var(--fc,var(--c-orange));border-bottom:2.4px solid var(--fc,var(--c-orange));
  transform:rotate(45deg);transition:transform .26s var(--ease);
}
.v1-faq details[open] summary::after{transform:rotate(-135deg)}
.v1-faq .v1-faq-mk{
  flex-shrink:0;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  background:var(--fc-tint,var(--tint-orange));color:var(--fc,var(--c-orange));
  font-family:var(--font-head);font-weight:900;font-size:.84rem;
}
.v1-faq .ans{
  padding:0 22px 22px 22px;color:var(--muted);font-size:1rem;line-height:1.62;
}
/* couleur par groupe FAQ */
.v1-faq.f-talent{--fc:var(--c-green);--fc-tint:var(--tint-green)}
.v1-faq.f-employeur{--fc:var(--c-blue);--fc-tint:var(--tint-blue)}

/* Abréviation infobulle (réutilise le motif v1-abbr de v1.css, alias .v1-faq .abbr) */
.v1-faq .v1-abbr{display:inline}

/* ------------------------------------------------------- EN CONSTRUCTION */
.v1-construction{
  min-height:72vh;display:flex;align-items:center;
  background:linear-gradient(160deg,var(--c-navy),var(--c-navy-d));color:#fff;
  position:relative;overflow:hidden;
}
.v1-construction::before{
  content:"";position:absolute;inset:0;background:url("../img/motif-petales.svg") repeat;
  background-size:300px;opacity:.06;pointer-events:none;
}
.v1-construction .v1-wrap{position:relative;z-index:1}
.v1-construction-inner{max-width:720px;margin-inline:auto;text-align:center}
.v1-construction .mk{
  width:92px;margin:0 auto 26px;filter:drop-shadow(0 22px 44px rgba(0,0,0,.4));
}
.v1-construction .mk img{width:100%}
.v1-construction h1{
  color:#fff;font-size:clamp(2.1rem,5vw,3.3rem);margin-bottom:16px;
}
.v1-construction .v1-eyebrow{justify-content:center;color:var(--c-yellow-d)}
.v1-construction .lead{
  color:rgba(255,255,255,.85);font-size:clamp(1.06rem,1.6vw,1.24rem);
  line-height:1.6;max-width:54ch;margin:0 auto 30px;
}
.v1-construction-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}

/* ---------------------------------------------------------- RESPONSIVE */
@media (max-width:1023px){
  .v1-contact-grid{grid-template-columns:1fr}
  .v1-contact-info{order:-1}
}
@media (max-width:560px){
  .v1-form{grid-template-columns:1fr}
  .v1-entry-tabs button{min-width:0}
  .v1-construction-actions .v1-btn{width:100%;justify-content:center}
}

/* Statut d'envoi du formulaire de contact */
.v1-form-status{margin:14px 0 0;padding:.7em 1em;border-radius:12px;font-weight:700;font-size:.95rem}
.v1-form-status.ok{background:var(--tint-green);color:var(--c-green-d)}
.v1-form-status.err{background:var(--tint-orange);color:var(--c-orange-d)}