/* Shifa Ul-Dahar — logo / ayat refinement, October 2026.
   Logo is genuine selectable text. No raster/vector logo or typography image.
   This file intentionally scopes the last visual refinement without rewriting locked sections. */
:root{--verse-forest:#062d25;--verse-emerald:#0b4132;--verse-gold:#e6c173}
/* Brand: short, faithful three-line typography with ornamental double rule. */
.site-header .brand{width:158px;max-width:158px;min-width:0;padding:2px 0 0;gap:0;flex-shrink:0;line-height:1;align-items:center;overflow:visible;filter:none}
.brand .brand-ar{font-family:'Aref Ruqaa Ink','Noto Nastaliq Urdu',serif;font-size:33px;font-weight:700;line-height:1.12;letter-spacing:-.08em;color:#bb8d45;text-align:center;transform:none;white-space:nowrap;display:block;text-shadow:0 1px 0 rgba(255,255,255,.45)}
.brand .brand-en{font-family:'Cinzel',Georgia,serif;position:relative;font-weight:700;font-size:10px;line-height:1.2;letter-spacing:.18em;padding:3px 3px 2px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;white-space:nowrap;color:#b08743;text-align:center}
.brand .brand-ur{font-family:'Noto Nastaliq Urdu',serif;font-size:8px;font-weight:600;line-height:2.2;transform:none;white-space:nowrap;color:var(--forest);text-align:center;padding-top:0}
.brand .brand-en::before,.brand .brand-en::after{content:'✧';font-family:Georgia,serif;font-size:7px;position:absolute;top:50%;transform:translateY(-50%);opacity:.75;color:var(--gold)}
.brand .brand-en::before{right:calc(100% + 3px)}.brand .brand-en::after{left:calc(100% + 3px)}
.brand:hover{transform:translateY(-1px);filter:drop-shadow(0 2px 5px rgba(184,139,53,.19))}
html[data-theme="dark"] .brand .brand-ar{color:#f0d18a;text-shadow:0 1px 9px rgba(255,224,161,.08)}
html[data-theme="dark"] .brand .brand-en{color:#efd08a}html[data-theme="dark"] .brand .brand-ur{color:#f4e9ca}
/* Premium scripture message with ornamental frame, quiet luminous corners and layered depth. */
.hero .hero-quote{isolation:isolate;overflow:visible;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;width:clamp(226px,19vw,278px);min-height:244px;top:60px;right:12px;bottom:auto;left:auto;margin:0;text-align:center;padding:23px 18px 23px;border:1px solid rgba(244,205,128,.85);border-radius:28px 28px 19px 19px;background:radial-gradient(ellipse at 50% 0%,rgba(54,119,78,.20),transparent 57%),linear-gradient(140deg,rgba(9,66,48,.975),rgba(2,38,29,.98) 79%);color:#fff4d6;box-shadow:inset 0 0 0 3px rgba(4,39,28,.92),inset 0 0 0 5px rgba(235,192,109,.21),0 20px 45px rgba(2,26,18,.36),0 0 22px rgba(213,161,59,.10);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);transition:box-shadow .55s ease,transform .55s cubic-bezier(.22,1,.36,1)}
.hero .hero-quote::before{content:'';position:absolute;pointer-events:none;inset:8px;border:1px solid rgba(234,189,98,.34);border-radius:21px 21px 13px 13px;z-index:0}
.hero .hero-quote::after{content:'❈';position:absolute;pointer-events:none;left:50%;top:-15px;transform:translateX(-50%);color:#e6bd6e;font:23px/1 Georgia,serif;text-shadow:0 0 14px rgba(255,219,142,.46);z-index:3}
.hero .hero-quote>*{position:relative;z-index:1}
.hero .hero-quote:hover{box-shadow:inset 0 0 0 3px rgba(4,39,28,.92),inset 0 0 0 5px rgba(235,192,109,.33),0 22px 48px rgba(2,26,18,.35),0 0 31px rgba(228,183,92,.20)}
.hero-quote .verse-star{display:block;font-size:11px;line-height:1;color:#ffdf9e;margin-bottom:5px}
.hero-quote .verse-label{display:block;font:700 8px/1.4 'DM Sans',sans-serif;letter-spacing:2px;color:#e8c781;margin-bottom:4px}
.hero .hero-quote .verse-arabic{display:block;direction:rtl;unicode-bidi:isolate;font-family:'Amiri','Noto Naskh Arabic','Noto Serif Arabic',serif;font-weight:700;font-size:clamp(19px,1.52vw,22px);line-height:1.92;letter-spacing:0;color:#ffe6a6;text-align:center;margin:0 auto 1px;max-width:100%;text-shadow:0 0 13px rgba(246,208,122,.12)}
.hero-quote .verse-divider{display:block;width:78%;height:17px;margin:2px auto 7px;color:#e5bd72;font:18px/15px Georgia,serif;text-align:center;position:relative}
.hero-quote .verse-divider::before,.hero-quote .verse-divider::after{content:'';position:absolute;top:7px;height:1px;width:36%;background:linear-gradient(90deg,transparent,#d8a952)}
.hero-quote .verse-divider::before{left:0}.hero-quote .verse-divider::after{right:0;transform:scaleX(-1)}
.hero .hero-quote .verse-translation{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:clamp(10.5px,1.02vw,12px);line-height:1.6;font-style:italic;color:#fff8e9;margin:0 auto 10px;max-width:225px}
.hero .hero-quote .verse-source{font:700 9px/1.4 'DM Sans',sans-serif;color:#f7d98c;letter-spacing:.25px;display:block}
html[dir="rtl"] .hero .hero-quote .verse-translation{font-family:'Noto Nastaliq Urdu',serif;font-style:normal;line-height:2.05;font-size:12px}
html[dir="rtl"] .hero-quote .verse-label{font-family:'Noto Nastaliq Urdu',serif;font-size:10px;letter-spacing:0;line-height:1.8}
html[dir="rtl"] .hero .hero-quote .verse-source{font-family:'Noto Nastaliq Urdu',serif;line-height:1.8;font-size:10px}
/* Tablet: retain side-card position, adjust to narrower hero. */
@media(max-width:1240px){.site-header .brand{width:143px;max-width:143px}.brand .brand-ar{font-size:30px}.brand .brand-en{font-size:8.5px;letter-spacing:.16em}.brand .brand-ur{font-size:7.6px}.hero .hero-quote{width:216px;top:48px;right:8px;min-height:210px;padding:19px 12px 16px}.hero .hero-quote .verse-arabic{font-size:19px;line-height:1.7}}
@media(max-width:1040px){.site-header .brand{width:139px;max-width:139px}.hero .hero-quote{width:184px;top:19px;right:4px;min-height:0;padding:16px 11px 14px}.hero .hero-quote .verse-arabic{font-size:17px;line-height:1.7}.hero .hero-quote .verse-translation{font-size:9.5px;line-height:1.45}.hero .hero-quote .verse-source{font-size:8px}.hero-quote .verse-label{font-size:7px;letter-spacing:1.3px}}
@media(max-width:850px) and (min-width:641px){.hero .hero-quote{top:auto;bottom:12px;right:10px;width:172px;padding:12px 10px 13px}.hero .hero-quote .verse-arabic{font-size:15px;line-height:1.6}.hero .hero-quote .verse-translation{font-size:9px}.hero .hero-quote::after{font-size:17px;top:-11px}.hero-quote .verse-divider{margin:1px auto 3px}}
/* Mobile: image stays behind title; quote becomes a purposeful SIDE message overlay,
   with reserved room for the fixed WhatsApp/Hikmat/theme tools. */
@media(max-width:640px){
  .site-header .brand{width:119px;max-width:119px;padding-top:2px}
  .brand .brand-ar{font-size:25px;line-height:1.11}.brand .brand-en{font-size:7px;letter-spacing:.11em;padding:2px 1px 1px}.brand .brand-ur{font-size:6.7px;line-height:2.1}
  .brand .brand-en::before,.brand .brand-en::after{font-size:6px}
  .hero-grid{padding-bottom:22px}
  .hero .hero-quote{position:relative;order:2;top:auto;bottom:auto;left:auto;right:auto;align-self:flex-end;width:min(77%,282px);max-width:none;min-height:0;margin:-6px 45px 2px 0;padding:16px 13px 16px;border-radius:20px 20px 16px 16px;box-shadow:inset 0 0 0 2px rgba(4,39,28,.86),inset 0 0 0 4px rgba(235,192,109,.20),0 14px 35px rgba(2,24,18,.31),0 0 16px rgba(213,161,59,.11)}
  .hero .hero-quote::before{inset:6px;border-radius:15px 15px 11px 11px}
  .hero .hero-quote::after{top:-12px;font-size:17px}
  .hero-quote .verse-star{font-size:9px;margin-bottom:3px}
  .hero-quote .verse-label{font-size:7px;letter-spacing:1.2px}
  .hero .hero-quote .verse-arabic{font-size:clamp(17px,4.7vw,21px);line-height:1.7;margin:0}
  .hero-quote .verse-divider{margin:1px auto 3px;height:13px;font-size:14px;line-height:12px}
  .hero-quote .verse-divider::before,.hero-quote .verse-divider::after{top:5px}
  .hero .hero-quote .verse-translation{font-size:clamp(10px,2.7vw,11.5px);line-height:1.52;margin:0 auto 7px}
  .hero .hero-quote .verse-source{font-size:8px}
  html[dir="rtl"] .hero .hero-quote{align-self:flex-start;margin:0 0 2px 45px}
}
@media(max-width:365px){.site-header .brand{width:105px;max-width:105px}.brand .brand-ar{font-size:22px}.brand .brand-en{font-size:6.4px;letter-spacing:.08em}.brand .brand-ur{font-size:6px}.hero .hero-quote{width:min(77%,240px);margin-right:39px;padding:13px 10px}.hero .hero-quote .verse-arabic{font-size:16.5px}.hero .hero-quote .verse-translation{font-size:9.7px}html[dir="rtl"] .hero .hero-quote{margin-left:39px;margin-right:0}}
@media(prefers-reduced-motion:reduce){.hero .hero-quote,.brand{transition:none!important}}
/* Last responsive safety refinements. */
@media(min-width:641px) and (max-width:1350px){
 .hero .hero-quote{right:70px}
}
@media(max-width:640px){
 .hero-copy{isolation:isolate}
 .hero-copy::before{content:'';z-index:0;position:absolute;inset:-15px auto -7px -17px;width:min(88vw,338px);pointer-events:none;background:linear-gradient(90deg,rgba(249,249,242,.96),rgba(249,249,242,.72) 53%,rgba(249,249,242,.21) 85%,transparent);filter:blur(2px)}
 html[data-theme="dark"] .hero-copy::before{background:linear-gradient(90deg,rgba(6,30,22,.95),rgba(7,31,23,.77) 54%,rgba(7,31,23,.18) 87%,transparent)}
 html[dir="rtl"] .hero-copy::before{left:auto;right:-17px;transform:scaleX(-1)}
}