/* =========================
   HOME : Card scroll (desktop) / normal scroll (mobile)
   ========================= */

.home-card{
  height: auto;
  overflow: visible;
  overscroll-behavior: auto;
  scrollbar-gutter: auto;
  min-height: 0;
  margin: 0;
}

@media (min-width: 861px){
  .home-card{
    margin: 50px 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    padding-bottom: 0;
    max-height: calc(100vh - 100px);
    border-radius: 18px;
    padding: 26px 26px 18px;
  }
}

/* =========================
   HERO (banner + form remonte dedans)
   ========================= */

:root{
  --homeHeroLift: 180px;
}

.home-head{
  text-align: center;
  margin-bottom: 0;
}

.home-hero-banner{
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 0;

  position: relative;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;

  z-index: 1;
}

.home-hero-banner::after{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;

  background: linear-gradient(
    180deg,
    rgba(255,255,255,.28) 0%,
    rgba(255,255,255,.18) 55%,
    rgba(255,255,255,.24) 100%
  );
}

.home-hero-banner img{
  width: 100%;
  max-width: 980px;
  height: clamp(220px, 26vw, 360px);

  object-fit: cover;
  object-position: center;
  display: block;

  opacity: .95;

  transform: translateZ(0);
  -webkit-user-drag: none;
}

/* =========================
   FORM LAYOUT (centered stack)
   ========================= */

.home-form{
  display:flex;
  flex-direction: column;
  gap: 22px;

  padding-top: 0;
  margin-top: calc(var(--homeHeroLift) * -1);

  position: relative;
  z-index: 2;
}

.home-topgrid{
  width: 100%;
  display:flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  margin-top: 6px;
}

.home-topgrid .field{
  width: 100%;
  max-width: 700px;
  text-align: center;
}

.field-head{
  width: 100%;
  max-width: 700px;
  margin: 0 auto 10px;

  display:flex;
  align-items:center;
  justify-content: flex-start;
  gap: 10px;

  text-align: left;
}

/* Labels lisibles sur hero (badge léger, texte centré) */
.home-label{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  width: 100%;
  padding: 6px 10px;
  margin-bottom: -10px;

  font-weight: 900;
  font-size: 13px;
  line-height: 1.15;
  letter-spacing: .08em;
  text-transform: uppercase;

  color: rgba(15, 23, 42, .92);

  background: rgba(255,255,255,.72);
  border: 1px solid rgba(15, 23, 42, .12);

  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

@media (min-width: 861px){
  .home-label{ font-size: 14px; }
}

/* Big centered inputs */
.home-inputwrap{
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  border: 1px solid black;
}

.home-input{
  width: 100%;
  padding: 14px 46px 14px 14px;
  font-size: 13px;
}

/* Placeholder en italique */
.home-input::placeholder{ font-style: italic; }
.home-input::-webkit-input-placeholder{ font-style: italic; }
.home-input::-moz-placeholder{ font-style: italic; }
.home-input:-ms-input-placeholder{ font-style: italic; }
.home-input:-moz-placeholder{ font-style: italic; }

@media (min-width: 861px){
  .home-input{
    font-size: 13px;
    padding: 16px 50px 16px 16px;
  }
}

/* WHERE stack */
.where-stack{
  width: 100%;
  display:flex;
  flex-direction: column;
  gap: 12px;
  align-items: stretch;
}

.geo-state{
  margin-top: 8px;
  font-size: 13px;
  color: var(--muted);
}

/* ERRORS */
.field-error{
  margin-top: 10px;
  font-size: 12px;
  color: var(--danger);
  text-align: center;
}

.field.is-invalid input{
  border-color: var(--danger);
}

/* =========================
   PARTNERS (CLEAN + STABLE)
   ========================= */

.home-partners{
  margin-top: 18px;
}

/* Mobile / small : 2 colonnes */
.partners-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  justify-items: center;
}

