/*
Theme Name: 	Ecco-eco
Template: ascend
Author: 		Dewwwe
Author URI: 	https://www.dewwwe.com/
Description: 	Child Theme of <a href='https://www.kadencewp.com/product/ascend-wordpress-theme/'>Ascend</a> developped for <a href='https://ecco-eco.com'>Ecco-eco</a> by <a href='https://dewwwe.com'>Dewwwe</a>.
Version: 		1.0
*/

:root {
  --primary-green: #a0c51b;
  --gray-light: #8f8f8f;
  --gray-dark: #333333;
  --white: #ffffff;
}

/* Enlever les espaces après les p et autres */
.elementor-element p,
.entry-content p {
  margin: 0;
  letter-spacing: 0.2px;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
  margin-bottom: 0;
}

.entry-content p a:not(.button):not(.select2-choice):not([data-rel="lightbox"]) {
  text-decoration: none;
  border: none;
}

.wp-block-quote {
  margin: 16px 0;
  padding: 8px 12px;
  border-left: 4px solid var(--primary-green);
  color: var(--gray-dark);
}

.wp-block-quote p > mark {
  color: var(--gray-dark);
}

/* 
* Breadcrumbs 
*/

#kadbreadcrumbs,
#kadbreadcrumbs a {
  background: transparent;
  color: var(--gray-dark);

  font-size: unset;
  line-height: unset;

  padding: 0 0 32px 0;

  border: none;

  position: unset !important;
}

#kadbreadcrumbs .kad-breadcurrent {
  color: var(--primary-green);
}

/* Page header for articles and projects responsive fix */

#pageheader {
  display: flex;
  flex-direction: column;
  gap: 12px;

  padding: 128px 12px 12px 12px;
  height: fit-content;
}

#pageheader > .container,
#pageheader > .container .page-header,
#pageheader > .container .page-header .page-header-inner {
  height: fit-content;
  display: flex;
  flex-direction: column;
}

#pageheader > .kadbreadcrumbs {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
}

/* Images for article thumbnails */

.post-land-image-container {
  min-height: 250px;
  overflow: hidden;
}

.post-land-image-container .imghoverclass,
.post-land-image-container .imghoverclass a,
.post-land-image-container .imghoverclass a div {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.post-land-image-container .imghoverclass a div > img.attachment-thumb.wp-post-image.kt-image-link {
  max-height: 300px;

  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 30% top;
}

/* 
* Menu principal
*/

/* Soulignement éléments menu sélectionnés */
.kt-header-layout-standard .kad-center-header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
}

.kt-header-layout-standard .kad-center-header .nav-main,
.kt-header-layout-standard .kad-center-header .nav-main #menu-principal {
  height: 100%;
  display: flex;
  align-items: center;
}

.kt-header-layout-standard .kad-center-header .nav-main #menu-principal > li.menu-item {
  height: 100%;
  display: flex;
  align-items: center;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}

.kt-header-layout-standard .kad-center-header .nav-main #menu-principal > li.menu-item.current-menu-item,
.kt-header-layout-standard .kad-center-header .nav-main #menu-principal > li.menu-item:has(> a:hover) {
  border-bottom: 4px solid var(--primary-green);
}

/* Espacement éléments menu */
.kt-header-layout-standard .kad-center-header .nav-main #menu-principal {
  gap: 4px;
}

/* 
* Page nos projets
*/

/* fix height/width for portfolio items */
.p_item {
  min-height: 400px !important;
}

.portfolio_item {
  background: var(--white) !important;
  overflow: hidden !important;
  box-shadow: none !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

.portfolio-loop-image-container .portfolio-hover-item .portfolio-hover-item-inner .portfolio-loop-title {
  text-transform: capitalize !important;
  padding: 10px;

  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
}

.portfolio-loop-image-container {
  position: relative !important;
  overflow: hidden !important;
  height: 400px !important;
  background: #f8f9fa !important;
}

.portfolio-loop-image {
  padding-bottom: 0 !important;
  height: 100% !important;
  position: relative !important;
}

.portfolio-img-hover-inner {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.portfolio-loop-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.portfolio-loop-types {
  margin: 0 !important;
  margin-top: auto !important;
}

@media (max-width: 768px) {
  .p_item {
    min-height: 350px !important;
  }

  .portfolio-loop-image-container {
    height: 350px !important;
  }
}

/* Overlay color pour portfolio item cards */
.portfolio_item .portfolio-loop-image-container .portfolio-hover-item .portfolio-overlay-color {
  background: rgba(0, 0, 0, 0.9);
}

/* Tiret vert sous les titres */
.portfolio-loop-image-container .portfolio-hover-item .portfolio-hover-item-inner a .portfolio-loop-title {
  position: relative;
}

.portfolio-loop-image-container .portfolio-hover-item .portfolio-hover-item-inner a .portfolio-loop-title::after {
  content: " ";
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -14px;
  width: 28px;
  height: 4px;
  background: var(--primary-green);
}

.portfolio-loop-image-container .portfolio-hover-item .portfolio-hover-item-inner a .portfolio-loop-types {
  padding-top: 10px;
}

/* Fix pour cacher les lightbox */
.portfolio-loop-image-container
  .portfolio-hover-item
  .portfolio-hover-item-inner
  .kad_portfolio_lightbox_link.portfolio_lightbox {
  display: none;
}

/* 
* Accueil > Slider Header
*/

/* Titre */
#kt_slider_home .captiontitle.entry-title {
  font-weight: 400;
  font-size: 80px !important;
  line-height: 100px;
  text-shadow: 1px 1px 1px var(--gray-dark);
}

/* Sous titre */
#kt_slider_home .captiontext.subtitle {
  background: var(--primary-green);
  font-weight: 300;
  font-size: 18px !important;
  font-style: italic;
  line-height: 20px;
  width: fit-content;
  padding: 10px;
  letter-spacing: 4.5px;
}

