p { margin-top: 0; }
.buttons { margin-top: 32px; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.buttons a.btn { margin: 0; }
.intro { margin-bottom: 40px; }
@media (max-width: 575px) {
  .buttons .btn { width: 100%; }
}



.breadcrumb { list-style: none; padding: 0; margin-top: 24px; margin-bottom: 0; display: flex; flex-wrap: wrap; gap: 8px; color: #ACACAC; background-color: transparent; border-radius: 0; }
.breadcrumb > li + li::before { content: '/'; margin-right: 8px; padding: 0; color: inherit; }
.breadcrumb a { font-weight: 500; color: #7CBDFF; }
.breadcrumb a:hover { color: #D3E9FF; text-decoration: underline; }



.section-hero { color: #fff; background-color: #14102B; }
.section-hero .content { padding: 40px 0 80px; text-align: center; }
.section-hero .content h1 { margin-top: 0; margin-bottom: 20px; text-wrap: balance; }
.section-hero .content p:last-child { margin-bottom: 0; }
.section-hero .content .author { margin: 0; display: inline-flex; flex-wrap: wrap; gap: 8px; }
.section-hero .content .written-by { color: #ACACAC; letter-spacing: .64px; text-transform: uppercase; }
@media (max-width: 991px) {
  .section-hero .content { padding: 40px 0 64px; }
}
@media (max-width: 767px) {
  .section-hero .content { padding: 48px 0 48px; }
}



.biodata { padding-top: 40px; }
.biodata hr { margin: 40px 0; border-top: 1px solid #A488EB; }
.biodata .row-flex { display: flex; flex-wrap: wrap; align-items: center; }
.biodata .image img { border-radius: 12px; }
.biodata .content h2 { margin-top: 0; margin-bottom: 4px; }
.biodata .content .work-experience { display: flex; flex-wrap: wrap; align-self: flex-start; gap: 12px; margin-bottom: 24px; }
.biodata .content .badge { flex-shrink: 0; padding: 5px 8px 3px; min-height: 24px; display: inline-block; font-size: 12px; line-height: 1; font-weight: 500; color: #000; text-transform: uppercase; background-color: #D1C3F5; border-radius: 4px; }
.biodata .content .large { margin-bottom: 24px; }
.biodata .content .location { margin-bottom: 24px; font-size: 12px; line-height: 1.333333; font-weight: 700; letter-spacing: 1.44px; color: #616161; text-transform: uppercase; }
.biodata .content .social-media { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; }
.biodata .content .social-media a { color: #424242; text-decoration: none !important; }
.biodata .content .social-media a:hover { color: #0067CB; }
.biodata .content .social-media a svg { width: 20px; height: 20px; }
.biodata .content .social-media a.website svg { width: 18px; }
@media (max-width: 1199px) {
  .biodata .row-flex { align-items: flex-start; }
  .biodata .content .work-experience span:first-child { width: 100%; }
}
@media (max-width: 767px) { 
  .biodata { padding-top: 48px; }
  .biodata hr { margin: 48px 0; }
  .biodata .image img { margin-bottom: 32px; max-width: 300px; }
}

@media (max-width: 575px) {
  .biodata .image img { max-width: 100%; }
}



.quote { position: relative; display: block; margin-top: 40px; margin-bottom: 40px; padding: 24px 40px; background-color: #F8F8F8; border-radius: 16px;}
.quote::before, .quote::after { content: ""; display: inline-block; margin-bottom: 16px; width: 36px; height: 32px; background: no-repeat center / contain; background-image: url(/static/common/images/icons/quote-left-corel.svg); }
.quote::after { margin: 0; position: absolute; right: 40px; bottom: 24px; transform: rotate(180deg); }
.quote .description { margin: 0; }
.quote .name { font-weight: 700; margin-bottom: 0; padding-right: 40px; margin-top: 16px;}
.quote .position { color: #616161; margin-bottom: 0; padding-right: 40px;}
@media (max-width: 767px) {
  .quote::before { margin-bottom: 4px; }
}


.interview { padding-bottom: 80px; }
.interview h2 { margin-top: 0; margin-bottom: 0; }
.interview h3 { margin-top: 40px; margin-bottom: 12px; }
.interview p:last-child { margin-bottom: 0; }
@media (max-width: 991px) {
  .interview { padding-bottom: 64px; }
}
@media (max-width: 767px) {
  .interview { padding-bottom: 48px; }
}



.artwork { margin-top: 40px; margin-bottom: 40px; }
.artwork .intro { margin-bottom: 24px; display: flex; flex-wrap: wrap; align-items: center; }
.artwork .intro h4 { margin: 0 auto 0 0; }
.custom-arrow { padding: 0; border: 0; padding: 0; appearance: none; display: inline-block; width: 32px; height: 32px; background-color: #424242; mask: no-repeat center / 32px; mask-image: url('/static/common/images/icons/chevron-left-circle-black.svg'); text-decoration: none !important; }
.custom-arrow:hover { background-color: #0067CB; }
.custom-arrow.slick-disabled { background-color: #CBCBCB; pointer-events: none; }
.custom-arrow-next { transform: rotate(180deg); margin-left: 12px; }
.artwork-slider { margin-right: -12px; margin-left: -12px; }
.artwork-slider:not(.slick-initialized) .slide-item:not(:first-of-type) { display: none; }
.artwork-slider:not(.slick-initialized) .slide-item:first-of-type { visibility: hidden; }
.artwork-slider .wrapper { display: block; margin-right: 12px; margin-left: 12px; }
.artwork-slider .wrapper { aspect-ratio: 4/3; }
.artwork-slider .wrapper img { width: 100%; height: 100%; object-fit: cover; border-radius: 16px; }



.bottom-cta {  position: relative; padding: 80px 0; color: #fff; background-repeat: no-repeat; background-size: cover; background-position: bottom right; }
.bottom-cta .star-1 { position: absolute; right: 8vw; bottom: 20px; width: 110px; height: auto; }
.bottom-cta .star-2 { position: absolute; right: 5vw; bottom: 35%; width: 70px; height: auto; }
.bottom-cta .content { text-align: center; }
.bottom-cta .content h2 { margin-top: 0; margin-bottom: 12px; }
.bottom-cta .content .large { margin: 0; }
@media (max-width: 1199px) {
  .bottom-cta .star-1 { width: 100px; }
  .bottom-cta .star-2  { width: 60px; }
  .bottom-cta .content .large br { display: none; }
}
@media (max-width: 767px) {
  .bottom-cta { padding: 48px 0; }
  .bottom-cta .star-1, 
  .bottom-cta .star-2 {  display: none; }
}



.related-articles { padding: 80px 0; }
.related-articles .intro h2 { margin: 0; }
.related-articles .row-media { display: flex; flex-wrap: wrap; row-gap: 48px; }
.related-articles .row-media::before,
.related-articles .row-media::after { display: none; }
.related-articles .media-block img { margin-bottom: 24px; width: 100%; }
.related-articles .media-block .h4 { margin-top: 0; margin-bottom: 8px; }
.related-articles .media-block p { margin-bottom: 24px; }
@media (max-width: 991px) {
  .related-articles { padding: 64px 0; }
}
@media (max-width: 767px) {
  .related-articles { padding: 48px 0; }
}