/* 1680px - Grands écrans */
@media screen and (max-width: 1680px) {
  
a.logo { margin: 33px 0 0;}
  
.wrapper-home { font-size: 27px; }
  
.custombloc-1 .infotxt { padding: 0 125px 0 140px;}

.wrapper-home:before { height: 850px; }

.custombloc-1 .audio-reader-btn {left: 60px;}
  
}

/* 1600px */
@media screen and (max-width: 1600px) {
  header.header .container-fluid {
    padding: 0 15px;
  }
}

/* 1570px */
@media screen and (max-width: 1570px) {
  header.header .mod_jo_slideshow .slide-content { font-size: 54px !important;}

  .wrapper-home { font-size: 26px;}

 .custombloc-1 .infotxt h2 { margin: 0 0 30px;}

  h2, .h2 { font-size: 50px;}
  
.wrapper-home:before {  height: 799px;}  

.wrapper-home .grid-child a {font-size: 24px;margin: 20px 0 0;}
  
 .custombloc-3 .infotxt{   padding: 10px 190px 0 162px;} 

.reference .tz-flex-grid>.grid {
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)) !important;
}

h3 {font-size: 30px;}
  
.container { max-width: 87%; } 

.bloc6 .bloc {  padding: 48px 30px;}
  
.bloc6 .bloc h3 { font-size: 32px; margin-bottom: 13px;  padding-bottom: 15px;} 

.bloc6 .bloc p {font-size: 27px; margin-top: 0;}  

.footer-section .footer-col, .footer-section .footer-link-group { padding: 0;}

.view-article .site-grid { max-width: 90%; margin: auto;}

.epf-section .secondary-image { bottom: 0;  left: 0;   width: 70%; height: 60%;}
  h1{font-size: 48px;}
}

/* 1470px - Écrans larges */

@media screen and (max-width: 1470px) {
  
  .wrapper-home {  padding: 70px 0 0 !important; }
  
  .wrapper-home h2 { font-size: 47px;}
  
  .wrapper-home .grid-child {  max-width: 95%;}
  
  .wrapper-home .grid-child a {  margin: 7px 0 0 !important; font-size: 26px; }

  .custombloc-3 .audio-reader-btn { top: 80px; left: unset;}

  .custombloc-1 .audio-reader-btn {left: unset;}
  
  .custombloc-1 .infotxt {  padding: 0 60px 0 50px !important}
  
  .custombloc-3 .infotxt { padding: 50px 50px 0 50px;}
  
  .wrapper-home .custombloc-3 .grid-child {  max-width: 100%;}
  
  header.header .mod_jo_slideshow .slide-content {  font-size: 45px !important;}
  
  .container-header .tophead .grid-child:before {width: 388px !important;}
  
  .bloc2 .bx h3 {  font-size: 28px; }
  
  .bloc6 .bloc p { font-size: 24px; }
  
  .reference .tz-flex-grid>.grid {
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)) !important; grid-auto-rows: minmax(300px, auto) !important;
  }
  
  .footer { margin-top: 0;  padding: 66px 0; }
  
  .footer-section .footer-grid {gap: 20px;max-width: 93%;font-size: 18px;}
  
  .footer-section .footer-title, 
  .footer-section .nav-item a {font-size: 18px;}
  
  .footer-section .social-icon i {font-size: 36px;}

  .footer-section .contact-icon { width: 35px; height: 35px;}
  
  .custombloc-3 .photo-right { transform: translateX(-30px);}
  
  .custombloc-3 .infotxt {transform: translateX(30px);}

  .bloc6 .audio-reader-btn { top: 35px;  left: unset;}
  
  .bloc6 .container p {  font-size: 26px;}

  .bloc6 .grid-child.container-top-a { max-width: 100%;}

  .view-article .site-grid { max-width: 95%; }

  .vision-content { gap: 10px; }
  
  .contactp .blocf { font-size: 20px; }

    h1{font-size: 40px;}
  
.page-header {top: -90px;}
}

/* 1366px */
@media screen and (max-width: 1366px) {
  
  .custombloc-3 .infotxt { padding: 30px 0 0 80px; }
  
  .custombloc-3 .grid-child { max-width: 1200px;}
  
  .custombloc-3 .photo-right { animation: slideInLeft 0.8s ease 0.3s forwards; }
  
  .custombloc-3 .infotxt { animation: slideInRight 0.8s ease 0.6s forwards; }
}

/* 1300px */
@media screen and (max-width: 1300px) {
  
  header.header .mod_jo_slideshow .slide-content {  font-size: 38px;}
  
  .custombloc-1 .infotxt {  padding: 0 60px 0 44px !important; }
  
  .wrapper-home {padding: 50px 0 0 !important;  font-size: 23px !important;}
  
  .wrapper-home:before {   height: 678px; }
  
  .bloc2 .bx h3 { font-size: 25px;}
  
  .footer-section .footer-title, 
  .footer-section .nav-item a {/* font-size: 20px; */}
  
  .footer-section .footer-grid {/* font-size: 20px; */}

  body { font-size: 24px; }

  h1, .h1 { font-size: 38px; }

      .container-header .tophead .grid-child:before {
        width: 388px !important;
        height: 124px;
    }
}

/* 1280px - Ordinateurs portables */
@media screen and (max-width: 1280px) {
  .custombloc-3 .infotxt {  padding: 20px 0 0 60px; width: 55%;}
  
  .custombloc-3 .photo-right { width: 65%; padding-top: 50px; transform: translateX(-20px); }
  
  .custombloc-3 .infotxt {transform: translateX(20px);}
  
  .bloc6 .container p {font-size: 21px;}

  header.header .tophead { margin-top: -8px;}


  .com_tz_portfolio_plus.view-portfolio .tpp-bootstrap .card h2.tpp-item-title.name {
    font-size: 28px;
}
}

