@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Cairo:wght@400;500;600;700;800&family=Reem+Kufi+Ink&display=swap');
:root{color-scheme:dark;--bg:#080d12;--bg2:#0d171b;--panel:#101d20;--panel2:#142327;--text:#eee9dc;--muted:#a4b0a9;--gold:#c8a56c;--gold2:#efd39a;--line:#c8a56c42;--neon:#baff63;--font:'Cairo',Tahoma,sans-serif;--display:'Amiri',serif;--ornate:'Reem Kufi Ink','Amiri',serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:86px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.9;overflow-x:hidden;transition:background .35s,color .35s}body,button,input,textarea{font-family:var(--font)}a{color:inherit;text-decoration:none}button{cursor:pointer;color:inherit}::selection{background:var(--neon);color:#10170c}.site-shell{opacity:0;visibility:hidden;transition:opacity .8s,visibility .8s}body.site-ready .site-shell{opacity:1;visibility:visible}.section-wrap{width:min(1050px,calc(100% - 44px));margin-inline:auto}
.intro-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:auto;background:radial-gradient(ellipse at 50% 42%,#1a302c 0,#0b1719 48%,#060b10 100%);transition:opacity .7s,visibility .7s}.intro-screen.leaving{opacity:0;visibility:hidden;pointer-events:none}.intro-screen:before,.intro-screen:after{content:"";position:absolute;width:min(86vw,760px);aspect-ratio:1;border:1px solid #c8a56c25;border-radius:50%;pointer-events:none}.intro-screen:before{box-shadow:0 0 0 24px #c8a56c08,0 0 0 55px #c8a56c06}.intro-screen:after{width:min(72vw,620px);border-style:dashed;animation:spin 100s linear infinite}.intro-stars i{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--gold2);box-shadow:0 0 15px 4px #e4c27c55;animation:twinkle 3s infinite alternate}.intro-stars i:nth-child(1){top:15%;left:18%}.intro-stars i:nth-child(2){top:24%;right:15%;animation-delay:.5s}.intro-stars i:nth-child(3){bottom:17%;left:12%;animation-delay:1s}.intro-stars i:nth-child(4){bottom:20%;right:17%;animation-delay:1.5s}.intro-stars i:nth-child(5){top:10%;left:55%;animation-delay:.8s}.intro-stars i:nth-child(6){bottom:9%;left:51%;animation-delay:1.2s}
.intro-center{position:relative;z-index:1;width:min(760px,calc(100% - 30px));padding:24px 0;text-align:center}.intro-mark{font-size:38px;color:var(--gold2);line-height:1.2;text-shadow:0 0 25px #e4c27c55}.intro-brand{font:clamp(18px,4vw,25px) var(--display);color:var(--gold2);margin-top:6px}.intro-subtitle{font-size:9px;letter-spacing:4px;color:var(--muted);margin:5px 0 22px}.hadith-panel{position:relative;padding:30px clamp(16px,5vw,55px);border:1px solid #c8a56c88;background:linear-gradient(145deg,#10201edc,#0a1318ed);box-shadow:inset 0 0 0 6px #c8a56c0b,0 20px 70px #0008}.hadith-panel:before{content:"";position:absolute;inset:7px;border:1px solid #c8a56c30;pointer-events:none}.panel-ornament{color:var(--gold);font-size:21px}.panel-ornament.lower{margin-top:15px}.speaker{min-height:38px;margin:3px 0 8px;color:var(--gold2);font:clamp(16px,3vw,21px) var(--display)}.hadith-text{min-height:160px;margin:0;color:var(--neon);font:clamp(19px,3.5vw,27px)/2.05 var(--display);text-shadow:0 0 8px #baff6380,0 0 20px #baff633d}.source-text,.grade-text{min-height:29px;margin:9px 0 0;color:var(--gold2);font-size:clamp(11px,2.1vw,14px);line-height:2}.grade-text{color:var(--text);margin-top:2px}.typing{position:relative}.typing:after{content:"✍";display:inline-block;margin-right:3px;color:var(--gold2);font:20px var(--font);text-shadow:0 0 12px var(--gold);animation:writeBlink .55s steps(2,end) infinite}.enter-button{display:block;width:min(300px,90%);margin:20px auto 5px;padding:13px 20px;border:1px solid var(--gold);background:linear-gradient(120deg,#c8a56c,#efd39a);color:#101612;font-weight:800;font-size:15px;transition:.25s}.enter-button:disabled{opacity:.3;cursor:wait}.enter-button:not(:disabled):hover{transform:translateY(-3px);box-shadow:0 8px 28px #c8a56c40}.skip-button{border:0;background:transparent;color:#aab5aa;font-size:10px;padding:6px 12px}.skip-button:hover{color:var(--gold2)}
.site-header{height:78px;position:sticky;top:0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 max(5vw,20px);background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;justify-self:center}.brand-symbol{font-size:33px;color:var(--gold);line-height:1}.brand b,.brand small{display:block;font:18px var(--display);color:var(--gold2);line-height:1.35}.brand small{font-size:12px;color:var(--muted);letter-spacing:3px}.icon-button{width:43px;height:43px;border:1px solid var(--line);background:transparent;display:grid;place-items:center;transition:.25s}.icon-button:hover{background:var(--panel2);border-color:var(--gold)}.menu-button{justify-self:start;gap:5px;align-content:center}.menu-button span{width:18px;height:1px;background:var(--gold2);display:block;transition:.25s}.menu-button[aria-expanded=true] span:first-child{transform:translateY(6px) rotate(45deg)}.menu-button[aria-expanded=true] span:nth-child(2){opacity:0}.menu-button[aria-expanded=true] span:last-child{transform:translateY(-6px) rotate(-45deg)}.header-tools{justify-self:end}.theme-button{border-radius:50%;font-size:23px;color:var(--gold2)}.menu-backdrop{position:fixed;inset:78px 0 0;background:#0009;z-index:48;opacity:0;visibility:hidden;transition:.3s}.menu-backdrop.open{opacity:1;visibility:visible}.side-menu{position:fixed;z-index:49;top:78px;right:0;width:min(350px,88vw);height:calc(100dvh - 78px);padding:23px;background:var(--bg2);border-left:1px solid var(--line);transform:translateX(105%);transition:transform .35s cubic-bezier(.2,.8,.2,1);box-shadow:-20px 20px 55px #0004}.side-menu.open{transform:translateX(0)}.menu-top{display:flex;justify-content:space-between;align-items:center;color:var(--gold2);font:17px var(--display);padding-bottom:16px;border-bottom:1px solid var(--line)}.menu-top .icon-button{font-size:25px}.side-menu>a{display:flex;align-items:center;gap:14px;padding:12px 5px;border-bottom:1px solid color-mix(in srgb,var(--line) 45%,transparent);font-size:13px;transition:.2s}.side-menu>a span{width:25px;color:var(--gold);font-size:19px;text-align:center}.side-menu>a:hover{color:var(--gold2);padding-right:12px}.menu-note{margin-top:25px;text-align:center;color:var(--muted);font-size:9px;letter-spacing:2px}
.hero{min-height:calc(100svh - 78px);position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:70px 22px 80px;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,#1a302d 0,transparent 58%),linear-gradient(180deg,var(--bg),var(--bg2))}.hero:before,.hero:after{content:"";position:absolute;left:50%;top:50%;width:min(90vw,760px);aspect-ratio:1;border:1px solid #c8a56c19;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.hero:after{width:min(70vw,590px);border-style:dashed;animation:spin 130s linear infinite}.hero-glow{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 69px,#c8a56c08 70px,transparent 71px);mask-image:linear-gradient(transparent,#000 20%,#000 80%,transparent)}.hero-content{position:relative;z-index:1;width:min(720px,100%);margin:auto}.eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);padding:6px 15px;color:var(--gold2);font-size:10px;letter-spacing:1px}.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--neon);box-shadow:0 0 10px var(--neon)}.hero-emblem{margin:25px 0 2px;color:var(--gold);font-size:46px;text-shadow:0 0 25px #c8a56c40}.hero h1{margin:0;color:var(--text);font:clamp(42px,8vw,76px)/1.45 var(--ornate);text-shadow:0 4px 30px #0008}.hero h1 em{font-style:normal;color:var(--gold2)}.hero-divider{display:flex;justify-content:center;align-items:center;gap:17px;color:var(--gold);margin:10px auto}.hero-divider span{width:65px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}.hero-divider span:last-child{transform:rotate(180deg)}.hero-phrase{font:clamp(19px,3.5vw,27px) var(--display);color:var(--gold2);margin:10px 0}.hero-description{max-width:590px;margin:8px auto 25px;color:var(--muted);font-size:13px;line-height:2.3}.hero-enter{display:inline-flex;align-items:center;gap:25px;padding:12px 23px;border:1px solid var(--gold);color:var(--gold2);font-size:12px;transition:.25s}.hero-enter span{font-size:20px}.hero-enter:hover{background:var(--gold);color:#101612;transform:translateY(-3px)}.hero-bottom{position:absolute;bottom:20px;left:5%;right:5%;display:flex;justify-content:space-between;color:var(--muted);font-size:9px;letter-spacing:1px}
.categories{padding-block:90px}.section-title{text-align:center;max-width:700px;margin:0 auto 35px}.section-title>span{font-size:9px;letter-spacing:3px;color:var(--gold)}.section-title h2{margin:7px 0;font:clamp(30px,5vw,45px) var(--ornate);color:var(--text)}.section-title p{margin:0;color:var(--muted);font-size:12px;line-height:2.2}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.category{min-height:158px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px 14px;background:linear-gradient(145deg,var(--panel),var(--bg2));border:1px solid var(--line);transition:transform .25s,border-color .25s,box-shadow .25s}.category:before{content:"";position:absolute;inset:5px;border:1px solid color-mix(in srgb,var(--line) 55%,transparent);pointer-events:none}.category:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 13px 35px #0003}.cat-icon{font-size:28px;color:var(--gold);margin-bottom:7px}.category b{font:17px var(--display);color:var(--text)}.category small{font-size:9px;color:var(--muted);margin-top:4px;line-height:1.8}
.sunni-section{padding:85px 0;background:var(--panel);border-block:1px solid var(--line)}.sunni-inner .section-title{margin-bottom:30px}.source-types{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.source-types>div{display:flex;align-items:center;gap:15px;padding:17px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 45%,transparent)}.source-types span{color:var(--gold);font-size:11px}.source-types b{font:16px var(--display);font-weight:400}.refutation-section{padding-block:90px}.refutation-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.refutation-steps>div{padding:20px 12px;text-align:center;border:1px solid var(--line);background:var(--panel)}.refutation-steps span{display:grid;place-items:center;width:35px;height:35px;margin:0 auto 9px;border:1px solid var(--gold);border-radius:50%;color:var(--gold2)}.refutation-steps b,.refutation-steps small{display:block}.refutation-steps b{font:17px var(--display)}.refutation-steps small{font-size:9px;color:var(--muted);margin-top:4px}
.method-section{padding:85px 0;background:var(--panel);border-block:1px solid var(--line)}.method-inner{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.method-inner .section-title{text-align:right;margin:0}.method-inner .section-title h2{line-height:1.7}.method-inner .section-title h2 em{color:var(--gold2);font-style:normal}.method-points{border-right:1px solid var(--gold);padding-right:25px}.method-points p{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:13px 0}.method-points span{color:var(--gold)}
.contact-section{padding-block:90px}.contact-layout{display:grid;grid-template-columns:1fr .85fr;gap:30px;align-items:start}.message-form{display:grid;gap:9px;padding:25px;background:var(--panel);border:1px solid var(--line)}.message-form>label{font-size:11px;color:var(--gold2)}.message-form label small{font-size:9px;color:var(--muted)}.message-form>input,.message-form textarea{width:100%;padding:12px 14px;border:1px solid var(--line);background:var(--bg);color:var(--text);outline:0;font-size:11px}.message-form>input:focus,.message-form textarea:focus{border-color:var(--gold)}.message-form textarea{resize:vertical;min-height:120px}.visibility-choice{display:flex;gap:11px;align-items:flex-start;margin:8px 0;cursor:pointer}.visibility-choice input{accent-color:var(--gold);margin-top:7px}.visibility-choice b,.visibility-choice small{display:block}.visibility-choice b{font-size:10px;color:var(--text)}.visibility-choice small{font-size:9px;color:var(--muted);line-height:1.8}.send-button{padding:12px;border:0;background:var(--gold);color:#111711;font-weight:800;font-size:12px}.send-button:disabled{opacity:.5}.form-status{min-height:20px;margin:0;color:var(--muted);font-size:10px}.form-status.error{color:#e6a29b}.form-status.success{color:#a9d38c}.contact-aside{padding:27px;border:1px solid var(--line);background:var(--panel)}.aside-mark{font-size:32px;color:var(--gold)}.contact-aside h3{font:22px var(--display);color:var(--gold2)}.contact-aside>p{font-size:11px;color:var(--muted);line-height:2}.public-messages{display:grid;gap:10px;margin-top:20px}.empty-voices{font-size:10px;color:var(--muted);padding:15px;border:1px dashed var(--line)}.voice-card{padding:14px;border:1px solid var(--line);background:var(--bg)}.voice-card h4{margin:0;color:var(--gold2);font:17px var(--display)}.voice-card p{font-size:11px;white-space:pre-wrap;overflow-wrap:anywhere}.voice-card small{color:var(--muted);font-size:9px}
.about-section{padding:60px 0;background:var(--panel);border-top:1px solid var(--line)}.about-inner{text-align:center}.about-mark{font-size:38px;color:var(--gold)}.about-inner h2{font:clamp(24px,4vw,34px) var(--display);color:var(--gold2);margin:8px}.about-inner p{max-width:620px;margin:10px auto;color:var(--muted);font-size:11px;line-height:2.2}.about-inner>div:last-child{color:var(--gold);font-size:10px;letter-spacing:3px;margin-top:18px}.about-inner i{font-style:normal;color:var(--muted);margin-inline:8px}.site-footer{display:flex;justify-content:space-between;padding:18px max(5vw,22px);font-size:9px;color:var(--muted);border-top:1px solid var(--line)}.site-footer a:hover{color:var(--gold2)}
/* Light appearance */
body.light{color-scheme:light;--bg:#f2efe7;--bg2:#e8e3d7;--panel:#e6e1d5;--panel2:#dcd5c6;--text:#202b29;--muted:#66736d;--gold:#96703e;--gold2:#76552d;--line:#96703e55}body.light .site-header{background:#f2efe7eF}body.light .hero{background:radial-gradient(ellipse at 50% 38%,#d7e2d8 0,transparent 60%),linear-gradient(180deg,var(--bg),var(--bg2))}body.light .hero:before,body.light .hero:after{border-color:#96703e30}body.light .hero-glow{opacity:.35}body.light .intro-screen{background:radial-gradient(ellipse at 50% 42%,#d6e4d9 0,#eef0e8 52%,#e4e2d8 100%)}body.light .hadith-panel{background:#f8f6edee}body.light .hadith-text{color:#56851f;text-shadow:0 0 8px #9bd45b66}body.light .grade-text{color:#26342c}body.light .side-menu{background:var(--bg)}body.light .message-form>input,body.light .message-form textarea{background:#f7f5ed}body.light .voice-card{background:#f5f2e9}body.light .hero-description{color:#596b62}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes twinkle{from{opacity:.25;transform:scale(.7)}to{opacity:1;transform:scale(1.4)}}@keyframes writeBlink{50%{opacity:0}}
@media(max-width:760px){.site-header{height:70px;padding-inline:16px}.side-menu{top:70px;height:calc(100dvh - 70px)}.menu-backdrop{inset:70px 0 0}.hero{min-height:calc(100svh - 70px);padding:55px 18px 75px}.hero h1{font-size:clamp(39px,10vw,58px)}.category-grid{grid-template-columns:repeat(2,1fr);gap:8px}.category{min-height:145px;padding:14px 8px}.category b{font-size:15px}.category small{font-size:8px}.source-types{grid-template-columns:repeat(2,1fr)}.refutation-steps{grid-template-columns:repeat(2,1fr)}.method-inner,.contact-layout{grid-template-columns:1fr;gap:25px}.method-inner .section-title{text-align:center}.method-points{padding-right:15px}.categories,.refutation-section,.contact-section{padding-block:65px}.sunni-section,.method-section{padding-block:65px}.hero-bottom{font-size:7px}.hadith-panel{padding:22px 14px}.hadith-text{min-height:190px;font-size:19px}.intro-subtitle{letter-spacing:2px}.site-footer{gap:10px;flex-direction:column;align-items:center;text-align:center}}
@media(max-width:390px){.category b{font-size:13px}.category small{font-size:8px}.source-types>div{padding:13px 8px;gap:9px}.source-types b{font-size:14px}.hero-bottom{left:15px;right:15px}.brand b{font-size:15px}.brand small{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* Standalone section pages */
.source-text,.grade-text{white-space:pre-line}
.standalone-page{min-height:calc(100svh - 145px);padding:30px 22px 70px;background:radial-gradient(ellipse at 50% 22%,color-mix(in srgb,var(--gold) 9%,transparent),transparent 55%)}
.section-page-top{width:min(850px,100%);margin:0 auto 30px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:10px}
.section-page-top a{color:var(--gold2);border-bottom:1px solid var(--line);padding-bottom:3px}
.section-content{width:min(760px,100%);margin:0 auto;text-align:center;padding:38px clamp(18px,5vw,58px);border:1px solid var(--line);background:linear-gradient(145deg,var(--panel),var(--bg2));box-shadow:0 24px 70px #0002;position:relative}
.section-content:before{content:"";position:absolute;inset:7px;border:1px solid color-mix(in srgb,var(--line) 60%,transparent);pointer-events:none}
.section-page-emblem{font-size:42px;color:var(--gold);margin-bottom:5px}
.section-page-eyebrow{font-size:9px;letter-spacing:3px;color:var(--gold)}
.section-content h1{font:clamp(32px,6vw,50px)/1.6 var(--ornate);color:var(--gold2);margin:8px 0}
.section-page-description{max-width:620px;margin:18px auto 25px;color:var(--text);font:clamp(17px,2.8vw,21px)/2.15 var(--display)}
.section-detail-panel{max-width:580px;margin:0 auto;padding:20px 22px;text-align:right;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 55%,transparent)}
.section-detail-panel h2{font:20px var(--display);color:var(--gold2);margin:0 0 12px}
.section-detail-panel ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:9px 16px}
.section-detail-panel li{font-size:12px;color:var(--text);line-height:1.9}
.section-detail-panel li::first-letter{color:var(--gold)}
.section-note{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:11px;line-height:2}
.section-back-button{display:inline-block;margin-top:25px;padding:11px 26px;border:1px solid var(--gold);color:var(--gold2);font-size:12px;transition:.25s}
.section-back-button:hover{background:var(--gold);color:#111}
.section-page-bottom{width:min(760px,100%);margin:22px auto 0;text-align:center;color:var(--muted);font-size:9px;letter-spacing:2px}
.section-shell .site-footer{margin-top:0}
@media(max-width:600px){.standalone-page{padding:20px 14px 50px}.section-page-top{margin-bottom:20px}.section-content{padding:28px 15px}.section-detail-panel{padding:16px 13px}.section-detail-panel ul{grid-template-columns:1fr}.section-content h1{font-size:32px}.section-page-description{font-size:17px}}


/* New luminous identity: vivid midnight, teal and electric citron */
:root{--bg:#080c18;--bg2:#10172a;--panel:#121d31;--panel2:#192a3e;--text:#f3f0e7;--muted:#aab5c7;--gold:#8fe3d0;--gold2:#c7fff0;--line:#71d9d055;--neon:#d5ff54;--accent:#a78bfa;--font:'Cairo',Tahoma,sans-serif}
body{background-image:radial-gradient(ellipse at 12% 15%,#493b8c18,transparent 35%),radial-gradient(ellipse at 90% 60%,#0ebda418,transparent 36%)}
.site-header{background:color-mix(in srgb,#080c18 84%,transparent);border-bottom-color:#8fe3d055}
.brand-symbol{color:var(--neon);filter:drop-shadow(0 0 9px #d5ff5470)}
.icon-button{border-radius:13px;background:linear-gradient(145deg,#17263a,#0b1222);box-shadow:0 5px 20px #0004}
.menu-button{border-color:#8fe3d077}
.theme-button{border-radius:14px;color:var(--neon)}
.side-menu{background:linear-gradient(155deg,#18243b 0%,#0a1120 58%,#101d2b 100%);border-left:1px solid #9c8cff88;box-shadow:-22px 0 75px #0009;overflow-y:auto}
.side-menu:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 90% 0%,#a78bfa22,transparent 45%),repeating-linear-gradient(135deg,transparent 0 31px,#8fe3d00a 32px 33px)}
.side-menu>*{position:relative}
.menu-top{font-family:var(--ornate);font-size:19px;border-bottom:1px solid #a78bfa77;color:#d5ff8d}
.side-menu>a{margin:3px 0;padding:11px 12px;border:1px solid transparent;border-radius:11px;background:linear-gradient(90deg,#8fe3d008,transparent);transition:transform .28s,border-color .28s,background .28s,color .28s}
.side-menu>a span{color:var(--neon);text-shadow:0 0 12px #d5ff5470}
.side-menu>a:hover{padding-right:17px;transform:translateX(-4px);border-color:#8fe3d066;background:linear-gradient(100deg,#8fe3d022,#a78bfa1c);color:#eaffc0}
.menu-group-label{margin-top:18px;padding:9px 11px;border-top:1px solid #8fe3d044;color:#a78bfa;font-size:9px;letter-spacing:2px}
.menu-note{color:#8fe3d0;letter-spacing:3px}
.hero{background:radial-gradient(ellipse at 50% 35%,#193e4b 0,#17213b 35%,transparent 70%),linear-gradient(135deg,#080c18,#111b2d 58%,#10182a)}
.hero:before{border-color:#8fe3d035;box-shadow:0 0 0 20px #a78bfa08,0 0 0 45px #8fe3d008}
.hero:after{border-color:#a78bfa55}
.hero-glow{background:repeating-linear-gradient(90deg,transparent 0 59px,#8fe3d010 60px,transparent 61px),repeating-linear-gradient(0deg,transparent 0 59px,#a78bfa0b 60px,transparent 61px)}
.eyebrow{border-color:#8fe3d077;background:#0c192b88;box-shadow:0 0 24px #8fe3d018}
.eyebrow i{background:var(--neon);box-shadow:0 0 13px var(--neon)}
.hero-emblem{color:var(--neon);text-shadow:0 0 28px #d5ff5466}
.hero h1 em{color:#a7f2dd;text-shadow:0 0 26px #8fe3d022}
.hero-divider{color:var(--accent)}
.hero-divider span{background:linear-gradient(90deg,transparent,var(--accent))}
.hero-phrase{color:#d5ff9b}
.hero-enter{border:1px solid #8fe3d0;background:linear-gradient(110deg,#8fe3d014,#a78bfa14);border-radius:999px;padding:14px 27px;box-shadow:0 9px 30px #0003}
.hero-enter:hover{background:linear-gradient(110deg,#8fe3d0,#d5ff8d);color:#101526;box-shadow:0 12px 38px #8fe3d033}
.home-feature-zone{width:min(1000px,calc(100% - 34px));margin:0 auto;padding:22px 0 72px;display:grid;grid-template-columns:1.1fr .9fr;gap:17px}
.home-feature{position:relative;overflow:hidden;min-height:260px;padding:30px clamp(20px,4vw,36px);border:1px solid #8fe3d055;border-radius:23px;background:linear-gradient(135deg,#142c3a,#10172a 60%,#282044);box-shadow:0 18px 55px #0003;isolation:isolate;transition:transform .35s,border-color .35s,box-shadow .35s}
.home-feature:before{content:"";position:absolute;z-index:-1;width:240px;height:240px;border:1px solid #d5ff5433;border-radius:50%;left:-80px;top:-100px;box-shadow:0 0 0 16px #d5ff5407,0 0 0 38px #8fe3d009}
.home-feature:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(120deg,transparent 35%,#8fe3d00a 50%,transparent 65%);transform:translateX(-100%);transition:transform .8s}
.home-feature:hover{transform:translateY(-6px);border-color:#d5ff54aa;box-shadow:0 22px 65px #0005}
.home-feature:hover:after{transform:translateX(100%)}
.feature-orbit{position:absolute;left:22px;top:15px;font-size:65px;line-height:1;color:#d5ff5430;transform:rotate(-12deg)}
.feature-kicker{display:inline-block;color:#a78bfa;font-size:9px;letter-spacing:3px}
.home-feature h2{position:relative;max-width:560px;margin:13px 0 8px;color:#f2f5e9;font:clamp(24px,4vw,36px)/1.5 var(--ornate)}
.home-feature p{max-width:570px;margin:0;color:#b9c8cf;font-size:12px;line-height:2.2}
.feature-link{display:inline-flex;align-items:center;gap:16px;margin-top:19px;padding:9px 17px;border:1px solid #8fe3d088;border-radius:999px;color:#d5ff9b;font-size:11px;transition:.25s}
.feature-link:hover{background:#d5ff54;color:#11182a;border-color:#d5ff54}
.feature-link span{font-size:18px}
.feature-status{display:inline-block;margin-right:10px;color:#aab5c7;font-size:9px}
.about-feature{background:linear-gradient(135deg,#292047,#17243a 68%,#0e2630);border-color:#a78bfa66}
.about-feature .feature-kicker{color:#d4bdff}
.about-feature .feature-link{border-color:#a78bfa88;color:#e0d4ff}
.about-feature .feature-link:hover{background:#a78bfa;color:#111}
body.light{--bg:#f0f4f0;--bg2:#e4eee9;--panel:#e4eee9;--panel2:#d9e9e4;--text:#192c2b;--muted:#607672;--gold:#287d78;--gold2:#245f60;--line:#3d8d8580;--neon:#639b12;--accent:#7654bd}
body.light .site-header{background:#f0f4f0ed}
body.light .side-menu{background:linear-gradient(150deg,#e8f3ef,#f4f1fa);box-shadow:-20px 0 55px #2334}
body.light .side-menu>a{color:#203c3a}
body.light .side-menu>a:hover{color:#274b40;background:#d4ebe2}
body.light .hero{background:radial-gradient(ellipse at 50% 35%,#c6e5dc 0,#d9def0 40%,transparent 70%),linear-gradient(135deg,#f0f4f0,#e4eee9)}
body.light .home-feature{background:linear-gradient(135deg,#d4e9e4,#e8e3f6 70%,#d9e9e6);border-color:#448f8777}
body.light .home-feature h2{color:#1b3837}
body.light .home-feature p{color:#4d6662}
body.light .feature-link{color:#285c57}
body.light .about-feature{background:linear-gradient(135deg,#e7def7,#dce9ed)}
body.light .about-feature .feature-link{color:#5d4693}
body.light .intro-screen{background:radial-gradient(ellipse at 50% 42%,#c8e7dc 0,#e6e9f4 52%,#e4eee9 100%)}
body.light .hadith-panel{background:#f7fbf4ee}
body.light .hadith-text{color:#54821c;text-shadow:0 0 8px #9bd45b66}
.typing:after{content:"";display:inline-block;width:2px;height:1.05em;margin-right:5px;vertical-align:-.14em;background:var(--neon);box-shadow:0 0 10px var(--neon);animation:writeBlink .8s steps(2,end) infinite}
@media(max-width:700px){.home-feature-zone{grid-template-columns:1fr;padding:10px 0 48px}.home-feature{min-height:230px;padding:25px 21px}.feature-orbit{font-size:50px}.side-menu{width:min(390px,92vw);padding:18px}.side-menu>a{padding:10px 12px}}


/* MIRṢĀD 2026 — editorial motion system */
:root{--bg:#070b17;--bg2:#10172b;--panel:#111d32;--panel2:#182842;--text:#eff4f3;--muted:#9eafc0;--gold:#69e4d0;--gold2:#c1fff1;--line:#72e4d044;--neon:#d8ff62;--violet:#a68aff;--pink:#ed8acb;--display:'Amiri',serif;--ornate:'Reem Kufi Ink','Amiri',serif}
html{scroll-behavior:smooth}body{background-color:var(--bg);background-image:radial-gradient(ellipse at 8% 4%,#6954bc22,transparent 33%),radial-gradient(ellipse at 92% 34%,#27c9b31c,transparent 30%),linear-gradient(120deg,transparent 49.8%,#ffffff06 50%,transparent 50.2%);background-attachment:fixed}
.site-header{height:78px;padding-inline:clamp(18px,5vw,72px);border-bottom:1px solid #75e6d044;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 12px 42px #0002}
.brand{gap:13px}.brand-symbol{display:grid;place-items:center;width:43px;height:43px;border:1px solid #d8ff6255;border-radius:15px 4px 15px 4px;font-size:26px;color:var(--neon);background:linear-gradient(145deg,#d8ff6216,#a68aff18);box-shadow:0 0 25px #d8ff6214}
.brand b{font:18px/1.4 var(--ornate);color:#d9fff5}.brand small{font-size:10px;letter-spacing:3px;color:#a68aff}
.icon-button{width:46px;height:46px;border:1px solid #75e6d066;border-radius:14px 4px 14px 4px;background:linear-gradient(145deg,#172843,#0b1221);color:var(--neon);transition:transform .3s,box-shadow .3s}
.icon-button:hover{transform:rotate(-7deg) scale(1.06);box-shadow:0 0 25px #75e6d044}
.hero{position:relative;min-height:690px;min-height:min(850px,calc(100svh - 78px));display:grid;place-items:center;overflow:hidden;padding:90px 22px 115px;background:radial-gradient(ellipse at 50% 44%,#163b4a 0,#17203a 32%,#090f1d 70%,#070b17 100%)}
.hero:before{width:min(78vw,790px);border:1px solid #69e4d04a;box-shadow:0 0 0 18px #69e4d009,0 0 0 54px #a68aff0c,0 0 0 100px #69e4d007;animation:heroOrbit 32s linear infinite}
.hero:after{width:min(62vw,620px);border:1px dashed #a68aff66;animation:spin 90s linear infinite reverse}
.hero-glow{inset:0;opacity:.8;background:repeating-linear-gradient(90deg,transparent 0 79px,#69e4d00a 80px,transparent 81px),repeating-linear-gradient(0deg,transparent 0 79px,#a68aff0a 80px,transparent 81px);mask-image:linear-gradient(transparent,#000 25%,#000 80%,transparent)}
.hero-content{width:min(790px,100%);position:relative;z-index:1;text-align:center;animation:heroRise 1.2s cubic-bezier(.2,.8,.2,1) both}
.eyebrow{padding:10px 18px;border:1px solid #69e4d077;border-radius:999px;background:#091322aa;color:#c4eee7;font-size:10px;letter-spacing:1px}
.hero-emblem{font-size:62px;color:var(--neon);margin:27px 0 3px;text-shadow:0 0 35px #d8ff6266;animation:emblemFloat 6s ease-in-out infinite}
.hero h1{font:clamp(48px,8vw,88px)/1.55 var(--ornate);letter-spacing:0;color:#f1f7f4;text-shadow:0 8px 45px #0008}
.hero h1 em{font-style:normal;color:#81efdc;text-shadow:0 0 35px #69e4d044}
.hero-divider{color:var(--violet);gap:18px;margin:12px auto}
.hero-divider span{width:90px;height:1px;background:linear-gradient(90deg,transparent,var(--violet))}
.hero-phrase{font:clamp(20px,3vw,29px) var(--display);color:var(--neon);letter-spacing:1px}
.hero-description{max-width:620px;margin:17px auto 29px;color:#c0ccd6;font-size:14px;line-height:2.3}
.hero-enter{border:1px solid #69e4d0a8;border-radius:999px;background:linear-gradient(110deg,#69e4d01c,#a68aff1c);color:#e5fff8;padding:14px 29px;font-size:13px;box-shadow:0 12px 45px #0004;transition:transform .3s,background .3s,box-shadow .3s}
.hero-enter:hover{transform:translateY(-4px);background:linear-gradient(100deg,#69e4d0,#d8ff62);color:#09131c;box-shadow:0 15px 45px #69e4d044}
.hero-bottom{bottom:26px;color:#9ebbbd;font-size:9px;letter-spacing:2px}
.home-pulse{position:relative;width:min(1050px,calc(100% - 36px));margin:-44px auto 45px;z-index:3;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;padding:27px clamp(20px,4vw,42px);border:1px solid #69e4d055;border-radius:18px 4px 18px 4px;background:linear-gradient(110deg,#122c3b,#111a30 64%,#252044);box-shadow:0 24px 70px #0005;overflow:hidden}
.home-pulse:after{content:"";position:absolute;width:220px;height:220px;border:1px solid #d8ff6233;border-radius:50%;left:-65px;top:-120px;box-shadow:0 0 0 18px #d8ff6209,0 0 0 40px #a68aff0a}
.pulse-heading{display:grid;gap:3px}.pulse-heading span{font-size:10px;color:var(--violet);letter-spacing:2px}.pulse-heading b{font:clamp(19px,3vw,27px) var(--display);color:#eafff7}
.pulse-stats{display:flex;gap:clamp(13px,3vw,35px);position:relative;z-index:1}.pulse-stats div{display:grid;gap:2px;text-align:center}.pulse-stats strong{font:24px var(--ornate);color:var(--neon)}.pulse-stats small{font-size:9px;color:#adbdc9}.pulse-mark{display:none}
.home-feature-zone{width:min(1050px,calc(100% - 36px));padding:0 0 70px;gap:20px}
.home-feature{min-height:280px;border-radius:22px 5px 22px 5px;padding:36px clamp(22px,4vw,42px);background:linear-gradient(140deg,#14394a,#111a30 58%,#292044);border-color:#69e4d055;box-shadow:0 22px 70px #0003;transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s}
.home-feature:hover{transform:translateY(-9px) rotateX(2deg);border-color:#d8ff62aa;box-shadow:0 28px 80px #0006,0 0 28px #69e4d014}
.home-feature:before{border-color:#69e4d044;box-shadow:0 0 0 18px #a68aff0a,0 0 0 40px #69e4d00a}
.feature-index{position:absolute;left:26px;bottom:23px;font-size:9px;letter-spacing:3px;color:#8da6b6}
.feature-kicker{color:#b4a0ff}.home-feature h2{font-size:clamp(25px,4vw,38px);line-height:1.55}.home-feature p{font-size:13px;line-height:2.3}
.feature-link{border-radius:7px 2px 7px 2px;background:#69e4d010}
.about-feature{background:linear-gradient(140deg,#2a2250,#17263d 65%,#0d3035);border-color:#a68aff66}
.home-lanes{width:min(1050px,calc(100% - 36px));margin:0 auto;padding:4px 0 95px}
.lanes-heading{max-width:600px;margin:0 auto 27px;text-align:center}.lanes-heading>span{font-size:9px;letter-spacing:4px;color:var(--violet)}.lanes-heading h2{font:clamp(25px,4vw,38px) var(--ornate);margin:7px 0;color:var(--text)}.lanes-heading p{font-size:12px;color:var(--muted);line-height:2.1}
.lane-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.lane-grid a{position:relative;min-height:170px;padding:22px 18px;border:1px solid #69e4d044;border-radius:14px 3px 14px 3px;background:linear-gradient(145deg,#14243a,#0e1627);display:flex;flex-direction:column;align-items:flex-start;gap:7px;overflow:hidden;transition:transform .35s,border-color .35s,background .35s}
.lane-grid a:after{content:"";position:absolute;inset:auto -30px -75px auto;width:150px;height:150px;border:1px solid #a68aff44;border-radius:50%;box-shadow:0 0 0 14px #a68aff09}
.lane-grid a:hover{transform:translateY(-7px);border-color:var(--neon);background:linear-gradient(145deg,#1a3b48,#1a1d3c)}
.lane-grid i{font-style:normal;font-size:24px;color:var(--neon)}.lane-grid b{font:17px var(--display);color:var(--text)}.lane-grid small{font-size:10px;color:var(--muted)}.lane-grid em{position:absolute;left:15px;top:13px;font:10px monospace;color:#a68aff}
.side-menu{width:min(410px,92vw);padding:20px 22px;background:radial-gradient(ellipse at 15% 12%,#483b7a66,transparent 35%),linear-gradient(155deg,#14283c,#080e1c 65%,#191b36);border-left:1px solid #69e4d077;box-shadow:-28px 0 95px #000a;backdrop-filter:blur(22px)}
.side-menu>a{position:relative;margin:5px 0;padding:12px 14px;border-radius:10px 3px 10px 3px;border:1px solid #69e4d01a;background:linear-gradient(100deg,#69e4d009,transparent 60%);font-size:12px;transition:transform .35s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s,box-shadow .3s}
.side-menu>a:before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:linear-gradient(var(--violet),var(--neon));transform:scaleY(0);transition:transform .3s}
.side-menu>a:hover{transform:translateX(-7px);border-color:#69e4d066;background:linear-gradient(100deg,#69e4d022,#a68aff1c);box-shadow:0 7px 24px #0003}
.side-menu>a:hover:before{transform:scaleY(1)}.side-menu>a span{display:inline-grid;place-items:center;width:28px;height:28px;margin-left:9px;border:1px solid #d8ff6244;border-radius:9px 3px 9px 3px;color:var(--neon);background:#d8ff620c}
.menu-top{padding-bottom:16px;margin-bottom:12px;color:#d8ffad;font:20px var(--ornate)}
/* section interior */
.standalone-page{position:relative;isolation:isolate;padding:35px 20px 90px;background:radial-gradient(ellipse at 50% 0,#25345b55,transparent 42%),radial-gradient(ellipse at 4% 55%,#12665d20,transparent 30%)}
.standalone-page:before{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(#8be7d009 1px,transparent 1px),linear-gradient(90deg,#8be7d009 1px,transparent 1px);background-size:55px 55px;mask-image:linear-gradient(#000,transparent 85%)}
.section-page-top{width:min(1100px,100%);margin:0 auto 25px;font-size:10px;letter-spacing:1px}
.section-content{width:min(1100px,100%);margin:0 auto;padding:0;border:0;background:transparent;box-shadow:none;text-align:right}
.section-content:before{display:none}
.section-hero{position:relative;min-height:310px;padding:clamp(30px,6vw,68px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;overflow:hidden;border:1px solid #69e4d055;border-radius:28px 5px 28px 5px;background:radial-gradient(ellipse at 82% 45%,#22566a88,transparent 42%),linear-gradient(115deg,#111b32,#142d3c 58%,#292148);box-shadow:0 30px 90px #0005;animation:heroRise .8s both}
.section-hero:before{content:"";position:absolute;width:330px;height:330px;left:-80px;top:-160px;border:1px solid #d8ff6255;border-radius:50%;box-shadow:0 0 0 18px #d8ff6209,0 0 0 45px #a68aff10,0 0 0 80px #69e4d00a;animation:spin 75s linear infinite}
.section-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#ffffff08 50%,transparent 70%);transform:translateX(-100%);animation:sectionSheen 1.8s .25s ease both}
.section-icon{position:relative;z-index:1;display:grid;place-items:center;width:60px;height:60px;margin-bottom:17px;border:1px solid #d8ff6280;border-radius:18px 4px 18px 4px;background:#d8ff6212;color:var(--neon);font-size:30px;box-shadow:0 0 35px #d8ff621e}
.section-kicker{position:relative;z-index:1;color:#b5a4ff;font-size:9px;letter-spacing:4px}
.section-hero h1{position:relative;z-index:1;margin:5px 0 8px;color:#e9fff8;font:clamp(34px,6vw,60px)/1.5 var(--ornate)}
.section-lead{position:relative;z-index:1;max-width:720px;margin:0;color:#c0d0d9;font:clamp(16px,2.3vw,20px)/2.1 var(--display)}
.section-metrics{position:relative;z-index:1;display:flex;gap:12px;margin-top:25px;flex-wrap:wrap}
.section-metrics div{min-width:115px;padding:9px 14px;border:1px solid #69e4d044;border-radius:8px 2px 8px 2px;background:#07101b66;display:grid;gap:0}
.section-metrics b{color:var(--neon);font:16px monospace}.section-metrics small{color:#aebecb;font-size:9px}
.subsection-zone{margin-top:34px;display:grid;grid-template-columns:1fr minmax(260px,.8fr);gap:12px}
.subsection-heading{grid-column:1/-1;font:clamp(22px,3vw,30px) var(--display);color:var(--text)}
.subsection-hint{grid-column:1/-1;margin:-10px 0 9px;color:var(--muted);font-size:11px}
.subsection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.subsection-tile{position:relative;min-height:122px;padding:17px;text-align:right;display:flex;flex-direction:column;align-items:flex-start;gap:5px;border:1px solid #69e4d033;border-radius:13px 3px 13px 3px;background:linear-gradient(140deg,#13263b,#101629);overflow:hidden;transition:transform .3s,border-color .3s,background .3s,box-shadow .3s}
.subsection-tile:after{content:"";position:absolute;width:100px;height:100px;border:1px solid #a68aff33;border-radius:50%;left:-35px;bottom:-65px;transition:transform .4s}
.subsection-tile:hover,.subsection-tile.active{transform:translateY(-3px);border-color:#d8ff62aa;background:linear-gradient(140deg,#1c3c49,#211d40);box-shadow:0 12px 35px #0004}
.subsection-tile.active{box-shadow:inset -3px 0 var(--neon),0 12px 35px #0004}
.tile-number{color:var(--violet);font:10px monospace;letter-spacing:2px}.subsection-tile b{font:17px var(--display);color:#e8f6f1}.subsection-tile small{font-size:10px;color:#aebdc9;line-height:1.8}.subsection-tile i{position:absolute;left:15px;top:13px;color:var(--neon);font-style:normal}
.subsection-detail{align-self:stretch;min-height:240px;padding:26px;border:1px solid #a68aff55;border-radius:4px 22px 4px 22px;background:radial-gradient(ellipse at 90% 0,#51408044,transparent 48%),linear-gradient(145deg,#172b40,#101627);display:flex;flex-direction:column;justify-content:center;transition:opacity .25s,transform .25s}
.subsection-detail.detail-in{animation:detailReveal .5s both}
.detail-glyph{color:var(--neon);font:30px monospace}.subsection-detail h2{margin:9px 0;font:26px var(--ornate);color:#d9fff4}.subsection-detail p{margin:0;color:#b6c6d0;font-size:13px;line-height:2.2}
.content-state{grid-column:1/-1;margin-top:12px;padding:25px;display:grid;justify-items:center;gap:8px;text-align:center;border:1px dashed #69e4d055;border-radius:15px;background:#0c1628aa}
.content-state .state-mark{font-size:31px;color:var(--neon);animation:emblemFloat 4s infinite}.content-state b{font:19px var(--display);color:var(--text)}.content-state p{max-width:580px;margin:0;color:var(--muted);font-size:11px;line-height:2}
.section-endnote{text-align:center;margin:30px 0 18px;color:#8ba5b7;font-size:9px;letter-spacing:3px}
.section-neighbor-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.neighbor-link{padding:16px 20px;border:1px solid #69e4d044;border-radius:10px 3px 10px 3px;background:linear-gradient(110deg,#14263c,#171932);display:grid;gap:3px;transition:transform .3s,border-color .3s}
.neighbor-link:hover{transform:translateY(-4px);border-color:var(--neon)}.neighbor-link small{color:var(--violet);font-size:9px}.neighbor-link b{font:18px var(--display);color:var(--text)}.neighbor-link i{font-style:normal;color:var(--neon)}
.page-transition{position:fixed;z-index:2000;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;background:radial-gradient(ellipse at center,#203e50,#0a1020 70%);opacity:0;visibility:hidden;transform:scale(1.04);transition:opacity .3s,visibility .3s,transform .45s}
.page-transition.active{opacity:1;visibility:visible;transform:scale(1)}
.page-transition span{font-size:70px;color:var(--neon);text-shadow:0 0 35px #d8ff6288;animation:emblemFloat 1.3s infinite}
.page-transition small{font-size:10px;letter-spacing:4px;color:#c8fff2}
body.light{--bg:#f2f5f1;--bg2:#e6eeeb;--panel:#e5efea;--panel2:#dce8e3;--text:#1b3030;--muted:#647b78;--gold:#287e79;--gold2:#235e5b;--line:#398e8666;--neon:#648f12;--violet:#7653b6}
body.light .site-header{background:#f2f5f1eF}body.light .hero{background:radial-gradient(ellipse at 50% 40%,#c1e4db,#d9e1f0 45%,#f2f5f1 100%)}body.light .hero h1{color:#173638}body.light .hero-description{color:#496360}
body.light .home-pulse{background:linear-gradient(110deg,#d4eae4,#e6e3f3)}body.light .pulse-heading b{color:#183a3b}body.light .pulse-stats small{color:#536e6a}
body.light .home-feature{background:linear-gradient(140deg,#d6ebe5,#e6e2f5)}body.light .home-feature h2{color:#1a393a}body.light .home-feature p{color:#526d69}body.light .feature-link{color:#245d58}
body.light .lane-grid a{background:linear-gradient(145deg,#e1eee9,#e9e5f3)}body.light .lane-grid b{color:#193a39}body.light .lane-grid small{color:#607571}
body.light .section-hero{background:radial-gradient(ellipse at 82% 45%,#a9d6d4,transparent 42%),linear-gradient(115deg,#e0eae8,#d9e3f0 58%,#e9e2f5)}body.light .section-hero h1{color:#183b3a}body.light .section-lead{color:#45635f}
body.light .subsection-tile,body.light .subsection-detail,body.light .neighbor-link{background:linear-gradient(140deg,#e3eee9,#e9e4f4)}body.light .subsection-tile b,body.light .subsection-detail h2,body.light .neighbor-link b{color:#193b39}body.light .subsection-tile small,body.light .subsection-detail p{color:#5c716d}
body.light .content-state{background:#eaf2ed}body.light .page-transition{background:radial-gradient(ellipse at center,#c8e5df,#e9e9f4 70%)}
@keyframes heroRise{from{opacity:0;transform:translateY(24px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes heroOrbit{to{transform:rotate(360deg)}}@keyframes emblemFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(5deg)}}
@keyframes sectionSheen{to{transform:translateX(110%)}}@keyframes detailReveal{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){.site-header{height:70px}.hero{min-height:calc(86svh - 70px);padding:65px 18px 100px}.hero h1{font-size:clamp(42px,11vw,62px)}.home-pulse{grid-template-columns:1fr;margin-top:-28px;padding:22px}.pulse-stats{justify-content:space-between}.home-feature-zone{grid-template-columns:1fr;padding-bottom:45px}.home-feature{min-height:235px}.home-lanes{padding-bottom:65px}.lane-grid{grid-template-columns:repeat(2,1fr)}.lane-grid a{min-height:145px;padding:17px 14px}.section-hero{min-height:285px;padding:27px 22px}.section-metrics{gap:7px}.section-metrics div{min-width:95px;padding:8px}.subsection-zone{grid-template-columns:1fr}.subsection-heading,.subsection-hint{grid-column:1}.subsection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.subsection-detail{min-height:165px}.section-neighbor-nav{gap:8px}.neighbor-link{padding:12px}.neighbor-link b{font-size:15px}}
@media(max-width:420px){.pulse-stats{gap:8px}.pulse-stats small{font-size:8px}.subsection-grid{grid-template-columns:1fr}.subsection-tile{min-height:95px}.hero-description{font-size:12px}.section-metrics div{min-width:88px}}


/* 2030 / MIRṢĀD — immersive scale, typography and spatial navigation */
@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Cairo:wght@400;500;600;700;800;900&family=Noto+Naskh+Arabic:wght@400;500;600;700&family=Reem+Kufi+Ink&display=swap');
:root{--display:'Cairo',sans-serif;--ornate:'Reem Kufi Ink','Amiri',serif;--body:'Noto Naskh Arabic','Cairo',sans-serif}
body{font-family:var(--body);font-size:17px;line-height:2.05;letter-spacing:0}
.site-header{height:88px;padding-inline:clamp(22px,6vw,100px)}
.brand b{font-size:21px;line-height:1.55}.brand small{font-size:12px;letter-spacing:2px}
.icon-button{width:54px;height:54px;font-size:23px}
.hero{min-height:clamp(760px,94svh,1080px);padding:120px 28px 145px}
.hero-content{width:min(1040px,100%)}
.eyebrow{font-size:13px;padding:13px 24px}
.hero-emblem{font-size:90px;margin:38px 0 8px}
.hero h1{font-size:clamp(66px,10vw,118px);line-height:1.48}
.hero-phrase{font-size:clamp(26px,3.4vw,38px)}
.hero-description{max-width:820px;font-size:19px;line-height:2.35}
.hero-enter{font-size:16px;padding:18px 38px}
.hero-bottom{font-size:12px;letter-spacing:2px}
.home-pulse{width:min(1320px,calc(100% - 60px));padding:38px 52px;margin-top:-56px;border-radius:26px 6px 26px 6px}
.pulse-heading span{font-size:13px}.pulse-heading b{font-size:clamp(26px,3vw,36px)}
.pulse-stats strong{font-size:34px}.pulse-stats small{font-size:13px}
.home-feature-zone,.home-lanes{width:min(1320px,calc(100% - 60px))}
.home-feature-zone{gap:26px;padding-bottom:95px}
.home-feature{min-height:370px;padding:52px}
.feature-kicker{font-size:13px}.home-feature h2{font-size:clamp(34px,4vw,48px);line-height:1.6}
.home-feature p{font-size:17px;line-height:2.25;max-width:650px}
.feature-link{font-size:15px;padding:12px 18px}
.feature-index{font-size:12px}
.home-lanes{padding-bottom:125px}
.lanes-heading>span{font-size:12px}.lanes-heading h2{font-size:clamp(36px,4vw,48px)}.lanes-heading p{font-size:16px}
.lane-grid{gap:18px}.lane-grid a{min-height:225px;padding:30px 26px;border-radius:20px 5px 20px 5px}
.lane-grid i{font-size:35px}.lane-grid b{font-size:23px}.lane-grid small{font-size:14px}.lane-grid em{font-size:12px}
.site-footer{padding:28px clamp(22px,6vw,100px);font-size:13px}
.side-menu{width:min(470px,94vw);padding:28px}
.side-menu>a{padding:16px 18px;font-size:15px;margin:7px 0}
.side-menu>a span{width:36px;height:36px;font-size:17px}
.menu-top{font-size:25px}
.standalone-page{padding:48px 28px 120px}
.section-page-top{font-size:13px;margin-bottom:35px}
.section-hero{min-height:440px;padding:clamp(45px,7vw,90px);border-radius:38px 7px 38px 7px}
.section-icon{width:78px;height:78px;font-size:39px}
.section-kicker{font-size:12px;letter-spacing:4px}
.section-hero h1{font-size:clamp(48px,7vw,78px);line-height:1.5}
.section-lead{font-size:clamp(20px,2.5vw,26px);line-height:2.15;max-width:900px}
.section-metrics{gap:16px;margin-top:35px}.section-metrics div{min-width:155px;padding:14px 18px}.section-metrics b{font-size:21px}.section-metrics small{font-size:12px}
.subsection-zone{margin-top:54px;gap:18px}
.subsection-heading{font-size:clamp(30px,4vw,42px)}
.subsection-hint{font-size:15px;margin-top:-14px}
.subsection-grid{gap:15px}
.subsection-tile{min-height:165px;padding:24px;border-radius:20px 5px 20px 5px}
.tile-number{font-size:13px}.subsection-tile b{font-size:23px}.subsection-tile small{font-size:14px;line-height:1.9}
.subsection-detail{min-height:320px;padding:38px;border-radius:6px 32px 6px 32px}
.detail-glyph{font-size:40px}.subsection-detail h2{font-size:36px}.subsection-detail p{font-size:18px;line-height:2.25}
.content-state{padding:38px;margin-top:20px}.content-state .state-mark{font-size:42px}.content-state b{font-size:25px}.content-state p{font-size:15px;line-height:2.1}
.section-endnote{font-size:12px;margin:45px 0 25px}.section-neighbor-nav{gap:18px;margin-top:30px}.neighbor-link{padding:24px 28px}.neighbor-link small{font-size:12px}.neighbor-link b{font-size:24px}
.page-transition{opacity:1;visibility:hidden;transform:none;clip-path:circle(0% at 50% 50%);background:radial-gradient(ellipse at 50% 45%,#244e5c,#10172e 52%,#050914);transition:clip-path .82s cubic-bezier(.76,0,.18,1),visibility .82s}
.page-transition.active{visibility:visible;clip-path:circle(150% at 50% 50%)}
.page-transition span{font-size:100px;animation:portalPulse 1.6s ease-in-out infinite}
.page-transition small{font-size:13px;letter-spacing:5px}
@keyframes portalPulse{0%,100%{transform:scale(.86) rotate(-12deg);filter:drop-shadow(0 0 8px #d8ff62)}50%{transform:scale(1.12) rotate(12deg);filter:drop-shadow(0 0 35px #69e4d0)}}
@keyframes tileEntrance{from{opacity:0;transform:translateY(35px) rotateX(12deg);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}
.subsection-tile{animation:tileEntrance .75s both;animation-delay:calc(var(--tile-i,0)*65ms)}
.subsection-tile:nth-child(2){--tile-i:1}.subsection-tile:nth-child(3){--tile-i:2}.subsection-tile:nth-child(4){--tile-i:3}.subsection-tile:nth-child(5){--tile-i:4}.subsection-tile:nth-child(6){--tile-i:5}
.home-feature,.lane-grid a,.subsection-tile,.neighbor-link{transform-style:preserve-3d;will-change:transform}
@media(max-width:760px){body{font-size:16px}.site-header{height:76px}.brand b{font-size:17px}.icon-button{width:48px;height:48px}.hero{min-height:88svh;padding:90px 20px 120px}.hero-emblem{font-size:70px}.hero h1{font-size:clamp(48px,12vw,72px)}.hero-description{font-size:16px}.home-pulse{width:calc(100% - 28px);padding:25px;margin-top:-35px}.pulse-heading b{font-size:25px}.pulse-stats strong{font-size:27px}.pulse-stats small{font-size:11px}.home-feature-zone,.home-lanes{width:calc(100% - 28px)}.home-feature{min-height:290px;padding:30px}.home-feature h2{font-size:32px}.home-feature p{font-size:15px}.lane-grid{gap:11px}.lane-grid a{min-height:175px;padding:21px 17px}.lane-grid b{font-size:19px}.lane-grid small{font-size:12px}.standalone-page{padding:28px 14px 80px}.section-hero{min-height:360px;padding:30px 23px}.section-hero h1{font-size:clamp(37px,9vw,54px)}.section-lead{font-size:18px}.section-metrics div{min-width:105px;padding:10px}.section-metrics b{font-size:17px}.section-metrics small{font-size:10px}.subsection-zone{margin-top:35px}.subsection-heading{font-size:29px}.subsection-tile{min-height:140px;padding:16px}.subsection-tile b{font-size:19px}.subsection-tile small{font-size:12px}.subsection-detail{min-height:220px;padding:25px}.subsection-detail h2{font-size:29px}.subsection-detail p{font-size:16px}.content-state{padding:25px}.content-state b{font-size:20px}.content-state p{font-size:13px}.neighbor-link{padding:16px}.neighbor-link b{font-size:18px}}
@media(max-width:420px){.hero h1{font-size:45px}.hero-phrase{font-size:23px}.pulse-stats small{font-size:9px}.lane-grid a{min-height:155px}.lane-grid b{font-size:17px}.section-metrics div{min-width:92px}.subsection-grid{grid-template-columns:1fr}.subsection-tile{min-height:112px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}


.home-culture{width:min(1320px,calc(100% - 60px));margin:0 auto;padding:0 0 130px}
.culture-head{text-align:center;max-width:760px;margin:0 auto 34px}.culture-head>span,.culture-bulletin>span{font-size:12px;letter-spacing:3px;color:var(--violet)}.culture-head h2{font:clamp(34px,4vw,48px) var(--ornate);margin:8px 0;color:var(--text)}.culture-head p{font-size:16px;color:var(--muted)}
.culture-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.verse-card{position:relative;min-height:260px;padding:30px 25px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #69e4d055;border-radius:26px 5px 26px 5px;background:radial-gradient(ellipse at 90% 0,#51408044,transparent 55%),linear-gradient(145deg,#142a40,#101629);overflow:hidden;transition:transform .5s,border-color .4s,box-shadow .4s}
.verse-card:after{content:"۞";position:absolute;left:14px;bottom:-43px;font-size:115px;color:#d8ff620c}.verse-card:hover{transform:translateY(-8px) rotateX(2deg);border-color:var(--neon);box-shadow:0 25px 65px #0005}
.verse-card>span{font:11px monospace;letter-spacing:2px;color:var(--neon)}.verse-card div{position:relative;z-index:1;font:clamp(20px,2.4vw,27px)/2.15 var(--display);color:#edfff8}.verse-card small{color:#a8c0c5;font-size:12px}
.culture-bulletin{margin-top:20px;padding:28px 34px;display:grid;gap:8px;border:1px solid #a68aff66;border-radius:5px 24px 5px 24px;background:linear-gradient(110deg,#282148,#142d3d 65%,#102033)}
.culture-bulletin b{font:27px var(--display);color:#f1fff8}.culture-bulletin p{margin:0;color:#bfd0d7;font-size:15px;line-height:2.1}.culture-bulletin a{justify-self:start;margin-top:8px;color:var(--neon);font-size:14px}.culture-bulletin i{font-style:normal}
body.light .verse-card{background:linear-gradient(145deg,#e1eee9,#e8e2f4)}body.light .verse-card div{color:#203d3b}body.light .verse-card small{color:#637a75}body.light .culture-bulletin{background:linear-gradient(110deg,#e7e1f3,#d9ebe5)}body.light .culture-bulletin b{color:#1c3a38}body.light .culture-bulletin p{color:#536d68}
@media(max-width:760px){.home-culture{width:calc(100% - 28px);padding-bottom:80px}.culture-grid{grid-template-columns:1fr}.verse-card{min-height:210px;padding:25px}.verse-card div{font-size:23px}.culture-bulletin{padding:23px}.culture-bulletin b{font-size:22px}.culture-bulletin p{font-size:14px}}


.in-view{animation:spatialArrival .9s cubic-bezier(.18,.78,.2,1) both}
@keyframes spatialArrival{0%{opacity:.25;filter:blur(5px);transform:translateY(34px) scale(.975)}65%{opacity:1;filter:blur(0);transform:translateY(-4px) scale(1.008)}100%{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.in-view{animation:none}}