@import "https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&family=Tajawal:wght@400;500;700;800;900&display=swap";@layer components;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:"Tajawal", "Cairo", system-ui, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-blue-300:oklch(80.9% .105 251.813);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--font-weight-medium:500;--radius-md:.375rem;--shadow-sm:0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--font-display:"Cairo", "Tajawal", system-ui, sans-serif}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.\!visible{visibility:visible!important}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.-ml-px{margin-left:-1px}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.h-5{height:calc(var(--spacing) * 5)}.w-5{width:calc(var(--spacing) * 5)}.w-full{width:100%}.min-w-0{min-width:0}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.resize{resize:both}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-items-center{justify-items:center}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.rounded-md{border-radius:var(--radius-md)}.rounded-l-md{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.rounded-r-md{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-gray-300{border-color:var(--color-gray-300)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-white{background-color:var(--color-white)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-2{padding-block:calc(var(--spacing) * 2)}.text-right{text-align:right}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.italic{font-style:italic}.shadow,.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-gray-300{--tw-ring-color:var(--color-gray-300)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}@media (hover:hover){.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:text-gray-400:hover{color:var(--color-gray-400)}.hover\:text-gray-700:hover{color:var(--color-gray-700)}}.focus\:border-blue-300:focus{border-color:var(--color-blue-300)}.focus\:ring:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.active\:bg-gray-100:active{background-color:var(--color-gray-100)}.active\:text-gray-500:active{color:var(--color-gray-500)}.active\:text-gray-700:active{color:var(--color-gray-700)}.active\:text-gray-800:active{color:var(--color-gray-800)}@media (width>=40rem){.sm\:block{display:block}.sm\:flex{display:flex}.sm\:hidden{display:none}.sm\:inline-flex{display:inline-flex}.sm\:flex-1{flex:1}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-2{gap:calc(var(--spacing) * 2)}}@media (width>=64rem){.lg\:hidden{display:none}.lg\:inline-grid{display:inline-grid}}.rtl\:flex-row-reverse:where(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),[dir=rtl],[dir=rtl] *){flex-direction:row-reverse}@media (prefers-color-scheme:dark){.dark\:border-gray-600{border-color:var(--color-gray-600)}.dark\:bg-gray-700{background-color:var(--color-gray-700)}.dark\:bg-gray-800{background-color:var(--color-gray-800)}.dark\:text-gray-200{color:var(--color-gray-200)}.dark\:text-gray-300{color:var(--color-gray-300)}.dark\:text-gray-400{color:var(--color-gray-400)}.dark\:text-gray-600{color:var(--color-gray-600)}@media (hover:hover){.dark\:hover\:bg-gray-900:hover{background-color:var(--color-gray-900)}.dark\:hover\:text-gray-200:hover{color:var(--color-gray-200)}.dark\:hover\:text-gray-300:hover{color:var(--color-gray-300)}}.dark\:focus\:border-blue-700:focus{border-color:var(--color-blue-700)}.dark\:focus\:border-blue-800:focus{border-color:var(--color-blue-800)}.dark\:active\:bg-gray-700:active{background-color:var(--color-gray-700)}.dark\:active\:text-gray-300:active{color:var(--color-gray-300)}}}:root{--brand:#0b5a5b;--brand-deep:#063e40;--brand-2:#2f7778;--accent:#b8893d;--accent-soft:#f5ead6;--surface:#fffdf9;--surface-2:#f4f7f5;--text:#153435;--text-2:#536866;--text-3:#7d8e8b;--line:#dfe8e5;--success:#287452;--warning:#a66b20;--danger:#a34e4e;--info:#3f6f93;--shadow-sm:0 4px 18px #063e400d;--shadow-md:0 14px 38px #063e4014;--shadow-lg:0 28px 70px #063e4021;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-sans);color:var(--text);background:var(--surface);margin:0}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}[x-cloak]{display:none!important}::selection{color:var(--brand-deep);background:#0b5a5b2e}:focus-visible{outline-offset:3px;outline:3px solid #b8893d73}.btn{cursor:pointer;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;min-height:42px;padding:.72rem 1rem;font-weight:800;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-lg{border-radius:14px;min-height:48px;padding:.82rem 1.25rem}.btn-primary{background:var(--brand);color:#fff;box-shadow:0 9px 24px #0b5a5b29}.btn-primary:hover{background:var(--brand-deep);box-shadow:0 12px 30px #0b5a5b36}.btn-gold{background:var(--accent);color:#fff;box-shadow:0 9px 24px #b8893d33}.btn-gold:hover{background:#9e722f}.btn-light{color:var(--brand-deep);background:#fffffff5;border-color:#ffffffb3}.btn-muted{color:#3e5552;border-color:var(--line);background:#f7f9f8}.btn-muted:hover{background:#eef4f2}.btn-ghost{color:var(--text-2);background:0 0}.eyebrow{color:var(--accent);letter-spacing:.04em;align-items:center;gap:.45rem;font-size:.72rem;font-weight:900;display:inline-flex}.eyebrow:before{content:"";opacity:.6;background:currentColor;width:20px;height:1px}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.icon{stroke-width:1.8px;flex:none;width:20px;height:20px}.icon-sm{width:17px;height:17px}.icon-lg{width:24px;height:24px}.site-shell{background:var(--surface);min-height:100vh}.site-container{width:min(1240px,100% - 40px);margin-inline:auto}.site-header{z-index:50;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffdf9e6;border-bottom:1px solid #0b5a5b14;position:sticky;top:0}.nav-inner{justify-content:space-between;align-items:center;gap:22px;min-height:82px;display:flex}.site-brand{align-items:center;gap:11px;min-width:max-content;display:flex}.site-brand img{object-fit:contain;width:48px;height:48px}.site-brand .brand-wordmark{flex-direction:column;line-height:1.05;display:flex}.site-brand strong{font-family:var(--font-display);font-size:1.05rem}.site-brand small{color:var(--text-3);margin-top:5px;font-size:.64rem}.desktop-nav{align-items:center;gap:2px;display:flex}.desktop-nav a{color:#536a67;border-radius:11px;padding:.65rem .78rem;font-size:.84rem;font-weight:800;transition:all .18s}.desktop-nav a:hover,.desktop-nav a.active{color:var(--brand);background:var(--teal-soft)}.nav-actions{align-items:center;gap:8px;display:flex}.nav-search,.nav-about,.mobile-toggle{border:1px solid var(--line);background:#fff;border-radius:12px;justify-content:center;align-items:center;font-weight:800;transition:all .18s;display:inline-flex}.nav-search:hover,.nav-about:hover,.mobile-toggle:hover{background:#f8fbfa;border-color:#c5d7d3}.nav-about{padding:.58rem .82rem;font-size:.78rem}.mobile-toggle{width:42px;height:42px;display:none}.mobile-nav{border-top:1px solid var(--line);background:#fffdf9;padding:10px 20px 18px}.mobile-nav a{border-radius:11px;align-items:center;gap:10px;padding:12px 10px;font-weight:800;display:flex}.mobile-nav a:hover{background:var(--teal-soft);color:var(--brand)}.home-hero{background:var(--brand-deep);color:#fff;position:relative;overflow:hidden}.home-hero:before{content:"";background:radial-gradient(circle at 78% 25%,#b8893d40,#0000 27%),radial-gradient(circle at 18% 110%,#3a87884d,#0000 32%);position:absolute;inset:0}.home-hero:after{content:"";border:1px solid #ffffff14;border-radius:50%;width:520px;height:520px;position:absolute;bottom:-300px;left:-240px}.hero-grid{z-index:1;grid-template-columns:1.12fr .88fr;align-items:center;gap:60px;min-height:620px;display:grid;position:relative}.hero-copy{padding-block:80px}.hero-copy .eyebrow{color:#e5c58e}.hero-copy h1{font-family:var(--font-display);letter-spacing:-.045em;margin:15px 0 24px;font-size:clamp(2.6rem,5.5vw,5.2rem);line-height:1.08}.hero-copy h1 em{color:#d7ad65;font-style:normal}.hero-copy p{color:#d3e0dd;max-width:650px;margin:0 0 30px;font-size:1.06rem;line-height:2.05}.hero-actions{flex-wrap:wrap;gap:10px;display:flex}.hero-visual{justify-content:center;align-items:center;display:flex}.hero-art{aspect-ratio:1;place-items:center;width:min(470px,86vw);display:grid;position:relative}.hero-art:before,.hero-art:after{content:"";border:1px solid #d7ad6547;border-radius:50%;position:absolute}.hero-art:before{inset:5%}.hero-art:after{inset:18%}.hero-art .art-glow{filter:blur(10px);background:radial-gradient(circle,#b8893d33,#0000 70%);border-radius:50%;position:absolute;inset:28%}.hero-art img{z-index:1;object-fit:contain;filter:drop-shadow(0 24px 35px #00000042);width:62%;height:62%;position:relative}.hero-note{z-index:2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#e5d4b1;background:#ffffff12;border:1px solid #ffffff21;border-radius:15px;max-width:250px;padding:12px 15px;font-size:.72rem;line-height:1.8;position:absolute;bottom:7%;right:0}.home-quick{z-index:4;margin-top:-36px;position:relative}.quick-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.quick-card{border:1px solid var(--line);min-height:92px;box-shadow:var(--shadow-sm);background:#fff;border-radius:18px;align-items:center;gap:13px;padding:15px 16px;transition:all .2s;display:flex}.quick-card:hover{box-shadow:var(--shadow-md);border-color:#c6d9d5;transform:translateY(-3px)}.quick-icon{width:44px;height:44px;color:var(--brand);background:var(--teal-soft);border-radius:13px;place-items:center;display:grid}.quick-card strong{font-family:var(--font-display);font-size:.9rem;display:block}.quick-card span{color:var(--text-3);margin-top:4px;font-size:.7rem;display:block}.section-dark{background:var(--brand-deep);color:#fff}.section-head{justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px;display:flex}.section-head h2{font-family:var(--font-display);margin:5px 0 0;font-size:clamp(1.55rem,3vw,2.15rem)}.section-head p,.section-head>p{color:var(--text-3);margin:0;font-size:.82rem}.section-dark .section-head p{color:#b9cfca}.text-link{color:#9b702f;align-items:center;gap:6px;font-size:.8rem;font-weight:900;display:inline-flex}.content-grid{gap:18px;display:grid}.feature-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.feature-card{border:1px solid var(--line);min-height:190px;box-shadow:var(--shadow-sm);background:#fff;border-radius:20px;padding:23px;transition:all .2s;position:relative}.feature-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.feature-card>span{background:var(--teal-soft);width:44px;height:44px;color:var(--brand);border-radius:13px;place-items:center;display:grid}.feature-card h3{font-family:var(--font-display);margin:20px 0 7px}.feature-card p{color:var(--text-3);margin:0 0 16px;font-size:.8rem;line-height:1.85}.feature-card b{color:var(--brand);font-size:.78rem}.accent-blue>span{color:#3f6f93;background:#edf3f8}.accent-violet>span{color:#705a9d;background:#f1eef8}.accent-amber>span{background:var(--accent-soft);color:#9b702f}.audio-grid{grid-template-columns:repeat(4,1fr)}.content-card,.book-card{border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;border-radius:20px;transition:all .2s;overflow:hidden}.content-card:hover,.book-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}.media-cover{aspect-ratio:1.35;cursor:pointer;background:linear-gradient(145deg,var(--brand-deep),#1d7071);color:#e2c48c;border:0;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;display:flex;position:relative;overflow:hidden}.media-cover:before{content:"";border:1px solid #ffffff1a;border-radius:50%;width:150px;height:150px;position:absolute}.audio-cover span{z-index:1;width:58px;height:58px;color:var(--brand-deep);background:#d7ad65;border-radius:50%;place-items:center;display:grid;position:relative;box-shadow:0 12px 28px #00000029}.audio-cover small{z-index:1;font-size:.7rem;font-weight:900;position:relative}.tag{color:#58706d;background:#eef4f2;border-radius:999px;align-items:center;gap:4px;padding:5px 9px;font-size:.64rem;font-weight:900;display:inline-flex}.content-body h2,.content-body h3{font-family:var(--font-display);margin:11px 0 7px;font-size:1rem;line-height:1.55}.content-body p{color:var(--text-3);min-height:42px;margin:0;font-size:.77rem;line-height:1.8}.card-foot{color:#8b9b97;justify-content:space-between;align-items:center;gap:10px;margin-top:17px;font-size:.68rem;display:flex}.card-foot a{color:#9b702f;font-weight:900}.book-grid{grid-template-columns:repeat(6,1fr)}.book-card{flex-direction:column;padding:11px;display:flex}.book-cover{aspect-ratio:.72;color:#e2c48c;background:linear-gradient(145deg,#114f50,#2d7c7d);border-radius:14px;place-items:center;font-size:2rem;display:grid;overflow:hidden}.book-cover img{object-fit:cover;width:100%;height:100%}.book-card>div{padding:13px 3px 4px}.book-card h3{margin:9px 0 5px;font-size:.9rem;line-height:1.5}.book-card p{color:var(--text-3);margin:0;font-size:.7rem;line-height:1.7}.home-featured{grid-template-columns:1.15fr .85fr;gap:18px;display:grid}.home-feature-panel{color:#fff;background:linear-gradient(145deg,#0a5051,#0b5a5b);border-radius:24px;min-height:320px;padding:28px;position:relative;overflow:hidden}.home-feature-panel:after{content:"";border:1px solid #ffffff1a;border-radius:50%;width:280px;height:280px;position:absolute;bottom:-140px;left:-110px}.home-feature-panel h2{font-family:var(--font-display);z-index:1;margin:10px 0;font-size:1.8rem;position:relative}.home-feature-panel p{color:#c8ddda;z-index:1;max-width:560px;line-height:2;position:relative}.home-feature-panel .btn{z-index:1;margin-top:8px;position:relative}.home-feature-side{gap:12px;display:grid}.mini-stat{border:1px solid var(--line);background:#fff;border-radius:18px;padding:20px}.mini-stat strong{font-family:var(--font-display);margin-top:5px;font-size:1.15rem;display:block}.mini-stat span{color:var(--text-3);font-size:.72rem}.page-hero{border-bottom:1px solid var(--line);background:linear-gradient(#edf5f3,#fffdf9);padding:72px 0 50px}.page-hero h1{font-family:var(--font-display);letter-spacing:-.03em;margin:10px 0;font-size:clamp(2.1rem,5vw,3.5rem)}.page-hero p{color:var(--text-2);max-width:680px;margin:0;line-height:2}.site-filters{align-items:stretch;gap:10px;margin-bottom:30px;display:flex}.site-search,.big-search{border:1px solid var(--line);background:#fff;border-radius:14px;flex:1;align-items:center;gap:8px;padding:0 14px;display:flex;box-shadow:0 2px 8px #063e4005}.site-search:focus-within,.big-search:focus-within{border-color:#9bbfba;box-shadow:0 0 0 4px #0b5a5b0f}.site-search input,.big-search input{width:100%;color:var(--text);background:0 0;border:0;outline:0;padding:13px 4px}.site-search>svg,.big-search>svg{color:#78908b}.site-filters select{border:1px solid var(--line);color:#435c58;background:#fff;border-radius:14px;outline:none;min-width:190px;padding:0 12px}.site-pagination{margin-top:35px}.site-pagination nav{justify-content:center;display:flex}.site-pagination svg{width:18px}.book-catalog{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.book-card.large{grid-template-columns:160px 1fr;gap:18px;padding:14px;display:grid}.book-card.large .book-cover{height:230px}.book-info{padding:15px 5px}.detail-hero{background:linear-gradient(145deg,var(--brand-deep),#0b5a5b);color:#fff;padding:34px 0 70px;position:relative;overflow:hidden}.detail-hero:after{content:"";border:1px solid #ffffff14;border-radius:50%;width:500px;height:500px;position:absolute;bottom:-300px;left:-250px}.back-link{color:#9b702f;align-items:center;gap:6px;margin-bottom:24px;font-size:.78rem;font-weight:900;display:inline-flex}.detail-hero .back-link{color:#e3c68f}.detail-card,.book-detail{z-index:1;grid-template-columns:110px 1fr;align-items:center;gap:26px;display:grid;position:relative}.detail-icon{color:#e2c48c;background:#ffffff17;border:1px solid #ffffff24;border-radius:28px;place-items:center;width:110px;height:110px;display:grid}.detail-card h1,.book-detail h1{font-family:var(--font-display);margin:9px 0;font-size:clamp(2rem,4vw,3.3rem);line-height:1.2}.detail-card p,.book-detail p{color:#d1e1de;max-width:780px;line-height:2}.detail-actions{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.detail-cover{aspect-ratio:.72;color:#e2c48c;width:250px;box-shadow:var(--shadow-lg);background:linear-gradient(145deg,#114f50,#2d7c7d);border-radius:20px;place-items:center;font-size:3rem;display:grid;overflow:hidden}.detail-cover img{object-fit:cover;width:100%;height:100%}.book-detail{grid-template-columns:250px 1fr;max-width:1000px}.news-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.news-card{border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;border-radius:20px;transition:all .2s;overflow:hidden}.news-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}.news-card img,.news-placeholder{aspect-ratio:1.65;object-fit:cover;color:#e2c48c;background:linear-gradient(145deg,#0b5051,#2b7778);place-items:center;width:100%;font-size:2rem;display:grid}.news-card>div{padding:20px}.news-card h2{font-family:var(--font-display);font-size:1.08rem;line-height:1.6}.news-card p{color:var(--text-3);font-size:.8rem;line-height:1.8}.news-card small{color:#9aa9a5}.narrow{max-width:900px}.article-page{padding:58px 0 90px}.article-page article{border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;border-radius:26px;padding:clamp(22px,5vw,56px)}.article-page h1{font-family:var(--font-display);margin:15px 0 8px;font-size:clamp(2rem,5vw,3.5rem);line-height:1.3}.article-page article h2{font-family:var(--font-display);margin-top:32px}@keyframes wave{50%{height:35px}}@media (width<=1180px){.desktop-nav{display:none}.mobile-toggle{display:inline-flex}.quick-grid,.feature-grid,.audio-grid{grid-template-columns:repeat(2,1fr)}.book-grid{grid-template-columns:repeat(3,1fr)}.news-grid{grid-template-columns:repeat(2,1fr)}.admin-stat-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=960px){.hero-grid{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:70px 0 15px}.hero-visual{padding:15px 0 75px}.home-featured{grid-template-columns:1fr}.book-catalog{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.admin-sidebar{transform:translate(100%)}.admin-sidebar.is-open{transform:translate(0)}.admin-main,.admin-main.is-collapsed{margin-right:0}.admin-mobile-overlay{z-index:65;background:#0006;display:block;position:fixed;inset:0}.admin-content{padding:22px}.admin-stat-grid{grid-template-columns:repeat(2,1fr)}.admin-grid-2,.login-page{grid-template-columns:1fr}.login-art{display:none}.login-mobile-brand{place-items:center;margin-bottom:20px;display:grid}.login-mobile-brand img{width:76px;height:76px}}@media (width<=640px){.site-container{width:min(100% - 24px,1240px)}.nav-inner{min-height:68px}.site-brand img{width:43px;height:43px}.nav-about{display:none!important}.hero-copy h1{font-size:2.55rem}.hero-copy p{font-size:.95rem}.hero-art{width:330px}.hero-note{bottom:2%;right:-2px}.section{padding:60px 0}.section-head{flex-direction:column;align-items:start;gap:8px}.quick-grid,.feature-grid,.audio-grid,.news-grid,.book-catalog{grid-template-columns:1fr}.book-grid{grid-template-columns:repeat(2,1fr)}.book-card.large{grid-template-columns:105px 1fr}.book-card.large .book-cover{height:165px}.site-filters{flex-direction:column}.site-filters select{height:48px}.detail-card,.book-detail{grid-template-columns:1fr}.detail-icon{width:82px;height:82px}.detail-cover{width:190px}.fatwa-card{grid-template-columns:1fr 25px}.fatwa-number{grid-column:1/-1}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:7px}.audio-player-inner{grid-template-columns:auto 1fr;width:calc(100% - 20px)}.player-actions,.player-title span,.player-volume{display:none}.radio-wave{display:none!important}.reader-head{flex-direction:column;align-items:start}.reader-frame{height:70vh}.admin-page-header{flex-direction:column;align-items:start}.admin-stat-grid{grid-template-columns:1fr 1fr}.admin-grid-2,.admin-form-grid.two{grid-template-columns:1fr}.admin-form-grid .full{grid-column:auto}.admin-topbar{padding:0 14px}.admin-top-link,.admin-breadcrumb span,.admin-breadcrumb i{display:none}.quick-actions{grid-template-columns:1fr}.admin-content,.admin-panel,.login-card-wrap{padding:16px}.login-card{padding:25px 20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media (width<=960px){.identity-intro{grid-template-columns:1fr;gap:10px;padding-top:52px}.identity-seal{width:190px;height:190px;margin:10px auto 0}.identity-seal .seal-content{width:125px;height:125px}.radio-hero-inner{grid-template-columns:1fr;gap:25px}.radio-ornament{display:none}.radio-columns{grid-template-columns:1fr}}@media (width<=640px){.identity-banner{height:auto !important;max-height:none}.identity-banner-fallback{min-height:170px}.identity-fallback-inner{gap:12px}.identity-fallback-inner img{width:60px;height:60px}.identity-copy h1{font-size:2.3rem}.identity-copy p{font-size:.9rem}.identity-seal{width:155px;height:155px}.identity-seal .seal-content{width:105px;height:105px}.seal-content strong{font-size:1.55rem}.radio-hero{padding:58px 0 65px}.radio-player-card{align-items:flex-start}.radio-play{flex:none;width:56px;height:56px}.radio-player-card div span{line-height:1.7}.radio-panel{padding:15px}.playlist-row,.radio-history-row{padding:11px}.playlist-row time{min-width:72px}.footer-app-card{padding:16px}.audio-player-inner{min-height:64px}.player-button{width:44px;height:44px}.player-title strong{max-width:55vw}}@keyframes player-spin{to{transform:rotate(360deg)}}@media (width<=640px){.player-error{white-space:nowrap;text-overflow:ellipsis;max-width:55vw;position:absolute;bottom:4px;right:58px;overflow:hidden}.player-main{position:relative}}@media (width>=641px){.sm\:block{display:block!important}.sm\:inline-flex{display:inline-flex!important}}@media (width>=961px){.lg\:hidden{display:none!important}.lg\:inline-grid{display:inline-grid!important}}.article-meta{color:#909f9b;margin-bottom:25px;font-size:.78rem}.article-image{object-fit:cover;border-radius:18px;width:100%;max-height:500px;margin-bottom:30px}.article-content{color:#465d59;font-size:1.02rem;line-height:2.3}.fatwa-list{gap:12px;display:grid}.fatwa-card{border:1px solid var(--line);background:#fff;border-radius:18px;grid-template-columns:90px 1fr 30px;align-items:center;gap:18px;padding:20px;transition:all .2s;display:grid}.fatwa-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.fatwa-number{color:#9b702f;font-weight:900}.fatwa-card h2{font-size:1rem;line-height:1.7;font-family:var(--font-display);margin:0 0 5px}.fatwa-card p{color:var(--text-3);margin:0;font-size:.8rem}.fatwa-card .arrow{color:#9b702f;font-size:1.1rem}.question-box{border:1px solid var(--line);color:#405854;background:#f0f5f3;border-radius:17px;padding:20px;line-height:2.1}.question-box.public{margin:20px 0;font-size:1.08rem}.big-search{margin-bottom:35px;padding:7px}.big-search input{padding:15px;font-size:1.05rem}.search-results section{margin-bottom:40px}.result-row,.history-row{border-bottom:1px solid #e6edeb;align-items:center;gap:14px;padding:15px 0;display:flex}.result-row>div,.history-row>div{flex:1;min-width:0}.result-row strong,.history-row strong{margin-bottom:4px;display:block}.result-row small,.history-row small{color:#859591;display:block}.result-empty,.search-hint{color:#73837f;background:#f0f5f3;border-radius:16px;padding:20px}.reader-shell{background:#edf2f0;min-height:calc(100vh - 82px);padding:28px 0 90px}.reader-head{justify-content:space-between;align-items:end;gap:20px;margin-bottom:20px;display:flex}.reader-head h1{font-family:var(--font-display);margin:5px 0 0}.reader-frame{height:78vh;box-shadow:var(--shadow-lg);background:#283331;border-radius:20px;overflow:hidden}.reader-frame iframe{border:0;width:100%;height:100%}.prose-card{border:1px solid var(--line);background:#fff;border-radius:24px;padding:clamp(25px,5vw,50px)}.prose-card p{color:#536966;line-height:2.2}.radio-hero{background:linear-gradient(145deg,var(--brand-deep),#0b5a5b);color:#fff;padding:90px 0;position:relative;overflow:hidden}.radio-hero:after{content:"";border:1px solid #ffffff14;border-radius:50%;width:620px;height:620px;position:absolute;top:-240px;left:-330px}.live-pill{border:1px solid #ffffff2e;border-radius:999px;align-items:center;gap:8px;margin-bottom:22px;padding:7px 10px;font-size:.72rem;font-weight:900;display:inline-flex}.live-pill span{background:#d7ad65;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 6px #d7ad651f}.radio-hero h1{z-index:1;font-family:var(--font-display);margin:0 0 15px;font-size:clamp(2.2rem,5vw,4.2rem);line-height:1.2;position:relative}.radio-hero p{z-index:1;color:#cfe0dc;max-width:650px;line-height:2;position:relative}.radio-player{z-index:1;background:#ffffff14;border:1px solid #ffffff21;border-radius:22px;align-items:center;gap:16px;max-width:760px;margin-top:35px;padding:18px;display:flex;position:relative}.radio-play{width:66px;height:66px;color:var(--brand-deep);cursor:pointer;background:#d7ad65;border:0;border-radius:50%;place-items:center;display:grid;box-shadow:0 12px 30px #00000029}.radio-player>div{flex-direction:column;gap:4px;display:flex}.radio-player strong{font-family:var(--font-display)}.radio-player span{color:#bcd0cb;font-size:.76rem}.radio-wave{align-items:center;gap:4px;height:40px;margin-inline-start:auto;display:flex!important}.radio-wave i{background:#d7ad65;border-radius:10px;width:4px;height:16px;animation:1s ease-in-out infinite wave}.radio-wave i:nth-child(2){animation-delay:.12s}.radio-wave i:nth-child(3){animation-delay:.24s}.radio-wave i:nth-child(4){animation-delay:.36s}.radio-wave i:nth-child(5){animation-delay:.48s}.history-row{border:1px solid var(--line);background:#fff;border-radius:15px;margin-bottom:9px;padding:16px}.audio-player{z-index:90;color:#fff;background:#063e40fa;border-top:1px solid #ffffff1a;position:fixed;inset:auto 0 0;box-shadow:0 -15px 45px #0000002e}.audio-player-inner{grid-template-columns:auto 1fr auto;align-items:center;gap:14px;width:min(1240px,100% - 40px);margin:auto;padding:11px 0;display:grid}.player-button{width:48px;height:48px;color:var(--brand-deep);cursor:pointer;background:#d7ad65;border:0;border-radius:50%;place-items:center;display:grid}.player-title{justify-content:space-between;gap:15px;margin-bottom:6px;font-size:.78rem;display:flex}.player-title strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.player-title span{color:#b9cfca;white-space:nowrap}.player-range{accent-color:#d7ad65;width:100%}.player-actions{color:#b9cfca;align-items:center;gap:8px;font-size:.65rem;display:flex}.player-actions button{color:#d7e4e1;cursor:pointer;background:0 0;border:1px solid #ffffff1f;border-radius:10px;width:34px;height:34px}.player-volume{accent-color:#d7ad65;width:90px}.player-live{color:#d7ad65;font-weight:900}.site-footer{color:#d8e5e2;background:#082f31;padding-top:70px}.site-footer .site-brand strong{color:#fff}.site-footer .site-brand small{color:#9bb4ae}.footer-grid{grid-template-columns:2fr 1fr 1fr 1.3fr;gap:40px;padding-bottom:55px;display:grid}.footer-grid>div>p{color:#9db3ae;max-width:330px;font-size:.83rem;line-height:1.95}.footer-grid h3{color:#fff;font-family:var(--font-display);margin:0 0 16px}.footer-grid>div>a:not(.site-brand){color:#9db3ae;margin:10px 0;font-size:.82rem;display:block}.footer-grid>div>a:not(.site-brand):hover{color:#e2c48c}.app-badge{border:1px solid #ffffff24;border-radius:10px;padding:8px 10px;font-size:.72rem;display:inline-flex}.footer-bottom{color:#7f9b95;border-top:1px solid #ffffff14;justify-content:space-between;padding:18px 0;font-size:.68rem;display:flex}.error-page{text-align:center;place-items:center;min-height:65vh;padding:60px 16px;display:grid}.error-code{color:#d7ad65;font-size:clamp(5rem,15vw,10rem);font-weight:900;line-height:.9}.error-page h1{font-family:var(--font-display)}.admin-shell{background:#f2f6f4;min-height:100vh}.admin-sidebar{color:#dbe8e5;z-index:70;direction:rtl;background:#073f41;flex-direction:column;width:276px;transition:all .22s;display:flex;position:fixed;inset:0 0 0 auto;box-shadow:-8px 0 35px #063e4014}.admin-sidebar.is-collapsed{width:82px}.admin-brand{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;min-height:86px;padding:17px 19px;display:flex}.brand-mark{background:#ffffff17;border:1px solid #ffffff1a;border-radius:15px;flex:none;place-items:center;width:48px;height:48px;display:grid}.brand-mark img{object-fit:contain;width:39px;height:39px}.brand-copy{flex-direction:column;display:flex}.brand-copy strong{font-family:var(--font-display);color:#fff}.brand-copy small{color:#8fb0aa;margin-top:4px;font-size:.63rem}.admin-nav{flex:1;padding:17px 12px;overflow:auto}.admin-nav-label{color:#71948e;padding:18px 11px 7px;font-size:.62rem;font-weight:900}.admin-nav-item{color:#b7ceca;cursor:pointer;text-align:right;background:0 0;border:0;border-radius:12px;align-items:center;gap:12px;margin:3px 0;padding:10px 12px;font-size:.78rem;font-weight:800;display:flex}.admin-nav-item span{color:#8fb0aa;flex:none;place-items:center;width:24px;height:24px;display:grid}.admin-nav-item:hover{color:#fff;background:#ffffff0f}.admin-nav-item.active{color:#173b3d;background:#d7ad65;box-shadow:0 9px 24px #0000001f}.admin-nav-item.active span{color:#173b3d}.admin-sidebar-footer{color:#8ca7a2;border-top:1px solid #ffffff14;padding:15px 20px;font-size:.68rem}.admin-sidebar-footer div{color:#b8cec9;align-items:center;gap:7px;margin-bottom:4px;display:flex}.status-dot{background:#69c38d;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #69c38d1a}.admin-main{min-height:100vh;margin-right:276px;transition:all .22s}.admin-main.is-collapsed{margin-right:82px}.admin-topbar{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);z-index:40;background:#fffffff0;justify-content:space-between;align-items:center;height:82px;padding:0 28px;display:flex;position:sticky;top:0}.admin-icon-btn,.admin-collapse-btn{border:1px solid var(--line);cursor:pointer;color:#4e6562;background:#fff;border-radius:10px;place-items:center;width:40px;height:40px;display:inline-grid}.admin-collapse-btn{transform:rotate(180deg)}.admin-breadcrumb{color:#97a7a3;align-items:center;gap:9px;font-size:.72rem;display:flex}.admin-breadcrumb i{font-style:normal}.admin-breadcrumb strong{color:#314946}.admin-top-link{color:#5e7470;padding:8px 10px;font-size:.74rem}.admin-top-link:hover{color:var(--brand)}.admin-user-button{cursor:pointer;background:0 0;border:0;align-items:center;gap:9px;padding:4px;display:flex}.admin-user-button strong{color:#304945;font-size:.72rem;display:block}.admin-user-button small{color:#8b9d99;margin-top:3px;font-size:.61rem;display:block}.admin-avatar{background:var(--teal-soft);width:38px;height:38px;color:var(--brand);border-radius:12px;place-items:center;font-weight:900;display:grid}.admin-avatar.small{border-radius:9px;width:32px;height:32px;font-size:.72rem}.admin-user-dropdown{border:1px solid var(--line);width:170px;box-shadow:var(--shadow-md);background:#fff;border-radius:14px;padding:7px;position:absolute;top:58px;left:0}.admin-user-dropdown a,.admin-user-dropdown button{text-align:right;cursor:pointer;background:0 0;border:0;border-radius:9px;width:100%;padding:9px 10px;font-size:.72rem;display:block}.admin-user-dropdown a:hover,.admin-user-dropdown button:hover{background:#f1f5f3}.admin-user-menu{position:relative}.admin-content{max-width:1500px;margin:0 auto;padding:28px}.admin-page-header{justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px;display:flex}.admin-page-header h1{font-family:var(--font-display);margin:5px 0;font-size:1.7rem}.admin-page-header p{color:#7d8e8b;max-width:700px;margin:0;font-size:.74rem;line-height:1.8}.admin-page-header .eyebrow{margin-bottom:0}.admin-stat-grid{grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:18px;display:grid}.admin-stat-card{border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;border-radius:17px;align-items:center;gap:11px;padding:16px;display:flex}.stat-icon{background:var(--teal-soft);width:42px;height:42px;color:var(--brand);border-radius:12px;place-items:center;display:grid}.stat-icon.amber{background:var(--accent-soft);color:#9b702f}.stat-icon.blue{color:#3f6f93;background:#edf3f8}.stat-icon.violet{color:#705a9d;background:#f1eef8}.stat-icon.rose{color:#a65b5b;background:#f8eeee}.stat-icon.cyan{color:#427b88;background:#eaf4f6}.admin-stat-card span{color:#7e908b;font-size:.62rem;line-height:1.5;display:block}.admin-stat-card strong{font-family:var(--font-display);margin-top:3px;font-size:1.12rem;display:block}.admin-grid-2{grid-template-columns:1.15fr .85fr;gap:16px;display:grid}.admin-panel{border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;border-radius:18px;padding:19px}.panel-head{justify-content:space-between;align-items:center;gap:15px;margin-bottom:17px;display:flex}.panel-head h2{font-family:var(--font-display);margin:0;font-size:1rem}.panel-meta{color:#93a29e;margin-top:4px;font-size:.62rem;display:block}.panel-link{color:#9b702f;font-size:.68rem;font-weight:900}.admin-list{gap:8px;display:grid}.admin-list-row{border:1px solid #edf1ef;border-radius:12px;align-items:center;gap:10px;padding:10px;display:flex}.admin-list-row>span:first-child,.row-icon{background:var(--teal-soft);width:34px;height:34px;color:var(--brand);border-radius:10px;flex:none;place-items:center;display:grid}.admin-list-row>span:nth-child(2){flex:1;min-width:0}.admin-list-row strong{font-size:.72rem;display:block}.admin-list-row small{color:#909f9b;margin-top:3px;font-size:.61rem;display:block}.admin-list-row time{color:#a0aeaa;font-size:.58rem}.quick-actions{grid-template-columns:1fr 1fr;gap:9px;display:grid}.quick-actions a{border:1px solid var(--line);border-radius:14px;grid-template-columns:34px 1fr;gap:0 9px;padding:13px;display:grid}.quick-actions a:hover{background:#f5f8f6;border-color:#c9dad6}.quick-actions span{background:var(--teal-soft);width:34px;height:34px;color:var(--brand);border-radius:10px;grid-row:span 2;place-items:center;display:grid}.quick-actions b{font-size:.7rem}.quick-actions small{color:#8b9b97;margin-top:3px;font-size:.58rem}.admin-toolbar{flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:17px;display:flex}.admin-search{border:1px solid var(--line);background:#fbfcfb;border-radius:12px;flex:1;align-items:center;gap:8px;min-width:200px;padding:0 12px;display:flex}.admin-search span{color:#8b9b97}.admin-search input{background:0 0;border:0;outline:0;width:100%;padding:11px 3px;font-size:.74rem}.admin-select,.admin-field select{border:1px solid var(--line);color:#415a56;background:#fff;border-radius:11px;outline:none;padding:10px 12px}.admin-table-wrap{border:1px solid #e5ece9;border-radius:14px;overflow:auto}.admin-table{border-collapse:collapse;width:100%;min-width:720px}.admin-table th{color:#879792;text-align:right;background:#f7f9f8;padding:12px 14px;font-size:.63rem;font-weight:900}.admin-table td{vertical-align:middle;border-top:1px solid #edf1ef;padding:12px 14px;font-size:.69rem}.table-title{align-items:center;gap:10px;min-width:250px;display:flex}.table-title>div{min-width:0}.table-title strong{font-size:.74rem;display:block}.table-title small{color:#8d9b97;white-space:nowrap;text-overflow:ellipsis;max-width:330px;margin-top:3px;font-size:.6rem;display:block;overflow:hidden}.badge{border-radius:999px;align-items:center;padding:5px 9px;font-size:.59rem;font-weight:900;display:inline-flex}.badge-soft{color:#52716c;background:#edf4f2}.badge-success{color:#2c7b4e;background:#e5f4eb}.badge-muted{color:#808f8b;background:#f0f3f2}.table-actions{justify-content:flex-start;align-items:center;gap:8px;display:flex}.table-actions a,.table-actions button{color:#356b68;cursor:pointer;background:0 0;border:0;padding:4px;font-size:.64rem;font-weight:900}.table-actions form button{color:#a25c5c}.admin-form-shell{gap:16px;display:grid}.form-section{gap:17px;display:grid}.form-section h2{font-family:var(--font-display);margin:0;font-size:1rem}.form-section>p{color:#879792;margin:0;font-size:.68rem}.admin-form-grid{gap:14px;display:grid}.admin-form-grid.two{grid-template-columns:1fr 1fr}.admin-form-grid .full{grid-column:1/-1}.admin-field{gap:7px;display:grid}.admin-field>span{color:#4d615d;font-size:.69rem;font-weight:900}.admin-field em{color:#b26d26;font-style:normal}.admin-field input,.admin-field textarea{border:1px solid var(--line);width:100%;color:var(--text);background:#fff;border-radius:11px;outline:none;padding:11px 12px;font-size:.75rem;transition:all .15s}.admin-field input:focus,.admin-field textarea:focus,.admin-field select:focus{border-color:#8fb5b0;box-shadow:0 0 0 3px #0b5a5b12}.admin-field textarea{resize:vertical;line-height:1.85}.upload-zone{text-align:center;cursor:pointer;background:#f8fbfa;border:1.5px dashed #aec4bf;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:190px;padding:25px;display:flex}.upload-zone input{display:none}.upload-zone strong{font-size:.75rem}.upload-zone small{color:#8b9b97;font-size:.61rem}.upload-icon{background:var(--teal-soft);width:45px;height:45px;color:var(--brand);border-radius:13px;place-items:center;display:grid}.upload-zone.compact{min-height:140px}.current-file{color:#758682;background:#f3f7f5;border-radius:10px;margin-top:12px;padding:10px;font-size:.68rem}.cover-preview,.news-preview{object-fit:cover;border:1px solid var(--line);border-radius:13px;width:130px;max-height:180px}.checkbox-field{align-items:center;gap:8px;font-size:.69rem;font-weight:800;display:flex}.checkbox-field input{accent-color:var(--brand)}.admin-form-actions{justify-content:flex-end;gap:9px;margin-top:3px;display:flex}.admin-modal-backdrop{z-index:100;background:#05242594;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.admin-modal{background:#fff;border-radius:21px;width:min(560px,100%);padding:22px;box-shadow:0 30px 80px #0003}.admin-modal-head{justify-content:space-between;align-items:start;margin-bottom:20px;display:flex}.admin-alert{border-radius:13px;align-items:flex-start;gap:10px;margin-bottom:18px;padding:12px 14px;font-size:.7rem;display:flex}.admin-alert.success{color:#286847;background:#eaf5ee}.admin-alert.error{color:#944d4d;background:#faeded}.admin-alert>span{font-weight:900}.admin-alert>div{flex:1}.admin-alert button{cursor:pointer;background:0 0;border:0}.admin-alert ul{margin:5px 0 0;padding-right:15px}.question-meta{color:#8a9a95;justify-content:space-between;margin-top:15px;font-size:.65rem;display:flex}.profile-hero{border-bottom:1px solid #e8eeeb;align-items:center;gap:14px;margin-bottom:20px;padding-bottom:20px;display:flex}.profile-avatar{background:var(--teal-soft);width:65px;height:65px;color:var(--brand);border-radius:20px;place-items:center;font-size:1.5rem;font-weight:900;display:grid}.profile-hero h2{font-family:var(--font-display);margin:0;font-size:1.15rem}.profile-hero span{color:#899a95;font-size:.68rem}.admin-mobile-overlay{display:none}.login-page{background:#eef3f1;grid-template-columns:1.02fr .98fr;min-height:100vh;display:grid}.login-art{background:linear-gradient(145deg,var(--brand-deep),#0b5a5b);color:#fff;flex-direction:column;justify-content:space-between;padding:42px clamp(30px,6vw,90px);display:flex;position:relative;overflow:hidden}.login-art:after{content:"";border:1px solid #ffffff14;border-radius:50%;width:620px;height:620px;position:absolute;bottom:-300px;right:-300px}.login-brand{font-family:var(--font-display);z-index:1;align-items:center;gap:11px;font-size:1.2rem;font-weight:900;display:flex;position:relative}.login-brand img{object-fit:contain;width:58px;height:58px}.login-quote{z-index:1;max-width:540px;position:relative}.login-quote h1{font-family:var(--font-display);margin:12px 0 18px;font-size:clamp(2rem,4vw,4rem);line-height:1.2}.login-quote p{color:#c8d9d5;line-height:2}.login-art-foot{color:#91aaa4;z-index:1;font-size:.68rem;position:relative}.login-card-wrap{place-items:center;padding:30px;display:grid}.login-card{border:1px solid var(--line);width:min(460px,100%);box-shadow:var(--shadow-lg);background:#fff;border-radius:25px;padding:clamp(25px,5vw,45px)}.login-card h2{font-family:var(--font-display);margin:5px 0;font-size:2rem}.login-subtitle{color:#879792;margin:0 0 25px;font-size:.8rem}.password-field{position:relative}.password-field input{padding-left:45px}.password-field button{color:#55716c;cursor:pointer;background:#f2f6f4;border:0;border-radius:8px;width:34px;height:34px;position:absolute;top:7px;left:7px}.login-mobile-brand{display:none}.login-back{text-align:center;color:#758682;margin-top:20px;font-size:.7rem;display:block}@media (width<=1180px){.desktop-nav{display:none}.mobile-toggle{display:inline-flex}.quick-grid,.feature-grid,.audio-grid{grid-template-columns:repeat(2,1fr)}.book-grid{grid-template-columns:repeat(3,1fr)}.news-grid{grid-template-columns:repeat(2,1fr)}.admin-stat-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=960px){.hero-grid{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:70px 0 15px}.hero-visual{padding:15px 0 75px}.home-featured{grid-template-columns:1fr}.book-catalog{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.admin-sidebar{transform:translate(100%)}.admin-sidebar.is-open{transform:translate(0)}.admin-main,.admin-main.is-collapsed{margin-right:0}.admin-mobile-overlay{z-index:65;background:#0006;display:block;position:fixed;inset:0}.admin-content{padding:22px}.admin-stat-grid{grid-template-columns:repeat(2,1fr)}.admin-grid-2,.login-page{grid-template-columns:1fr}.login-art{display:none}.login-mobile-brand{place-items:center;margin-bottom:20px;display:grid}.login-mobile-brand img{width:76px;height:76px}}@media (width<=640px){.site-container{width:min(100% - 24px,1240px)}.nav-inner{min-height:68px}.site-brand img{width:43px;height:43px}.nav-about{display:none!important}.hero-copy h1{font-size:2.55rem}.hero-copy p{font-size:.95rem}.hero-art{width:330px}.hero-note{bottom:2%;right:-2px}.section{padding:60px 0}.section-head{flex-direction:column;align-items:start;gap:8px}.quick-grid,.feature-grid,.audio-grid,.news-grid,.book-catalog{grid-template-columns:1fr}.book-grid{grid-template-columns:repeat(2,1fr)}.book-card.large{grid-template-columns:105px 1fr}.book-card.large .book-cover{height:165px}.site-filters{flex-direction:column}.site-filters select{height:48px}.detail-card,.book-detail{grid-template-columns:1fr}.detail-icon{width:82px;height:82px}.detail-cover{width:190px}.fatwa-card{grid-template-columns:1fr 25px}.fatwa-number{grid-column:1/-1}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:7px}.audio-player-inner{grid-template-columns:auto 1fr;width:calc(100% - 20px)}.player-actions,.player-title span,.player-volume{display:none}.radio-wave{display:none!important}.reader-head{flex-direction:column;align-items:start}.reader-frame{height:70vh}.admin-page-header{flex-direction:column;align-items:start}.admin-stat-grid{grid-template-columns:1fr 1fr}.admin-grid-2,.admin-form-grid.two{grid-template-columns:1fr}.admin-form-grid .full{grid-column:auto}.admin-topbar{padding:0 14px}.admin-top-link,.admin-breadcrumb span,.admin-breadcrumb i{display:none}.quick-actions{grid-template-columns:1fr}.admin-content,.admin-panel,.login-card-wrap{padding:16px}.login-card{padding:25px 20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.empty-state{text-align:center;color:#788b86;background:#f1f5f3;border:1px dashed #cddbd7;border-radius:16px;grid-column:1/-1;padding:34px 18px;font-size:.78rem}.admin-empty{text-align:center;color:#97a6a2;padding:30px 10px;font-size:.72rem}.admin-panel nav,.site-pagination nav{margin-top:18px}.admin-panel nav>div,.site-pagination nav>div{flex-wrap:wrap;justify-content:center;align-items:center;gap:4px;display:flex}.admin-panel nav a,.admin-panel nav span,.site-pagination nav a,.site-pagination nav span{border:1px solid var(--line);color:#5b706c;background:#fff;border-radius:9px;justify-content:center;align-items:center;min-width:34px;height:34px;padding:0 9px;font-size:.66rem;display:inline-flex}.admin-panel nav a:hover,.site-pagination nav a:hover{background:var(--teal-soft);color:var(--brand)}.identity-hero{border-bottom:1px solid var(--line);background:linear-gradient(#fbf8f1 0%,#fffdf9 58%,#edf4f1 100%);position:relative;overflow:hidden}.identity-banner-wrap{background:#fbf8f1;border-bottom:1px solid #b8893d33;width:100%}.identity-banner{object-fit:contain;object-position:center;width:100%;height:auto;max-height:390px;display:block}.identity-banner-fallback{background:radial-gradient(circle,#b8893d24,#0000 45%),#fbf8f1;place-items:center;min-height:220px;display:grid}.identity-fallback-inner{color:var(--brand-deep);text-align:right;align-items:center;gap:18px;padding:35px 24px;display:flex}.identity-fallback-inner img{object-fit:contain;width:82px;height:82px}.identity-fallback-inner span,.identity-fallback-inner strong{font-family:var(--font-display);display:block}.identity-fallback-inner span{color:var(--accent);font-size:.85rem;font-weight:900}.identity-fallback-inner strong{margin-top:5px;font-size:clamp(1.35rem,3vw,2.4rem)}.identity-intro{grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:70px;padding:64px 0 78px;display:grid}.identity-copy{max-width:780px}.identity-copy h1{font-family:var(--font-display);letter-spacing:-.04em;color:var(--brand-deep);margin:13px 0 19px;font-size:clamp(2.25rem,5vw,4.35rem);line-height:1.16}.identity-copy h1 em{color:var(--accent);font-style:normal}.identity-copy p{max-width:720px;color:var(--text-2);margin:0 0 27px;font-size:1rem;line-height:2.05}.identity-seal{width:230px;height:230px;color:var(--brand-deep);justify-self:center;place-items:center;display:grid;position:relative}.seal-ring,.seal-ring:before,.seal-ring:after{content:"";border:1px solid #b8893d57;border-radius:50%;position:absolute;inset:0}.seal-ring:before{border-color:#0b5a5b2e;inset:13px}.seal-ring:after{border-style:dashed;border-color:#b8893d47;inset:29px}.seal-content{width:150px;height:150px;box-shadow:var(--shadow-md);text-align:center;background:#ffffffc2;border:1px solid #b8893d40;border-radius:50%;align-content:center;place-items:center;gap:3px;display:grid}.seal-content span{font-family:var(--font-display);font-size:.72rem;font-weight:800}.seal-content strong{font-family:var(--font-display);color:var(--accent);font-size:2rem;line-height:1}.seal-content small{color:var(--text-3);font-size:.56rem}.page-hero{background:linear-gradient(#f5efe3 0%,#edf4f1 100%);position:relative;overflow:hidden}.page-hero:after,.detail-hero:after{content:"";pointer-events:none;border:1px solid #b8893d33;border-radius:50%;width:300px;height:300px;position:absolute;bottom:-170px;left:-150px}.page-hero .site-container,.detail-hero .site-container{z-index:1;position:relative}.content-card,.book-card,.news-card,.fatwa-card,.mini-stat,.prose-card{box-shadow:0 8px 26px #063e400b}.content-card:hover,.book-card:hover,.news-card:hover,.fatwa-card:hover{border-color:#b8893d57}.content-card:focus-within,.book-card:focus-within,.news-card:focus-within,.fatwa-card:focus-within{outline-offset:3px;outline:2px solid #b8893d61}.radio-hero-inner{grid-template-columns:minmax(0,1fr) 270px;align-items:center;gap:60px;display:grid}.radio-hero-copy{z-index:2;position:relative}.radio-hero h1{max-width:760px;font-size:clamp(2.3rem,5vw,4.5rem)}.radio-hero p{max-width:720px;font-size:.98rem}.radio-player-card{background:#ffffff14;border:1px solid #ffffff24;border-radius:22px;align-items:center;gap:16px;max-width:820px;margin-top:30px;padding:15px;display:flex;box-shadow:0 20px 45px #0000001f}.radio-player-card>div{gap:4px;min-width:0;display:grid}.radio-player-card strong{font-family:var(--font-display);font-size:.92rem}.radio-player-card div span{color:#bcd0cb;font-size:.7rem}.radio-ornament{place-items:center;display:grid}.radio-seal{color:#d7ad65;background:radial-gradient(circle,#d7ad651f,#0000 65%);border:1px solid #d7ad6559;border-radius:50%;align-content:center;place-items:center;gap:5px;width:220px;height:220px;display:grid;position:relative}.radio-seal:before,.radio-seal:after{content:"";border:1px solid #ffffff17;border-radius:50%;position:absolute}.radio-seal:before{inset:17px}.radio-seal:after{border-style:dashed;inset:35px}.radio-seal .icon{width:40px;height:40px}.radio-seal span{font-size:.7rem}.radio-seal strong{font-family:var(--font-display);font-size:1.5rem}.radio-columns{grid-template-columns:1fr 1fr;gap:18px;display:grid}.radio-panel{border:1px solid var(--line);min-width:0;box-shadow:var(--shadow-sm);background:#fff;border-radius:22px;padding:21px}.radio-panel .panel-head{align-items:center}.radio-panel .panel-head h2{margin-top:5px}.radio-list{gap:9px;max-height:540px;padding-inline-end:2px;display:grid;overflow:auto}.playlist-row,.radio-history-row{background:#fbfcfb;border:1px solid #edf1ef;border-radius:14px;justify-content:space-between;align-items:center;gap:14px;padding:13px 14px;transition:all .18s;display:flex}.playlist-row:hover,.radio-history-row:hover{background:#fffdf9;border-color:#b8893d59}.playlist-row>div,.history-main>div{min-width:0}.playlist-row strong,.history-main strong{font-size:.76rem;line-height:1.7;display:block}.playlist-row span,.history-main>div>span{color:#879792;align-items:center;gap:5px;margin-top:5px;font-size:.62rem;display:flex}.playlist-row time{text-align:center;background:var(--accent-soft);color:#8f672d;border-radius:10px;flex:none;min-width:82px;padding:8px 9px;font-size:.66rem;font-weight:900}.history-main{align-items:center;gap:10px;min-width:0;display:flex}.history-main em{color:#a27635;font-style:normal}.player-list-button{background:var(--accent);width:40px;height:40px;color:var(--brand-deep);cursor:pointer;border:0;border-radius:50%;flex:none;place-items:center;display:grid;box-shadow:0 7px 17px #b8893d33}.player-list-button:disabled{opacity:.45;cursor:not-allowed}.radio-list-state{text-align:center;color:#83938f;background:#f6f9f7;border:1px dashed #cfddda;border-radius:15px;place-items:center;min-height:190px;padding:25px;font-size:.72rem;display:grid}.radio-error{color:#9d5b55;background:#fff2f0;border-radius:10px;margin-top:10px;padding:10px 12px;font-size:.66rem}.site-footer{position:relative;overflow:hidden}.site-footer:before{content:"";pointer-events:none;border:1px solid #d7ad651c;border-radius:50%;width:420px;height:420px;position:absolute;top:-220px;left:-230px}.footer-brand-block{position:relative}.footer-ornament{color:#c89a4c;align-items:center;gap:9px;width:190px;margin-top:18px;display:flex}.footer-ornament i{background:#d7ad6547;flex:1;height:1px}.footer-ornament span{font-family:var(--font-display);font-size:.65rem;font-weight:900}.footer-grid>div>h3,.footer-app-card h3{font-family:var(--font-display);color:#fff;margin:0 0 13px;font-size:.88rem}.footer-grid>div>a{color:#a9c0bb;width:max-content;max-width:100%;padding:5px 0;font-size:.72rem;transition:all .18s;display:block}.footer-grid>div>a:hover{color:#e0be7a;transform:translate(-2px)}.footer-app-card{background:#ffffff0b;border:1px solid #d7ad652e;border-radius:18px;padding:19px}.footer-app-card .eyebrow{color:#d8b66e}.footer-app-card p{color:#9db3ae;margin:0 0 15px;font-size:.72rem;line-height:1.9}.google-play-badge{background:#071f20;border:1px solid #ffffff29;border-radius:12px;align-items:center;gap:10px;color:#fff!important;width:auto!important;padding:9px 13px!important;display:inline-flex!important}.google-play-badge:hover{background:#0a292a!important;border-color:#d7ad6580!important;transform:none!important}.google-play-icon{color:#0b5a5b;background:#fff;border-radius:9px;place-items:center;width:31px;height:31px;font-size:.72rem;display:grid}.google-play-badge small,.google-play-badge strong{line-height:1.1;display:block}.google-play-badge small{color:#9bb4ae;margin-bottom:3px;font-size:.5rem}.google-play-badge strong{font-size:.8rem}.audio-player{padding-bottom:env(safe-area-inset-bottom)}.audio-player-inner{min-height:70px}.player-button:focus-visible,.player-actions button:focus-visible,.radio-play:focus-visible,.player-list-button:focus-visible{outline-offset:3px;outline:3px solid #d7ad658c}.player-main{min-width:0}.player-title{align-items:center}.player-title strong{max-width:70vw}.player-error{color:#f3b3a7;margin-top:3px;font-size:.62rem}.admin-shell{background:radial-gradient(circle at 100% 0,#0b5a5b0a,#0000 30%),#f2f6f4}.admin-sidebar{background:linear-gradient(#063e40,#073f41 72%,#082f31)}.admin-brand .brand-mark{position:relative}.admin-brand .brand-mark:after{content:"";border:1px solid #d7ad6533;border-radius:13px;position:absolute;inset:-4px}.admin-nav-item{min-height:43px}.admin-nav-item.active{background:linear-gradient(135deg,#d7ad65,#c49349)}.admin-panel{box-shadow:0 8px 25px #063e400a}.admin-table tbody tr:hover{background:#fbfdfc}.admin-field input::placeholder,.admin-field textarea::placeholder,.admin-search input::placeholder{color:#a2afac}.admin-field input[type=file]{padding:9px}.admin-form-actions{flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:9px;display:flex}.admin-modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#031c1d7a;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.admin-modal{border:1px solid var(--line);background:#fff;border-radius:22px;width:min(560px,100%);max-height:min(90vh,760px);padding:20px;overflow:auto;box-shadow:0 30px 80px #0003}.admin-modal-head{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:17px;display:flex}.admin-modal-head h3{font-family:var(--font-display);margin:5px 0 0;font-size:1.15rem}@media (width<=960px){.identity-intro{grid-template-columns:1fr;gap:10px;padding-top:52px}.identity-seal{width:190px;height:190px;margin:10px auto 0}.identity-seal .seal-content{width:125px;height:125px}.radio-hero-inner{grid-template-columns:1fr;gap:25px}.radio-ornament{display:none}.radio-columns{grid-template-columns:1fr}}@media (width<=640px){.identity-banner{height:auto !important;max-height:none}.identity-banner-fallback{min-height:170px}.identity-fallback-inner{gap:12px}.identity-fallback-inner img{width:60px;height:60px}.identity-copy h1{font-size:2.3rem}.identity-copy p{font-size:.9rem}.identity-seal{width:155px;height:155px}.identity-seal .seal-content{width:105px;height:105px}.seal-content strong{font-size:1.55rem}.radio-hero{padding:58px 0 65px}.radio-player-card{align-items:flex-start}.radio-play{flex:none;width:56px;height:56px}.radio-player-card div span{line-height:1.7}.radio-panel{padding:15px}.playlist-row,.radio-history-row{padding:11px}.playlist-row time{min-width:72px}.footer-app-card{padding:16px}.audio-player-inner{min-height:64px}.player-button{width:44px;height:44px}.player-title strong{max-width:55vw}}.player-spinner{border:2px solid #063e4040;border-top-color:var(--brand-deep);border-radius:50%;width:16px;height:16px;animation:.7s linear infinite player-spin}.player-volume-control{align-items:center;gap:6px;display:flex}.player-live-label{color:#b9cfca}@media (width<=640px){.player-error{white-space:nowrap;text-overflow:ellipsis;max-width:55vw;position:absolute;bottom:4px;right:58px;overflow:hidden}.player-main{position:relative}}.hidden{display:none!important}.flex{display:flex}.items-center{align-items:center}.min-w-0{min-width:0}.w-full{width:100%}.text-right{text-align:right}.gap-2{gap:.5rem}.gap-3{gap:.75rem}@media (width>=641px){.sm\:block{display:block!important}.sm\:inline-flex{display:inline-flex!important}}@media (width>=961px){.lg\:hidden{display:none!important}.lg\:inline-grid{display:inline-grid!important}}:root{--brand:#0a625f;--brand-deep:#043b3e;--brand-2:#2b817c;--accent:#c79a55;--accent-soft:#f4e8d3;--surface:#fffdf9;--surface-2:#f1f6f3;--surface-3:#e6efec;--text:#102f31;--text-2:#506763;--text-3:#7d8f8b;--line:#dbe7e3;--shadow-sm:0 8px 28px #043b3e0f;--shadow-md:0 18px 55px #043b3e1c;--shadow-lg:0 30px 90px #043b3e2b}body{color:var(--text);background:#fffdf9}.site-container{width:min(1340px,100% - 48px)}.site-header{-webkit-backdrop-filter:blur(24px)saturate(160%);backdrop-filter:blur(24px)saturate(160%);background:#fffdf9c7;border-bottom:1px solid #043b3e14;box-shadow:0 5px 24px #043b3e09}.site-header:after{content:"";background:linear-gradient(90deg,#0000,#c79a558c,#0000);height:1px;position:absolute;bottom:0;left:8%;right:8%}.nav-inner{min-height:88px}.site-brand img{filter:drop-shadow(0 8px 15px #043b3e1f);width:54px;height:54px}.site-brand strong{letter-spacing:-.025em;font-size:1.02rem}.site-brand small{color:#82938f}.desktop-nav{gap:4px}.desktop-nav a{padding:.72rem .82rem;font-size:.82rem}.desktop-nav a:after{content:"";background:var(--accent);border-radius:99px;height:2px;transition:transform .2s;position:absolute;bottom:5px;left:13px;right:13px;transform:scaleX(0)}.desktop-nav a:hover:after,.desktop-nav a.active:after{transform:scaleX(1)}.nav-search,.nav-about,.mobile-toggle{background:#ffffffe0;border-color:#d8e5e1;border-radius:14px}.nav-search{width:45px;height:45px}.nav-about{padding:.66rem .95rem}.identity-hero{background:linear-gradient(#fbf7ee 0%,#fffdf9 54%,#edf5f2 100%)}.identity-banner-wrap{background:#062f31;box-shadow:0 20px 55px #043b3e1f}.identity-banner{object-fit:cover;object-position:center;height:clamp(280px,34vw,520px);transform:scale(1.001)}.identity-banner-wrap:after{background:linear-gradient(#03232500 45%,#03232561 100%)}.identity-intro{grid-template-columns:minmax(0,1fr) 300px;gap:90px;padding:78px 0 88px}.identity-copy h1{letter-spacing:-.06em;margin:16px 0 22px;font-size:clamp(2.55rem,5.2vw,5.1rem);line-height:1.08}.identity-copy h1 em{color:var(--accent)}.identity-copy p{max-width:760px;font-size:1.03rem;line-height:2.15}.hero-actions .btn{box-shadow:0 14px 32px #043b3e1a}.identity-seal{width:270px;height:270px}.seal-content{background:#ffffffd6;width:174px;height:174px;box-shadow:0 22px 55px #043b3e1f}.home-quick{margin-top:-34px}.quick-grid{gap:13px}.quick-card{border-radius:22px;min-height:104px;padding:17px 19px;box-shadow:0 18px 42px #043b3e17}.quick-card:hover{transform:translateY(-7px)}.quick-icon{border-radius:16px;width:51px;height:51px}.section{padding:96px 0}.section-muted{background:linear-gradient(#f5f9f7,#edf5f2)}.section-head{margin-bottom:32px}.section-head h2{font-size:clamp(1.8rem,3vw,2.55rem)}.text-link{font-size:.8rem}.content-grid{gap:20px}.content-card,.book-card,.news-card,.fatwa-card{box-shadow:var(--shadow-sm);border-radius:24px}.content-card:hover,.book-card:hover,.news-card:hover,.fatwa-card:hover{box-shadow:var(--shadow-md);border-color:#c5dad5;transform:translateY(-7px)}.audio-cover{background:radial-gradient(circle at 50% 45%,#c79a5533,#0000 27%),linear-gradient(135deg,#063c3f,#0a6b67);height:190px}.card-logo{width:90px;height:90px}.play-overlay{background:linear-gradient(135deg,#d9b477,#b9843f);width:47px;height:47px}.content-body{padding:19px}.content-body h3,.book-card h3{font-size:1.02rem}.content-body p{font-size:.75rem}.book-grid{gap:20px}.book-card{padding:13px}.book-cover{border-radius:17px;height:245px}.book-card:hover .book-cover img{transform:scale(1.05)}.news-grid{gap:20px}.news-card{overflow:hidden}.news-card img{transition:transform .5s}.news-card:hover img{transform:scale(1.035)}.fatwa-list{gap:13px}.fatwa-card{border-radius:20px;padding:21px 22px}.fatwa-card:hover{transform:translate(-5px)}.android-app-section{background:linear-gradient(#fbf7ef,#f7f0e4)}.android-app-card{background:radial-gradient(circle at 15% 85%,#c79a5524,#0000 25%),linear-gradient(135deg,#043b3e,#0a6662);border-radius:36px;padding:62px;box-shadow:0 30px 90px #043b3e33}.android-app-card:before{border-color:#ffffff14}.android-app-copy h2{font-size:clamp(2rem,4vw,3.2rem)}.android-app-copy p{font-size:.92rem}.android-app-visual img{filter:drop-shadow(0 32px 50px #0000005c)}.section-dark{background:radial-gradient(circle at 85% 20%,#c79a551f,#0000 24%),linear-gradient(135deg,#04383b,#0a6260)}.home-featured{gap:70px}.home-feature-panel h2{letter-spacing:-.04em;font-size:clamp(2.1rem,4vw,3.9rem)}.mini-stat{border-radius:19px;padding:21px}.page-hero{background:radial-gradient(circle at 80% 25%,#c79a5521,#0000 25%),linear-gradient(135deg,#043b3e,#0a6662);padding:84px 0}.page-hero h1{letter-spacing:-.045em;font-size:clamp(2.4rem,5vw,4.2rem)}.page-hero p{font-size:.9rem}.detail-hero{background:radial-gradient(circle at 75% 20%,#c79a5521,#0000 24%),linear-gradient(135deg,#043b3e,#0a6260)}.detail-card h1,.book-detail h1{letter-spacing:-.04em}.detail-cover{border-radius:25px;box-shadow:0 30px 75px #00000040}.article-page article,.prose-card{box-shadow:var(--shadow-sm);border-radius:30px}.radio-hero{background:radial-gradient(circle at 78% 25%,#c79a5529,#0000 25%),linear-gradient(135deg,#04383b,#0a6562);padding:100px 0}.radio-hero h1{letter-spacing:-.055em;font-size:clamp(2.4rem,5vw,4.7rem)}.radio-current-track,.radio-recorder-card{background:#fff1;border-color:#ffffff24;box-shadow:0 20px 55px #00000014}.radio-current-track{padding:20px}.radio-data-section{background:#f2f7f4}.radio-panel{box-shadow:var(--shadow-sm);border-radius:25px;padding:25px}.playlist-row,.radio-history-row{border-radius:16px;padding:16px}.playlist-row:hover,.radio-history-row:hover{transform:translate(-2px)}.audio-player{-webkit-backdrop-filter:blur(20px)saturate(130%);backdrop-filter:blur(20px)saturate(130%);background:#032729f5;box-shadow:0 -20px 65px #0003}.audio-player-inner{width:min(1340px,100% - 30px);padding:13px 0}.player-button{background:linear-gradient(135deg,#d9b477,#b9843f);width:52px;height:52px;box-shadow:0 12px 28px #00000038}.player-range,.player-volume{accent-color:#d9b477}.site-footer{background:radial-gradient(circle at 85% 0,#c79a5514,#0000 22%),#052e31;padding-top:82px}.footer-grid{gap:50px;padding-bottom:62px}.footer-app-card{background:#ffffff0e;border-radius:22px}.footer-bottom{padding:20px 0}.site-search,.big-search,.site-filters select{border-radius:16px}.site-search:focus-within,.big-search:focus-within{box-shadow:0 0 0 4px #0a625f12}@keyframes akFadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.identity-copy,.identity-seal,.quick-card,.content-card,.book-card,.news-card,.fatwa-card{animation:.65s both akFadeUp}.quick-card:nth-child(2),.content-card:nth-child(2),.book-card:nth-child(2){animation-delay:60ms}.quick-card:nth-child(3),.content-card:nth-child(3),.book-card:nth-child(3){animation-delay:.12s}.quick-card:nth-child(4),.content-card:nth-child(4),.book-card:nth-child(4){animation-delay:.18s}@media (width<=1180px){.desktop-nav{display:none}.mobile-toggle{display:inline-flex}.quick-grid,.content-grid{grid-template-columns:repeat(2,1fr)}.book-grid{grid-template-columns:repeat(4,1fr)}.news-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=960px){.site-container{width:min(100% - 32px,1340px)}.identity-intro{grid-template-columns:1fr;gap:35px;padding:62px 0 76px}.identity-seal{justify-self:start}.android-app-card{grid-template-columns:1fr;padding:48px 36px}.home-featured{grid-template-columns:1fr;gap:25px}.radio-columns{grid-template-columns:1fr}.book-catalog,.footer-grid{grid-template-columns:1fr 1fr}.detail-card{grid-template-columns:95px 1fr}.book-detail{grid-template-columns:220px 1fr}}@media (width<=640px){.site-container{width:calc(100% - 24px)}.nav-inner{min-height:70px}.site-brand img{width:44px;height:44px}.site-brand strong{font-size:.78rem}.site-brand small{font-size:.54rem}.identity-banner{height:250px}.identity-intro{padding:48px 0 62px}.identity-copy h1{font-size:2.55rem}.identity-copy p{font-size:.9rem}.identity-seal{width:205px;height:205px}.seal-content{width:138px;height:138px}.quick-grid,.content-grid,.news-grid,.book-catalog{grid-template-columns:1fr}.book-grid{grid-template-columns:repeat(2,1fr)}.book-cover{height:205px}.section{padding:65px 0}.section-head{flex-direction:column;align-items:start;gap:8px}.android-app-card{border-radius:27px;padding:35px 22px}.android-app-copy h2{font-size:2rem}.android-app-visual{min-height:260px}.android-app-visual img{width:220px}.page-hero{padding:60px 0}.page-hero h1{font-size:2.5rem}.site-filters{flex-direction:column}.site-filters select{height:50px}.book-card.large{grid-template-columns:110px 1fr}.book-card.large .book-cover{height:170px}.detail-card,.book-detail{grid-template-columns:1fr}.detail-icon{width:80px;height:80px}.detail-cover{width:190px}.fatwa-card{grid-template-columns:1fr 25px}.fatwa-number{grid-column:1/-1}.radio-hero{padding:68px 0}.radio-hero h1{font-size:2.4rem}.radio-current-track{flex-direction:column;align-items:stretch}.radio-recorder-card{display:grid}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:7px}.audio-player-inner{grid-template-columns:auto 1fr;width:calc(100% - 18px)}.player-actions,.player-title span,.player-volume{display:none}.player-button{width:46px;height:46px}}@media (prefers-reduced-motion:reduce){.identity-copy,.identity-seal,.quick-card,.content-card,.book-card,.news-card,.fatwa-card{animation:none!important}}.nav-live{color:var(--brand-deep);background:#eaf4f1;border:1px solid #cfe2dd;border-radius:999px;align-items:center;gap:7px;padding:.68rem .82rem;font-size:.68rem;font-weight:900;transition:all .2s;display:inline-flex}.nav-live:hover{box-shadow:var(--shadow-sm);background:#fff;transform:translateY(-2px)}.nav-live span{background:#b9853f;border-radius:50%;width:7px;height:7px;animation:1.7s infinite livePulse;box-shadow:0 0 0 5px #b9853f1f}.nav-live b{font-weight:900}@keyframes livePulse{50%{box-shadow:0 0 0 8px #b9853f00}}@media (width<=640px){.nav-live{display:none}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}

/* Alkhaleel final polish */

.identity-strip { position:relative; overflow:hidden; background:linear-gradient(135deg,#073e40,#0b5a5b); color:#fff; border-bottom:1px solid rgba(184,137,61,.28); }
.identity-strip::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 12% 50%,rgba(184,137,61,.16),transparent 25%),linear-gradient(90deg,transparent 0 42%,rgba(255,255,255,.025)); pointer-events:none; }
.identity-strip-inner { min-height:132px; display:flex; align-items:center; justify-content:space-between; gap:28px; position:relative; z-index:1; }
.identity-strip-inner>div { display:grid; gap:7px; min-width:0; }
.identity-strip .eyebrow { color:#e5c58e; }
.identity-strip strong { font-family:var(--font-display); font-size:clamp(1.15rem,2.2vw,1.8rem); line-height:1.35; }
.identity-strip img { width:210px; height:92px; object-fit:cover; border-radius:18px; border:1px solid rgba(255,255,255,.13); opacity:.92; box-shadow:0 18px 45px rgba(0,0,0,.18); }
.identity-strip-mark { width:72px; height:72px; display:grid; place-items:center; border:1px solid rgba(229,197,142,.25); border-radius:50%; background:rgba(255,255,255,.06); }
.identity-strip-mark img { width:54px; height:54px; object-fit:contain; border:0; box-shadow:none; }

.radio-now-playing { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px; margin-top:25px; padding:18px; border:1px solid rgba(255,255,255,.14); border-radius:22px; background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.045)); box-shadow:0 25px 70px rgba(0,0,0,.13); }
.radio-now-icon { width:58px; height:58px; display:grid; place-items:center; border-radius:18px; background:rgba(184,137,61,.16); color:#e5c58e; }
.radio-now-copy { min-width:0; display:grid; gap:5px; }
.radio-now-copy small { color:#c7d9d5; font-size:.7rem; }
.radio-now-copy>strong { color:#fff; font-family:var(--font-display); font-size:1.05rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.radio-live-meta { display:flex; flex-wrap:wrap; gap:12px; color:#bdd0cc; font-size:.67rem; }
.radio-live-meta span { display:inline-flex; align-items:center; gap:5px; }
.radio-now-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.radio-hero-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:13px; }
.radio-hero-stats>div { padding:12px 14px; border:1px solid rgba(255,255,255,.1); border-radius:15px; background:rgba(255,255,255,.04); }
.radio-hero-stats span { display:block; color:#a9c0bb; font-size:.62rem; }
.radio-hero-stats strong { display:block; margin-top:4px; color:#fff; font-size:.75rem; }
.radio-recorder-wrap { position:relative; z-index:3; margin-top:18px; }
.radio-recorder-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center; padding:20px 22px; border:1px solid rgba(255,255,255,.14); border-radius:22px; background:rgba(5,49,51,.9); color:#fff; box-shadow:0 22px 60px rgba(0,0,0,.16); backdrop-filter:blur(16px); }
.radio-recorder-card h2 { margin:4px 0 5px; font-family:var(--font-display); font-size:1.05rem; }
.radio-recorder-card p { margin:0; color:#bdd0cc; font-size:.72rem; line-height:1.8; }
.recorder-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:9px; }
.recording-state { color:#f1d69e; font-size:.68rem; font-weight:800; }
.recording-state.error { color:#f2b5a9; }
.local-recordings { grid-column:1/-1; display:grid; gap:7px; padding-top:10px; border-top:1px solid rgba(255,255,255,.08); }
.local-recording { display:grid; grid-template-columns:minmax(0,1fr) auto auto auto; align-items:center; gap:9px; padding:9px 11px; border-radius:13px; background:rgba(255,255,255,.05); }
.local-recording strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.7rem; }
.local-recording>span { color:#a9c0bb; font-size:.64rem; }

.playlist-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; }
.playlist-row>div { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; min-width:0; }
.playlist-row strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.playlist-index { color:var(--accent); font-size:.68rem; font-weight:900; }
.playlist-row time { color:var(--brand); font-weight:900; font-size:.72rem; white-space:nowrap; }

.site-toast { position:fixed; right:18px; bottom:88px; z-index:120; max-width:min(360px,calc(100% - 36px)); padding:11px 15px; border-radius:14px; background:#073e40; color:#fff; box-shadow:0 18px 45px rgba(0,0,0,.2); font-size:.72rem; font-weight:800; opacity:0; transform:translateY(8px); pointer-events:none; transition:.2s ease; }
.site-toast.is-visible { opacity:1; transform:translateY(0); }
.js-bookmark.is-bookmarked { color:var(--accent)!important; background:var(--accent-soft)!important; border-color:#e3c993!important; }

.admin-notification-button { position:relative; width:42px; height:42px; display:inline-grid; place-items:center; border:1px solid var(--line); border-radius:13px; background:#fff; color:var(--brand); transition:.18s; }
.admin-notification-button:hover { border-color:#bfd4cf; box-shadow:var(--shadow-sm); transform:translateY(-1px); }
.admin-notification-button span { position:absolute; top:-4px; left:-4px; min-width:19px; height:19px; padding:0 5px; display:grid; place-items:center; border-radius:999px; background:var(--accent); color:#fff; border:2px solid #fff; font-size:.55rem; font-weight:900; }

.admin-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.admin-table { min-width:720px; }
.admin-table td,.admin-table th { vertical-align:middle; }
.admin-modal-backdrop .admin-modal { animation:akModalIn .18s ease both; }
@keyframes akModalIn { from { opacity:0; transform:translateY(8px) scale(.985); } to { opacity:1; transform:none; } }
.admin-sidebar { box-shadow:18px 0 55px rgba(0,0,0,.08); }
.admin-nav-item { min-height:45px; }
.admin-panel { box-shadow:0 10px 34px rgba(4,59,62,.055); }

@media (max-width:760px) {
    .identity-strip-inner { min-height:112px; }
    .identity-strip img { width:130px; height:70px; }
    .radio-now-playing { grid-template-columns:auto minmax(0,1fr); }
    .radio-now-actions { grid-column:1/-1; justify-content:stretch; }
    .radio-now-actions .btn { flex:1; }
    .radio-hero-stats { grid-template-columns:1fr; }
    .radio-recorder-card { grid-template-columns:1fr; }
    .recorder-actions { justify-content:flex-start; }
    .local-recording { grid-template-columns:1fr auto; }
    .local-recording .btn { min-height:36px; }
}
@media (max-width:520px) {
    .identity-strip-inner { gap:12px; }
    .identity-strip img { display:none; }
    .radio-now-icon { width:50px; height:50px; }
    .radio-now-copy>strong { font-size:.9rem; }
    .radio-now-actions { display:grid; grid-template-columns:1fr 1fr; }
    .radio-now-actions .btn { width:100%; padding-inline:.6rem; }
    .radio-recorder-card { padding:17px; }
    .site-toast { right:12px; bottom:80px; }
}
@media (prefers-reduced-motion:reduce) { .admin-modal-backdrop .admin-modal,.site-toast { animation:none!important; transition:none!important; } }

.site-progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:200;background:linear-gradient(90deg,var(--accent),#e3c68f,var(--brand));transform:scaleX(0);transform-origin:right;opacity:0;pointer-events:none;transition:transform .25s ease,opacity .15s ease}.site-progress.is-active{transform:scaleX(.72);opacity:1;animation:siteProgress 1s ease-in-out infinite}@keyframes siteProgress{50%{transform:scaleX(.92)}100%{transform:scaleX(.72)}}@media(prefers-reduced-motion:reduce){.site-progress{animation:none!important}}
.media-cover:before{background:#ffffff17;}
.book-cover img{height:auto;}
.home-feature-side .mini-stat {color:#102f31;}
.book-cover{background:#ffffff;}

/* =========================================================
   HOMEPAGE — SELECTED BOOKS
   ========================================================= */

.home-books-section {
    padding: 64px 0;
    background: #f6f3ec;
}


/* =========================================================
   SECTION HEADER
   ========================================================= */

.home-books-section .home-books-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.home-books-section .home-books-head > div {
    min-width: 0;
}

.home-books-section .home-books-head h2 {
    margin: 5px 0 6px;
    color: #183f3d;
    font-size: clamp(1.8rem, 2.8vw, 2.45rem);
    font-weight: 800;
    line-height: 1.2;
}

.home-books-section .home-books-head p {
    max-width: 540px;
    margin: 0;
    color: #77766e;
    font-size: .86rem;
    line-height: 1.8;
}

.home-books-section .home-books-head .text-link {
    flex-shrink: 0;
    white-space: nowrap;
}


/* =========================================================
   BOOK GRID
   ========================================================= */

.home-books-section .home-books-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: start !important;
}


/* =========================================================
   BOOK CARD
   ========================================================= */

.home-books-section .home-book-card {
    display: flex !important;
    flex-direction: column !important;

    width: 100%;
    min-width: 0;
    min-height: 0;
    height: auto !important;

    padding: 12px !important;

    overflow: hidden;

    border: 1px solid rgba(111, 91, 55, .10);
    border-radius: 18px;

    background: #ffffff;

    box-shadow:
        0 5px 18px rgba(45, 39, 29, .035);

    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease;
}

.home-books-section .home-book-card:hover {
    transform: translateY(-5px);

    border-color: rgba(177, 145, 78, .28);

    box-shadow:
        0 12px 30px rgba(45, 39, 29, .08);
}


/* =========================================================
   BOOK COVER
   ========================================================= */

.home-books-section .home-book-cover {
    position: relative;

    display: block;

    width: 100%;
    aspect-ratio: 3 / 4;

    overflow: hidden;

    border-radius: 13px;

    background: #eeeae1;
}

.home-books-section .home-book-cover::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    border-radius: inherit;

    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10);
}

.home-books-section .home-book-cover img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 300ms ease;
}

.home-books-section .home-book-card:hover .home-book-cover img {
    transform: scale(1.035);
}


/* =========================================================
   BOOK CONTENT
   ========================================================= */

.home-books-section .home-book-content {
    display: flex;
    flex-direction: column;

    min-width: 0;

    padding:
        13px
        4px
        4px;
}


/* =========================================================
   CATEGORY
   ========================================================= */

.home-books-section .home-book-category {
    display: block;

    align-self: flex-start;

    max-width: 100%;

    margin: 0 0 7px;

    overflow: hidden;

    color: #96753a;

    font-size: .68rem;
    font-weight: 700;
    line-height: 1.5;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   TITLE
   ========================================================= */

.home-books-section .home-book-title {
    margin: 0;

    color: #183f3d;

    font-size: .98rem;
    font-weight: 800;
    line-height: 1.55;
}

.home-books-section .home-book-title a {
    color: inherit;
    text-decoration: none;
}

.home-books-section .home-book-title a:hover {
    color: #8d6d35;
}


/* =========================================================
   BOOK DESCRIPTION
   ========================================================= */

.home-books-section .home-book-description,
.home-book-description {
    margin: 7px 0 0;
    color: #667b78;
    font-size: .72rem;
    font-weight: 500;
    line-height: 1.65;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    min-height: calc(.72rem * 1.65 * 2);
}


/* =========================================================
   BOOK META
   ========================================================= */

.home-books-section .home-book-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 8px;

    margin-top: 10px;
    padding-top: 9px;

    border-top: 1px solid rgba(111, 91, 55, .09);

    color: #858279;

    font-size: .68rem;
    line-height: 1.4;
}

.home-books-section .home-book-type,
.home-books-section .home-book-size {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.home-books-section .home-book-type {
    padding: 3px 7px;

    border-radius: 5px;

    background: #f2eee5;

    color: #8d6d35;

    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .02em;
}

.home-books-section .home-book-size {
    color: #858279;
}

.home-books-section .home-book-size .icon-xs {
    width: 13px;
    height: 13px;
}


/* =========================================================
   BOOK ACTIONS
   ========================================================= */

.home-books-section .home-book-actions {
    display: flex;
    align-items: center;

    gap: 7px;

    margin-top: 11px;
}


/* Shared action */

.home-books-section .home-book-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 5px;

    min-height: 33px;

    border: 1px solid rgba(111, 91, 55, .11);
    border-radius: 8px;

    background: #faf8f3;

    color: #5f625d;

    font-family: inherit;
    font-size: .68rem;
    font-weight: 700;
    line-height: 1;

    text-decoration: none;

    cursor: pointer;

    transition:
        background 160ms ease,
        color 160ms ease,
        border-color 160ms ease,
        transform 160ms ease;
}

.home-books-section .home-book-action:hover {
    transform: translateY(-1px);

    background: #f2eee5;

    border-color: rgba(141, 109, 53, .25);

    color: #8d6d35;
}

.home-books-section .home-book-action .icon-sm {
    width: 14px;
    height: 14px;
}


/* =========================================================
   DOWNLOAD BUTTON
   ========================================================= */

.home-books-section .home-book-download {
    flex: 1;

    padding:
        7px
        10px;
}

.home-books-section .home-book-download:hover {
    background: #f4efe3;
}


/* =========================================================
   SHARE BUTTON
   ========================================================= */

.home-books-section .home-book-share {
    width: 38px;

    padding: 6px;
}

.home-books-section .home-book-share span {
    display: none;
}


/* =========================================================
   EMPTY STATE
   ========================================================= */

.home-books-section .empty-state {
    grid-column: 1 / -1;

    padding: 40px 20px;

    border: 1px dashed rgba(111, 91, 55, .18);
    border-radius: 16px;

    background: rgba(255, 255, 255, .55);

    color: #77766e;

    text-align: center;
}


/* =========================================================
   TABLET — 3 COLUMNS
   ========================================================= */

@media (max-width: 1050px) {

    .home-books-section .home-books-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr))
            !important;
    }

}


/* =========================================================
   SMALL TABLET — 2 COLUMNS
   ========================================================= */

@media (max-width: 800px) {

    .home-books-section {
        padding: 52px 0;
    }

    .home-books-section .home-books-head {
        align-items: flex-start;
    }

    .home-books-section .home-books-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;

        gap: 14px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 560px) {

    .home-books-section {
        padding: 46px 0;
    }

    .home-books-section .home-books-head {
        display: block;

        margin-bottom: 20px;
    }

    .home-books-section .home-books-head h2 {
        font-size: 1.75rem;
    }

    .home-books-section .home-books-head p {
        font-size: .8rem;
    }

    .home-books-section .home-books-head .text-link {
        display: inline-flex;

        margin-top: 12px;
    }


    .home-books-section .home-books-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;

        gap: 10px !important;
    }


    .home-books-section .home-book-card {
        padding: 9px !important;

        border-radius: 15px;
    }


    .home-books-section .home-book-cover {
        border-radius: 10px;
    }


    .home-books-section .home-book-content {
        padding:
            10px
            2px
            2px;
    }


    .home-books-section .home-book-category {
        margin-bottom: 5px;

        font-size: .61rem;
    }


    .home-books-section .home-book-title {
        font-size: .86rem;
        line-height: 1.5;
    }


    .home-books-section .home-book-meta {
        gap: 6px;

        margin-top: 8px;
        padding-top: 7px;

        font-size: .61rem;
    }


    .home-books-section .home-book-type {
        padding:
            2px
            6px;

        font-size: .57rem;
    }


    .home-books-section .home-book-size .icon-xs {
        width: 11px;
        height: 11px;
    }


    .home-books-section .home-book-actions {
        gap: 5px;

        margin-top: 8px;
    }


    .home-books-section .home-book-action {
        min-height: 30px;

        font-size: .61rem;
    }


    .home-books-section .home-book-download {
        padding:
            6px
            7px;
    }


    .home-books-section .home-book-share {
        width: 34px;

        padding: 5px;
    }


    .home-books-section .home-book-action .icon-sm {
        width: 13px;
        height: 13px;
    }

}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media (max-width: 380px) {

    .home-books-section .home-books-grid {
        gap: 8px !important;
    }

    .home-books-section .home-book-card {
        padding: 7px !important;
    }

    .home-books-section .home-book-title {
        font-size: .8rem;
    }

    .home-books-section .home-book-download span {
        display: none;
    }

    .home-books-section .home-book-download {
        flex: 1;

        padding-left: 6px;
        padding-right: 6px;
    }

}

/* =========================================================
   Android App Section
   ========================================================= */

.android-app-section {
    padding: 72px 0;
}

.android-app-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    align-items: center;
    gap: 70px;

    min-height: 520px;
    padding: 52px 64px;

    overflow: hidden;

    background: #f8f4e9;
    border: 1px solid rgba(116, 91, 49, 0.14);
    border-radius: 30px;

    box-shadow:
        0 20px 60px rgba(42, 35, 24, 0.09);
}

/* Decorative background shape */

.android-app-card::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    left: -180px;
    bottom: -230px;

    border-radius: 50%;
    background: rgba(181, 143, 65, 0.08);

    pointer-events: none;
}

.android-app-card::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    right: -120px;
    top: -150px;

    border-radius: 50%;
    background: rgba(181, 143, 65, 0.07);

    pointer-events: none;
}

/* ---------------------------------------------------------
   Copy
   --------------------------------------------------------- */

.android-app-copy {
    position: relative;
    z-index: 2;

    max-width: 650px;

    color: #263b38;
}

.android-app-copy .eyebrow {
    display: inline-block;
    margin-bottom: 10px;

    color: #a77b35;
}

.android-app-copy h2 {
    margin: 0 0 18px;

    color: #173f3d;

    font-size: clamp(2rem, 4vw, 3.15rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.035em;
}

.android-app-copy h2 em {
    display: block;

    margin-top: 3px;

    color: #a77b35;
    font-style: normal;
}

.android-app-copy > p {
    max-width: 590px;
    margin: 0;

    color: #66716c;

    font-size: 1.02rem;
    line-height: 1.95;
}

/* ---------------------------------------------------------
   Features
   --------------------------------------------------------- */

.android-app-features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;

    margin-top: 28px;
}

.android-feature {
    display: flex;
    align-items: center;
    gap: 10px;

    min-width: 0;
    padding: 13px 12px;

    border: 1px solid rgba(116, 91, 49, 0.11);
    border-radius: 14px;

    background: rgba(255, 255, 255, 0.72);
}

.android-feature-icon {
    display: flex;
    flex: 0 0 38px;

    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border-radius: 11px;

    background: rgba(181, 143, 65, 0.12);
    color: #a77b35;
}

.android-feature > span:last-child {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.android-feature strong {
    color: #31423e;
    font-size: 0.84rem;
    line-height: 1.4;
}

.android-feature small {
    margin-top: 2px;

    color: #85877f;
    font-size: 0.72rem;
    line-height: 1.4;
}

/* ---------------------------------------------------------
   Actions
   --------------------------------------------------------- */

.android-app-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;

    margin-top: 30px;
}

.android-app-actions .btn {
    min-width: 185px;
    justify-content: center;
}

.android-app-platform {
    color: #88867c;
    font-size: 0.82rem;
}

.google-play-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 21px;
    height: 21px;

    font-size: 0.7rem;
}

/* ---------------------------------------------------------
   Phone
   --------------------------------------------------------- */

.android-app-visual {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    height: 100%;
    min-height: 420px;
}

.android-phone {
    position: relative;

    width: 220px;
    height: 440px;

    padding: 7px;

    border-radius: 30px;

    background: #1c2726;

    box-shadow:
        0 25px 50px rgba(35, 39, 34, 0.24),
        0 8px 18px rgba(35, 39, 34, 0.12);

    transform: rotate(3deg);
}

.android-phone img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    border-radius: 24px;
}

.android-phone-notch {
    position: absolute;
    z-index: 3;

    top: 11px;
    left: 50%;

    width: 64px;
    height: 7px;

    border-radius: 999px;

    background: #111817;

    transform: translateX(-50%);
}

/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media (max-width: 950px) {
    .android-app-card {
        grid-template-columns: minmax(0, 1fr) 250px;
        gap: 35px;

        padding: 44px;
    }

    .android-phone {
        width: 190px;
        height: 380px;
    }

    .android-app-features {
        grid-template-columns: 1fr;
    }
}

/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media (max-width: 700px) {
    .android-app-section {
        padding: 48px 0;
    }

    .android-app-card {
        grid-template-columns: 1fr;
        gap: 35px;

        min-height: 0;

        padding: 34px 22px;

        border-radius: 24px;
    }

    .android-app-copy {
        text-align: center;
    }

    .android-app-copy h2 {
        font-size: 2rem;
    }

    .android-app-copy > p {
        font-size: 0.96rem;
        line-height: 1.85;
    }

    .android-app-features {
        grid-template-columns: 1fr;

        text-align: right;
    }

    .android-feature {
        padding: 12px;
    }

    .android-app-actions {
        justify-content: center;
    }

    .android-app-platform {
        width: 100%;
        text-align: center;
    }

    .android-app-visual {
        min-height: 0;
        padding-top: 5px;
    }

    .android-phone {
        width: 175px;
        height: 350px;

        transform: none;
    }
}
/* =========================================================
   Homepage Radio Section
   ========================================================= */

.home-radio-section {
    padding: 72px 0;
}

.home-radio-card {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    align-items: stretch;

    gap: 0;

    overflow: hidden;

    border-radius: 30px;

    background:
        radial-gradient(
            circle at 12% 90%,
            rgba(191, 153, 75, 0.12),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #073f3e 0%,
            #075451 100%
        );

    box-shadow:
        0 22px 60px rgba(21, 44, 42, 0.18);
}

/* Decorative glow */

.home-radio-card::before {
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    left: -190px;
    top: -190px;

    border-radius: 50%;

    background: rgba(202, 166, 91, 0.07);

    pointer-events: none;
}

.home-radio-card::after {
    content: "";

    position: absolute;

    width: 260px;
    height: 260px;

    right: -120px;
    bottom: -150px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.035);

    pointer-events: none;
}

/* ---------------------------------------------------------
   Main content
   --------------------------------------------------------- */

.home-radio-content {
    position: relative;
    z-index: 2;

    padding: 52px 58px;
}

.home-radio-heading {
    max-width: 620px;
}

.home-radio-heading .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    color: #d2ad64;
}

.live-dot {
    display: inline-block;

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #d2ad64;

    box-shadow: 0 0 0 5px rgba(210, 173, 100, 0.12);
}

.home-radio-heading h2 {
    margin: 12px 0 16px;

    color: #fffdf7;

    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: -0.035em;
}

.home-radio-heading h2 em {
    display: block;

    color: #d4ae62;

    font-style: normal;
}

.home-radio-heading p {
    max-width: 590px;

    margin: 0;

    color: rgba(255, 255, 255, 0.72);

    font-size: 1rem;
    line-height: 1.95;
}

/* ---------------------------------------------------------
   Radio player
   --------------------------------------------------------- */

.home-radio-player {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    max-width: 650px;

    margin-top: 30px;
    padding: 16px;

    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 18px;

    background: rgba(255, 255, 255, 0.075);

    backdrop-filter: blur(8px);
}

.radio-player-info {
    display: flex;
    align-items: center;
    gap: 13px;

    min-width: 0;
}

.radio-player-icon {
    display: flex;
    flex: 0 0 48px;

    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    border-radius: 14px;

    background: rgba(210, 173, 100, 0.16);

    color: #d4ae62;
}

.radio-player-info > div:last-child {
    display: flex;
    flex-direction: column;

    min-width: 0;
}

.radio-player-info span {
    color: #d4ae62;

    font-size: 0.72rem;
    font-weight: 700;
}

.radio-player-info strong {
    margin-top: 2px;

    overflow: hidden;

    color: #fff;

    font-size: 0.92rem;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.radio-player-info small {
    margin-top: 2px;

    color: rgba(255, 255, 255, 0.52);

    font-size: 0.72rem;
}

.radio-play-button {
    flex: 0 0 auto;

    min-width: 145px;

    justify-content: center;
}

/* ---------------------------------------------------------
   Note
   --------------------------------------------------------- */

.home-radio-note {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 15px;

    color: rgba(255, 255, 255, 0.52);

    font-size: 0.78rem;
}

.home-radio-note .icon-sm {
    color: #d4ae62;
}

/* ---------------------------------------------------------
   Benefits
   --------------------------------------------------------- */

.home-radio-benefits {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 12px;

    padding: 42px 34px;

    border-right: 1px solid rgba(255, 255, 255, 0.09);

    background: rgba(0, 0, 0, 0.10);
}

.radio-benefit {
    display: flex;
    align-items: center;
    gap: 13px;

    padding: 16px;

    border: 1px solid rgba(255, 255, 255, 0.075);
    border-radius: 16px;

    background: rgba(255, 255, 255, 0.045);
}

.radio-benefit-icon {
    display: flex;
    flex: 0 0 42px;

    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    border-radius: 12px;

    background: rgba(210, 173, 100, 0.12);

    color: #d4ae62;
}

.radio-benefit div {
    display: flex;
    flex-direction: column;

    min-width: 0;
}

.radio-benefit strong {
    color: #fff;

    font-size: 0.88rem;
}

.radio-benefit div > span {
    margin-top: 3px;

    color: rgba(255, 255, 255, 0.52);

    font-size: 0.74rem;
    line-height: 1.5;
}

/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media (max-width: 900px) {
    .home-radio-card {
        grid-template-columns: 1fr;
    }

    .home-radio-content {
        padding: 44px;
    }

    .home-radio-benefits {
        display: grid;
        grid-template-columns: repeat(3, 1fr);

        padding: 0 44px 44px;

        border-right: 0;
    }

    .radio-benefit {
        height: 100%;
    }
}

/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media (max-width: 650px) {
    .home-radio-section {
        padding: 48px 0;
    }

    .home-radio-card {
        border-radius: 24px;
    }

    .home-radio-content {
        padding: 34px 22px;
    }

    .home-radio-heading {
        text-align: center;
    }

    .home-radio-heading h2 {
        font-size: 2rem;
    }

    .home-radio-heading p {
        font-size: 0.94rem;
        line-height: 1.85;
    }

    .home-radio-player {
        flex-direction: column;
        align-items: stretch;

        padding: 14px;
    }

    .radio-play-button {
        width: 100%;
    }

    .home-radio-note {
        justify-content: center;

        text-align: center;
        line-height: 1.6;
    }

    .home-radio-benefits {
        display: flex;

        gap: 9px;

        padding: 0 22px 28px;
    }

    .radio-benefit {
        padding: 12px;
    }

    .radio-benefit-icon {
        flex-basis: 38px;

        width: 38px;
        height: 38px;
    }
}
/* =========================================================
   Homepage Fatawa Section
   ========================================================= */

.fatawa-home-section {
    padding: 76px 0;
    background: #f7f4ec;
}

/* ---------------------------------------------------------
   Section heading
   --------------------------------------------------------- */

.fatawa-section-head {
    align-items: flex-end;
    margin-bottom: 28px;
}

.fatawa-section-head h2 {
    margin: 7px 0 8px;

    color: #183f3d;

    font-size: clamp(1.9rem, 3vw, 2.65rem);
    font-weight: 800;
    line-height: 1.25;
}

.fatawa-section-head p {
    max-width: 520px;
    margin: 0;

    color: #77766e;

    font-size: 0.9rem;
    line-height: 1.8;
}

/* ---------------------------------------------------------
   List
   --------------------------------------------------------- */

.fatwa-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

/* ---------------------------------------------------------
   Card
   --------------------------------------------------------- */

.fatwa-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 245px;

    padding: 22px 23px;

    overflow: hidden;

    border: 1px solid rgba(111, 91, 55, 0.12);
    border-radius: 20px;

    background: rgba(255, 255, 255, 0.82);

    color: inherit;
    text-decoration: none;

    box-shadow: 0 8px 25px rgba(45, 39, 29, 0.045);

    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease;
}

.fatwa-card::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;

    width: 4px;
    height: 100%;

    background: #b58d45;

    transform: scaleY(0);
    transform-origin: center;

    transition: transform 180ms ease;
}

