/* Compléments au CSS de la maquette : formulaire, accessibilité, animations. */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Champ piège anti-robots */
.ym-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.ym-form-status { grid-column: 1 / -1; margin: 0; min-height: 1.4em; font-size: 15px; }
.ym-form-status.is-ok { color: #DBE0A4; }
.ym-form-status.is-error { color: #F2A74B; }
#lead-form button[disabled] { opacity: .6; cursor: wait; }

/* iOS zoome sur les champs en dessous de 16 px : on reste à 16 px sur mobile et tablette */
@media (max-width: 900px) {
  .ym-field { font-size: 16px; }
}
/* Le champ actif garde de la marge sous l'en-tête quand la page remonte */
#lead-form input, #lead-form select { scroll-margin: 96px 0 120px; }
.ym-field::placeholder { color: rgba(15, 32, 74, .4); }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid #F2A74B;
  outline-offset: 3px;
}

/* Tours filaires : tracé qui monte au chargement */
.ym-towers path { animation: ym-draw 2.2s cubic-bezier(.22,.61,.36,1) both; }
.ym-towers path + path { animation-delay: .35s; }
@keyframes ym-draw {
  from { clip-path: inset(100% 0 0 0); }
  to { clip-path: inset(0 0 0 0); }
}

/* Apparition au défilement (activée par site.js) */
/* .ym-js est posée dans le <head> avant le premier affichage : les blocs sont masqués dès le chargement, sans flash. */
.ym-js :where(.ym-hero-body > div > *, .ym-hero-cards > div > a, #qui-sommes-nous .ym-qui-photo, #qui-sommes-nous .ym-qui-inner > div:last-child, .ym-value, #projets h2, #projets .ym-ctrls, .ym-valeurs > div > p, .ym-valeurs > div > h2, #projets > div:first-child > div:first-child > p, #contact h2, #contact p:has(+ .ym-contact-title), #contact .ym-lead, .ym-form) { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s cubic-bezier(.22,.61,.36,1); }
.ym-js .ym-reveal.is-in, .ym-js.ym-fallback :where(.ym-hero-body > div > *, .ym-hero-cards > div > a, #qui-sommes-nous .ym-qui-photo, #qui-sommes-nous .ym-qui-inner > div:last-child, .ym-value, #projets h2, #projets .ym-ctrls, .ym-valeurs > div > p, .ym-valeurs > div > h2, #projets > div:first-child > div:first-child > p, #contact h2, #contact p:has(+ .ym-contact-title), #contact .ym-lead, .ym-form) { opacity: 1; transform: none; }

/* Boutons : légère élévation, ombre et reflet au survol */
.ym-head-cta, a[href="#contact"][style*="height: 52px"], .ym-form button[type="submit"], .ym-arrow, .ym-edge-arrow,
a[aria-label^="Yamed sur"] {
  position: relative; overflow: hidden;
  transition: transform .25s cubic-bezier(.22,.61,.36,1), filter .25s ease, background-color .25s ease, color .25s ease;
}
.ym-head-cta::after, a[href="#contact"][style*="height: 52px"]::after, .ym-form button[type="submit"]::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
  transform: translateX(-120%); transition: transform .6s ease;
}
@media (hover: hover) {
  .ym-head-cta:hover, a[href="#contact"][style*="height: 52px"]:hover, .ym-form button[type="submit"]:hover {
    transform: translateY(-3px); filter: brightness(1.06);
  }
  .ym-head-cta:hover::after, a[href="#contact"][style*="height: 52px"]:hover::after, .ym-form button[type="submit"]:hover::after { transform: translateX(120%); }
  a[aria-label^="Yamed sur"]:hover, .ym-edge-arrow:hover { transform: translateY(-3px); }
}
.ym-head-cta:active, a[href="#contact"][style*="height: 52px"]:active, .ym-form button[type="submit"]:active { transform: translateY(0) scale(.98); }

/* Liens : changement de couleur et icônes animées au survol */
.ym-hero-cards a span, .ym-hero-cards a span svg, .ym-hero-cards a span svg path { transition: color .25s ease, stroke .25s ease, transform .3s cubic-bezier(.22,.61,.36,1); }
.ym-slide a { position: relative; transition: color .25s ease; }
.ym-slide a::after { content: "→"; display: inline-block; margin-left: 8px; transition: transform .3s cubic-bezier(.22,.61,.36,1); }
#qui-sommes-nous a { transition: color .25s ease, text-decoration-color .25s ease, text-underline-offset .25s ease; }
a[aria-label^="Yamed sur"] svg { transition: transform .35s cubic-bezier(.22,.61,.36,1); }
@media (hover: hover) {
  .ym-hero-cards a:hover span { color: #F9F1E4 !important; }
  .ym-hero-cards a:hover span svg { transform: translateX(6px); stroke: #F9F1E4; }
  .ym-slide a:hover { color: #C47A14 !important; }
  .ym-slide a:hover::after { transform: translateX(6px); }
  #qui-sommes-nous a:hover { color: #C47A14 !important; text-underline-offset: 9px; }
  a[aria-label^="Yamed sur"]:hover { background: #F2A74B !important; }
  a[aria-label^="Yamed sur"]:hover svg { transform: scale(1.18) rotate(-6deg); }
}
a:focus-visible, button:focus-visible { outline: 2px solid #F2A74B; outline-offset: 3px; }

/* Survol des cartes projets */
.ym-hero-cards img, .ym-slide img { transition: transform .6s cubic-bezier(.22,.61,.36,1), filter .6s ease; }
.ym-hero-cards a:hover img { transform: translateY(-6px); }

@media (prefers-reduced-motion: reduce) {
  .ym-towers path { animation: none; }
  .ym-track, .ym-slide { transition: none !important; }
}

/* Mobile : textes du bandeau sans fond décalé */
@media (max-width: 640px) {
  .ym-logo { height: 40px !important; }
  .ym-foot-logo { height: 56px !important; }
  .ym-frame-txt { padding: 0 !important; margin-left: 0 !important; margin-right: 0 !important; align-self: start !important; }
}

/* Slider infini : repositionnement instantané sur la vraie slide après passage sur une copie */
.ym-track.ym-no-anim, .ym-track.ym-no-anim .ym-slide { transition: none !important; }

/* Mobile : légende des réalisations empilée (titres longs lisibles, lien sous le texte) */
@media (max-width: 640px) {
  .ym-slide > div:last-child { flex-direction: column; align-items: flex-start !important; gap: 10px !important; }
}

/* Indicatif : chevron dessiné, à la même distance du bord que le texte (14 px) */
select.ym-field {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 36px;
  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 1.5l5 5 5-5' fill='none' stroke='%230F204A' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 12px 8px;
  cursor: pointer;
}
select.ym-field::-ms-expand { display: none; }

/* Mobile : texte « Qui sommes-nous » plus compact */
@media (max-width: 640px) {
  .ym-qui-text { font-size: 23px !important; line-height: 1.35 !important; }
}

/* Cartes projets du hero : photo voilée et logo blanc (header v7 C) */
.ym-card-veil { transition: background .3s ease; }
.ym-card-logo:hover .ym-card-veil, .ym-card-logo:focus-visible .ym-card-veil { background: rgba(15, 32, 74, 0.4) !important; }