/* 1200px */
@media screen and (max-width: 1200px) {
  
  .bloc6 h2 {font-size: 45px;  }
  
  .bloc6 .bloc { padding: 45px 35px; }
  
  .reference .tz-flex-grid>.grid {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
    grid-auto-rows: minmax(300px, auto) !important;
  }
  
  /* Slickline services */
  .slickline-image-left { width: 40%;   margin-right: 40px;}
  
  .units-container {
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 30px;
  }
  
  /* Well testing */
  .well-testing-content {   gap: 40px; }
  
  .well-testing-image { flex: 0 0 40%; }
  
  .package-grid {  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px;}

}

/* 1150px */
@media screen and (max-width: 1150px) {
  
  .reference .tz-flex-grid>.grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
    grid-auto-rows: minmax(300px, auto) !important;
  }
  
  .custombloc-1 .infotxt {   padding: 0 30px 0 50px !important;  }
  
  .custombloc-3 .infotxt {   padding: 50px 25px 0 60px; }
  
  .wrapper-home h2 {    font-size: 43px;}
  
  .bloc2 .bx h3 {    font-size: 28px; }
  
  h3, .h3 {  font-size: 31px; }
  
  .bloc2 .bx:after { right: -60px;  }
  
  .bloc6 .bloc { padding: 40px 28px;}
  
  .footer .grid-child { max-width: 90%;   font-size: 24px;}
  
  .footer h3 { font-size: 35px;}
  
  /* Header */
  .container-header .tophead .container-nav { width: 70% !important; }
  
  .bloc6 .audio-reader-btn {   top: 21px;   right: 30%; left:unset;}
  
  .custombloc-1 .audio-reader-btn, .custombloc-3 .audio-reader-btn { right: 30%; left:unset }

  .page-header { top: -90px; }

  .contactp .blocf p {  flex-wrap: wrap;     gap: 6px;}

  
.contactp .blocf p i { font-size: 24px;}
}

/* 1090px */
@media screen and (max-width: 1090px) {
  
.container-header .tophead .container-nav { width: 70% !important; }
  
.bloc6 .audio-reader-btn { top: 37px; right: 27%; left:unset;  }
  
.custombloc-1 .audio-reader-btn{ right: 39%; left:unset; top:9px}
  
.custombloc-3 .audio-reader-btn { right: 39%; left: unset; top: 44px;  }
  
.custombloc-3 .infotxt {padding: 9px 25px 0 35px;}
  
.custombloc-1 .infotxt ul { margin: 14px 0 0 20px;}

.wrapper-home .grid-child a {  font-size: 23px; }

.bloc2 .bx h3 {  font-size: 26px; }  
  
.epf-section.operations-maintenance-section h3, h3, .h3 {  font-size: 28px; } 
 header.header .tophead { margin-top: -15px;}

}

/* 1080px */
@media screen and (max-width: 1080px) {
  h1, .h1 { font-size: 36px; }
  
  h2, .h2 { font-size: 38px;}
  
.bloc2 .bx:after {   right: -46px; }
  
.mod_jo_slideshow .slide-content {  top: 54%;}

.container { max-width: 93%;  }

.bloc6  .grid-child.container-top-a { grid-template-columns: repeat(2, 1fr);}  
  
body { font-size: 21px;} 

.mplt-text-left { margin-top: 0;}

.objectives-section h3 {font-size: 28px;}  

.package-item h3,
.well-testing-section .service-text h3, .solution-item h3 { font-size: 20px;} 

.package-header h2 {font-size: 28px;}

 .epf-section .main-image { right: 0;} 


  .com_tz_portfolio_plus.view-portfolio .tpp-bootstrap .card h2.tpp-item-title.name {
    font-size: 24px;
}
    .page-header {
        top: -60px;
    }
}