/* Centrage des titres */
#kt_slider_home .flex-caption-case {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex-direction: column;
}

/* Taille des images */
#kt_slider_home .kt-slick-slide {
  height: 100vh;
  width: 100vw;
}
#kt_slider_home .kt-slick-slide div:has(img) {
  height: 100% !important;
  object-fit: cover !important;
}

#kt_slider_home .kt-slick-slide div:has(img) img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Boutons de navigation */
#kt_slider_home .slick-prev,
#kt_slider_home .slick-next {
  background-color: var(--primary-green);
  width: 120px;
  height: 70px;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
#kt_slider_home .slick-prev {
  clip-path: polygon(0% 0%, 75% 0%, 100% 100%, 25% 100%);
  padding-left: 12px;
}
#kt_slider_home .slick-next {
  padding-right: 12px;
  clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
}

#kt_slider_home .slick-prev:before,
#kt_slider_home .slick-next:before {
  font-size: 32px;
  font-weight: 500;
  color: var(--white);
}

#kt_slider_home .slick-prev:hover,
#kt_slider_home .slick-next:hover {
  background-color: var(--white);
}

#kt_slider_home .slick-prev:hover:before,
#kt_slider_home .slick-next:hover:before {
  color: var(--primary-green);
}

/* Fix pour "next arrow" qui ne s'affiche pas sinon */
.kt-slickslider .slick-next:before {
  content: "";
}

@media (max-width: 768px) {
  #kt_slider_home .kt-slick-slide,
  #kt_slider_home .kt-slick-slide div:has(img) img {
    min-height: 100vh;
    width: 100vw;
  }

  /* Titre */
  #kt_slider_home .captiontitle.entry-title {
    font-size: 48px !important;
    line-height: 50px;

    text-wrap: wrap;
  }

  /* Sous titre */
  #kt_slider_home .captiontext.subtitle {
    font-weight: 300;
    font-size: 14px !important;
    padding: 4px;
    letter-spacing: 3px;

    text-wrap: wrap;
  }

  #kt_slider_home .slick-prev,
  #kt_slider_home .slick-next {
    display: none !important;
  }
}

/* Accueil > Article thumbnails */

.eael-entry-thumbnail {
  max-height: 250px;
  overflow: hidden;
}

.eael-grid-post .eael-entry-thumbnail > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 30% bottom;
}

.eael-entry-wrapper {
  display: flex;
  flex-direction: column;

  height: unset !important;
}

/* 
* Accueil > Temoignages 
*/

#slider_temoignages {
  overflow: hidden;
}

#slider_temoignages .swiper-button-next, #slider_temoignages .swiper-button-prev {
  color: var(--primary-green);
  width: 48px;
}

/* 
* Articles  
*/

/* Date de publication */
.post-top-meta {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-dark);

  margin: 12px 0 12px 0;
}

/* Liens sur les cartes d'articles */
.postlist article .entry-content a.more-link {
  font-size: 16px;
  font-weight: 600;

  box-shadow: none;
  border-radius: 3px;
  border: none;

  color: var(--white);
  background: var(--gray-dark);
  padding: 8px 12px;
  text-align: center;
}

.postlist article .entry-content a.more-link:hover {
  color: var(--white) !important;
  background: var(--primary-green);
  border: none;
}

.kt_archivecontent article .row {
  display: flex;
  flex-direction: row;
}

.kt_archivecontent article .row .post-image-container,
.kt_archivecontent article .row .post-text-container {
  width: 100%;
}

.kt_archivecontent article .row .post-image-container img {
  width: 100%;
  height: 300px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .kt_archivecontent article .row {
    flex-direction: column;
  }
}

/* Hide titles in article and post navigation */

.kad-post-navigation .kt_postlink_meta {
  display: none;
}

.kad-post-navigation .kt_postlink_title {
  max-width: 300px;
}

.post-template-default .entry-content {
  padding-bottom: 32px;
}

/* Boutons dans les articles */
.wp-block-button__link,
.kt-excerpt-readmore.more-link {
  box-shadow: none;
  border-radius: 3px;
}

.wp-block-button__link:hover,
.kt-excerpt-readmore.more-link:hover {
  background: var(--primary-green);
}

@media (max-width: 768px) {
  /* center portfolio cards on mobile */
  .kad-portfolio-wrapper-outer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
/* 
* footer
*/

.footerclass {
  padding-top: 0;
}

.footerclass .widget {
  margin-top: 30px;
  color: var(--gray-light);
}

.footerclass .widget a {
  color: var(--gray-light);
}

.footermenu li {
  text-transform: uppercase;
  color: var(--gray-light);
  letter-spacing: 1px;
}

.footercredits.clearfix {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;

  color: var(--gray-light);
}

.footercredits.clearfix a {
  color: var(--gray-light);
}

.footercredits.clearfix:after,
.footercredits.clearfix:before {
  display: none !important;
}

.footercredits p {
  text-transform: uppercase;
}

@media (max-width: 768px) {
  .footercredits.clearfix {
    flex-direction: column;
    text-align: center;
  }
}