:root {
  --primary-color: #0d1e3a;
  --accent-color: #f26a2e;
  --background-color: #ffffff;
  --light-gray: #f7f7f7;
  --text-color: #333333;
  --container-max: 1200px;
  --radius: 12px;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
body { font-family:'Lato',sans-serif; background:var(--background-color); color:var(--text-color); line-height:1.6; }
h1,h2,h3,h4,h5 { font-family:'Montserrat',sans-serif; color: var(--primary-color); margin:0 0 .5rem; }
a { color: var(--accent-color); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Site header with logo left + menu right */
.site-header { background: var(--primary-color); color:#fff; padding:.75rem 1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.site-title, .site-title a { color:#fff; text-decoration:none; font-family:'Montserrat',sans-serif; font-weight:700; }
.site-nav .menu { list-style:none; margin:0; padding:0; display:flex; gap:1rem; flex-wrap:wrap; }
.site-nav .menu a { color:#fff; font-weight:700; text-decoration:none; }

/* Buttons */
.button, .wp-block-button__link { display:inline-block; padding:.8rem 1.5rem; background:var(--accent-color); color:#fff; border-radius:5px; font-weight:700; text-decoration:none; transition:filter .3s ease; }
.button:hover, .wp-block-button__link:hover { filter:brightness(.95); text-decoration:none; }

/* Sections */
section { min-height:100vh; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; padding: clamp(1.25rem, 1rem + 1vw, 3rem); }

.section-title { font-size:clamp(1.6rem,1.2rem + 1vw,2.2rem); margin-bottom:2rem; text-align:center; position:relative; padding-bottom:.5rem; }
.section-title::after { content:""; display:block; width:60px; height:4px; background:var(--accent-color); margin:.5rem auto 0; border-radius:2px; }

/* Hero header */
.header { position:relative; background:var(--primary-color); color:#fff; text-align:center; overflow:hidden; padding-top:5rem; padding-bottom:5rem; }
.header::before { content:""; position:absolute; inset:0; z-index:0; background: linear-gradient(180deg, rgba(13,30,58,.5), rgba(13,30,58,.9)); }
.header > * { position:relative; z-index:1; }
.header h1 { font-size:clamp(1.8rem,2.2rem + 1vw,3rem); margin-bottom:1rem; line-height:1.25; color:#fff; }
.header p { font-size:clamp(1rem,.95rem + .4vw,1.25rem); margin-bottom:2rem; max-width:800px; color:#fff; }

/* Grids */
.services-container, .reasons-container { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:1.5rem; width:100%; max-width:var(--container-max); margin-inline:auto; }
.packs-container { display:grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap:2rem; width:100%; max-width:var(--container-max); margin-inline:auto; }

/* Cards */
.service-card, .pack-card, .reason-card { background:var(--light-gray); border-radius: var(--radius); padding:2rem; border-top:4px solid var(--accent-color); transition: transform .3s ease, box-shadow .3s ease; text-align:left; }
.service-card:hover, .pack-card:hover, .reason-card:hover { transform: translateY(-8px); box-shadow: 0 15px 40px rgba(0,0,0,.15); }
.card-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; background:var(--accent-color); color:#fff; border-radius:50%; font-weight:700; margin-bottom:1rem; }

/* Articles & blog */
.entry { width:100%; max-width:var(--container-max); margin:2rem auto; padding:0 1rem; }
.entry .post-title { font-size:2rem; margin-bottom:.5rem; }
.entry .meta { color:#666; font-size:.9rem; margin-bottom:1rem; }
.entry img { max-width:100%; height:auto; border-radius:8px; }
.entry a.more-link { display:inline-block; margin-top:1rem; }

/* Carousel */
.articles-section { background: var(--light-gray); }
.articles-header { text-align:center; margin-bottom:1rem; }
.articles-header p { color:var(--primary-color); font-weight:700; letter-spacing:.3px; }
.carousel { width:100%; max-width:var(--container-max); margin-inline:auto; position:relative; }
.carousel-track { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(260px,320px); gap:1rem; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:.5rem; }
.carousel-card { background:#fff; border-radius:var(--radius); border-top:4px solid var(--accent-color); padding:1rem; scroll-snap-align:start; display:flex; flex-direction:column; justify-content:space-between; min-height:220px; }
.carousel-card .suptitle { font-size:.85rem; text-transform:uppercase; opacity:.8; margin-bottom:.25rem; font-weight:700; }
.carousel button.carousel-cta { align-self:flex-start; padding:.6rem 1rem; background:var(--accent-color); color:#fff; border:0; border-radius:6px; font-weight:700; cursor:pointer; }

/* Footer */
.site-footer { background: var(--primary-color); color:#fff; padding:2rem 1rem; text-align:center; }

/* Responsive */
@media (max-width: 600px) {
  .packs-container { grid-template-columns: 1fr !important; }
}


/* === CTA Section (Home) === */
.cta-section {
  background: var(--primary-color);
  color: #fff;
  text-align: center;
  padding: clamp(2rem, 4vw, 4rem) 1rem;
}
.cta-section h2 {
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  font-size: clamp(1.6rem, 1.2rem + 1vw, 2.2rem);
  margin-bottom: 1rem;
}
.footer-buttons {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 1rem;
}
.footer-buttons .button { background: var(--accent-color); }
.footer-buttons .button:hover { filter: brightness(.95); }


/* === Single post layout & typography === */
.entry {
  width: 100%;
  max-width: var(--container-max);
  margin: clamp(1.5rem, 3vh, 2.5rem) auto;
  padding: 0 clamp(1rem, 3vw, 2rem); /* centrage + padding latéral */
}
.entry .post-title {
  color: var(--primary-color);
  margin-bottom: .75rem;
  line-height: 1.2;
}
.entry .meta {
  color: #667085;
  font-size: .95rem;
  margin-bottom: 1.25rem;
}
.entry .content > * + * { /* harmonise l'espacement vertical */
  margin-top: 1rem;
}
.entry .content p { margin: 0 0 1rem; }
.entry .content h2, .entry .content h3 { margin: 1.5rem 0 .5rem; color: var(--primary-color); }
.entry .content ul, .entry .content ol { padding-left: 1.25rem; margin: 0 0 1rem; }
.post-nav { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2rem; }
.post-nav .button { background: var(--accent-color); color: #fff; }

/* === Style des articles (single) === */
.single-post .entry {
  max-width: 100%; /* occupe toute la largeur disponible */
  padding-left: 20%;
  padding-right: 20%;
  box-sizing: border-box;
}

.single-post .post-title {
  color: #003366; /* bleu foncé */
  font-family: 'Montserrat', sans-serif;
}