/* 1024px - Tablettes paysage / petits ordinateurs */
@media screen and (max-width: 1024px) {
  
  .container {  max-width: 100%;  }
  
  /* Header et navigation */
  .header-inner .col-sm-10 {  padding-right: 0;  flex: 0 0 33%;  max-width: 33%;   }
  
  .header-inner .col-sm-2 {    flex: 0 0 67%;    max-width: 67%; }
  
  .nav-menu.navmenu2 {   padding: 0;   display: block;  }
  
  nav#navigation.nav-top1 { display: block; }
  
  nav.mobile-nav { display: block; padding: 10px; position: absolute; right: 0; margin: 0;  top: 55px;}
  
  .is-sticky nav.mobile-nav { top: 10px; }
  
  .topheader { padding: 0; }
  
  nav.mobile-nav a {  color: white; }
  
  .container-header .tophead .grid-child:before { width: 370px !important; height: 110px !important; }
  
  /* Images */
  .img-left,
  .img-right {
    float: none;
    display: table;
    margin: 0 auto 40px;
    max-width: 100%;
  }
  
  /* Custom blocs */
  .custombloc-3 .grid-child,
  .custombloc-1 .container-fluid,
  .custombloc-3 .container-fluid,
  .custombloc-1 .grid-child {
    flex-direction: column;
  }
  
  .custombloc-3 .grid-child {padding: 0 20px;}
  
  .custombloc-1 .infotxt,
  .custombloc-3 .infotxt {
    width: 100%;
    padding: 0 20px !important;
  }
  
  .custombloc-1 .photo-right,
  .custombloc-3 .photo-right {
    width: 100%;
    padding-top: 20px;
    text-align: center;
  }


  /* Adaptation des animations pour disposition colonne */
  .custombloc-3 .photo-right {
    transform: translateY(-30px);
    animation: slideInTop 0.8s ease 0.3s forwards;
  }
  
  .custombloc-3 .infotxt {
    transform: translateY(30px);
    animation: slideInBottom 0.8s ease 0.6s forwards;
  }
  
  
  /* Ajustement des effets de survol */
  .custombloc-3 .grid-child::before {
    background: linear-gradient(135deg, transparent 0%, transparent 30%, rgba(22, 96, 136, 0.03) 30%, rgba(74, 111, 165, 0.03) 100%);
  }
  
  /* Slider */
  .mod_jo_slideshow .slide-content {top: 50%; right: 35px; }
  
  /* Audio reader */
  .audio-reader-btn {
    display: block;
    margin: 15px auto;
    position: static;
    opacity: 1;
    animation: none;
  }
  
  [class^="custombloc-"] .infotxt:hover .audio-reader-btn {
    opacity: 1;
  }
  
  /* Animations réduites */
  .custombloc-1 .photo-right { transition-delay: 0.2s !important;}
  
  .custombloc-1 .infotxt { transition-delay: 0.3s !important;}
  
  .custombloc-1 .infotxt h2 { transition-delay: 0.4s !important;}
  
  .custombloc-1 .infotxt ul { transition-delay: 0.5s !important; }
  
  .custombloc-1 .infotxt ul li,
  .custombloc-1 .infotxt ul li::before { transition-delay: 0.6s !important; }
  
  .custombloc-1 a.link { transition-delay: 0.7s !important;}
  
  .custombloc-1 .audio-reader-btn { transition-delay: 0.8s !important;}
  
  /* EPF Section */
  .epf-section .epf-setup-with-images {
    grid-template-columns: 1fr;  gap: 40px;
  }
  
  .epf-section .stacked-images-container { height: 500px; }
  
  /* Marginal Field */
  .epf-section.marginal-field-section .stories-grid { gap: 25px;}
  
  .epf-section.marginal-field-section .planning-card-with-icon { padding: 35px;}
  
  /* Operations & Maintenance */
  .epf-section.operations-maintenance-section .om-intro-section,
  .epf-section.operations-maintenance-section .strength-content-wrapper,
  .epf-section.operations-maintenance-section .hseq-content-wrapper {
    grid-template-columns: 1fr;  gap: 30px;}
  
  .epf-section.operations-maintenance-section .services-grid { grid-template-columns: repeat(2, 1fr);}
  
  .epf-section.operations-maintenance-section .om-intro-content { padding-right: 0;}
  
  .epf-section.operations-maintenance-section .hseq-content-wrapper {  display: flex; flex-direction: column;}
  
  .epf-section.operations-maintenance-section .hseq-text {  order: 1;}
  
  .epf-section.operations-maintenance-section .hseq-image {order: 2;  }

  .custombloc-1 .audio-reader-btn{right: 66%;left:unset;top: -3px;}
  
.custombloc-3 .audio-reader-btn {right: 65%;left: unset;top: 21px;}

.bloc6 .audio-reader-btn {top: 25px;right: 31%;left:unset;}

  .epf-section.operations-maintenance-section .hseq-section {margin: 0px 0 50px;}
}

/* 992px - Tablettes */
@media screen and (max-width: 992px) {
  /* Bloc 6 */
  .grid-child.container-top-a {  grid-template-columns: repeat(2, 1fr);}
  
  .bloc6 .boc3 { grid-column: span 2;}
  
  .bloc6 h2 { font-size: 40px;}
  
  .bloc6 .container p { font-size: 24px;}
  
  .bloc6 .bloc h3 {  font-size: 24px;}
  
  /* Slickline services */
  .slickline-main-container { margin-bottom: 60px; }
  
  .slickline-image-left { float: none;  width: 100%; max-width: 600px;  margin: 0 auto 40px;  display: block;}
  
  .slickline-content-right { padding-top: 0;}
  
  .slickline-content-right .page-title {  font-size: 36px;  text-align: center;}
  
  /* Units section */
  .units-section {padding: 60px 0;}
  
  .units-container { grid-template-columns: 1fr; max-width: 800px;}
  
  /* Well testing */
  .well-testing-content { flex-direction: column; gap: 40px; }
  
  .well-testing-image { flex: none; width: 100%;  max-width: 600px;  margin: 0 auto;}
  
  .package-section { padding: 40px; }
  
  .package-header h2 { font-size: 28px; }
  
  /* MPLT */
  .mplt-container-alt { margin-bottom: 40px; }
  
  .mplt-image-right {  float: none;  width: 100%;  max-width: 600px;  margin: 0 auto 40px;  display: block;}
  
  .mplt-text-left { padding-top: 20px;}
  
  .mplt-text-left h1 { text-align: center;}
  
  .mplt-bottom-image { padding: 0 15px;}
  
  /* Who We Are */
  .who-we-are-text.overlap-more { padding: 40px 30px; margin-right: -3%; }
  
  /* Custom blocs animations */
  .custombloc-3 {  padding: 0 0 70px;}
  
  .custombloc-3 .infotxt h2 { margin: 20px 0 25px; }
  
  .custombloc-3 .link { padding: 8px 0; margin-top: 15px;}
  
  .custombloc-3 .link:hover { padding: 8px;}
  
  /* Our Vision */
  .our-vision-section { padding: 60px 0; }
  
  .our-vision-container { flex-direction: column;  gap: 40px;}
  
  .our-vision-image { order: 1; width: 100%; }
  
  .our-vision-content {order: 2; padding: 0;}

  .com_tz_portfolio_plus.view-portfolio .tpp-bootstrap .card h2.tpp-item-title.name { font-size: 22px;}

  .com_tz_portfolio_plus.view-portfolio .tpp-bootstrap .bg-transparent { width: 50% !important;}


  .view-article .container-banner .mod-custom img {
    width: 100%;
    height: 290px;
}
}

