/* ATP-2 (2026-10-29) -- corrections responsive d'alpes-toitures-protection.fr, chargees APRES la feuille Webflow.
   Genere par scripts/bancs/atp2/gen_resp.pl : 43 selecteurs, 65 regles reprises. */
.section-1 { height: auto; min-height: 75vh; max-height: none; }
.section-3 { height: auto; min-height: 30vh; max-height: none; }
.s5-div-2 { height: auto; min-height: 35vh; max-height: none; }
.s3-grid { height: auto; min-height: 30vh; max-height: none; }
.s3-div { height: auto; min-height: 18vh; max-height: none; }
.s3-paragpgraphe { height: auto; min-height: 40px; max-height: none; }
.cta-div { height: auto; min-height: 50vh; max-height: none; }
.cta-w-flex { height: auto; min-height: 50vh; max-height: none; }
.cta-sous-div-1 { height: auto; min-height: 50vh; max-height: none; }
.cta-sous-div-2 { height: auto; min-height: 50vh; max-height: none; }
.contact-div-1 { height: auto; min-height: 7vh; max-height: none; }
.contact-div-1._1 { height: auto; min-height: 10vh; max-height: none; }
.contact-sous-div-1 { height: auto; min-height: 8vh; max-height: none; }
.s11-sous-div-1-2 { height: auto; min-height: 20vh; max-height: none; }
.s11-sous-div-1-2._1 { height: auto; min-height: 30vh; max-height: none; }
.s11-sous-div-1-2-2-1 { height: auto; min-height: 8vh; max-height: none; }
.s11-sous-div-1-2-2-2 { height: auto; min-height: 12vh; max-height: none; }
.s11-sous-div-1-2-2-2._1 { height: auto; min-height: 22vh; max-height: none; }
.s11-sous-div-3 { height: auto; min-height: 30vh; max-height: none; }
.s11-sous-div-3-1 { height: auto; min-height: 30vh; max-height: none; }
.s11-sous-div-3-1-1 { height: auto; min-height: 10vh; max-height: none; }
.s11-sous-div-3-1-2 { height: auto; min-height: 20vh; max-height: none; }
@media screen and (max-width: 767px) {
  .link-block { height: auto; min-height: 30vh; max-height: none; }
  .h2.services { height: auto; min-height: 15vh; max-height: none; }
  .s2-paragraphe { height: auto; min-height: 13vh; max-height: none; }
  .s2-div { height: auto; min-height: 30vh; max-height: none; }
  .footer { height: auto; min-height: 60vh; max-height: none; }
  .footer-container { height: auto; min-height: 60vh; max-height: none; }
  .footer-v-flex { height: auto; min-height: 60vh; max-height: none; }
  .footer-div-1 { height: auto; min-height: 50vh; max-height: none; }
  .footer-div-2 { height: auto; min-height: 10vh; max-height: none; }
  .footer-sous-div-1 { height: auto; min-height: 50vh; max-height: none; }
  .footer-link-block { height: auto; min-height: 25vh; max-height: none; }
  .footer-paragraphe { height: auto; min-height: 25vh; max-height: none; }
  .footer-sous-div-2 { height: auto; min-height: 50vh; max-height: none; }
  .footer-sous-div-3 { height: auto; min-height: 10vh; max-height: none; }
  .footer-ss-div1 { height: auto; min-height: 10vh; max-height: none; }
  .footer-ss-div2 { height: auto; min-height: 10vh; max-height: none; }
  .link-block { height: auto; min-height: 10vh; max-height: none; }
  .s2-div { height: auto; min-height: 10vh; max-height: none; }
  .s2-div._1 { height: auto; min-height: 10vh; max-height: none; }
  .s2-div._2, .s2-div._3 { height: auto; min-height: 10vh; max-height: none; }
  .s5-div-2 { height: auto; min-height: 30vh; max-height: none; }
  .cta-div, .cta-w-flex { height: auto; min-height: 40vh; max-height: none; }
  .cta-sous-div-1 { height: auto; min-height: 35vh; max-height: none; }
  .footer { height: auto; min-height: 75vh; max-height: none; }
}
@media screen and (max-width: 479px) {
  .section-1 { height: auto; min-height: 85vh; max-height: none; }
  .section-3._1 { height: auto; min-height: 45vh; max-height: none; }
  .s5-div-2 { height: auto; min-height: 35vh; max-height: none; }
  .s3-grid { height: auto; min-height: 50vh; max-height: none; }
  .s3-paragpgraphe { height: auto; min-height: 10vh; max-height: none; }
  .s6-div { height: auto; min-height: 24vh; max-height: none; }
  .cta-div { height: auto; min-height: 65vh; max-height: none; }
  .cta-w-flex { height: auto; min-height: 65vh; max-height: none; }
  .cta-sous-div-1 { height: auto; min-height: 65vh; max-height: none; }
  .footer { height: auto; min-height: 100vh; max-height: none; }
  .footer-div-2 { height: auto; min-height: 40vh; max-height: none; }
  .footer-sous-div-2 { height: auto; min-height: 45vh; max-height: none; }
  .contact-div-1 { height: auto; min-height: 8vh; max-height: none; }
  .contact-div-1._1 { height: auto; min-height: 12vh; max-height: none; }
  .s11-sous-div-1-2 { height: auto; min-height: 30vh; max-height: none; }
  .s11-sous-div-1-2-2-2 { height: auto; min-height: 27vh; max-height: none; }
  .s11-sous-div-3 { height: auto; min-height: 0; }
  .s11-sous-div-3-1 { height: auto; min-height: 0; }
  .s11-sous-div-3-1-1 { height: auto; min-height: 20vh; max-height: none; }
}