.fatwa-card:hover {
    transform: translateY(-3px);

    border-color: rgba(181, 141, 69, 0.25);

    box-shadow:
        0 15px 35px rgba(45, 39, 29, 0.09);
}

.fatwa-card:hover::before {
    transform: scaleY(1);
}

/* ---------------------------------------------------------
   Card top
   --------------------------------------------------------- */

.fatwa-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-bottom: 18px;
}

.fatwa-label {
    display: inline-flex;
    align-items: center;

    min-height: 28px;
    padding: 4px 10px;

    border-radius: 999px;

    background: rgba(181, 141, 69, 0.10);

    color: #a37935;

    font-size: 0.72rem;
    font-weight: 700;
}

.fatwa-number {
    color: #a5a29a;

    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 600;
}

/* ---------------------------------------------------------
   Body
   --------------------------------------------------------- */

.fatwa-card-body {
    flex: 1;
}

.fatwa-card-body h3 {
    margin: 0;

    color: #263f3d;

    font-size: 1.05rem;
    font-weight: 750;
    line-height: 1.75;
}

.fatwa-card-body p {
    margin: 11px 0 0;

    color: #777870;

    font-size: 0.84rem;
    line-height: 1.8;
}

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */

.fatwa-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-top: 22px;
    padding-top: 15px;

    border-top: 1px solid rgba(91, 82, 66, 0.09);

    color: #a37935;

    font-size: 0.78rem;
    font-weight: 700;
}

