/* Qur’an reader product page; shared brand tokens and assets come from home.css. */
.reader-hero{background:var(--paper);padding:64px 0 88px}
.reader-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:64px}
.reader-intro h1{font-family:var(--serif);font-size:clamp(3.25rem,5.6vw,4.5rem);font-weight:400;line-height:.94;letter-spacing:-.02em;text-wrap:balance}
.reader-lede{max-width:48ch;margin:32px 0 24px}
.reader-intro .store-ctas{justify-content:flex-start}
.reader-note{font-size:var(--text-small);color:var(--ink-soft);line-height:1.7}
.reader-intro .reader-note{margin-top:16px}
.reader-intro>.reader-web-link{display:inline-block;margin-top:10px;font-size:var(--text-small);line-height:1.5;color:var(--ink-soft);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.reader-intro>.reader-web-link:hover{color:var(--ink)}
.reader-intro .reader-note{margin-top:10px}
.reader-devices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.reader-devices figure:last-child{margin-top:64px}
.android-shot,.ios-shot{display:block;width:100%;height:auto;background:var(--ink);border:6px solid var(--ink)}
.android-shot{border-radius:18px}.ios-shot{border-radius:28px}
figcaption{font-size:var(--text-small);color:var(--ink-soft);text-align:center;margin-top:16px}
.reader-reading,.reader-reflection,.reader-membership{padding:var(--section-space) 0}
.reader-reading{background:var(--band);color:var(--band-text)}
.reader-reading-grid,.reader-membership-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:96px;align-items:start}
.reader-reading h2,.reader-reflection h2,.reader-membership h2{font-size:clamp(2.625rem,5.7vw,4.5rem)}
.reader-reading p,.reader-reflection p,.reader-membership p{margin-top:24px;max-width:54ch}
.reader-page-link{display:inline-flex;gap:8px;align-items:center;text-decoration:none}
.reader-page-link:hover{text-decoration:none}
.reader-link-label{border-bottom:1px solid currentColor;padding-bottom:2px}
.reader-link-arrow{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.reader-link-arrow svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.reader-reading .verse-link{margin-block:20px 0;margin-inline:0 20px}
.reader-layers{display:grid;gap:32px;padding-top:8px}
.reader-layers dt{font-family:var(--serif);font-size:var(--text-title);line-height:1.1;margin-bottom:12px}
.reader-layers dd{color:var(--band-muted)}
.reader-reflection{background:var(--paper)}
.reader-reflection-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:96px;max-width:1040px}
.reader-reflection figure{width:100%;max-width:256px;margin:auto}
.reader-reflection .text-link,.reader-membership .text-link{margin-top:16px}
.reader-membership{background:var(--canvas)}
.reader-membership p:first-child{margin-top:0}
.reader-daily-tools{padding:var(--section-space) 0;background:var(--band);color:var(--band-text)}
.reader-tools-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:64px;margin-bottom:64px}
.reader-tools-heading h2{font-size:clamp(2.625rem,5.7vw,4.5rem)}
.reader-tools-heading p{max-width:44ch;color:var(--band-muted);font-size:var(--text-body);line-height:1.7}
.reader-tools-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px;align-items:start}
.reader-tools-list{display:grid;grid-template-columns:1fr 1fr;column-gap:40px;padding-top:4px}
.reader-tools-list>div{padding:20px 0;border-top:1px solid rgba(243,244,247,.22)}
.reader-tools-list dt{font-family:var(--serif);font-size:1.45rem;line-height:1.15;margin-bottom:8px}
.reader-tools-list dd{color:var(--band-muted);font-size:var(--text-body);line-height:1.65}
.reader-tools-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px;align-items:start}
.reader-tools-gallery figure{max-width:208px;margin:0 auto}
.reader-tools-gallery img{display:block;width:100%;height:auto;border:5px solid var(--ink);border-radius:24px;background:var(--ink)}
.reader-tools-gallery figure:nth-child(even){margin-top:44px}
.reader-tools-gallery figcaption{margin-top:10px;color:var(--band-muted);font-size:var(--text-small)}
.final-cta{background:var(--paper)}
@media(max-width:960px){.reader-hero-grid{gap:32px}.reader-reading-grid,.reader-membership-grid,.reader-reflection-grid{gap:48px}.reader-tools-grid{grid-template-columns:minmax(0,1fr);gap:32px}.reader-tools-heading{gap:40px}.reader-tools-list{column-gap:24px}.reader-tools-gallery{max-width:480px;margin:0 auto}.reader-devices{gap:12px}.android-shot,.ios-shot{border-width:4px}.android-shot{border-radius:14px}.ios-shot{border-radius:22px}}
@media(max-width:780px){.reader-hero{padding:40px 0 64px}.reader-hero-grid,.reader-reading-grid,.reader-membership-grid,.reader-reflection-grid,.reader-tools-heading,.reader-tools-grid{grid-template-columns:minmax(0,1fr);gap:40px}.reader-tools-heading{margin-bottom:32px}.reader-tools-gallery{max-width:480px;margin:auto;gap:24px 16px}.reader-tools-gallery figure{max-width:205px}.reader-intro{max-width:560px;margin:auto;width:100%}.reader-devices{width:100%;max-width:480px;margin:auto;gap:20px}.reader-devices figure:last-child{margin-top:40px}.reader-reflection-grid figure{order:2}.reader-reflection-grid>div{max-width:560px;margin:auto}.reader-layers{padding-top:0}.reader-membership h2 br:last-child{display:none}}
@media(max-width:560px){.reader-tools-list{grid-template-columns:minmax(0,1fr)}.reader-tools-gallery{gap:24px 12px}.reader-tools-gallery figure{max-width:100%}.reader-tools-gallery figcaption{font-size:12px}}
@media(max-width:380px){.reader-devices{gap:12px}.reader-intro .store-ctas{gap:8px}.reader-intro h1{font-size:clamp(2.625rem,13vw,3.25rem)}.reader-devices figcaption{font-size:12px}.reader-membership h2 br:last-child{display:initial}}

