.elementor-294 .elementor-element.elementor-element-3d06ae8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-294 .elementor-element.elementor-element-25ed1b1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-294 .elementor-element.elementor-element-42c36d8{--spacer-size:50px;}.elementor-294 .elementor-element.elementor-element-f7748f7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-posts .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__title, .elementor-widget-posts .elementor-post__title a{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-posts .elementor-post__meta-data{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .elementor-post__excerpt p{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-posts .elementor-post__read-more{color:var( --e-global-color-accent );}.elementor-widget-posts a.elementor-post__read-more{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__card .elementor-post__badge{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-294 .elementor-element.elementor-element-05d1052{--grid-row-gap:35px;--grid-column-gap:30px;}.elementor-294 .elementor-element.elementor-element-05d1052 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-294 .elementor-element.elementor-element-05d1052:after{content:"0.66";}.elementor-294 .elementor-element.elementor-element-05d1052 .elementor-post__thumbnail__link{width:100%;}.elementor-294 .elementor-element.elementor-element-05d1052 .elementor-post__meta-data span + span:before{content:"///";}.elementor-294 .elementor-element.elementor-element-05d1052.elementor-posts--thumbnail-left .elementor-post__thumbnail__link{margin-right:20px;}.elementor-294 .elementor-element.elementor-element-05d1052.elementor-posts--thumbnail-right .elementor-post__thumbnail__link{margin-left:20px;}.elementor-294 .elementor-element.elementor-element-05d1052.elementor-posts--thumbnail-top .elementor-post__thumbnail__link{margin-bottom:20px;}@media(max-width:767px){.elementor-294 .elementor-element.elementor-element-05d1052 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-294 .elementor-element.elementor-element-05d1052:after{content:"0.5";}.elementor-294 .elementor-element.elementor-element-05d1052 .elementor-post__thumbnail__link{width:100%;}}/* Start custom CSS for posts, class: .elementor-element-05d1052 *//* ═══════════════════════════════════════════════════════════════
   GESTAUTO-ÉCOLE — CSS blog complet (cards + layout + footer fix)
   À coller dans WordPress → Apparence → Personnaliser → CSS additionnel

   Palette : bleu Ezway #2563eb + accent orange #f59e0b (énergie, jeune)
   Polices : Manrope (display) + Inter (corps) — modernes, lisibles
   Cible :   directeurs d'auto-école + élèves jeunes + parents
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --gae-dark: #0f172a;
  --gae-text: #1e293b;
  --gae-mid: #475569;
  --gae-grey: #64748b;
  --gae-light: #94a3b8;
  --gae-border: #e2e8f0;
  --gae-bg: #f8fafc;
  --gae-white: #ffffff;
  --gae-blue: #2563eb;
  --gae-blue-dark: #1e40af;
  --gae-blue-light: #eff6ff;
  --gae-accent: #f59e0b;
  --gae-accent-light: #fef3c7;
  --gae-success: #10b981;
}

/* ═══════════════════════════════════════════════════════════════
   1. STICKY FOOTER — Empêche le footer de remonter
   ═══════════════════════════════════════════════════════════════ */

html, body { min-height: 100vh !important; }

body {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100vh !important;
  margin: 0 !important;
}

header.elementor-location-header { flex-shrink: 0 !important; }

main.elementor-location-archive,
.elementor-location-archive,
.elementor-location-single,
.elementor-location-page,
main,
#content,
.site-content {
  flex: 1 0 auto !important;
  min-height: 60vh !important;
  width: 100% !important;
}

footer.elementor-location-footer,
.site-footer,
footer {
  flex-shrink: 0 !important;
  margin-top: auto !important;
  width: 100% !important;
}

/* ═══════════════════════════════════════════════════════════════
   2. HERO DE LA PAGE BLOG — Gradient bleu énergique
   ═══════════════════════════════════════════════════════════════ */

.blog .page-header,
.archive .page-header,
.gae-blog-hero {
  background: linear-gradient(135deg, #1e40af 0%, #2563eb 50%, #3b82f6 100%) !important;
  color: #fff !important;
  padding: 72px 24px 96px !important;
  text-align: center !important;
  margin: 0 0 -48px !important;
  position: relative !important;
  overflow: hidden !important;
}

.blog .page-header::before,
.archive .page-header::before,
.gae-blog-hero::before {
  content: '🚗';
  position: absolute;
  font-size: 220px;
  opacity: 0.06;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.blog .page-title,
.archive .page-title,
.gae-blog-hero h1,
.page-header .entry-title {
  font-family: 'Manrope', 'Inter', sans-serif !important;
  font-size: 48px !important;
  font-weight: 900 !important;
  color: #fff !important;
  margin: 0 0 16px !important;
  letter-spacing: -1.2px !important;
  line-height: 1.1 !important;
  position: relative;
  z-index: 1;
}

.blog .archive-description,
.archive .archive-description,
.gae-blog-hero p {
  font-size: 18px !important;
  color: rgba(255, 255, 255, 0.92) !important;
  max-width: 680px !important;
  margin: 0 auto !important;
  line-height: 1.6 !important;
  font-family: 'Inter', sans-serif !important;
  position: relative;
  z-index: 1;
}

/* ═══════════════════════════════════════════════════════════════
   3. CONTAINER PRINCIPAL
   ═══════════════════════════════════════════════════════════════ */

.blog .site-main,
.archive .site-main,
.elementor-location-archive {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 56px 24px 80px !important;
  position: relative;
  z-index: 1;
}

/* ═══════════════════════════════════════════════════════════════
   4. GRILLE DES CARDS
   ═══════════════════════════════════════════════════════════════ */

.elementor-posts-container,
.elementor-posts.elementor-grid,
.elementor-widget-posts .elementor-posts,
.wp-block-query .wp-block-post-template,
.blog #main {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
  gap: 28px !important;
  padding: 8px !important;
  list-style: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   5. CARDS D'ARTICLES — Style moderne avec accent orange
   ═══════════════════════════════════════════════════════════════ */

.elementor-post,
.elementor-posts .elementor-post,
.blog article.post,
.archive article.post,
.wp-block-post {
  background: var(--gae-white) !important;
  border: 1px solid var(--gae-border) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1), box-shadow .3s ease, border-color .3s ease !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

/* Accent orange en haut au hover (signature visuelle gestauto) */
.elementor-post::before,
.blog article.post::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(to right, var(--gae-accent), var(--gae-blue));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.2, .8, .2, 1);
  z-index: 2;
}

.elementor-post:hover::before,
.blog article.post:hover::before {
  transform: scaleX(1);
}

.elementor-post:hover,
.blog article.post:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 24px 48px rgba(37, 99, 235, 0.15) !important;
  border-color: var(--gae-blue) !important;
}

/* ═══════════════════════════════════════════════════════════════
   6. IMAGE À LA UNE — Avec zoom et placeholder voiture
   ═══════════════════════════════════════════════════════════════ */

.elementor-post__thumbnail__link,
.elementor-post__thumbnail,
.wp-block-post-featured-image {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  aspect-ratio: 16 / 10 !important;
  margin: 0 !important;
  background: linear-gradient(135deg, #1e40af 0%, #2563eb 60%, #3b82f6 100%) !important;
}

.elementor-post__thumbnail img,
.elementor-post__thumbnail__link img,
.wp-block-post-featured-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .7s cubic-bezier(.2, .8, .2, 1) !important;
  display: block !important;
}

.elementor-post:hover .elementor-post__thumbnail img,
.blog article.post:hover .wp-block-post-featured-image img {
  transform: scale(1.08) !important;
}

/* Placeholder voiture si pas d'image à la une */
.elementor-post:not(:has(.elementor-post__thumbnail img)) .elementor-post__thumbnail::before,
.elementor-post .elementor-post__thumbnail:empty::before {
  content: '🚗';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 80px;
  color: rgba(255, 255, 255, 0.32);
}

/* ═══════════════════════════════════════════════════════════════
   7. ZONE TEXTE
   ═══════════════════════════════════════════════════════════════ */

.elementor-post__text,
.blog article.post .entry-header,
.blog article.post .entry-content {
  padding: 24px 26px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  font-family: 'Inter', sans-serif !important;
}

/* ═══════════════════════════════════════════════════════════════
   8. MÉTADONNÉES — Catégorie + date
   ═══════════════════════════════════════════════════════════════ */

.elementor-post__meta-data {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
  flex-wrap: wrap !important;
}

.elementor-post__meta-data .elementor-post__categories,
.elementor-post__categories,
.cat-links {
  display: inline-block !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  color: var(--gae-accent) !important;
  background: var(--gae-accent-light) !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(245, 158, 11, 0.25) !important;
  text-decoration: none !important;
}

.elementor-post__categories a,
.cat-links a {
  color: var(--gae-accent) !important;
  text-decoration: none !important;
}

.elementor-post-date,
.elementor-post__date,
.posted-on {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--gae-light) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

.elementor-post-date::before,
.elementor-post__date::before,
.posted-on::before {
  content: '📅 ' !important;
  margin-right: 3px !important;
  opacity: 0.7;
}

/* ═══════════════════════════════════════════════════════════════
   9. TITRE DE L'ARTICLE — Manrope bold
   ═══════════════════════════════════════════════════════════════ */

.elementor-post__title,
.blog article.post .entry-title,
.wp-block-post-title {
  font-family: 'Manrope', 'Inter', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  margin: 0 0 14px !important;
  letter-spacing: -0.4px !important;
  color: var(--gae-dark) !important;
}

.elementor-post__title a,
.blog article.post .entry-title a,
.wp-block-post-title a {
  color: var(--gae-dark) !important;
  text-decoration: none !important;
  background-image: linear-gradient(to right, var(--gae-blue), var(--gae-blue));
  background-size: 0 3px;
  background-repeat: no-repeat;
  background-position: 0 100%;
  transition: background-size .4s cubic-bezier(.2, .8, .2, 1), color .2s ease;
  padding-bottom: 2px;
}

.elementor-post__title a:hover,
.blog article.post .entry-title a:hover {
  color: var(--gae-blue) !important;
  background-size: 100% 3px;
}

/* ═══════════════════════════════════════════════════════════════
   10. EXTRAIT — 3 lignes max
   ═══════════════════════════════════════════════════════════════ */

.elementor-post__excerpt,
.elementor-post__excerpt p,
.blog article.post .entry-summary,
.wp-block-post-excerpt__excerpt {
  font-size: 14.5px !important;
  color: var(--gae-mid) !important;
  line-height: 1.65 !important;
  margin: 0 0 18px !important;
  font-family: 'Inter', sans-serif !important;
}

.elementor-post__excerpt p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ═══════════════════════════════════════════════════════════════
   11. BOUTON "LIRE LA SUITE"
   ═══════════════════════════════════════════════════════════════ */

.elementor-post__read-more-wrapper {
  margin-top: auto !important;
  padding: 16px 26px 22px !important;
  border-top: 1px solid var(--gae-border) !important;
  background: transparent !important;
}

.elementor-post__read-more,
.more-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: var(--gae-blue) !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  text-decoration: none !important;
  transition: gap .25s ease, color .2s ease !important;
  font-family: 'Inter', sans-serif !important;
}

.elementor-post__read-more::after,
.more-link::after {
  content: '→';
  display: inline-block;
  transition: transform .25s cubic-bezier(.2, .8, .2, 1);
  font-size: 16px;
}

.elementor-post:hover .elementor-post__read-more::after,
.blog article.post:hover .more-link::after {
  transform: translateX(6px);
}

.elementor-post__read-more:hover {
  color: var(--gae-blue-dark) !important;
  gap: 10px !important;
}

/* ═══════════════════════════════════════════════════════════════
   12. ARTICLE SINGLE — Page d'un article
   ═══════════════════════════════════════════════════════════════ */

.single-post .entry-header,
.single .entry-header {
  background: linear-gradient(135deg, #1e40af 0%, #2563eb 50%, #3b82f6 100%) !important;
  color: #fff !important;
  padding: 80px 24px 100px !important;
  text-align: center !important;
  margin: 0 0 -60px !important;
}

.single-post .entry-title,
.single .entry-title {
  font-family: 'Manrope', 'Inter', sans-serif !important;
  font-size: 44px !important;
  font-weight: 900 !important;
  color: #fff !important;
  margin: 0 auto 24px !important;
  max-width: 800px !important;
  letter-spacing: -1px !important;
  line-height: 1.15 !important;
}

.single-post .entry-meta,
.single .entry-meta {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 13px !important;
}

.single-post .entry-content,
.single .entry-content {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  font-size: 17px !important;
  line-height: 1.8 !important;
  color: var(--gae-text) !important;
  font-family: 'Inter', sans-serif !important;
  position: relative;
  z-index: 1;
}

.single-post .entry-content h2,
.single .entry-content h2 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--gae-dark) !important;
  margin: 48px 0 16px !important;
  padding-bottom: 12px !important;
  border-bottom: 3px solid var(--gae-blue) !important;
  letter-spacing: -0.5px !important;
}

.single-post .entry-content h3,
.single .entry-content h3 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  color: var(--gae-blue-dark) !important;
  margin: 32px 0 12px !important;
}

.single-post .entry-content blockquote,
.single .entry-content blockquote {
  border-left: 4px solid var(--gae-blue) !important;
  background: var(--gae-blue-light) !important;
  padding: 20px 28px !important;
  margin: 32px 0 !important;
  font-style: italic !important;
  font-size: 18px !important;
  color: var(--gae-blue-dark) !important;
  border-radius: 0 12px 12px 0 !important;
}

.single-post .entry-content table,
.single .entry-content table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 24px 0 !important;
  background: #fff !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05) !important;
  font-size: 15px !important;
}