.fatwa-arrow {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    border-radius: 50%;

    background: rgba(181, 141, 69, 0.10);

    transition:
        background 180ms ease,
        transform 180ms ease;
}

.fatwa-card:hover .fatwa-arrow {
    background: #b58d45;
    color: #fff;

    transform: translateX(-3px);
}

/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media (max-width: 760px) {
    .fatawa-home-section {
        padding: 54px 0;
    }

    .fatawa-section-head {
        align-items: flex-start;
        gap: 15px;
    }

    .fatawa-section-head p {
        font-size: 0.84rem;
    }

    .fatwa-list {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .fatwa-card {
        min-height: 0;
        padding: 19px;
        border-radius: 17px;
    }

    .fatwa-card-body h3 {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .fatwa-card-body p {
        font-size: 0.81rem;
    }
}

@media (max-width: 520px) {
    .fatawa-section-head {
        display: block;
    }

    .fatawa-section-head .text-link {
        display: inline-flex;
        margin-top: 12px;
    }
}/* =========================================================
   Homepage News / Benefits
   Compact 4-Column Layout
   ========================================================= */

.home-news-section {
    padding: 64px 0;
    background: #fffdf8;
}

/* ---------------------------------------------------------
   Section Header
   --------------------------------------------------------- */

.home-news-section .home-news-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
}

.home-news-section .home-news-head h2 {
    margin: 5px 0 5px;

    color: #183f3d;

    font-size: clamp(1.8rem, 2.8vw, 2.45rem);
    font-weight: 800;
    line-height: 1.2;
}

.home-news-section .home-news-head p {
    max-width: 500px;
    margin: 0;

    color: #77766e;

    font-size: 0.86rem;
    line-height: 1.7;
}

/* ---------------------------------------------------------
   FOUR CARDS PER ROW
   --------------------------------------------------------- */

.home-news-section .news-grid {
    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 14px !important;

    align-items: start !important;
}

/* ---------------------------------------------------------
   CARD
   --------------------------------------------------------- */

.home-news-section .news-grid .news-card {
    position: relative;

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;

    padding: 18px !important;

    overflow: hidden;

    border: 1px solid rgba(111, 91, 55, 0.11);
    border-radius: 17px;

    background: #ffffff;

    box-shadow: 0 5px 18px rgba(45, 39, 29, 0.035);

    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease;
}

/* ---------------------------------------------------------
   Gold hover line
   --------------------------------------------------------- */

.home-news-section .news-grid .news-card::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;

    width: 100%;
    height: 3px;

    background: #b58d45;

    transform: scaleX(0);
    transform-origin: right;

    transition: transform 180ms ease;
}