/* ---- corrections a la main ---- */

/* Sections en 100vw : sous Windows (barre de defilement classique), barre horizontale de 15 px. */
html { overflow-x: hidden; }

/* Page contact : libelles a 363.5vw d'origine -> page 4 a 5 fois plus large que l'ecran des 480 px. */
.field-label { width: auto; }

/* Article de blog : interligne de 2.5vh pour un texte de 17 px -> 9 px sur un telephone couche, les lignes
   s'empilent. Plancher de 18 px : sans effet des 720 px de hauteur d'ecran. */
.rich-text-block, .blog-texte-conclusion-1, .blog-texte-1 { line-height: max(2.5vh, 18px); }

/* Titre de l'en-tete : interligne fixe (44 px, puis 6vh) plus petit que les grandes initiales (72 / 48 px)
   -> les lignes se chevauchent des que le titre passe a la ligne, ou que l'ecran est court. */
@media screen and (max-width: 991px) {
  .h1.light { line-height: 64px; }
  /* les cartes remontent de 6vh sur la photo : on reserve cette place sous le texte */
  .section-1 { padding-bottom: 6vh; }
}
@media screen and (max-width: 767px) {
  .h1.light { line-height: max(6vh, 50px); }
  .section-1 { padding-bottom: 0; }
}
@media screen and (max-width: 479px) {
  .h1.light { line-height: max(6vh, 36px); }
  /* barre bleue des cartes de prestation : 28vh centree dans une carte de 30vh. La carte peut maintenant
     grandir : la barre la suit (meme marge de 1vh), identique quand la carte garde ses 30vh. */
  .s11-sous-div-1-2-1 { height: auto; align-self: stretch; margin-top: 1vh; margin-bottom: 1vh; }
  .field-label { width: 30vw; }
  .field-label._1 { width: 85vw; }
}

/* En-tete, grand ecran : les cartes remontent de 75 px sur la photo. 77 px + la marge basse de 10 px du
   paragraphe = 75 px de cartes + 12 px d'air sous le dernier mot. N'agrandit l'en-tete que si le texte
   descend jusqu'aux cartes (1280 x 720 : 8 px de texte sous les cartes ; 1440 x 900 : 143 px de marge, inchange). */
@media screen and (min-width: 992px) {
  .section-1 { padding-bottom: 77px; }
}