.single-post .entry-content th,
.single .entry-content th {
  background: var(--gae-blue-dark) !important;
  color: #fff !important;
  padding: 12px 16px !important;
  text-align: left !important;
}

.single-post .entry-content td,
.single .entry-content td {
  padding: 12px 16px !important;
  border-top: 1px solid var(--gae-border) !important;
}

.single-post .entry-content tr:nth-child(even) td,
.single .entry-content tr:nth-child(even) td {
  background: var(--gae-bg) !important;
}

/* ═══════════════════════════════════════════════════════════════
   13. PAGINATION
   ═══════════════════════════════════════════════════════════════ */

.pagination,
.navigation.pagination,
.elementor-pagination,
.wp-block-query-pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 48px auto 0 !important;
  padding: 0 24px !important;
  flex-wrap: wrap !important;
}

.pagination .page-numbers,
.navigation.pagination .page-numbers,
.page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 1px solid var(--gae-border) !important;
  border-radius: 12px !important;
  color: var(--gae-text) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  transition: all .2s ease !important;
  font-family: 'Inter', sans-serif !important;
}

.pagination .page-numbers:hover,
.page-numbers:hover {
  border-color: var(--gae-blue) !important;
  color: var(--gae-blue) !important;
  transform: translateY(-2px) !important;
}