.home-news-section .news-grid .news-card:hover {
    transform: translateY(-3px);

    border-color: rgba(181, 141, 69, 0.24);

    box-shadow:
        0 12px 25px rgba(45, 39, 29, 0.075);
}

.home-news-section .news-grid .news-card:hover::before {
    transform: scaleX(1);
}

/* ---------------------------------------------------------
   TOP
   --------------------------------------------------------- */

.home-news-section .news-card .news-card-top {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 8px;

    margin-bottom: 12px;
}

.home-news-section .news-card .tag {
    display: inline-flex;
    align-items: center;

    min-height: 25px;

    padding: 3px 8px;

    border-radius: 999px;

    background: rgba(181, 141, 69, 0.09);

    color: #a37935;

    font-size: 0.68rem;
    font-weight: 700;

    white-space: nowrap;
}

.home-news-section .news-card .news-card-mark {
    display: flex;

    flex: 0 0 auto;

    align-items: center;
    justify-content: center;

    width: 29px;
    height: 29px;

    border-radius: 50%;

    background: #f5f2e9;

    color: #a37935;

    transition:
        background 180ms ease,
        color 180ms ease,
        transform 180ms ease;
}

.home-news-section .news-card:hover .news-card-mark {
    background: #b58d45;
    color: #ffffff;

    transform: translate(-2px, -2px);
}