.reader-nav{background:var(--paper)}
.reader-nav .nav-actions .nav-cta{padding-inline:24px}
@media(max-width:380px){.reader-nav .nav-actions .nav-cta{padding-inline:12px}}
[dir="rtl"] .reader-intro h1{letter-spacing:0;line-height:1.15}
[dir="rtl"] .reader-layers dt,[dir="rtl"] .reader-tools-list dt{line-height:1.35}
[dir="rtl"] .reader-link-arrow{transform:scaleX(-1)}
[dir="rtl"] .reader-tools-gallery,[dir="rtl"] .reader-devices{direction:ltr}
[dir="rtl"] figcaption{direction:rtl}

[data-hikma-reader-page] .mobile-navigation-top>.brand{margin:0;margin-inline-end:auto}

/* Marketing screenshot rows keep complete device screens aligned without crowding the copy. */
.reader-quiet-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:64px;margin-top:72px;padding-top:64px}
.reader-quiet-row h3{font-family:var(--serif);font-size:clamp(2.625rem,5.7vw,4.5rem);font-weight:400;line-height:.94}
.reader-quiet-row p{margin-top:16px;max-width:48ch;color:var(--band-muted)}
.reader-quiet-row figure{width:276px;margin:0 auto}
.reader-quiet-row img{display:block;width:100%;height:auto;border:6px solid var(--ink);border-radius:28px;background:var(--ink)}
.reader-reflection-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02212fr);align-items:start;gap:20px}
.reader-reflection-pair figure{width:100%;max-width:220px;margin:0}
.reader-reflection-pair img{width:100%;height:auto}
.reader-reflection-grid{grid-template-columns:1.1fr 1fr;gap:64px;max-width:1200px}
.reader-reflection-pair figure{max-width:none}
.reader-reading figcaption{color:var(--band-muted)}
.reader-tools-grid{grid-template-columns:minmax(0,1fr)}
.reader-tools-list{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:32px}
.reader-tools-gallery{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:32px 40px;max-width:920px;margin:0 auto}
.reader-tools-gallery figure{flex:0 1 276px;max-width:276px;margin:0!important}
.reader-tools-gallery img{width:100%;height:auto}
@media(max-width:960px){.reader-tools-list{grid-template-columns:repeat(2,minmax(0,1fr))}.reader-tools-gallery{gap:24px 16px;max-width:740px}.reader-tools-gallery figure{flex-basis:208px}}
@media(max-width:780px){.reader-quiet-row{grid-template-columns:minmax(0,1fr) 252px;gap:32px;margin-top:48px;padding-top:48px}.reader-reflection-pair{max-width:520px;margin:auto}.reader-tools-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.reader-quiet-row{grid-template-columns:1fr;gap:28px}.reader-quiet-row figure{width:min(252px,100%)}.reader-reflection-pair{flex-direction:column;align-items:center;gap:32px}.reader-reflection-pair figure{width:min(252px,100%);max-width:252px}.reader-tools-list{grid-template-columns:minmax(0,1fr)}.reader-tools-gallery{flex-direction:column;align-items:center;gap:32px}.reader-tools-gallery figure{flex:0 1 auto;width:min(252px,100%);max-width:252px}}
@media(max-width:780px){.reader-reflection-grid{grid-template-columns:1fr;gap:40px}.reader-reflection-pair{order:2;width:100%}}
@media(max-width:560px){.reader-reflection-pair{grid-template-columns:1fr}.reader-reflection-pair figure{margin-inline:auto}}