/* Blog */

#scene-article {
height: 340px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 2rem;
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity, 1))
}

#scene-article h1 {
font-size: 2.25rem;
line-height: 2.5rem
}

@media (min-width: 900px) {

#scene-article h1 {
font-size: 42px;
line-height: 50px
}
    }

article .entry-content p {
margin-bottom: 1rem;
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity, 1))
}

article .entry-content h2 {
font-size: 28px
}

@media (min-width: 900px) {

article .entry-content h2 {
margin-bottom: 0.5rem;
font-size: 32px
}
    }

article .entry-content h3 {
font-size: 26px;
font-weight: 800
}

@media (min-width: 900px) {

article .entry-content h3 {
margin-bottom: 0.5rem;
font-size: 28px
}
    }

article .entry-content a {
--tw-text-opacity: 1;
color: rgb(255 98 42 / var(--tw-text-opacity, 1));
text-decoration-line: underline
}

article .entry-content a:hover {
--tw-text-opacity: 1;
color: rgb(180 52 3 / var(--tw-text-opacity, 1))
}

article .entry-content li {
margin-bottom: 0.5rem;
margin-left: 1.25rem;
list-style-type: disc;
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity, 1))
}

#category-filters {
margin-bottom: 3rem
}

#category-filters .filter-btn {
border-radius: 0.375rem;
--tw-bg-opacity: 1;
background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
padding-left: 0.75rem;
padding-right: 0.75rem;
padding-top: 0.125rem;
padding-bottom: 0.125rem;
font-weight: 500;
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity, 1))
}

#category-filters .filter-btn.active {
--tw-bg-opacity: 1;
background-color: rgb(255 248 241 / var(--tw-bg-opacity, 1));
--tw-text-opacity: 1;
color: rgb(255 98 42 / var(--tw-text-opacity, 1))
}

#posts-container {
display: flex;
flex-wrap: wrap;
gap: 1rem
}

@media (min-width: 992px) {

#posts-container {
gap: 2rem
}
  }

.item-blog {
display: flex;
width: 100%;
flex-direction: column;
gap: 1.5rem;
border-radius: 0.5rem;
border-width: 1px;
border-style: solid;
--tw-border-opacity: 1;
border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
padding: 1.5rem;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1),
    0px 1px 2px -1px rgba(0, 0, 0, 0.1);
  transition: transform 0.15s ease-out
}

@media (min-width: 700px) {

.item-blog {
    width: calc(100% / 2 - 8px)
}
  }

@media (min-width: 992px) {

.item-blog {
    width: calc(100% / 3 - (64px / 3))
}
  }

.item-blog a {
display: flex;
flex-direction: column;
gap: 1rem
}

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

@media (min-width: 960px) {

.item-blog p {
      -webkit-line-clamp: 2
  }
    }

.item-blog:hover {
    transform: scaleX(1.05) scaleY(1.05);
    transition: transform 0.15s ease-out;
  }

.item-blog .img-blog {
border-radius: 0.25rem;
  transition: transform 0.15s ease-out
}

.item-blog .logo-blog {
width: 8rem
}

.item-blog .title-blog {
font-size: 1.125rem;
font-weight: 800;
--tw-text-opacity: 1;
color: rgb(17 24 39 / var(--tw-text-opacity, 1))
}

/*** Tag blog ***/

.tag {
width: -moz-fit-content;
width: fit-content;
border-radius: 0.375rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
font-size: 0.75rem;
line-height: 1rem;
font-weight: 500
}

.tag-actualites {
width: -moz-fit-content;
width: fit-content;
border-radius: 0.375rem;
--tw-bg-opacity: 1;
background-color: rgb(253 246 178 / var(--tw-bg-opacity, 1));
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
font-size: 0.75rem;
line-height: 1rem;
font-weight: 500;
--tw-text-opacity: 1;
color: rgb(114 59 19 / var(--tw-text-opacity, 1))
}

.tag-entreprise {
width: -moz-fit-content;
width: fit-content;
border-radius: 0.375rem;
--tw-bg-opacity: 1;
background-color: rgb(229 237 255 / var(--tw-bg-opacity, 1));
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
font-size: 0.75rem;
line-height: 1rem;
font-weight: 500;
--tw-text-opacity: 1;
color: rgb(66 56 157 / var(--tw-text-opacity, 1))
}

.tag-ecologie {
width: -moz-fit-content;
width: fit-content;
border-radius: 0.375rem;
--tw-bg-opacity: 1;
background-color: rgb(222 247 236 / var(--tw-bg-opacity, 1));
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
font-size: 0.75rem;
line-height: 1rem;
font-weight: 500;
--tw-text-opacity: 1;
color: rgb(23 83 78 / var(--tw-text-opacity, 1))
}