/* ---------------------------------------------------------
   BODY
   --------------------------------------------------------- */

.home-news-section .news-card .news-card-body {
    display: block !important;

    flex: none !important;

    height: auto !important;
    min-height: 0 !important;
}

.home-news-section .news-card .news-card-body h3 {
    margin: 0;

    color: #263f3d;

    font-size: 0.96rem;
    font-weight: 750;

    line-height: 1.65;
}

.home-news-section .news-card .news-card-body h3 a {
    color: inherit;

    text-decoration: none;

    transition: color 180ms ease;
}

.home-news-section .news-card:hover .news-card-body h3 a {
    color: #a37935;
}

.home-news-section .news-card .news-card-body p {
    margin: 7px 0 0;

    color: #777870;

    font-size: 0.78rem;
    line-height: 1.7;
}

/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

.home-news-section .news-card .news-card-footer {
    display: block !important;

    margin-top: 13px !important;
    padding-top: 10px !important;

    border-top: 1px solid rgba(91, 82, 66, 0.08);
}

.home-news-section .news-card .news-card-footer a {
    display: inline-flex;

    align-items: center;
    gap: 5px;

    color: #a37935;

    font-size: 0.71rem;
    font-weight: 700;

    text-decoration: none;

    transition: gap 180ms ease;
}

