:root{
  --amex-blue: #00175A;
  --accent-blue: #006FCF;
  --light-blue: #66A9E2;
  --muted: #DDD;
  --grey: #CCC;
  --white: #fff;
  --shadow-1: 10px 9px 0px -3px rgba(193,220,243,1);
  --shadow-soft: 10px 10px 15px -10px rgba(0,0,0,0.43);
  --sticky-shadow: 0 10px 30px rgba(0,0,0,0.25);
  --font-benton: BentonSans, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

/* global */
#amex-header { display: none; }

html { scroll-behavior: smooth; }

/* headings */
h2{
  font-weight:600;
  font-size:1.3rem;
  color:var(--amex-blue);
  padding:25px 0;
  line-height:1.3rem;
}
@media screen and (min-width:768px){
  h2{ font-size:2.3rem; line-height:2.3rem; padding:25px 0; }
}

/* utility */
.sticky-bottom{
  position:fixed!important;
  width:100%;
  z-index:1000;
  bottom:0;
  box-shadow:var(--sticky-shadow);
  background-color:var(--white);
}

.pad-top-1{ margin-top:-45px; }
.pad-top-2{ margin-top:45px; }

.img-pad-top,
.img-pad-top-1{
  position:relative;
  z-index:10;
}
.img-pad-top{ margin-top:-105px; }
.img-pad-top-1{ margin-top:-150px; }
.img-pad-top-afg { margin-top: -156px; position: relative; z-index: 10; }

.barre-de-fond{ background-color:var(--light-blue) !important; }

/* boxed components */
.blue-round{
  border:2px solid var(--amex-blue);
  background:var(--amex-blue);
  border-radius:5px;
  margin:10px;
}

.blue-round-2{
  background:var(--white) !important;
  border:2px solid #dddddd;
  border-radius:10px;
  margin:5px;
  min-height:220px;
  box-shadow:var(--shadow-1);
}

.blue-border{
  background:var(--white) !important;
  border:2px solid var(--accent-blue);
  border-radius:30px;
  box-shadow:var(--shadow-soft);
}

.blue-bg{
  background-color:var(--light-blue);
  height:250px;
}

.grey-border{
  background:var(--white) !important;
  border:2px solid var(--grey);
  border-radius:30px;
  margin-top:-225px;
}

/* typography */
.titre-1, .titre-2, .titre-blanc{
  font-size:1.6rem;
  font-family:var(--font-benton);
  font-weight:600;
  text-align:center;
}
.titre-1{ color:var(--accent-blue); }
.titre-2{ color:var(--amex-blue); padding-top:10px; }
.titre-blanc{ color:var(--white); padding-top:10px; }

/* other text styles */
.texte-decale{ margin-left:-100px; padding-top:12px; font-size:1.1rem; }
.sub-title{
  color:#FFF;
  font-size:1.05rem;
  text-align:left;
}
.collapsible-text{ text-align:center!important; }

/* accordion / tabs */
.accordion-content .dls-white-bg{ background-color:var(--amex-blue) !important; }
.tab-app{ border-left:5px solid var(--amex-blue); font-size:.8rem; margin-top:30px; }
.tab-app-active{ border-left:5px solid var(--accent-blue); font-size:.8rem; margin-top:30px; color:var(--accent-blue); }

/* responsive column padding reset for small screens */
@media (min-width:375px){
  .col, [class*=" col-"], [class^=col-]{ padding-left:0!important; padding-right:0!important; }
}

html:has(link[rel="canonical"][href*="/fr-fr/entreprises/cartes-business/avantages/"]),
html:has(meta[property="og:url"][content*="/fr-fr/entreprises/cartes-business/avantages/"]) {
  .col, [class*=" col-"], [class^=col-] {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* desktop adjustments */
@media screen and (min-width:768px){
  .blue-round-2{ margin:25px; }

  .en-tete-bloc-bleu{ font-size:1.4rem; height:65px; }

  .logo-amex{ margin-top:8px!important; }

  .titre-1, .titre-2{ font-size:1.7rem; }

  .sub-title{
    color:#FFF;
    font-size:1.2rem;
    text-align:center;
    font-weight:600;
  }
 

  #menu-header{
    position:fixed!important;
    z-index:1000!important;
    width:100%!important;
  }
}