/* 991px */
@media screen and (max-width: 991px) {
  
  header.header .mod_jo_slideshow .slide-content {font-size: 35px !important; }
  
  .container-header .tophead .container-nav, 
  .container-header .tophead .navbar-brand {   width: 50% !important; }
  
  .blocf { margin: 0 0 40px;}
  
  .bloc2 .bx { text-align: center;    width: 20%;}
  
  .bloc2 .grid-child {  justify-content: center;  gap: 50px;  flex-wrap: wrap;}
  
  /* Menu mobile styles - gardé séparé pour clarté */
  header.header .sf-menu:not(.mobile-active) {  display: none !important;}
  
  .menu-toggle { display: block!important;}
  
  .sf-menu.mobile-active {
    display: block !important;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(20, 22, 25, 0.95);
    z-index: 9999;
    padding: 20px 0;
    max-height: 100vh;
    overflow-y: auto;
    z-index: 2222222;
  }
  
  .sf-menu.mobile-active>li {
    float: none !important;
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;
  }
  
  .sf-menu.mobile-active li {
    display: block;
    padding: 12px 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }
  
  .sf-menu.mobile-active li.item-146,
  .sf-menu.mobile-active li.item-147 {
    margin-left: 0 !important;
    padding: 12px 20px !important;
    background: none !important;
    border-radius: 0 !important;
  }
  
  .sf-menu.mobile-active a,
  .sf-menu.mobile-active span.separator {
    font-size: 23px !important;
    padding: 10px 0;
    color: #fff !important;
    width: 100%;
    display: block;
  }
  
  .sf-menu.mobile-active li:before {  display: none; }
  
  .container-header .mod-menu li.nav-item.item-116 {
    position: relative;
    inset: unset;
    background: none;
    height: auto;
  }
  
  .sf-menu.mobile-active ul {
    position: static !important;
    display: none;
    background: rgba(0, 0, 0, 0.3);
    margin-left: 20px !important;
    box-shadow: none;
    padding-left: 0;
  }
  
  .sf-menu.mobile-active ul li { padding-left: 30px !important; }
  
  .sf-menu.mobile-active li.has-submenu>a { position: relative;}
  
  .sf-menu.mobile-active li.has-submenu>a:after {
    content: '▼';
    position: absolute;
    right: 20px;
    font-size: 12px;
    transition: transform 0.3s;
  }
  .sf-menu.mobile-active li.has-submenu.active>a:after {  transform: rotate(180deg);}
  
  .sf-menu.mobile-active li.has-submenu.active ul { display: block !important;}
  
  .container-header .tophead {  position: relative;  height: auto; min-height: 80px;}
  
  .container-header .tophead .grid-child {
    display: flex;  align-items: center; justify-content: space-between;  padding: 15px 0; position: relative;
  }
  
  .container-header .tophead .navbar-brand { width: auto; z-index: 1001; }
  
  .container-header .tophead .container-nav { width: auto; padding: 0;}
  
  /* Custom bloc animations réduites */
  .custombloc-3 .photo-right { animation: slideInTop 0.7s ease 0.2s forwards;}
  
  .custombloc-3 .infotxt { animation: slideInBottom 0.7s ease 0.4s forwards;}
  
  .custombloc-3 .infotxt p {animation: fadeInUp 0.6s ease 0.6s forwards;}
  
  .custombloc-3 .link {  animation: fadeInUp 0.6s ease 0.8s forwards;}
  
  /* Who We Are */
  .who-we-are-container { flex-direction: column; min-height: auto;}
  
  .who-we-are-text.overlap-more {
    width: 100%;
    margin: 0px auto 0;
    padding: 40px 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    border-radius: 0px;
    z-index: 2;
    position: relative;
  }
  
  .who-we-are-image {
    width: 100%;
    height: 50vh;
    min-height: 400px;
    border-radius: 0;
  }
  .who-we-are-image img { border-radius: 0;}

  .reference .tz-flex-grid>.grid {
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)) !important;
    justify-content: center !important;
    justify-self: center !important;
  }

  /* Our People */
  .our-people-container { flex-direction: column;  gap: 40px;}
  
  .our-people-image { width: 100%; }
  
  .our-people-content { width: 100%; padding: 0;}
  
  .our-people-section.classic-layout .our-people-container { padding: 0 15px; }
  
  .our-people-section.classic-layout .our-people-image {  float: none;  width: 100%;  margin: 0 0 30px 0;  max-height: 350px;}

  .vision-content-1 { width: auto; padding: 0;flex: auto;}

  .vision-image-container {width: auto; flex: auto;}

  .objectives-section {width: auto;}
  
  .well-testing-content {margin-bottom: 20px;}

.row.contactp .col-md-4, .row.contactp .col-md-8 { width: 100%;}

header.header .tophead { margin-top: -25px;} 

.container-header .tophead .grid-child:before {width: 480px !important;height: 110px !important;}
}

