@font-face {
    font-family: 'Denton Test';
    src: url('../../fonts/denton-font/Denton Test Bold 700.otf') format('woff2'),
        url('../../fonts/denton-font/Denton Test Bold 700.otf') format('truetype');
    font-weight: normal;
    font-style: normal;
    /* font-display: swap; */
}


.about-founders-section {
    width: 100%;
    /* height: 700px; */
    opacity: 1;
    overflow: hidden;
    background-size: cover;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 50px 70px;
}

.about-founders-section h2 {
    font-family: 'Denton Test';
    font-weight: 420;
    font-style: normal;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    position: relative;
    margin-bottom: 20px;
    top: 0;

}

.about-founders-section h2::before,
.about-founders-section h2::after {
    content: "";
    display: inline-block;
    /* make visible */
    width: 100px;
    border-bottom: 2px solid #70724F;
    vertical-align: middle;
    position: relative;
    margin: 0 20px;
    /* spacing between line and text */
    /* top: 50%; position middle */
    transform: translateY(-50%);
}

.about-founders-section h2::before {
    /* margin-right: 15px; optional */
    left: 0px;
}

.about-founders-section h2::after {
    /* margin-left: 15px; optional */
    right: 0px;
}

.media-card {
  flex:1;
  position: relative;
  border-radius: 26.65px;
  background: #F6ECE4;
  padding:15px 15px 70px 15px;
  transition: all 0.6s ease; text-align: center;
}
.media-card:hover { box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); }


.media-card-collection {
    display: flex;
    flex-direction: row;
    gap:25px;
    transition: all 0.5s ease;
    position: relative;
    width: 100%;
    margin-top:120px;
}

.about-founders-img {
    width: 150px;
    height:160px;
    opacity: 1;
    position: absolute;
    top:-80px;
    /* vertically center relative to card */
    left: calc(50% - 75px);
    border-radius: 20px;
    /* border: 0.46px solid #000000; */
    /* background: #7d3e0d; */
    background: lightgrey;
    box-sizing: border-box;
    object-fit: cover;
    display: block;
    object-position: top;
}

.media-card .name {
    font-family: 'Denton Test';
    font-weight: 780;
    font-style: bold;
    font-size: 15.11px;
    line-height: 100%;
    letter-spacing: 0px;
    left: 120px;
    /* vertical-align: middle; */
    display: block;
    padding-bottom: 5px;
    padding-top: 5px;
}

.media-card p {
    font-family: 'DM Sans', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 13px;
    line-height: 26px;
    letter-spacing: 0%;
    vertical-align: middle;
    flex: 1;
    padding-bottom: 5px;
    margin-top:85px;

}
.card-bottom { position:absolute; left:0; right:0; text-align:center; 
  bottom:25px;
}
.media-card .position {
    font-family: 'Denton Test';
    font-weight: 420;
    font-style: normal;
    font-size: 12.07px;
    line-height: 100%;
    letter-spacing: 0px;
    display: block;
    color: #2d2d2d;
}


/* Move buttons above the cards */
.move-media {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    position: absolute;
    /* position relative to section */
    bottom: 20px;
    /* inside the section */
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    /* above cards */
}


.media-btn {
    width: 60px;
    height: 35px;
    border-radius: 50px;
    border: 0.74px solid #9A7A5F;
    background: #F6ECE4;
    /* background color */
    color: #9A7A5F;
    /* text color */
    cursor: pointer;
    transition: 0.2s ease;

    display: flex;
    /* enable flexbox */
    justify-content: center;
    /* center horizontally */
    align-items: center;
    /* center vertically */
    text-align: center;
    /* fallback to center text */
    font-size: 14px;
    /* adjust text size as needed */
}

/* .media-btn:hover {
    background: #f0e6dc;
} */

/* 
.media-card.active {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  z-index: 10;
}

.media-card.prev,
.media-card.next {
  opacity: 0.7;
  z-index: 5;
}

.media-card.prev {
  transform: translate(-120%, -50%) scale(0.8);
}

.media-card.next {
  transform: translate(20%, -50%) scale(0.8);
} */

@media(max-width:991px){
  .about-founders-section { padding:50px 30px; }
  .media-card-collection { gap:15px; }
  .about-founders-section h2 { font-size:30px; }
  .about-founders-section h2::before,
  .about-founders-section h2::after { width:70px; }
  .about-lifestyle-section h1 { font-size:30px; }
  .about-lifestyle-section h1::before, .about-lifestyle-section h1::after { width:70px; }
}
@media(max-width:767px){
  .media-card-collection { flex-direction: column; margin-top:0px; }
  .media-card { margin-top:120px; }
  .about-founders-section h2 { font-size:26px; }
  .about-founders-section h2::before,
  .about-founders-section h2::after { width:40px; }
  .about-lifestyle-section h1 { font-size:26px; text-align: center; }
  .about-lifestyle-section h1::before, .about-lifestyle-section h1::after { width:40px; }
}
@media(max-width:575px){
  .about-lifestyle-section h1, .about-founders-section h2 { font-size:20px; }
  .about-lifestyle-section h1::before, .about-lifestyle-section h1::after { margin:0px 30px; }
  .about-founders-section h2::before, .about-founders-section h2::after { margin:0px 10px; }
}