.pagination .page-numbers.current,
.page-numbers.current {
  background: var(--gae-blue) !important;
  color: #fff !important;
  border-color: var(--gae-blue) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════════════
   14. FOOTER — Couleurs lisibles (au cas où)
   ═══════════════════════════════════════════════════════════════ */

body footer.elementor-location-footer {
  background: var(--gae-bg) !important;
  color: var(--gae-text) !important;
  padding: 56px 24px 32px !important;
  border-top: 1px solid var(--gae-border) !important;
  position: relative;
}

body footer.elementor-location-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(to right, transparent, var(--gae-blue), transparent);
}

body footer.elementor-location-footer,
body footer.elementor-location-footer p,
body footer.elementor-location-footer span,
body footer.elementor-location-footer a,
body footer.elementor-location-footer li {
  color: var(--gae-text) !important;
}

body footer.elementor-location-footer a:hover {
  color: var(--gae-blue) !important;
}

/* ═══════════════════════════════════════════════════════════════
   15. RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  .elementor-posts-container,
  .blog #main {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
    gap: 24px !important;
  }
  .blog .page-title,
  .archive .page-title,
  .gae-blog-hero h1,
  .single .entry-title {
    font-size: 36px !important;
  }
  .single .entry-content h2 {
    font-size: 24px !important;
  }
}

@media (max-width: 600px) {
  .elementor-posts-container,
  .blog #main {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .blog .page-header,
  .archive .page-header,
  .gae-blog-hero {
    padding: 48px 20px 70px !important;
  }
  .blog .page-title,
  .archive .page-title,
  .gae-blog-hero h1,
  .single .entry-title {
    font-size: 28px !important;
  }
  .elementor-post__text {
    padding: 22px 22px 0 !important;
  }
  .elementor-post:hover {
    transform: translateY(-4px) !important;
  }
}/* End custom CSS */