@media screen and (max-width: 896px) {
  
.custombloc-3 .audio-reader-btn {right: 60%;left: unset;top: 15px;}

.wrapper-home .custombloc-1 .grid-child, .wrapper-home .custombloc-3 .grid-child {  max-width: 95%;}

.bloc6 .audio-reader-btn {top: 21px;right: 26%;left:unset;}

 .contactp .blocf { padding: 25px 15px 25px 10px; font-size: 16px; overflow: hidden;}
 
  .com_tz_portfolio_plus.view-portfolio .tpp-bootstrap .bg-transparent { width: auto !important;}

  .tpp-item-page__inner div#tz-portfolio-template-media, .tpp-item-page__inner div#tz-portfolio-template-body { width: auto;}

  .desc2 { margin: 441px auto 0;}
}


/* 860px - Tablettes portrait */
@media screen and (max-width: 860px) {
  
  .custombloc-3 .photo-right img { max-height: 400px;  width: 100%; object-fit: cover;}
  
  .custombloc-3 .infotxt { padding: 0 15px; }
  
  .custombloc-3 .photo-right { transform: translateY(-20px);}
  
  .custombloc-3 .infotxt {  transform: translateY(20px);}

  .custombloc-1 .audio-reader-btn{right: 60%;left:unset;top: -6px;}
  .custombloc-3 .audio-reader-btn {right: 50%;left: unset;top: 15px;}

.bloc6 .audio-reader-btn {top: 21px;right: 0;left:unset;}

.epf-section .epf-intro-simple p { font-size: 29px;}

  .view-article .container-banner .mod-custom img {   height: 305px;  }
  
}

/* 768px - Phablettes */
@media screen and (max-width: 768px) {
  
  body { font-size: 18px !important; }
  
  h1, .h1 { font-size: 32px;}
  
  h2, .h2 { font-size: 28px;}
  
 .epf-section.operations-maintenance-section h3, h3, .h3 {  font-size: 24px;   }
  
  .wrapper-home { padding: 40px 0 0 !important;}
  
  /* Bloc 2 */
  .bloc2 .bx { width: 33%;}
  
  /* Bloc 6 */
  .grid-child.container-top-a { grid-template-columns: 1fr; gap: 20px; }
  
  .bloc6 .boc3 {grid-column: 1; }
  
  .bloc6 h2 {  font-size: 32px;  text-align: center;  }
  
  .bloc6 h2::after {  left: 50%;  transform: translateX(-50%);}
  
  .bloc6 .container p { font-size: 20px; text-align: center; padding-top: 20px;}
  
  .bloc6 .bloc {  padding: 35px 25px;}
  
  .bloc6 .bloc:hover {  transform: translateY(-10px);}
  
  .bloc6 .bloc::after { font-size: 60px;}
  
  /* Header */
  .container-header .tophead .container-nav,
  .container-header .tophead .navbar-brand { width: auto !important;}
  
  /* Audio reader */
  .audio-reader-btn {  width: 38px;  height: 38px;  font-size: 16px;  margin: 10px auto;}
  
  .audio-reader-btn::before {  font-size: 10px;  top: -25px;}
  
  /* Animations simplifiées pour mobile */
  .custombloc-1,
  .custombloc-1 .photo-right,
  .custombloc-1 .infotxt,
  .custombloc-1 .infotxt h2,
  .custombloc-1 .infotxt ul,
  .custombloc-1 .infotxt ul li,
  .custombloc-1 .infotxt ul li::before,
  .custombloc-1 a.link,
  .custombloc-1 .audio-reader-btn,
  .custombloc-1 .infotxt p strong {
    transition-delay: 0.2s !important;
    transition-duration: 0.5s !important;
  }
  
  .custombloc-1::before { display: none;}
  
  /* Custom bloc 3 */
  .custombloc-3 { padding: 0 0 50px;}
  
  .custombloc-3 .grid-child { padding: 0 15px;}
  
  .custombloc-3 .photo-right {padding-top: 20px; margin-bottom: 20px;}
  
  .custombloc-3 .grid-child::before { display: none;}
  
  .custombloc-3 .infotxt p strong::before {  display: none; }
  
  .custombloc-3 .photo-right img { transition: none; }
  
  .custombloc-3 .photo-right:hover img { transform: none; }


.bloc6  .grid-child.container-top-a {  grid-template-columns: repeat(1, 1fr);  justify-items:center;  justify-content: center;}    
.bloc6 .audio-reader-btn {top: 21px;right: 0;left:unset;}
  
  .custombloc-1 .audio-reader-btn{right: 45%;left:unset;top: 0px;}
  /* Package grid compact */
  .package-grid.compact {  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));}
  
  /* EPF Section */
  .epf-section .epf-container {  padding: 30px 15px; }
  
  .epf-section .setup-title-section h2,
  .epf-section .turnkey-header-simple h2,
  .epf-section .commercial-models-header h2 { font-size: 23px; }
  
  .epf-section .stacked-images-container {  height: 400px;}
  
  .epf-section .setup-list,
  .epf-section .models-list {padding: 20px;}
  
  /* Marginal Field */
  .epf-section.marginal-field-section { padding: 40px 0;}
  
  .epf-section.marginal-field-section .marginal-field-header h2 {font-size: 22px; }
  
  .epf-section.marginal-field-section .stories-grid { grid-template-columns: 1fr; gap: 20px;}
  
  .epf-section.marginal-field-section .story-card { padding: 25px;}
  
  .epf-section.marginal-field-section .story-card-content h4 {font-size: 21px;}
  
  .epf-section.marginal-field-section .planning-card-with-icon {flex-direction: column;  text-align: center;   gap: 25px;    padding: 30px; }
  
  .epf-section.marginal-field-section .planning-main-icon { width: 70px; height: 70px;  font-size: 2.5rem;}

  
  /* Operations & Maintenance */
  .epf-section.operations-maintenance-section { padding: 0; margin: 30px 0;}
  
  .epf-section.operations-maintenance-section .services-grid { grid-template-columns: 1fr;  gap: 20px;}
  
  .epf-section.operations-maintenance-section .strength-section,
  .epf-section.operations-maintenance-section .hseq-section { padding: 25px;}
  
  .epf-section.operations-maintenance-section .trust-card {  padding: 30px 25px;}
  
  .epf-section.operations-maintenance-section .om-image-wrapper img {  height: 250px;}
  
  /* Slickline Services */
  .slickline-services-section { padding: 40px 0; }
  
  .slickline-main-container { padding: 0 15px; margin-bottom: 50px;}
  
  .slickline-content-right .page-title { font-size: 32px;}
  
  .services-section { padding: 25px;}
  
  .slickline-services-section .services-section h2 {  font-size: 22px;}
  
  .service-item {padding: 12px;  gap: 15px; }
  
  .service-text h3 { font-size: 16px;}
  
  .units-section {  padding: 50px 0; }
  
  .units-container {padding: 0 15px;}
  
  .unit-header { padding: 20px;  flex-direction: column;  align-items: flex-start;   gap: 10px;}
  
  .unit-header h2 { font-size: 24px;}
  
  .unit-content { padding: 25px; }
  
  .unit-details li {padding-left: 25px; }
 
  /* MPLT */
  .mplt-section-alt { padding: 40px 0;  }
  
  .mplt-container-alt { padding: 0 15px; }
  
  .mplt-text-left h1 { font-size: 30px;}
  
  /* Well Testing */
  .well-testing-section { padding: 40px 0;}
  
  .well-testing-container { padding: 0 15px; }
  
  .service-item {padding: 15px;}
  
  .slickline-services-section .service-text h3 { line-height: 1; }
  
  .solutions-section h2 { font-size: 24px;}
  
  .solution-item h3 { font-size: 18px; }
  
  .standards-section {  padding: 25px;}
  
  .package-section { padding: 30px; border-radius: 15px;}
  
  .package-header h2 { font-size: 26px; }
  
  .package-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px;}
  
  .package-item {  padding: 20px;}
  
  .package-item h3 { font-size: 16px; }
  
  /* Strategic Vision */
  .strategic-vision-section {  padding: 30px 0;}
  
  .strategic-vision-container { padding: 0 15px;  }
  
  .vision-image-container {  margin-bottom: 40px;  border-radius: 15px;}
  
  .vision-content > p { margin-bottom: 40px;}
  
  .objectives-section { padding: 25px; margin-bottom: 40px; }
  
  .objectives-section h3 {  font-size: 24px;  margin-bottom: 20px;}
  
  .objectives-section li { padding-left: 30px;   margin-bottom: 12px;}
  
  .strategic-vision-section.image-left .strategic-vision-container { flex-direction: column; gap: 40px;}
  
  .strategic-vision-section.image-left .vision-image-container { max-width: 100%;}
  
  .view-article .container-banner .mod-custom img {  height: 249px;}

  .epf-section .epf-intro-simple p { font-size: 25px;}
}