.home-news-section .news-card .news-card-footer a:hover {
    gap: 8px;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .home-news-section .news-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

/* =========================================================
   SMALL TABLET
   ========================================================= */

@media (max-width: 800px) {

    .home-news-section .news-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 560px) {

    .home-news-section {
        padding: 50px 0;
    }

    .home-news-section .home-news-head {
        display: block;
        margin-bottom: 18px;
    }

    .home-news-section .home-news-head p {
        margin-top: 4px;
        font-size: 0.82rem;
    }

    .home-news-section .news-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .home-news-section .news-grid .news-card {
        padding: 16px !important;
        border-radius: 15px;
    }

    .home-news-section .news-card .news-card-body h3 {
        font-size: 0.94rem;
    }

    .home-news-section .news-card .news-card-body p {
        font-size: 0.78rem;
    }
}

/* =========================================================
   Homepage Audio Cards
   ========================================================= */

.home-audio-section {
    background: var(--surface, #f7f4ee);
}

.home-audio-head {
    align-items: flex-end;
    margin-bottom: 24px;
}

.home-audio-head > div:first-child {
    max-width: 760px;
}

.home-audio-head p {
    margin: 8px 0 0;
    color: var(--text-muted, #6b746f);
    font-size: 0.95rem;
    line-height: 1.8;
}

.home-audio-grid {
    display: grid;
    /* FIX: Changed from rigid 4 columns to responsive fluid autofill */
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 18px;
}

.home-audio-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%; /* Force all cards in a row to match heights */
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(25, 67, 61, 0.08);
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(24, 52, 48, 0.06);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.home-audio-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(24, 52, 48, 0.1);
    border-color: rgba(180, 143, 65, 0.3);
}

/* Cover */

.home-audio-cover {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 150px;
    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(255, 255, 255, 0.08),
            transparent 42%
        ),
        #173f3a;
    overflow: hidden;
}

.home-audio-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.05),
            transparent 45%
        );
    pointer-events: none;
}