/* ✅ Le slot "prepend" est caché sur mobile => les 2 logos deviennent 1 & 2 */
@media (max-width: 860px){
  .partner-prepend{ display: none !important; }
}

/* Desktop : 4 colonnes fixes (pas de faux gaps) */
@media (min-width: 861px){
  .partners-grid{
    grid-template-columns: repeat(4, 260px);
    justify-content: center;
    justify-items: center;
    gap: 12px;
  }
}

.partner-card{
  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 14px;

  min-height: 80px;
  width: 100%;
  max-width: 200px;

  text-decoration: none;
}

@media (min-width: 861px){
  .partner-card{
    width: 260px;
    max-width: 260px;
    min-height: 86px;
  }
}

.partner-card img{
  display: block;

  width: auto;
  height: 60px;
  max-width: 100%;
  max-height: 100%;

  object-fit: contain;

  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  backface-visibility: hidden;
  transform: translateZ(0);

  -webkit-user-drag: none;
}

/* BFA2 uniquement (plus grand) */
.partner-card img[src*="/partners/BFA2/"]{
  height: 70px;
  width: auto;
}
@media (min-width: 861px){
  .partner-card img[src*="/partners/BFA2/"]{
    height: 80px;
  }
}

.partner-card:hover{
  background: var(--panel2);
  border-color: var(--line2);
}

.partner-placeholder{
  position: relative;
  overflow: hidden;
  border-style: dashed;
  opacity: .9;
}

.partner-placeholder::after{
  content:"";
  position:absolute;
  inset:0;
  transform: translateX(-60%);
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.06) 50%,
    rgba(255,255,255,0) 100%
  );
  animation: partnerShimmer 1.4s infinite;
}

@keyframes partnerShimmer{
  0%{ transform: translateX(-60%); }
  100%{ transform: translateX(60%); }
}

.partners-empty{
  margin-top: 10px;
  font-size: 13px;
  text-align: center;
}

.partners-link{
  margin-left: 6px;
  color: var(--text);
  font-weight: 900;
  text-decoration: underline;
}

/* =========================
   FOOTER
   ========================= */

.home-footer{
  margin-bottom: 10px;
  display:flex;
  flex-direction: column;
  gap: 10px;
}

@media (min-width: 861px){
  .home-footer{
    position: sticky;
    bottom: 0;
    z-index: 5;
    padding: 18px 0 12px;
    background: var(--panel);
  }
}

.home-actions{
  display:flex;
  justify-content:center;
}

.home-submit{
  width: min(320px, 100%);
  padding: 12px 20px;
  border-radius: 14px;
}

/* =========================
   MOBILE extras
   ========================= */

@media (max-width: 860px){
  :root{ --homeHeroLift: 70px; }

  .home-hero-banner img{
    max-width: 100%;
    height: clamp(180px, 42vw, 260px);
  }
}
.home-head{
  position: relative;
}

.home-brand-layer{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;

  display: flex;
  justify-content: center;

  z-index: 3;
  pointer-events: none;
  user-select: none;
}

.home-brand-top{
  width: 100%;
  max-width: 700px;
  margin: 14px 16px 0;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px 16px;

  background: rgba(255,255,255,.60);
  border: 1px solid rgba(15, 23, 42, .10);
  box-shadow: 0 10px 24px rgba(0,0,0,.10);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  font-weight: 800;
  font-size: clamp(18px, 2.4vw, 28px);
  letter-spacing: .01em;
  line-height: 1;
  text-transform:uppercase;

  color: rgba(15, 23, 42, .92);
  text-shadow: 0 1px 0 rgba(255,255,255,.5);

  margin-bottom: 0;
}

.home-brand-top span{
  font-weight: 900;
}

@media (max-width: 860px){
  .home-brand-top{
    margin-top: 10px;
    padding: 9px 14px;
    font-size: clamp(18px, 5.2vw, 24px);
  }
}
