/* @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); */

@font-face{
    font-family: 'HelveticaNowTextLight';
    src: url("./fonts/HelveticaNowTextLight.otf") format("opentype");
    font-weight: 400;
    font-style:  normal;
    font-display: swap;
}

#carousel-c067 { position: relative; }

#carousel-c067,
#carousel-c067 * {
    font-family: 'HelveticaNowTextLight', sans-serif !important;
}

#carousel-c067 .u-carousel-indicators{
    position: absolute !important;
    left: 50%;
    bottom: 1.75rem;
    transform: translateX(-50%);
    
    display: flex;
    justify-content: center;
    gap: .5rem;
    margin: 0;

    z-index: 5;
}

/* 3. Prev / next arrows vertically centred */
#carousel-c067 .u-carousel-control{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
}

/* 4. Icon image centred horizontally */
#carousel-c067 .u-image-1{
    display:block;
    margin-inline:auto;
    margin-top: 69px;
}

/* 5. Optional: keep text itself centred as well */
#carousel-c067 .u-sheet-1{ 
  text-align:center; 
  min-height: 400px;
}

/* ─── Mobile helper: stack buttons when screen < 768 px ─── */
@media(max-width:767px){
  #carousel-c067 .u-list-1 .u-repeater-1{
      flex-direction:column;
      gap:1rem;
  }
  #carousel-c067 .u-list-1 .u-list-item{ flex:1 1 auto; }
  .info-container {padding: 0rem !important}
}

@media (max-width: 1399px) {
    .u-carousel-item .u-image-1 {
      margin-top: 12px;
    }
  
    .u-carousel-item .u-image-2 {
      margin-top: 73px;
      width: auto;
    }
  
    .u-carousel-item .u-text-1 {
      width: auto;
      margin-left: 61px;
      margin-right: 61px;
    }
  
    .u-carousel-item .u-repeater-1 {
      min-height: 94px;
    }
  }

  #carousel-5989 .u-text-1 {
    margin-left: 85px;
    margin-right: 85px;
}

/* ───  INDICATORS under the copy  ─────────────────── */
#carousel-5989 .u-carousel-indicators {
  position: static !important;   /* drop out of absolute layer */
  margin: 24px auto 0;           /* space above, center horizontally */
  display: flex;                 /* keep dots on one line */
  justify-content: center;
}

#carousel-c067 .u-carousel-item .u-repeater-1{
    margin-bottom: 3.5rem;           /* CTA block sits higher,
                                        leaving room for the indicators */
}

/* 4 ▼  Standardise dot size / spacing (feel free to tweak) */
#carousel-c067 .u-carousel-indicators li{
    width: 10px;
    height: 10px;
    margin: 0 4px;
}

#carousel-c067 .u-btn-1,
#carousel-c067 .u-btn-2 {
    font-family: "HelveticaNowTextLight", sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    letter-spacing: normal !important;

    padding: 0.65rem 1.4rem !important;
    border: 2px solid #000 !important;
    border-radius: 0 !important;

    background-color: #fff !important;
    color: #000 !important;

    transition: background .25s ease, color .25s ease;
}


#carousel-c067 .u-btn-1:hover,
#carousel-c067 .u-btn-2:hover,
#carousel-c067 .u-btn-1:focus,
#carousel-c067 .u-btn-2:focus {
    background-color: #000 !important;
    color: #fff !important;
    outline: none;
}

#carousel-c067 .u-list-1 .u-repeater-1 {
    display: flex !important;          /* override any grid / block fallback   */
    justify-content: center !important;/* centre horizontally                 */
    align-items: center !important;    /* centre vertically in the row        */
    gap: 2rem !important;           /* space between the two buttons       */
    flex-wrap: wrap;                   /* allow wrap on mobile if necessary   */
}

/* make each list item size to its button (prevents forced 50% widths) */
#carousel-c067 .u-list-1 .u-list-item {
    flex: 0 0 auto !important;         /* no grow / no shrink / auto width    */
    text-align: center !important;     /* keeps the anchor centred inside     */
}

.u-carousel{
  background-color: #e5e5e5  !important ;
}

#carousel-c067 .slide-desc img,
#carousel-c067 .u-text-1 img {
    width: 75px !important;
    height: 75px !important;

    display: block;
    margin: 25px auto 0;

    object-fit: cover;

    border-radius: 50%;            
    outline: 2px solid #fff;       
    outline-offset: 0;             
}

.info-container {
  padding: 0rem 7rem;
}