@media screen and (max-width: 698px) {
  
  .custombloc-1 .audio-reader-btn{right: 35%;left:unset;top: -6px;}
  
  .custombloc-3 .audio-reader-btn {right: 35%;left: unset;top: 15px;}
  
  .container-header .tophead .grid-child:before{  width: 410px !important;   height: 110px !important; }
}

/* 600px - Mobiles larges */
@media screen and (max-width: 600px) {
  .bloc2 .bx {  width: 50%;}
  
  .container-header .tophead .container-nav {   width: 20% !important;  }
  
  .container-header .tophead .navbar-brand {   width: 70% !important; }
  
  .mod_jo_slideshow .slide-content {   font-size: 30px;   top: 40%; line-height:1.1}

  .bloc2 .bx:after{content:none}

  
  .container-header .tophead .grid-child:before {width: 450px !important;height: 94px !important;}
}


/* 575px - Smartphones */
@media screen and (max-width: 575px) {

.container-banner .customslider .mod_jo_slideshow .swiper-pagination-bullet {
  width: 15px !important;
  height: 15px !important;
}

.container-banner .customslider .mod_jo_slideshow .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 20px !important;
  height: 20px !important;
}
  
  .custombloc-3 .link {  padding: 6px 0;}
  
  .custombloc-3 .link:hover { padding: 6px;  transform: translateY(-2px); }
  
 .custombloc-3 .photo-right { transform: translateY(-15px);}
  
  .custombloc-3 .infotxt {  transform: translateY(15px); }
  
  .custombloc-3 .infotxt p {  transform: translateY(10px);  }
  
  /* Audio reader */
  .audio-reader-btn {  width: 36px;  height: 36px; font-size: 15px;}
  
  /* Slickline Services */
  .slickline-content-right .page-title { font-size: 28px; }
  
  .services-section { padding: 20px;  border-radius: 12px;}
  
  .service-icon {  margin-top: 0;}
  
  /* Well Testing */
  .well-testing-section {  padding: 30px 0;}
  
  .service-item { flex-direction: column; align-items: flex-start; gap: 15px;}
  
  .solutions-section h2 { font-size: 22px; }
  
  .package-section { padding: 25px; }
  
  .package-header h2 {   font-size: 24px; }
  
  .package-grid {  grid-template-columns: 1fr;}
  
  .package-item { padding: 15px; }

  .mod_jo_slideshow .slide-content p{  font-size: 25px; }
  
  .bloc6 .audio-reader-btn{ top: 55px;}
  
  .wrapper-home { font-size: 20px !important; }
  
  .wrapper-home h2 {font-size: 32px; }
  
