/* ==================================================
   site-clean.css
   Ajustements propres (sans casser le site)
   Si besoin de revenir en arrière : enlever ce fichier des pages
   ================================================== */

/* 1) Header : garde une hauteur stable */
.topbar-inner{ padding: 10px 0; }
.topbar nav a{ padding: 6px 10px; }

/* 2) Désactive le rond si tu utilises un logo */
.dot{ display:none; }

/* 3) Images TMF : règles cohérentes */
.tmf-photo{ border-radius:18px; overflow:hidden; background:#f1f3f5; }
.tmf-photo img{ width:100%; height:100%; display:block; object-fit:cover; }
/* === Bulles avec une touche de couleur (menus) === */
.page-menus .tmf-menu-type{
  background: linear-gradient(180deg, rgba(37,99,235,.08), rgba(255,255,255,1) 55%);
  border-color: rgba(37,99,235,.18);
}

.page-menus .tmf-menu-type:nth-child(2){
  background: linear-gradient(180deg, rgba(255,140,60,.10), rgba(255,255,255,1) 55%);
  border-color: rgba(255,140,60,.22);
}

.page-menus .tmf-menu-type:nth-child(3){
  background: linear-gradient(180deg, rgba(16,185,129,.10), rgba(255,255,255,1) 55%);
  border-color: rgba(16,185,129,.22);
}
/* === Logo header : taille uniforme (comme les pages internes) === */
.topbar .brand-logo{
  height: 80px !important;
  width: auto !important;
  display: block;
  object-fit: contain;
}

@media (max-width: 900px){
  .topbar .brand-logo{
    height: 36px !important;
  }
}
/* Fix "saut" horizontal entre pages (scrollbar) */
html{ overflow-y: scroll; }




/* === Accueil : phrase signature (1 lignes, classe) === */
.home-intro{
  margin: 18px 0 26px;
}
/* === Accueil : phrase signature sur UNE seule ligne === */
.tmf-quick .home-intro strong{
  white-space: nowrap;
}

.home-intro-line1{
  font-size: 40px;
  font-weight: 800;
  letter-spacing: -0,2px;
  color: #0f172a;
}

.home-intro-line2{
  margin-top: 6px;
  font-size: 17px;
  font-weight: 500;
  color: rgba(15,23,42,.7);
}

@media (max-width: 700px){
  .home-intro-line1{ font-size: 44px; }
  .home-intro-line2{ font-size: 44px; }
}
/* === Bulles (navigation) : plus grandes, plus premium === */
.topbar nav a{
  padding: 20px 16px !important;
  border-radius: 24px !important;
  font-size: 15px;
  line-height: 1.1;
}
/* === Accueil : bulles Réponse rapide / Devis (plus grandes) === */
.page-home .tmf-quick-grid,
.tmf-quick .tmf-quick-grid{
  gap: 22px !important;
}

/* === Accueil : uniquement les 4 bulles "Réponse rapide / Devis" === */
.tmf-quick .tmf-quick-grid > a.tmf-pill{
  padding: 26px 24px !important;
  border-radius: 22px !important;
}

.tmf-quick .tmf-quick-grid > a.tmf-pill .tmf-pill-title{
  font-size: 22px !important;
}

.tmf-quick .tmf-quick-grid > a.tmf-pill .tmf-pill-sub{
  font-size: 18px !important;
}
/* === Accueil : badges sous le hero (Fabrication locale, etc.) === */
.tmf-hero-badges{
  gap: 14px;
}

.tmf-hero-badges .tmf-badge{
  padding: 22px 22px;
  font-size: 15px;
  font-weight: 700;
  border-radius: 999px;
}
/* === Accueil : phrase signature décalée à droite === */
.tmf-quick .home-intro{
  max-width: 1280px;
  margin: 8px auto 2px;
  text-align: left;
  padding-left: 10px;   /* ← décalage vers la droite */
}

.tmf-quick .home-intro strong{
  font-size: 28px !important;
  line-height: 1.25;
  font-weight: 800;
  display: block;
   white-space: nowrap;
  color:#ec4899 /* fuchsia élégant */
}

@media (max-width: 900px){
  .tmf-quick .home-intro{
    padding-left: 0;
    text-align: center;
  }
}
/* === Bouton Catalogue en fuchsia === */
.tmf-btn--catalogue{
  background: #ec4899 !important;
  border-color: #ec4899 !important;
  color: #fff !important;
  box-shadow: 0 14px 30px rgba(225,29,72,.35);
}

.tmf-btn--catalogue:hover{
  background: #be123c !important;
  border-color: #be123c !important;
}
/* === FIX MOBILE : page coupée / zoom desktop === */
@media (max-width: 900px){
  html, body{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }

  /* Le header/nav doit pouvoir passer à la ligne */
  .topbar-inner{
    flex-wrap: wrap;
  }
  .topbar nav{
    justify-content: flex-start;
    flex-wrap: wrap;
    max-width: 100%;
  }

  /* Badges : autoriser le retour à la ligne */
  .tmf-hero-badges{
    flex-wrap: wrap !important;
  }

  /* Phrase signature : si elle est forcée en 1 ligne, on l’autorise à casser */
  .home-intro strong{
    white-space: normal !important;
    word-break: break-word;
  }

  /* Images : jamais plus larges que l’écran */
  img{
    max-width: 100%;
    height: auto;
  }
}
/* === MOBILE : header moins envahissant + il défile === */
@media (max-width: 700px){
  .topbar{
    position: static !important;   /* n'est plus sticky */
    padding: 6px 0 !important;     /* moins de hauteur */
  }
  .topbar-inner{
    padding: 6px 0 !important;     /* moins de hauteur */
  }
}
/* Hero subtitle fuchsia */
.tmf-hero__subtitle{
  color: #e83e8c; /* fuchsia élégant */
  font-weight: 600;
}
/* === Décaler le logo légèrement vers la gauche === */
.topbar .brand{
  margin-left: -90px;
  display: flex;
  align-items: center;
  gap: 12px;
}
/* === MOBILE: logos propres + pas de débordement === */
@media (max-width: 700px){
  .topbar .brand{
    margin-left: 0 !important;
    gap: 8px !important;
  }

  .topbar .brand-mark{
    height: 26px !important;   /* logo TM */
  }

  .topbar .brand-logo{
    height: 34px !important;   /* logo texte */
  }

  .topbar-inner{
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  .topbar nav{
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}