/* Corrections ciblées validées : formulaires, secours Nike et titres mobiles. */
form.msg-form .form-field {
  position: relative;
  min-width: 0;
}
form.msg-form .form-field input:not([type="hidden"]),
form.msg-form .form-field textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
}
form.msg-form input:not([type="hidden"])::placeholder,
form.msg-form textarea::placeholder {
  color: var(--form-ink) !important;
  -webkit-text-fill-color: var(--form-ink) !important;
  opacity: .9 !important;
}
/* Le repère reste très discret, et demeure visible après la saisie. */
form.msg-form .form-field .field-label {
  position: absolute;
  top: -4px;
  left: 2px;
  display: block;
  margin: 0;
  font-size: 10px;
  font-weight: 400;
  line-height: 12px;
  letter-spacing: .025em;
  text-transform: none;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
}
form.msg-form .form-field:focus-within .field-label,
form.msg-form .form-field:has(input:not(:placeholder-shown), textarea:not(:placeholder-shown)) .field-label {
  opacity: .75;
}
.cv-example-note { text-align: left; }

/* Une seule hauteur d'écran si la vue interactive ne peut pas être affichée. */
.sc-stage.sc-fallback {
  height: 100vh !important;
  height: 100svh !important;
  min-height: 420px;
  background-size: contain !important;
}
.sc-stage.sc-fallback .sc-sticky {
  position: relative;
  height: 100%;
}
.sc-stage.sc-fallback .sc-progress,
.sc-stage.sc-fallback .sc-hint-drag,
.sc-stage.sc-fallback .sc-glow,
.sc-stage.sc-fallback .sc-cap:not(.sc-cap-hero) {
  display: none !important;
}
.sc-stage.sc-fallback .sc-cap-hero {
  opacity: 1 !important;
  top: max(88px, 12vh);
  margin-top: 0 !important;
  transform: none !important;
}
#view-detail .sc-stage.sc-fallback .sc-title {
  font-size: clamp(30px, 5vw, 64px) !important;
  line-height: .95 !important;
}
.sc-stage.sc-fallback .sc-sub { display: none; }
.sc-stage.sc-fallback .sc-loading {
  inset: auto 0 24px;
  pointer-events: none;
}
#view-detail .sc-stage.sc-fallback .sc-pct {
  font-size: 12px !important;
  line-height: 1.5;
  letter-spacing: .025em;
}

@media (max-width: 600px) {
  #contact h2 {
    font-size: clamp(30px, 10.5vw, 48px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.045em !important;
    max-width: 100%;
  }
  #contact h2 em {
    line-height: 1.06 !important;
    letter-spacing: -.035em !important;
    filter: blur(1px) !important;
  }
  #detail-content[data-project="palindrome"] .detail-hero-content h1 {
    font-size: clamp(28px, 10.6vw, 64px) !important;
    max-width: 100%;
  }
  #detail-content[data-project="hermes"] .ed-hero-title {
    font-size: clamp(28px, 10.3vw, 62px) !important;
    max-width: 100%;
  }
}