.page-header {  top: -61px; }  

    h1, .h1 { font-size: 28px; }
  
  .container-header .tophead .grid-child:before {  width: 480px !important;  height: 100px !important; }

  
}

@media screen and (max-width: 538px) {

  header.header .mod_jo_slideshow .slide-content {display:none!important;}
    .container-header .tophead .grid-child:before {
        width: 400px !important;
        height: 100px !important;
    }
}

/* 480px - Mobiles petits */
@media screen and (max-width: 480px) {
  
  /* Header */
  .container-header .tophead .grid-child { flex-direction: row;}
  
  .container-header .tophead .navbar-brand { width: 70%; text-align: left; }
  
  .container-header .tophead .container-nav {  width: 30%;}
  
  .bloc2 .bx:after {  content: none;}
  
  .bloc2 .bx {  width: 100%;}
  
  .container-header .tophead .navbar-brand {  width: 60% !important;}
  
  .container-header .tophead .container-nav { width: 40% !important; }
  
  /* Menu mobile */
  .sf-menu.mobile-active {
    position: fixed;
    top: 80px;
    bottom: 0;
    left: 0;
    right: 0;
    max-height: calc(100vh - 80px);
  }
  
  .sf-menu.mobile-active a,
  .sf-menu.mobile-active span.separator {
    font-size: 18px !important;
  }
  
  .menu-toggle {  right: 10px; top: 25px;}
  
  /* Bloc 6 */
  .bloc6 { padding: 40px 15px; }
  
  .bloc6 h2 { font-size: 28px;}
  
  .bloc6 .container p { font-size: 18px;}
  
  .bloc6 .bloc {  padding: 25px 20px;}
  
  .bloc6 .bloc::after {  font-size: 50px;  bottom: -15px;  right: -15px;}
  
  /* Custom bloc 3 */
  .custombloc-3 { padding: 0 0 40px;}
  
  .custombloc-3 .grid-child { padding: 0 10px;}
  
  .custombloc-3 .infotxt {padding: 0 10px;}
  
  .custombloc-3 .link { display: block; width: 100%; text-align: center; padding: 8px 0;}
  
  .custombloc-3 .link:hover { padding: 8px;}
  
  .custombloc-3 .link::before { display: none; }
  
  .custombloc-3 .link:hover { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);}
  
  .custombloc-3 .photo-right {   animation: slideInTop 0.5s ease 0.1s forwards; }
  
  .custombloc-3 .infotxt {  animation: slideInBottom 0.5s ease 0.3s forwards;}
  
  .custombloc-3 .infotxt p {  animation: fadeInUp 0.5s ease 0.5s forwards; }
  
  .custombloc-3 .link { animation: fadeInUp 0.5s ease 0.7s forwards; }
  
  /* Package grid compact */
  .package-grid.compact { grid-template-columns: repeat(2, 1fr) }
  
  /* EPF Section */
  .epf-section .stacked-images-container {   height: 350px; }
  
  .epf-section .setup-title-section h2,
  .epf-section .turnkey-header-simple h2,
  .epf-section .commercial-models-header h2 { font-size: 22px;}
  
  /* Marginal Field */
  .epf-section.marginal-field-section .marginal-field-header h2 {   font-size: 23px; }  
  
  .epf-section.marginal-field-section .success-stories-header h3 { font-size: 21px;}
  
  .epf-section.marginal-field-section .story-card { padding: 20px; }
  
  .epf-section.marginal-field-section .planning-card-with-icon { padding: 25px;  }
  
  .epf-section.marginal-field-section .planning-main-icon { width: 60px;  height: 60px; font-size: 2rem;}
  
  /* Operations & Maintenance */
  
  .epf-section.operations-maintenance-section .services-header h3,
  .epf-section.operations-maintenance-section .strength-header h3,
  .epf-section.operations-maintenance-section .hseq-header h3 {
    font-size: 20px;
  }
  
  .epf-section.operations-maintenance-section .service-card { padding: 25px 20px; }
  
  .epf-section.operations-maintenance-section .trust-header h3 { font-size: 20px; }
  
  .epf-section.operations-maintenance-section .om-image-wrapper img {height: 200px;}
  
  /* Units section */
  .units-section {  padding: 40px 0;}
  
  .unit-card {   border-radius: 12px; }
  
  .unit-header {  padding: 15px 20px;}
  
  .unit-header h2 {  font-size: 22px;}
  
  .unit-content { padding: 20px;}
  
  .unit-details li { padding-left: 22px; }
  
  /* Strategic Vision */
  .strategic-vision-section { padding: 20px 0; }
  
  .vision-image-container {  margin-bottom: 30px;}
  
  .objectives-section {  padding: 20px;   margin-bottom: 30px; }
  
  .objectives-section h3 { font-size: 22px;}
  
  .objectives-section li { padding-left: 25px;}
  
  /* Our People */
  .our-people-section {  padding: 40px 0;}
  
  .our-people-container { padding: 0 15px; gap: 30px; }
  
  /* MPLT */
  .mplt-text-left h1 { font-size: 26px;}
  
  /* Who We Are */
  .who-we-are-text.overlap-more { padding: 30px 15px;  }
  
  .who-we-are-text ul {  padding-left: 15px;}
  
  .who-we-are-image { min-height: 300px;}
  
  /* Contact */
  .contactp .blocf { padding: 25px; }
  
  .contactp .blocf::before { top: 15px;  bottom: 15px;}

  .footer-section .footer-title, .footer-section .nav-item a, 
  .footer-section .footer-grid {font-size: 16px;}
  .footer-section .social-icon i {  font-size: 32px; }
}