.home-audio-cover .card-logo {
    position: relative;
    z-index: 1;
    width: 82px;
    height: 82px;
    object-fit: contain;
}

.home-audio-cover-label {
    position: absolute;
    z-index: 2;
    top: 12px;
    right: 12px;

    display: inline-flex;
    align-items: center;
    gap: 5px;

    padding: 5px 9px;
    border-radius: 999px;

    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.9);

    font-size: 0.72rem;
    font-weight: 700;
    backdrop-filter: blur(8px);
}

/* Content */

.home-audio-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 15px 16px 13px;
}

.home-audio-category {
    width: fit-content;
    max-width: 100%;
    margin-bottom: 7px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    font-size: 0.7rem;
}

.home-audio-title {
    margin: 0;
    color: #173f3a;
    font-size: 0.98rem;
    line-height: 1.65;
    font-weight: 800;
}

.home-audio-description {
    margin: 7px 0 0;
    color: #707873;
    font-size: 0.78rem;
    line-height: 1.7;
    margin-bottom: auto; /* FIX: Pushes the footer downward even on shorter descriptions */
}

/* Footer */

.home-audio-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;

    margin-top: 14px;
    padding-top: 11px;

    border-top: 1px solid rgba(23, 63, 58, 0.08);
}

.home-audio-play-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    min-height: 34px;
    padding: 7px 12px;

    border: 0;
    border-radius: 9px;

    background: #b88a3b;
    color: #fff;

    font-family: inherit;
    font-size: 0.76rem;
    font-weight: 800;

    cursor: pointer;

    transition:
        transform 0.18s ease,
        background 0.18s ease;
}

.home-audio-play-btn:hover {
    background: #a77b31;
    transform: translateY(-1px);
}

.home-audio-play-btn:focus-visible,
.home-audio-share-btn:focus-visible,
.home-audio-download-btn:focus-visible, /* Added download button focus state */
.home-audio-details:focus-visible {
    outline: 2px solid #b88a3b;
    outline-offset: 2px;
}

.home-audio-footer-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.home-audio-duration {
    display: inline-flex;
    align-items: center;
    gap: 4px;

    color: #7a827d;
    font-size: 0.7rem;
    white-space: nowrap;
}

/* NEW: Added download button to share styles bundle */
.home-audio-share-btn,
.home-audio-download-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;
    padding: 0;

    border: 1px solid rgba(23, 63, 58, 0.1);
    border-radius: 8px;

    background: #f7f5f0;
    color: #173f3a;
    text-decoration: none; /* Safe reset for anchor element type */

    cursor: pointer;

    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease;
}

/* NEW: Added hover overrides for download button */
.home-audio-share-btn:hover,
.home-audio-download-btn:hover {
    background: #fff;
    border-color: rgba(184, 138, 59, 0.4);
    transform: translateY(-1px);
}

.home-audio-details {
    display: inline-flex;
    align-items: center;
    gap: 4px;

    color: #173f3a;
    font-size: 0.7rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.home-audio-details:hover {
    color: #b88a3b;
}

/* Responsive Overrides */

@media (max-width: 800px) {
    .home-audio-grid {
        gap: 14px;
    }

    .home-audio-cover {
        min-height: 135px;
    }
}

@media (max-width: 560px) {
    .home-audio-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .home-audio-content {
        padding: 12px;
    }

    .home-audio-cover {
        min-height: 120px;
    }

    .home-audio-cover .card-logo {
        width: 65px;
        height: 65px;
    }

    .home-audio-title {
        font-size: 0.86rem;
    }

    .home-audio-description {
        font-size: 0.7rem;
    }

    .home-audio-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .home-audio-play-btn {
        width: 100%;
    }

    .home-audio-footer-actions {
        justify-content: space-between;
    }
}


.icon-xs {
    width: 16px;  /* or 12px / 1rem depending on your design */
    height: 16px;
    display: inline-block; /* ensures dimensions apply correctly */
}

/* =========================================================
   ALKHALEEL FOOTER
   ========================================================= */

.site-footer {
    position: relative;
    overflow: hidden;
    margin-top: 0;
    padding: 52px 0 0;
    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(184, 138, 59, 0.08),
            transparent 28%
        ),
        radial-gradient(
            circle at 85% 20%,
            rgba(255, 255, 255, 0.035),
            transparent 30%
        ),
        #123b37;
    color: rgba(255, 255, 255, 0.82);
}

