/* =========================================================
   Accueil — mise en page des blocs validés desktop + mobile.
   Les styles internes aux widgets restent volontairement
   dans le contenu pour éviter une régression visuelle.
   ========================================================= */
.home-main { overflow:hidden; }
.home-top {
  max-width:1120px;
  margin:0 auto;
  padding:24px 20px 68px;
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(330px,.82fr);
  grid-template-areas:
    "title portrait"
    "signup proofs";
  gap:18px 46px;
  align-items:start;
}
.top-title { grid-area:title; }
.top-portrait { grid-area:portrait; display:flex; justify-content:center; }
.top-signup { grid-area:signup; }
.top-proofs { grid-area:proofs; padding-top:16px; }
.top-proofs .proof-homeHero { padding:0!important; }
.top-proofs .proof-wrap { max-width:none!important; padding:0!important; }
.top-proofs .proof-proofStack { width:100%!important; }
.home-bio { padding:0 0 70px; }
.home-services { padding:10px 0 120px; }

@media (max-width:980px) {
  .home-top {
    grid-template-columns:minmax(0,1fr) 330px;
    gap:22px 28px;
  }
}

@media (max-width:780px) {
  .home-top {
    display:flex;
    flex-direction:column;
    padding:22px 16px 52px;
  }
  .top-title { order:1; }
  .top-portrait { order:2; margin-top:14px; }
  .top-signup { order:3; width:100%; }
  .top-proofs { order:4; width:100%; padding-top:10px; }
  .home-subCard { margin:0 auto; }
  .home-bio { padding-bottom:40px; }
  .home-services { padding-bottom:80px; }
}

@media (max-width:520px) {
  .home-top { padding-left:14px; padding-right:14px; }
}


/* =========================================================
   V12 — composition du hero accueil conforme à la référence Wix
   ========================================================= */

@media (min-width: 781px) {
  .home-hero-title h1 {
    font-size: clamp(34px, 3.35vw, 52px) !important;
    line-height: .98 !important;
    letter-spacing: -.03em !important;
  }

  .home-hero-title .home-line {
    display: block;
    white-space: nowrap;
  }

  .home-top {
    grid-template-columns: minmax(0, 1.28fr) minmax(330px, .72fr);
    gap: 18px 42px;
  }
}

@media (max-width: 780px) {
  .home-hero-title .home-line {
    display: inline;
    white-space: normal;
  }

  .home-hero-title .home-line::after {
    content: " ";
  }
}


/* =========================================================
   V13 — HERO ACCUEIL : COLONNES INDÉPENDANTES
   Évite que la hauteur du portrait repousse le bloc newsletter.
   ========================================================= */

@media (min-width: 781px) {
  .home-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1.28fr) minmax(330px, .72fr) !important;
    grid-template-areas: none !important;
    column-gap: 42px !important;
    row-gap: 0 !important;
    align-items: start !important;
  }

  .home-col-left,
  .home-col-right {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }

  .home-col-left {
    gap: 56px;
  }

  .home-col-right {
    gap: 42px;
  }

  .top-title,
  .top-portrait,
  .top-signup,
  .top-proofs {
    grid-area: auto !important;
  }

  .top-proofs {
    padding-top: 0 !important;
  }
}

@media (max-width: 780px) {
  .home-col-left,
  .home-col-right {
    display: contents;
  }
}


/* =========================================================
   V14 — PREUVES SOCIALES ACCUEIL
   Plus à gauche, plus larges, bord droit aligné sur le médaillon.
   ========================================================= */

@media (min-width: 781px) {
  .home-col-right {
    align-items: stretch !important;
  }

  .top-portrait {
    width: 100%;
  }

  .top-proofs {
    width: calc(100% + 72px) !important;
    max-width: none !important;
    margin-left: -72px !important;
    margin-right: 0 !important;
    align-self: stretch !important;
  }

  .top-proofs > * {
    width: 100%;
    max-width: none !important;
  }
}

@media (min-width: 1100px) {
  .top-proofs {
    width: calc(100% + 96px) !important;
    margin-left: -96px !important;
  }
}

@media (max-width: 780px) {
  .top-proofs {
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
