.destination-quote-hero {
    align-items: center;
}

.destination-hero-quote {
    position: relative;
    z-index: 1;
    width: max-content;
    max-width: 100%;
    margin: 0 auto;
    color: #fff;
}

.destination-hero-quote h1 {
    max-width: none;
    margin: 0 0 .55rem;
    color: #fff;
    font: 600 clamp(1.15rem, 1.5vw, 1.45rem) / 1.4 var(--serif);
    letter-spacing: 0;
    text-align: left;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .3);
}

.destination-hero-quote blockquote {
    width: max-content;
    max-width: 100%;
    margin: 0 auto;
    color: #f0c477;
    font: 400 clamp(2.15rem, 3vw, 3.05rem) / 1.6 "Uthman Taha Naskh", "Traditional Arabic", serif;
    direction: rtl;
    unicode-bidi: isolate;
    text-align: center;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .3);
}

.destination-hero-quote figcaption {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .08rem;
    margin: .45rem auto 0;
    color: #fff;
    line-height: 1.55;
}

.destination-hero-quote figcaption strong,
.destination-hero-quote figcaption span {
    display: block;
    text-align: left;
}

.destination-hero-quote figcaption strong {
    font-size: 1.05rem;
    font-weight: 800;
}

.destination-hero-quote figcaption span {
    margin-top: .12rem;
    font-size: clamp(1.28rem, 1.45vw, 1.42rem);
}

.destination-hero-quote cite {
    align-self: flex-end;
    color: #dfb567;
    font-size: .7rem;
    font-style: normal;
    font-weight: 750;
    letter-spacing: .06em;
    white-space: nowrap;
}

@media (max-width: 650px) {
    .destination-quote-hero {
        min-height: auto;
        align-items: end;
        padding-top: 255px;
    }

    .destination-quote-hero .destination-image {
        height: auto;
        background-position: 65% center;
    }

    .destination-quote-hero .destination-overlay {
        background: linear-gradient(0deg, rgba(7, 25, 20, .99) 0%, rgba(7, 25, 20, .94) 61%, rgba(7, 25, 20, .15) 100%);
    }

    .destination-hero-quote h1 {
        font-size: 1.3rem;
    }

    .destination-hero-quote {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .destination-hero-quote blockquote {
        width: 100%;
        font-size: clamp(1.65rem, 7.2vw, 2.15rem);
        line-height: 1.55;
        text-align: center;
    }

    .destination-hero-quote blockquote span {
        max-width: 100%;
    }

    .destination-hadith .destination-hero-quote blockquote {
        direction: ltr !important;
    }

    .destination-hadith .destination-hero-quote blockquote span {
        width: 100%;
        display: block;
        direction: rtl;
        unicode-bidi: isolate;
        text-align: center;
    }

    .destination-hero-quote figcaption strong {
        font-size: .92rem;
    }

    .destination-hero-quote figcaption span {
        margin-top: .18rem;
        font-size: 1.15rem;
    }

    .destination-hero-quote cite {
        font-size: .62rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .destination-quote-hero .destination-image {
        animation: none !important;
        transform: none !important;
    }
}