.site-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(184, 138, 59, 0.75),
        transparent
    );
}

.site-footer::after {
    content: "";
    position: absolute;
    left: -120px;
    bottom: -180px;
    width: 420px;
    height: 420px;
    border: 1px solid rgba(255, 255, 255, 0.025);
    border-radius: 50%;
    pointer-events: none;
}


/* ---------------------------------------------------------
   Top ornament
   --------------------------------------------------------- */

.footer-top-ornament {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 0 auto 42px;
    width: min(420px, 80%);
}

.footer-top-ornament span {
    height: 1px;
    flex: 1;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(184, 138, 59, 0.42)
    );
}

.footer-top-ornament span:last-child {
    background: linear-gradient(
        270deg,
        transparent,
        rgba(184, 138, 59, 0.42)
    );
}

.footer-top-ornament i {
    width: 5px;
    height: 5px;
    flex: 0 0 auto;
    border: 1px solid rgba(184, 138, 59, 0.8);
    transform: rotate(45deg);
}

.footer-top-ornament strong {
    color: #c69a4b;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}


/* ---------------------------------------------------------
   Main grid
   --------------------------------------------------------- */

.footer-grid {
    position: relative;
    z-index: 1;

    display: grid;
    grid-template-columns:
        minmax(260px, 1.55fr)
        minmax(130px, 0.75fr)
        minmax(130px, 0.75fr)
        minmax(250px, 1fr);

    gap: 48px;

    padding-bottom: 46px;
}


/* ---------------------------------------------------------
   Brand
   --------------------------------------------------------- */

.footer-brand-block {
    max-width: 440px;
}

.footer-brand {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    color: #fff;
    text-decoration: none;
}

.footer-brand img {
    width: 200px;
    height: 128px;
    object-fit: contain;
}

.footer-brand .brand-wordmark {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-brand .brand-wordmark strong {
    color: #fff;
    font-size: 0.95rem;
    line-height: 1.65;
    font-weight: 800;
}

.footer-brand .brand-wordmark small {
    color: #c69a4b;
    font-size: 0.72rem;
    font-weight: 700;
}

.footer-description {
    max-width: 400px;
    margin: 20px 0 0;
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.82rem;
    line-height: 2;
}

.footer-brand-note {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    font-size: 0.7rem;
}

.footer-brand-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #c69a4b;
    box-shadow: 0 0 0 4px rgba(198, 154, 75, 0.08);
}


/* ---------------------------------------------------------
   Footer navigation
   --------------------------------------------------------- */

.footer-nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.footer-nav-eyebrow {
    margin-bottom: 5px;
    color: rgba(198, 154, 75, 0.8);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.footer-nav h3 {
    margin: 0 0 15px;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 800;
}

.footer-nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    width: 100%;
    max-width: 190px;

    padding: 6px 0;

    color: rgba(255, 255, 255, 0.58);
    font-size: 0.77rem;
    line-height: 1.6;
    text-decoration: none;

    transition:
        color 0.18s ease,
        transform 0.18s ease;
}

.footer-nav a .icon-xs {
    opacity: 0;
    transform: translateX(5px);
    color: #c69a4b;

    transition:
        opacity 0.18s ease,
        transform 0.18s ease;
}

.footer-nav a:hover {
    color: #fff;
    transform: translateX(-2px);
}

.footer-nav a:hover .icon-xs {
    opacity: 1;
    transform: translateX(0);
}


/* ---------------------------------------------------------
   App card
   --------------------------------------------------------- */

.footer-app-card {
    position: relative;
    overflow: hidden;

    padding: 22px;

    border: 1px solid rgba(198, 154, 75, 0.22);
    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.055),
            rgba(255, 255, 255, 0.018)
        );

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 14px 35px rgba(0, 0, 0, 0.12);
}

.footer-app-card::after {
    content: "";
    position: absolute;
    width: 130px;
    height: 130px;
    left: -65px;
    bottom: -75px;
    border: 1px solid rgba(198, 154, 75, 0.1);
    border-radius: 50%;
    pointer-events: none;
}

.footer-app-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.footer-app-card .eyebrow {
    color: #c69a4b;
    font-size: 0.68rem;
    font-weight: 800;
}

.footer-app-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid rgba(198, 154, 75, 0.22);
    border-radius: 10px;

    background: rgba(198, 154, 75, 0.08);
    color: #c69a4b;
}

.footer-app-icon svg {
    width: 17px;
    height: 17px;
}

.footer-app-card h3 {
    margin: 15px 0 7px;
    color: #fff;
    font-size: 1rem;
    line-height: 1.6;
    font-weight: 800;
}

.footer-app-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.74rem;
    line-height: 1.8;
}


/* ---------------------------------------------------------
   Google Play badge
   --------------------------------------------------------- */

.google-play-badge {
    position: relative;
    z-index: 1;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-top: 17px;
    padding: 9px 12px;

    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;

    background: rgba(0, 0, 0, 0.18);
    color: #fff;

    text-decoration: none;

    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease;
}

.google-play-badge:hover {
    transform: translateY(-2px);
    border-color: rgba(198, 154, 75, 0.5);
    background: rgba(0, 0, 0, 0.26);
}

.google-play-icon {
    display: inline-flex;
    width: 25px;
    height: 25px;
    color: #fff;
    background: #ffffffb8;
}

.google-play-icon svg {
    width: 100%;
    height: 100%;
}

.google-play-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.google-play-text small {
    color: rgba(255, 255, 255, 0.48);
    font-size: 0.56rem;
    line-height: 1;
}

.google-play-text strong {
    color: #fff;
    font-size: 0.82rem;
    line-height: 1.3;
    font-weight: 800;
}

.google-play-arrow {
    margin-inline-start: 5px;
    color: #c69a4b;
}


/* ---------------------------------------------------------
   Bottom bar
   --------------------------------------------------------- */

.footer-bottom {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    min-height: 64px;

    border-top: 1px solid rgba(255, 255, 255, 0.08);

    color: rgba(255, 255, 255, 0.4);
    font-size: 0.67rem;
}

.footer-copyright {
    line-height: 1.8;
}

.footer-bottom-center {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    color: rgba(198, 154, 75, 0.7);
    white-space: nowrap;
}

.footer-bottom-line {
    width: 18px;
    height: 1px;
    background: rgba(198, 154, 75, 0.3);
}


/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media (max-width: 1050px) {

    .footer-grid {
        grid-template-columns: 1.4fr 0.8fr 0.8fr;
        gap: 36px;
    }

    .footer-app-card {
        grid-column: 1 / -1;
        max-width: 100%;
    }
}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media (max-width: 700px) {

    .site-footer {
        padding-top: 38px;
    }

    .footer-top-ornament {
        margin-bottom: 32px;
    }

    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 24px;
        padding-bottom: 34px;
    }

    .footer-brand-block {
        grid-column: 1 / -1;
        max-width: none;
    }

    .footer-description {
        max-width: 620px;
    }

    .footer-app-card {
        grid-column: 1 / -1;
    }

    .footer-bottom {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        gap: 7px;

        padding-top: 18px;
        padding-bottom: 18px;
    }

    .footer-bottom-center {
        order: -1;
    }
}


/* ---------------------------------------------------------
   Small phones
   --------------------------------------------------------- */

@media (max-width: 480px) {

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .footer-brand-block,
    .footer-app-card {
        grid-column: auto;
    }

    .footer-nav a {
        max-width: 240px;
    }

    .footer-brand img {
        width: 55px;
        height: 55px;
    }

    .footer-brand .brand-wordmark strong {
        font-size: 0.84rem;
    }

    .footer-description {
        font-size: 0.76rem;
    }

    .footer-app-card {
        padding: 18px;
    }
}
/* =========================================================
   Centered Footer Brand Block
   ========================================================= */

.footer-brand-block {
    display: flex;
    flex-direction: column;
    align-items: center;      /* Centers child elements horizontally */
    text-align: center;       /* Centers all raw text lines inside elements */
    max-width: 620px;         /* Limits description width for easier reading */
    margin: 0 auto;           /* Centers the entire container inside the footer section */
}

/* Brand Anchor Link Container */
.footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;      /* Centers logo image and wordmark spans */
    gap: 12px;                /* Adds neat spacing between image and text lines */
    text-decoration: none;
    margin-bottom: 16px;
}

/* Forces image alignment */
.footer-brand img {
    display: block;
    margin: 0 auto;
}

/* Wordmark typography overrides */
.brand-wordmark {
    display: block;
    text-align: center;
}

/* Description Text Spacing */
.footer-description {
    font-size: 0.92rem;
    line-height: 1.8;
    color: var(--text-muted, #6b746f);
    margin: 0 0 20px;         /* Safe layout spacing margins */
}

/* Badge Notes Row Alignment */
.footer-brand-note {
    display: inline-flex;
    align-items: center;
    justify-content: center;  /* Centers row items if it spans wide screens */
    gap: 8px;
    font-size: 0.8rem;
    background: rgba(23, 63, 58, 0.05); /* Soft premium badge container background */
    padding: 6px 16px;
    border-radius: 999px;
}

.footer-brand-dot {
    width: 6px;
    height: 6px;
    background: var(--accent, #b88a3b);
    border-radius: 50%;
    display: inline-block;
}

.admin-stat-grid{
    margin-top: 10px;
}

/* ========================= Final UX fixes ========================= */

/* Keep text readable when selecting it over dark sections. */
::selection {
    background: #e3c68f;
    color: #063e40;
}
::-moz-selection {
    background: #e3c68f;
    color: #063e40;
}

/* Book actions: reading and downloading are equal primary actions. */
.home-book-read,
.home-book-download {
    flex: 1;
}
.home-book-read {
    padding: 7px 10px;
}

/* Make the home/news card styling reusable on the news listing page. */
.home-news-section .news-card {
    min-width: 0;
}

/* Admin pagination: keep previous/next beside the page numbers. */
.admin-panel nav.pagination-ar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    width: 100%;
}
.admin-panel nav.pagination-ar .pagination-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
    margin: 0;
}
.admin-panel nav.pagination-ar .pagination-btn,
.admin-panel nav.pagination-ar .pagination-number,
.admin-panel nav.pagination-ar .pagination-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 9px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    color: #5b706c;
    font-size: .66rem;
    line-height: 1;
    white-space: nowrap;
}
.admin-panel nav.pagination-ar .pagination-btn:not(.disabled):hover,
.admin-panel nav.pagination-ar .pagination-number:not(.active):hover {
    background: var(--teal-soft);
    color: var(--brand);
}
.admin-panel nav.pagination-ar .pagination-number.active {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}
.admin-panel nav.pagination-ar .pagination-btn.disabled {
    opacity: .45;
    cursor: not-allowed;
    pointer-events: none;
}

/* Fatawa queue: unanswered first, answered rows visually separated. */
.admin-table tbody tr.fatawa-row-answered {
    background: #f3f6f5;
}
.admin-table tbody tr.fatawa-row-answered td {
    color: #7d8986;
}
.admin-table tbody tr.fatawa-row-answered .table-title strong {
    color: #687774;
}
.admin-table tbody tr.fatawa-row-unanswered {
    background: #fff;
}
.admin-table tbody tr.fatawa-row-answered:hover {
    background: #eaf0ee;
}
.admin-table tbody tr.fatawa-row-unanswered:hover {
    background: #fbfcfb;
}

/* Keep the book catalogue cards identical to the homepage card system. */
.book-catalog .home-books-grid,
section.section > .site-container > .home-books-grid {
    align-items: start;
}


/* =========================================================
   BOOK LIST / RELATED BOOKS — REUSE HOMEPAGE CARD DESIGN
   Scoped to book pages so global layout/footer styles are untouched.
   ========================================================= */
.books-page .home-books-grid,
.related-books-section .home-books-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: start !important;
}

.books-page .home-book-card,
.related-books-section .home-book-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100%;
    min-width: 0;
    min-height: 0;
    height: auto !important;
    padding: 12px !important;
    overflow: hidden;
    border: 1px solid rgba(111, 91, 55, .10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(45, 39, 29, .035);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.books-page .home-book-card:hover,
.related-books-section .home-book-card:hover {
    transform: translateY(-5px);
    border-color: rgba(177, 145, 78, .28);
    box-shadow: 0 12px 30px rgba(45, 39, 29, .08);
}

.books-page .home-book-cover,
.related-books-section .home-book-cover {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 3 / 4;
    height: auto !important;
    overflow: hidden;
    border-radius: 13px;
    background: #eeeae1;
}

.books-page .home-book-cover::after,
.related-books-section .home-book-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .10);
}

.books-page .home-book-cover img,
.related-books-section .home-book-cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 300ms ease;
}

.books-page .home-book-card:hover .home-book-cover img,
.related-books-section .home-book-card:hover .home-book-cover img {
    transform: scale(1.035);
}

.books-page .home-book-content,
.related-books-section .home-book-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
    padding: 14px 3px 2px;
}

.books-page .home-book-category,
.related-books-section .home-book-category {
    align-self: flex-start;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-page .home-book-title,
.related-books-section .home-book-title {
    margin: 9px 0 0;
    color: #173f3d;
    font-size: .98rem;
    font-weight: 800;
    line-height: 1.65;
}

.books-page .home-book-title a,
.related-books-section .home-book-title a {
    color: inherit;
    text-decoration: none;
}

.books-page .home-book-title a:hover,
.related-books-section .home-book-title a:hover {
    color: #b18545;
}

.books-page .home-book-meta,
.related-books-section .home-book-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 30px;
    margin-top: 8px;
    color: #77766e;
    font-size: .68rem;
}

.books-page .home-book-type,
.related-books-section .home-book-type {
    color: #0a625f;
    font-weight: 900;
}

.books-page .home-book-size,
.related-books-section .home-book-size {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-page .home-book-actions,
.related-books-section .home-book-actions {
    display: flex;
    align-items: stretch;
    gap: 7px;
    margin-top: 13px;
}

.books-page .home-book-action,
.related-books-section .home-book-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 0;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid #e6dfd1;
    border-radius: 11px;
    background: #fffdf9;
    color: #35514e;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: .18s ease;
}

.books-page .home-book-action:hover,
.related-books-section .home-book-action:hover {
    transform: translateY(-2px);
    border-color: #d3bd91;
    background: #faf5eb;
    color: #8b6631;
}

.books-page .home-book-action .icon-sm,
.related-books-section .home-book-action .icon-sm {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.books-page .home-book-read,
.related-books-section .home-book-read {
    border-color: #d8c092;
    background: #f7efe0;
    color: #8b6631;
}

.books-page .home-book-download,
.related-books-section .home-book-download {
    border-color: #cfe2dd;
    background: #edf6f3;
    color: #0a625f;
}

.books-page .home-book-share,
.related-books-section .home-book-share {
    flex: 0 0 auto;
}

@media (max-width: 1180px) {
    .books-page .home-books-grid,
    .related-books-section .home-books-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 960px) {
    .books-page .home-books-grid,
    .related-books-section .home-books-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    .books-page .home-books-grid,
    .related-books-section .home-books-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    .books-page .home-book-card,
    .related-books-section .home-book-card {
        padding: 9px !important;
        border-radius: 15px;
    }

    .books-page .home-book-actions,
    .related-books-section .home-book-actions {
        gap: 5px;
    }

    .books-page .home-book-action,
    .related-books-section .home-book-action {
        flex: 1 1 0;
        padding-inline: 6px;
    }

    .books-page .home-book-action span,
    .related-books-section .home-book-action span {
        font-size: .6rem;
    }
}