/*
 * Homepage reading rhythm
 *
 * The source text stays intact. On the overview page, long records are shown
 * as deliberate previews so imagery, navigation and content retain equal weight.
 */

.journey.section,
.obligatory.section,
.quran-world.section,
.hadith-stage.section,
.bookshelf.section,
.network.section,
.questions.section,
.topics-gallery.section {
    padding-block: clamp(4rem, 6vw, 5.25rem);
}

.split-heading {
    align-items: center;
    margin-bottom: clamp(1.75rem, 3vw, 2.35rem);
}

.split-heading h2,
.obligatory-intro h2,
.quran-copy h2,
.network-grid h2 {
    text-wrap: balance;
}

.split-heading > p,
.obligatory-intro > p,
.quran-copy > p,
.network-grid > div:first-child > p {
    font-size: .96rem;
    line-height: 1.65;
}

/* Learning path: short, scan-friendly steps rather than five equal text blocks. */
.journey .split-heading h2 {
    font-size: clamp(2.65rem, 4.4vw, 4.25rem);
}

.journey .split-heading p {
    max-width: 37ch;
    padding: 1rem 1.15rem;
}

.pathway {
    padding-top: 1.4rem;
}

.pathway strong {
    font-size: clamp(1rem, 1.35vw, 1.14rem);
    line-height: 1.25;
}

.pathway small {
    margin-top: .28rem;
    font-size: .76rem;
    line-height: 1.45;
}

.pathway a > div {
    padding: .68rem .72rem;
}

/* The platform core remains authoritative, but no longer visually oversized. */
.obligatory-layout {
    grid-template-columns: .8fr 1.2fr;
    gap: clamp(3rem, 5vw, 5rem);
    align-items: center;
}

.obligatory-intro h2 {
    max-width: 8ch;
    margin-block: .65rem 1rem;
    font-size: clamp(2.85rem, 4.5vw, 4.5rem);
}

.knowledge-explorer a {
    min-height: 44px;
    padding: .76rem .9rem;
}

.knowledge-explorer a strong {
    font-size: 1.04rem;
    line-height: 1.25;
}

/* Quran: compact editorial introduction and a calmer verse panel. */
.quran-layout {
    gap: clamp(3rem, 5vw, 5rem);
}

.quran-copy::before {
    height: clamp(150px, 18vw, 210px);
    margin-bottom: 1.5rem;
}

.quran-copy h2 {
    margin-block: .8rem;
    font-size: clamp(2.8rem, 4.5vw, 4.65rem);
}

.quran-actions {
    margin-top: 1.5rem;
}

.verse-experience {
    padding: clamp(1.5rem, 3vw, 2.15rem);
}

.verse-arabic {
    padding: 1.4rem 1rem;
    font-size: clamp(3.3rem, 5.4vw, 4.5rem);
}

.verse-experience > p {
    max-width: 46ch;
    margin-inline: auto;
    font-size: .9rem;
    line-height: 1.55;
}

.relation-pills {
    margin-block: 1.4rem;
}

/* A hadith on the homepage is a preview. The complete record remains untouched. */
.hadith-layout {
    grid-template-columns: .82fr 1.18fr;
    min-height: 440px;
}

.hadith-copy {
    padding: clamp(2rem, 3.8vw, 3.6rem);
    align-self: stretch;
}

.hadith-copy blockquote {
    max-width: 31ch;
    margin-block: 1.15rem;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 8;
    font-size: clamp(1.55rem, 2.25vw, 2.25rem);
    line-height: 1.32;
}

.hadith-copy > p {
    margin-block: .8rem;
    font-size: .82rem;
    line-height: 1.5;
}

.hadith-meta {
    margin-top: 1.25rem;
    flex-wrap: wrap;
}

/* Book and question titles keep their hierarchy without creating uneven rows. */
.book-cover strong {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    font-size: clamp(1.05rem, 1.55vw, 1.35rem);
}

.book h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 1.08rem;
    line-height: 1.28;
}

.network-grid {
    grid-template-columns: .78fr 1.22fr;
    gap: clamp(3rem, 5vw, 5rem);
}

.network-grid h2 {
    margin-block: .7rem 1rem;
    font-size: clamp(2.85rem, 4.5vw, 4.5rem);
}

.question-list {
    max-width: 820px;
}

.question-list a {
    min-height: 70px;
    padding-block: .9rem;
}

.question-list h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 1.16rem;
    line-height: 1.3;
}

.latest-strip a {
    min-width: 0;
    padding-block: 1rem;
}

.latest-strip strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Topic cards reveal enough context to choose, not an entire article abstract. */
.topic-image-grid {
    grid-auto-rows: minmax(210px, auto);
}

.topic-image-grid a {
    min-height: 210px;
    padding: 1.3rem;
}

.topic-image-grid strong {
    font-size: clamp(1.45rem, 2.35vw, 2.25rem);
}

.topic-image-grid small {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: .78rem;
    line-height: 1.45;
}

.topic-image-grid b {
    margin-top: .9rem;
}

@media (max-width: 1000px) {
    .obligatory-layout,
    .quran-layout,
    .network-grid {
        grid-template-columns: 1fr;
        gap: 2.6rem;
    }

    .hadith-copy blockquote {
        -webkit-line-clamp: 7;
    }
}

@media (max-width: 680px) {
    .journey.section,
    .obligatory.section,
    .quran-world.section,
    .hadith-stage.section,
    .bookshelf.section,
    .network.section,
    .questions.section,
    .topics-gallery.section {
        padding-block: 3.5rem;
    }

    .split-heading {
        margin-bottom: 1.6rem;
    }

    .split-heading h2,
    .journey .split-heading h2,
    .obligatory-intro h2,
    .quran-copy h2,
    .network-grid h2 {
        font-size: clamp(2.25rem, 10vw, 2.8rem);
    }

    .journey .split-heading p {
        padding: .9rem 1rem;
    }

    .pathway a > div {
        padding: .52rem .65rem;
    }

    .knowledge-explorer a strong {
        font-size: .96rem;
    }

    .quran-copy::before {
        height: 155px;
    }

    .verse-arabic {
        padding-block: 1rem;
        font-size: clamp(2.7rem, 13vw, 3.6rem);
    }

    .hadith-layout {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .hadith-copy {
        padding: 1.35rem;
    }

    .hadith-copy blockquote {
        -webkit-line-clamp: 6;
        font-size: 1.42rem;
        line-height: 1.34;
    }

    .hadith-meta span:nth-child(2),
    .hadith-meta span:nth-child(4) {
        display: none;
    }

    .question-list a {
        min-height: 64px;
    }

    .question-list h3 {
        font-size: 1.02rem;
    }

    .topic-image-grid a {
        min-height: 200px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .book-cover {
        transform: none !important;
    }
}