html, body {
   overflow-x: hidden;
}

#section_banner_newsletter {
   background: #eaf7ff;
}

.preinscription {
   font-family: 'Segoe UI', Roboto, sans-serif;
   max-width: 800px;
   margin: auto;
   padding: 2em;
   color: #333;
   line-height: 1.6;
}


h1 {
   color: #003366;
   text-align: center;
}

h2 {
   color: #004488; /* #007acc */
   margin-top: 2.5em;
   margin-bottom: 0.5em;
   display: block;
   font-size: 1.8em;
   margin-block-start: 0.83em;
   margin-block-end: 0.83em;
   margin-inline-start: 0px;
   margin-inline-end: 0px;
   line-height: 1.6;
   font-weight: bold;
   unicode-bidi: isolate;
}

h3 {
   font-size: 1.4em;
   margin-top: 1.4em;
   font-weight: 600;
   margin-top: 1.5em;
   margin-bottom: 0.3em;
   color: #222;
}

ul {
   padding-left: 1.2em;
   list-style: outside;
}

.section-suite {
   background-color: #f9f9f9;
   padding: 1.5em;
   margin-top: 2em;
   border-radius: 8px;
   border: 1px solid #e0e0e0;
}

p.transition {
   text-align: center;
   font-style: italic;
   font-size: 1.1em;
   margin-top: 2em;
   margin-bottom: 1.5em;
   color: #333;
}

.cta {
   background: #007acc;
   color: white;
   text-align: center;
   padding: 1em;
   margin-top: 2em;
   border-radius: 6px;
   font-weight: bold;
   text-decoration: none;
   display: block;
}

.form-zone {
   background: #f9f9f9;
   padding: 2em;
   margin-top: 2em;
   border-radius: 6px;
   text-align: center;
   border: 1px solid #ddd;
}

.first-form {
   background: #eef6fc;
   border-color: #99ccee;
   margin-bottom: 3.5em;
}

input[type="email"] {
   padding: 0.7em;
   width: 80%;
   max-width: 400px;
   font-size: 1em;
   margin-bottom: 1em;
}

button {
   padding: 0.7em 1.2em;
   background: #007acc;
   color: white;
   border: none;
   border-radius: 4px;
   font-size: 1em;
   cursor: pointer;
}

.cta-bottom {
   background-color: #f8f8f8;
   border: 2px solid #0078d4;
   color: #0078d4;
   font-weight: bold;
   padding: 0.8em 1.5em;
   border-radius: 6px;
   font-size: 1.1em;
   cursor: pointer;
}

.cta-bottom:hover {
   background-color: #e6f0fb;
}

/* Bandeau supérieur */
#header-top {
  z-index: 10;
  background-color: #f7f7f7;
  }

/* Logo Osmodev */
.header-logo {
   position: relative;
   margin-top: 5em;
   margin-bottom: 1.5em;
   text-align: center;
}

.header-logo img {
   max-width: 420px;
   width: 90%;
   height: auto;
   display: block;
   margin: 0 auto;
}

/* Titre */
.header-title-block {
   text-align: center;
   margin-bottom: 2em;
}


/* Bannière */
.banniere {
   background-color: #eaf6ff;
   padding: 0 1em;
   text-align: center;
}

.banniere-img {
   max-width: 100%;
   height: auto;
   display: block;
   margin: 0 auto;
}