/* 425px - Très petits mobiles */
@media screen and (max-width: 425px) {
  
  .custombloc-3 {  padding: 0 0 40px;}
  
  .custombloc-3 .grid-child { padding: 0 10px; }
  
  .custombloc-3 .infotxt { padding: 0 10px; }
  
  .custombloc-3 .link {  display: block; width: 100%;  text-align: center; padding: 8px 0;}
  
  .custombloc-3 .link:hover {   padding: 8px; }
  
  /* Optimisation pour les petits écrans - réduction des effets */
  .custombloc-3 .link::before {   display: none; /* Effet de brillance désactivé sur mobile */ }
  
  .custombloc-3 .link:hover { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);}
  
  /* Réduction des délais d'animation */
  .custombloc-3 .photo-right { animation: slideInTop 0.5s ease 0.1s forwards; }
  
  .custombloc-3 .infotxt {animation: slideInBottom 0.5s ease 0.3s forwards; }
  
  .custombloc-3 .infotxt p {animation: fadeInUp 0.5s ease 0.5s forwards; }
  
  .custombloc-3 .link { animation: fadeInUp 0.5s ease 0.7s forwards;}
  
  .custombloc-1 .audio-reader-btn{right: 0%;left:unset;top: -6px;}
  
  .custombloc-3 .audio-reader-btn {right: 0;left: unset;top: 15px;}

  .container-header .tophead .grid-child:before { width: 340px !important; height: 83px !important; }
  
  
  .view-article .container-banner .mod-custom img { height: 200px;  }
}

@media screen and (max-width: 390px) {
  
header.header .tophead {margin-top: -34px;} 
  
.container-header .tophead .grid-child:before { width: 290px !important;  height: 83px !important; }
}

/* Support pour préférences de réduction de mouvement */
@media (prefers-reduced-motion: reduce) {
  .mod-custom.custom,
  .custombloc-3 .photo-right,
  .custombloc-3 .infotxt,
  .custombloc-3 .infotxt p,
  .custombloc-3 .link,
  .audio-reader-btn,
  .audio-reader-btn.playing,
  .reading-highlight,
  .bloc2 .bx,
  .bloc2 .bx:before,
  .bloc2 .bx h3,
  .bloc2 .bx h3:after {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
  
  .custombloc-1,
  .custombloc-1 .photo-right,
  .custombloc-1 .infotxt,
  .custombloc-1 .infotxt h2,
  .custombloc-1 .infotxt ul,
  .custombloc-1 .infotxt ul li,
  .custombloc-1 .infotxt ul li::before,
  .custombloc-1 a.link,
  .custombloc-1 .audio-reader-btn,
  .custombloc-1 .infotxt p strong,
  .custombloc-1 .photo-right img,
  .custombloc-1 .reading-highlight,
  .custombloc-1 .infotxt ul li.reading-highlight,
  .custombloc-1::before {
    transition: none !important;
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
  
  .custombloc-1.visible,
  .custombloc-1.visible .photo-right,
  .custombloc-1.visible .infotxt,
  .custombloc-1.visible .infotxt h2,
  .custombloc-1.visible .infotxt ul,
  .custombloc-1.visible .infotxt ul li,
  .custombloc-1.visible .infotxt ul li::before,
  .custombloc-1.visible a.link,
  .custombloc-1.visible .audio-reader-btn,
  .custombloc-1.visible .infotxt p strong {
    opacity: 1 !important;
    transform: none !important;
  }
  /* Désactiver l'effet de révèlation */
  .custombloc-1::before {
    display: none;
  }
}

/* ==========================================================================
   ANIMATIONS KEYFRAMES (regroupées à la fin)
   ========================================================================== */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInUpIcon {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInUpText {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes expandBar {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInTop {
  from {
    opacity: 0;
    transform: translateY(-30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideInBottom {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(231, 76, 60, 0.7);
  }
  70% {
    box-shadow: 0 0 0 12px rgba(231, 76, 60, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(231, 76, 60, 0);
  }
}

@keyframes title-line {
  from {
    width: 0;
  }
  to {
    width: 80px;
  }
}

@keyframes bloc-hover-lift {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-15px);
  }
}

@keyframes bloc-hover-color {
  0% {
    background-color: #0059ad;
  }
  100% {
    background-color: #e3ab01;
  }
}

@keyframes icon-rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes textHighlight {
  0% {
    background-color: rgba(255, 215, 0, 0.15);
  }
  100% {
    background-color: rgba(255, 215, 0, 0.3);
  }
}

@keyframes listItemHighlight {
  0% {
    background-color: rgba(0, 89, 173, 0.15);
  }
  100% {
    background-color: rgba(0, 89, 173, 0.25);
  }
}

@keyframes highlightPulse {
  from {
    background-color: rgba(255, 255, 200, 0.3);
  }
  to {
    background-color: rgba(255, 255, 220, 0.5);
  }
}

@keyframes bloc-enter {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}