/*
  ╔══════════════════════════════════════════════════════════════╗
  ║  VILLAGE EMMAÜS LESCAR PAU — ARTICLE PLEINE LARGEUR          ║
  ╠══════════════════════════════════════════════════════════════╣
  ║  Mise en page des articles rédigés par l'IA (.em-article),   ║
  ║  reprise de elementor/Article/elementor-article3.html :      ║
  ║  bandeau, sommaire, sections numérotées, bandeau final.      ║
  ║                                                              ║
  ║  Même @layer que articles.css (voir l'explication en tête    ║
  ║  de ce fichier). La typographie de base est posée avec       ║
  ║  :where() (spécificité nulle) pour que chaque composant      ║
  ║  puisse la remplacer.                                        ║
  ║                                                              ║
  ║  L'article remplace l'en-tête du modèle Single Post : le     ║
  ║  bandeau et l'image du modèle sont masqués quand le contenu  ║
  ║  contient .em-article, sans toucher au modèle Elementor.     ║
  ╚══════════════════════════════════════════════════════════════╝
*/
@layer emmaus-blocs {

/* ══════════ MODÈLE SINGLE POST ══════════ */
body.single-post:has(.em-article) .empost-hero,
body.single-post:has(.em-article) .empost-body .elementor-widget-theme-post-featured-image{display:none!important}
body.single-post:has(.em-article) .empost-body{padding-top:0!important}

/* ══════════ BASE ══════════ */
.em-article{width:100vw!important;max-width:100vw!important;margin:0 0 0 calc(-50vw + 50%)!important;padding:0!important;overflow:hidden!important;background:#FFFAF0!important;color:#2B2625!important;font-family:'Nunito',-apple-system,BlinkMacSystemFont,sans-serif!important;line-height:1.6!important}
:where(.em-article),:where(.em-article) *,:where(.em-article) *::before,:where(.em-article) *::after{box-sizing:border-box}
:where(.em-article) p{font-family:'Nunito',sans-serif!important;font-size:clamp(16px,1.6vw,18px)!important;line-height:1.8!important;color:#4A4543!important;margin:0 0 1.1em!important}
:where(.em-article) p:last-child{margin-bottom:0!important}
:where(.em-article) strong{font-weight:800!important;color:#2B2625!important}
:where(.em-article) a:not(.wp-block-button__link){color:#8A4C3A!important;font-weight:700!important;text-decoration:underline!important;text-decoration-color:rgba(138,76,58,.35)!important;text-underline-offset:3px;transition:color .2s}
:where(.em-article) a:not(.wp-block-button__link):hover{color:#68A834!important}
:where(.em-article) .wp-block-heading{font-family:'Nunito',sans-serif!important}
:where(.em-article) h3.wp-block-heading{font-size:clamp(19px,2vw,23px)!important;font-weight:800!important;line-height:1.25!important;color:#2B2625!important;margin:0 0 14px!important}

/* Gabarits */
.em-article .em-inner{max-width:1200px!important;margin:0 auto!important;padding:0 clamp(16px,4vw,48px)!important}
.em-article .em-etroit{max-width:760px!important;margin-left:auto!important;margin-right:auto!important}
.em-article .em-centre{text-align:center!important}

/* ══════════ BANDEAU (HERO) ══════════ */
.em-article .em-hero{position:relative!important;margin:0!important;padding:clamp(130px,13vw,170px) 0 clamp(90px,10vw,130px)!important;background:#8A4C3A!important;color:#FFFAF0!important}
.em-article .em-hero::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 85% 15%,rgba(248,195,0,.14) 0%,transparent 50%),radial-gradient(ellipse at 10% 90%,rgba(104,168,52,.12) 0%,transparent 50%),url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='1.5' fill='%23ffffff' opacity='.05'/%3E%3C/svg%3E")}
.em-article .em-hero::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:70px;background:#FFFAF0;clip-path:ellipse(62% 100% at 50% 100%)}
.em-article .em-hero > *{position:relative;z-index:1}
.em-article .em-hero-grille{gap:clamp(40px,6vw,80px)!important;align-items:center!important;margin:0!important}

.em-article .em-fil{margin:0 0 24px!important;font-size:11px!important;font-weight:600!important;letter-spacing:2px!important;line-height:1.6!important;text-transform:uppercase!important;color:rgba(255,255,255,.5)!important}
.em-article .em-fil a{font-weight:600!important;text-decoration:none!important;color:rgba(255,255,255,.75)!important}
.em-article .em-fil a:hover{color:#FFFAF0!important}

.em-article .em-tags{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin:0 0 28px!important}
.em-article .em-tags > .wp-block-group__inner-container{display:flex!important;flex-wrap:wrap!important;gap:10px!important}
.em-article .em-tag{display:inline-flex!important;margin:0!important;padding:7px 16px!important;border:2px solid rgba(255,255,255,.35)!important;border-radius:50px!important;font-size:11px!important;font-weight:700!important;letter-spacing:2px!important;line-height:1.4!important;text-transform:uppercase!important;color:#FFFAF0!important}
.em-article .em-tag-jaune{background:#F8C300!important;border-color:#F8C300!important;color:#2B2625!important}

.em-article .em-hero h1.wp-block-heading{margin:0 0 28px!important;font-size:clamp(34px,5.2vw,64px)!important;font-weight:800!important;line-height:1.04!important;color:#FFFAF0!important;text-wrap:balance}
.em-article .em-hero h1.wp-block-heading em{display:block;margin-top:14px;font-size:.56em!important;font-weight:600!important;line-height:1.35!important;color:#F8C300!important}
.em-article .em-hero .em-chapo{max-width:580px;font-size:clamp(16px,1.9vw,19px)!important;line-height:1.7!important;color:rgba(255,250,240,.85)!important}

.em-article .em-hero-photo{position:relative!important;width:100%!important;max-width:420px!important;margin:0 auto!important}
.em-article .em-hero-photo .wp-block-image{margin:0!important}
.em-article .em-hero-photo img{display:block!important;width:100%!important;height:auto!important;aspect-ratio:4/5;object-fit:cover;margin:0!important;border:8px solid #FFFAF0!important;border-radius:20px!important;box-shadow:16px 16px 0 rgba(43,38,37,.18)!important;transform:rotate(2deg)}

/* Pastille jaune (bandeau et photos) */
.em-article .em-pastille{position:absolute!important;z-index:2!important;width:96px!important;height:96px!important;margin:0!important;padding:10px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#F8C300!important;border-radius:50%!important;box-shadow:4px 4px 0 rgba(43,38,37,.15)!important;font-family:'Gloria Hallelujah',cursive!important;font-size:15px!important;font-weight:700!important;line-height:1.15!important;text-align:center!important;text-transform:uppercase!important;color:#2B2625!important}
.em-article .em-hero-photo .em-pastille{top:-28px!important;left:-28px!important;right:auto!important;transform:rotate(-10deg)}
.em-article .em-photo .em-pastille{top:-26px!important;right:-22px!important;left:auto!important;transform:rotate(8deg)}

/* ══════════ INTRODUCTION + SOMMAIRE ══════════ */
.em-article .em-intro{margin:0!important;padding:clamp(40px,6vw,72px) 0 clamp(60px,8vw,100px)!important}
.em-article .em-intro .em-etroit p:first-child::first-letter{float:left;margin:.08em .12em 0 0;font-family:'Gloria Hallelujah',cursive;font-size:4.2em;line-height:.9;color:#8A4C3A}
.em-article .em-sommaire{margin-top:clamp(40px,5vw,56px)!important}
.em-article .em-sommaire-titre{display:block;margin:0 0 20px!important;text-align:center!important;font-family:'Gloria Hallelujah',cursive!important;font-size:20px!important;font-weight:700!important;color:#68A834!important}
.em-article .em-sommaire-liste{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important;gap:16px!important;margin:0!important;padding:0!important;list-style:none!important;counter-reset:em-sommaire}
.em-article .em-sommaire-liste > li{counter-increment:em-sommaire;margin:0!important;padding:0!important}
.em-article .em-sommaire-liste a{height:100%;display:flex!important;flex-direction:column;gap:10px;padding:22px 22px 20px!important;background:#F5EDDC!important;border:2px solid #EBE0CC!important;border-radius:12px!important;font-size:15px!important;font-weight:700!important;line-height:1.35!important;text-decoration:none!important;color:#2B2625!important;transition:all .35s cubic-bezier(.25,.8,.25,1.15)}
.em-article .em-sommaire-liste a::before{content:counter(em-sommaire,decimal-leading-zero);font-family:'Gloria Hallelujah',cursive;font-size:26px;line-height:1;color:#68A834}
.em-article .em-sommaire-liste a::after{content:'↓';margin-top:auto;font-size:18px;color:#8A4C3A;transition:transform .3s}
.em-article .em-sommaire-liste a:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(43,38,37,.08);background:#FFFAF0!important;border-color:#68A834!important;color:#2B2625!important}
.em-article .em-sommaire-liste a:hover::after{transform:translateY(4px)}

/* ══════════ SECTIONS ══════════ */
.em-article .em-section{position:relative!important;margin:0!important;padding:clamp(60px,9vw,110px) 0!important}
.em-article .em-section[id]{scroll-margin-top:110px}
.em-article .em-section-alt{background:#F5EDDC!important}
.em-article .em-section-sombre{background:#2B2625!important;color:#FFFAF0!important}
.em-article .em-section-alt::before,
.em-article .em-section-sombre::before,
.em-article .em-appel::before{content:'';position:absolute;top:-1px;left:0;right:0;height:60px;background:#FFFAF0;clip-path:ellipse(60% 100% at 50% 0%);z-index:1}
.em-article .em-apres-alt::before{background:#F5EDDC}
.em-article .em-section-sombre::after,
.em-article .em-appel::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 85% 20%,rgba(248,195,0,.12) 0%,transparent 45%),radial-gradient(ellipse at 10% 85%,rgba(104,168,52,.12) 0%,transparent 45%)}
.em-article .em-section > *,
.em-article .em-appel > *{position:relative;z-index:2}

/* Tête : numéro « 01 —— » + grand titre */
.em-article .em-numero{margin:0 0 16px!important;font-family:'Gloria Hallelujah',cursive!important;font-size:22px!important;font-weight:700!important;letter-spacing:1px!important;line-height:1.4!important;color:#68A834!important}
.em-article .em-numero::after{content:'';display:inline-block;width:40px;height:2px;margin-left:12px;vertical-align:middle;background:#68A834}
.em-article .em-centre .em-numero::before{content:'';display:inline-block;width:40px;height:2px;margin-right:12px;vertical-align:middle;background:#68A834}
.em-article .em-section h2.wp-block-heading{margin:0 0 24px!important;font-size:clamp(30px,4.4vw,54px)!important;font-weight:800!important;line-height:1.08!important;color:#2B2625!important;text-wrap:balance}
.em-article .em-section h2.wp-block-heading em{font-size:1.02em!important;font-weight:600!important;color:#8A4C3A!important}
.em-article .em-section h2.em-h2-long em{display:block;margin-top:8px;font-size:.74em!important;line-height:1.3!important}
.em-article .em-centre p{margin-left:auto!important;margin-right:auto!important}

/* Section sombre */
.em-article .em-section-sombre p{color:rgba(255,250,240,.82)!important}
.em-article .em-section-sombre strong{color:#F8C300!important}
.em-article .em-section-sombre h2.wp-block-heading,
.em-article .em-section-sombre h3.wp-block-heading{color:#FFFAF0!important}
.em-article .em-section-sombre h2.wp-block-heading em,
.em-article .em-section-sombre .em-numero,
.em-article .em-section-sombre p.is-style-manuscrit{color:#F8C300!important}
.em-article .em-section-sombre .em-numero::before,
.em-article .em-section-sombre .em-numero::after{background:#F8C300}

/* Phrase d'accroche manuscrite */
.em-article p.is-style-manuscrit{font-size:clamp(19px,2.2vw,23px)!important;line-height:1.5!important}

/* ══════════ COMPOSANTS ══════════ */
/* Cartes avec icône et grand numéro */
.em-article .em-cartes{gap:clamp(20px,3vw,32px)!important}
.em-article .em-carte{padding:clamp(28px,3.5vw,44px)!important;border-radius:12px!important}
.em-article .em-section-alt .em-carte{background:#FFFAF0!important}
.em-article .em-carte::before{content:'';display:block;width:52px;height:52px;margin-bottom:20px;border-radius:50%;background:#68A834 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFAF0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1.1L12 21l7.8-7.5 1-1.1a5.5 5.5 0 0 0 0-7.8z'/%3E%3C/svg%3E") center/26px no-repeat}
.em-article .em-carte:nth-child(3n+2)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFAF0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 20A7 7 0 0 1 9.8 6.1C15.5 5 17 4.5 19 2c1 2 2 4.2 2 8 0 5.5-4.8 10-10 10Z'/%3E%3Cpath d='M2 21c0-3 1.9-5.4 5.1-6C9.5 14.5 12 13 13 12'/%3E%3C/svg%3E")}
.em-article .em-carte:nth-child(3n)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFAF0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.4l-5.2 2.7 1-5.8-4.3-4.1 5.9-.9z'/%3E%3C/svg%3E")}
.em-article .em-carte .em-carte-numero{top:12px!important;right:22px!important;font-size:84px!important}
.em-article .em-carte h3.wp-block-heading{padding-right:56px!important}
.em-article .em-carte p{font-size:16px!important;line-height:1.75!important}

/* Mini-cartes (liste) */
.em-article .em-minis{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:16px!important;padding:0!important;list-style:none!important}
.em-article .em-minis > li{flex:0 1 calc((100% - 32px) / 3);min-width:250px;margin:0!important;padding:24px!important;background:#FFFAF0!important;border:2px solid #EBE0CC!important;border-radius:16px!important;font-size:16px!important;line-height:1.65!important;text-align:left!important;color:#4A4543!important;transition:transform .35s cubic-bezier(.25,.8,.25,1.15),box-shadow .35s,border-color .35s}
.em-article .em-minis > li:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(43,38,37,.08);border-color:#68A834!important}
.em-article .em-minis > li::before{content:'';display:block;width:46px;height:46px;margin-bottom:14px;border-radius:50%;background:#68A834 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFAF0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/20px no-repeat}
.em-article .em-minis > li:nth-child(even)::before{background-color:#8A4C3A}

/* Conseils numérotés */
.em-article .is-style-conseils{max-width:900px;margin-left:auto!important;margin-right:auto!important}
.em-article .is-style-conseils > li{padding:26px 30px 26px 112px!important}
.em-article .is-style-conseils > li::before{left:30px;top:24px;font-size:38px}

/* Encadrés */
.em-article .em-encadre-jaune{margin:clamp(32px,4vw,48px) 10px 0 0!important}
.em-article .em-encadre-jaune p{color:#2B2625!important}
.em-article .em-infos{position:relative!important;margin:clamp(24px,3vw,36px) 16px 0 0!important;padding:clamp(28px,3.5vw,40px)!important;background:#2B2625!important;border-radius:20px!important;box-shadow:16px 16px 0 #EBE0CC!important;color:#FFFAF0!important;text-align:left!important}
.em-article .em-split .em-infos,
.em-article .em-etroit > .em-infos:first-child{margin-top:0!important}
.em-article .em-infos p{font-size:16px!important;line-height:1.7!important;color:rgba(255,250,240,.85)!important}
.em-article .em-infos strong{color:#FFFAF0!important}
.em-article .em-infos p.em-infos-titre{margin:0 0 20px!important;font-family:'Gloria Hallelujah',cursive!important;font-size:24px!important;font-weight:700!important;line-height:1.3!important;color:#F8C300!important}
.em-article .em-jours{display:grid!important;grid-template-columns:repeat(7,1fr)!important;gap:6px!important;margin:0 0 26px!important;padding:0!important;list-style:none!important}
.em-article .em-jours > li{margin:0!important;padding:10px 0!important;border-radius:8px!important;background:rgba(255,255,255,.06)!important;font-size:13px!important;font-weight:800!important;letter-spacing:.5px!important;line-height:1.4!important;text-align:center!important;color:rgba(255,250,240,.35)!important}
.em-article .em-jours > li:nth-child(n+2):nth-child(-n+6){background:#68A834!important;color:#FFFAF0!important}
.em-article .em-infos p.em-infos-ligne{position:relative!important;margin:0!important;padding:14px 0 0 130px!important;font-weight:600!important;line-height:1.55!important;color:#FFFAF0!important}
.em-article .em-infos .em-jours + p.em-infos-ligne{border-top:1px solid rgba(255,255,255,.12)!important;padding-top:22px!important}
.em-article .em-infos p.em-infos-ligne strong{position:absolute;left:0;width:120px;margin-top:3px;font-size:12px!important;font-weight:800!important;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,250,240,.55)!important}
.em-article .em-infos .wp-block-buttons{margin:26px 0 0!important}
.em-article .em-infos .wp-block-button{width:100%}
.em-article .em-infos .wp-block-button__link{width:100%!important;justify-content:center!important}

/* Photo + texte */
.em-article .em-split{gap:clamp(36px,6vw,80px)!important;align-items:center!important}
.em-article .em-split-infos{align-items:flex-start!important}
.em-article .em-photo{margin:0 16px 0 0!important}
.em-article .em-photo img{border-radius:20px!important}

/* FAQ */
.em-article .em-faq{max-width:860px;margin-left:auto!important;margin-right:auto!important}
.em-article .em-faq summary{padding:20px 24px!important}
.em-article .em-faq summary::after{flex-basis:34px;height:34px;font-size:24px}
.em-article .em-faq .wp-block-details > :not(summary){padding:0 24px 16px!important}
.em-article .em-faq .wp-block-details > :last-child{padding-bottom:22px!important}

/* ══════════ BANDEAU FINAL ══════════ */
.em-article .em-appel{position:relative!important;margin:0!important;padding:clamp(80px,10vw,120px) 0 clamp(60px,8vw,100px)!important;background:#8A4C3A!important;text-align:center!important;color:#FFFAF0!important}
.em-article .em-appel p.em-appel-titre{margin:0 0 18px!important;font-size:clamp(28px,4.4vw,52px)!important;font-weight:800!important;line-height:1.1!important;color:#FFFAF0!important;text-wrap:balance}
.em-article .em-appel p.em-appel-titre em{font-family:'Gloria Hallelujah',cursive;font-style:normal;font-weight:600;color:#F8C300}
.em-article .em-appel p.em-appel-texte{max-width:560px;margin:0 auto 34px!important;color:rgba(255,250,240,.85)!important}
.em-article .em-appel .wp-block-buttons{justify-content:center!important;margin:0!important}
.em-article .em-appel p.em-appel-phrase{max-width:720px;margin:clamp(48px,6vw,72px) auto 0!important;padding-top:clamp(36px,5vw,52px)!important;border-top:2px dashed rgba(255,250,240,.25)!important;font-family:'Gloria Hallelujah',cursive!important;font-size:clamp(20px,2.8vw,30px)!important;line-height:1.5!important;color:#FFFAF0!important}
.em-article .wp-block-button__link{padding:18px 34px!important}
.wp-block-button.is-style-clair .wp-block-button__link{background:transparent!important;border-color:rgba(255,250,240,.45)!important;color:#FFFAF0!important}
.wp-block-button.is-style-clair .wp-block-button__link:hover{background:transparent!important;border-color:#FFFAF0!important}

/* ══════════ RYTHME VERTICAL ══════════ */
/* Placé après les composants : l'espacement entre blocs d'une section est géré ici */
.em-article :is(.em-inner, .em-inner > .wp-block-group__inner-container) > *{margin-top:0!important;margin-bottom:0!important}
.em-article :is(.em-inner, .em-inner > .wp-block-group__inner-container) > * + *{margin-top:clamp(36px,5vw,56px)!important}

/* ══════════ ÉDITEUR ══════════ */
.editor-styles-wrapper .em-article{width:auto!important;max-width:none!important;margin:0!important}
.editor-styles-wrapper .em-article .em-hero{padding-top:60px!important}
.editor-styles-wrapper .em-article .wp-block{max-width:none!important}
.editor-styles-wrapper .em-article .em-minis > li:hover,
.editor-styles-wrapper .em-article .em-sommaire-liste a:hover{transform:none}

/* ══════════ RESPONSIVE ══════════ */
/* Proportions des colonnes sur grand écran seulement : en dessous, WordPress les empile */
@media(min-width:782px){
  .em-article .em-hero-grille > .wp-block-column:first-child{flex:1.15 1 0!important}
  .em-article .em-hero-grille > .wp-block-column:last-child{flex:.85 1 0!important}
  .em-article .em-split-infos > .wp-block-column:first-child{flex:1.1 1 0!important}
  .em-article .em-split-infos > .wp-block-column:last-child{flex:.9 1 0!important}
  .em-article .em-sommaire-liste.em-colonnes-2{grid-template-columns:repeat(2,1fr)!important}
  .em-article .em-sommaire-liste.em-colonnes-3{grid-template-columns:repeat(3,1fr)!important}
  .em-article .em-sommaire-liste.em-colonnes-4{grid-template-columns:repeat(4,1fr)!important}
  .em-article .em-sommaire-liste.em-colonnes-5{grid-template-columns:repeat(5,1fr)!important}
}
@media(max-width:781px){
  .em-article .em-hero-photo{max-width:360px!important}
  .em-article .em-hero-photo img{aspect-ratio:4/3}
}
@media(max-width:600px){
  .em-article .em-minis > li{flex-basis:100%}
  .em-article .is-style-conseils > li{padding:58px 20px 20px!important}
  .em-article .is-style-conseils > li::before{left:20px;top:16px;font-size:30px}
}
@media(max-width:480px){
  .em-article .em-pastille{width:72px!important;height:72px!important;font-size:12px!important}
  .em-article .em-hero-photo .em-pastille{top:-18px!important;left:-10px!important}
  .em-article .em-photo .em-pastille{top:-18px!important;right:-8px!important}
  .em-article .em-infos p.em-infos-ligne{padding-left:0!important}
  .em-article .em-infos p.em-infos-ligne strong{position:static;display:block;margin:0 0 2px}
  .em-article .em-appel .wp-block-buttons{flex-direction:column!important;align-items:center!important}
}

}
