/* =====================================================================
   STYLE « PANORAMA »
   Titre et présentation sur une ligne ; dessous, une feuille pleine largeur :
   croquis à gauche, post-it du prix, et tous les réglages en une barre.
   ===================================================================== */
.accueil-panorama__tete { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: end; }
.accueil-panorama .accueil-mix__chapo { margin-top: 0; }
.atouts-standard--ligne { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 18px 0 0; }
.feuille--panorama { margin-top: clamp(28px, 4vw, 44px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 8px 32px; align-items: center; padding: 22px 28px 26px; }
.feuille--panorama .croquis { grid-row: span 1; }
.feuille--panorama .croquis svg { max-height: 360px; }


/* Réglages en colonne à droite du croquis */
.mini-sim--barre { align-content: center; gap: 18px; }

@media (max-width: 960px) {
  .accueil-panorama__tete, .feuille--panorama { grid-template-columns: 1fr; }
  .feuille--panorama .postit { right: -8px; }
}

/* Haut de page resserré : le ruban des prestations apparaît dès l'arrivée, sans défiler */
.accueil-panorama { padding-top: calc(var(--hauteur-entete) + clamp(40px, 4.4vw, 64px)); padding-bottom: clamp(48px, 5vw, 72px); }
.accueil-panorama .feuille--panorama { margin-top: clamp(24px, 2.6vw, 30px); padding-block: 16px 20px; }
.accueil-panorama .feuille--panorama .croquis svg { max-height: 320px; }

/* Mots-clés du titre principal, en petit au-dessus de la promesse */
.accueil-cle {
  display: flex; align-items: center; gap: 12px; margin-bottom: 20px; font-family: var(--f-tech); font-size: 15.5px; font-weight: 600;
  letter-spacing: .1em; line-height: 1.4; text-transform: uppercase; color: var(--c-lien);
}
.accueil-cle::before { content: ""; flex: none; width: 26px; height: 2px; border-radius: 1px; background: var(--c-orange); }

/* Haut de l'accueil, finitions : zone remontée, titre et mots-clés de même largeur,
   introduction plus discrète, photo de l'ingénieur plus grande */
.accueil-panorama { padding-top: calc(var(--hauteur-entete) + clamp(24px, 3vw, 44px)); }
.accueil-panorama h1 { width: fit-content; }
.accueil-panorama .accueil-cle { display: block; width: 0; min-width: 100%; white-space: nowrap; letter-spacing: .08em; margin-bottom: 18px; }
.accueil-panorama .accueil-cle::before { display: none; }
.accueil-panorama .accueil-mix__chapo { font-size: 16.5px !important; line-height: 1.6 !important; color: var(--c-gris); }
.accueil-panorama .atouts-standard--ligne { margin-top: 18px !important; font-size: 15px; }
.accueil-panorama .contact-humain { margin-top: 22px; gap: 16px; }
.accueil-panorama .contact-humain__photo { width: 76px; }
.accueil-panorama .contact-humain__photo.photo--vide > .ico { width: 26px; height: 26px; }
/* les deux colonnes centrées l'une sur l'autre : plus de vide au-dessus du titre */
.accueil-panorama__tete { align-items: center; }
/* sur téléphone, la ligne de mots-clés revient à la ligne au lieu de déborder */
@media (max-width: 600px) {
  .accueil-panorama .accueil-cle { width: auto; min-width: 0; white-space: normal; font-size: 12px !important; line-height: 1.6; margin-bottom: 12px; }
}