/*
 * ══════ «عن الموقع» — وكان لها لونُها الخاصّ ══════
 *
 * **صفحةٌ واحدةٌ في الموقع كانت بنفسجيّة**: صدرٌ متدرّجٌ من `#a855f7` إلى
 * `#7c3aed`، وعناوينُ بنفسجيّةٌ بحدٍّ بنفسجيّ، وظلٌّ بنفسجيّ. وهي من الثيم
 * الذي كان قبل نظام التصميم — كما كانت الأرضيّةُ الكريميّةُ في صفحة المقال.
 *
 * **وهي صفحةٌ في القائمة العليا** يفتحها من يسأل «من وراء هذه الشبكة»،
 * فيلقى موقعًا بلونٍ آخر.
 *
 * فصارت ألوانُها رموزَ الموقع (`--brand` و`--brand-deep` و`--azure`)،
 * **والبنيةُ كما هي**: الصدرُ صدرٌ والصناديقُ صناديق. ولا يُمَسّ نصُّ
 * المالك — هو في القاعدة، وهذه ورقتُه.
 *
 * ولو حُرِّرت الصفحةُ من `/admin/pages` لَذهب هذا كلُّه: الجديدُ يُرسم
 * بـ`voa-rich` بلا أصنافٍ خاصّة. **فهذا لونُ ما لم يُحرَّر بعد.**
 */
 :root {
     --primary-purple: var(--brand);
     --primary-purple-dark: var(--brand-deep);
     --primary-purple-light: var(--brand-line);
     --bg-light: var(--paper);
 }


 /* Hero Section Styles */
 .aboutus .hero-container {
     position: relative;
     background: linear-gradient(135deg, var(--azure) 0%, var(--brand) 50%, var(--brand-deep) 100%);
     border-radius: 24px;
     overflow: hidden;
     box-shadow: 0 20px 40px rgba(12, 94, 156, .22);
 }

 .aboutus .hero-pattern {
     position: absolute;
     inset: 0;
     opacity: 1;
     background-image: url(../images/back.png);
     background-size: contain;
 }

 .aboutus .hero-content {
     position: relative;
     z-index: 10;
 }

 /* Microphone Icon made with CSS */
 .aboutus .mic-container {
     position: relative;
     width: 180px;
     height: 220px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }

 .aboutus .mic-head {
     width: 120px;
     height: 140px;
     background: rgba(255, 255, 255, 0.15);
     border: 3px solid rgba(255, 255, 255, 0.8);
     border-radius: 50% 50% 45% 45%;
     position: relative;
     display: flex;
     align-items: center;
     justify-content: center;
     backdrop-filter: blur(5px);
 }

 .aboutus .mic-head::before {
     content: '';
     position: absolute;
     width: 100px;
     height: 120px;
     background: rgba(255, 255, 255, 0.1);
     border-radius: 50%;
     top: 10px;
 }

 .aboutus .mic-stand {
     width: 6px;
     height: 40px;
     background: rgba(255, 255, 255, 0.8);
     margin-top: -5px;
 }

 .aboutus .mic-base {
     width: 60px;
     height: 8px;
     background: rgba(255, 255, 255, 0.8);
     border-radius: 4px;
     margin-top: -2px;
 }

 .aboutus .arabic-text-inside {
     position: absolute;
     color: rgba(255, 255, 255, 0.9);
     font-size: 10px;
     font-weight: 700;
     text-align: center;
     line-height: 1.8;
     padding: 10px;
     direction: rtl;
 }





 .aboutus .section-title {
     color: var(--brand-deep);
     font-weight: 700;
     font-size: 1.1rem;
     position: relative;
     padding-right: 15px;
     border-right: 3px solid var(--brand-deep);
     margin-bottom: 1rem;
     display: inline-block;
 }

 /* Content Boxes */
 .aboutus .content-box {
     background: white;
     border-radius: 12px;
     padding: 1.5rem;
     margin-bottom: 1rem;
     border: 1px solid var(--line);
 }

 .aboutus .content-box-title {
     color: #4a4a4a;
     font-weight: 700;
     display: flex;
     align-items: center;
     gap: 8px;
     margin-bottom: 0.75rem;
 }

.aboutus  .purple-dot {
     width: 10px;
     height: 10px;
     background: var(--brand-deep);
     border-radius: 50%;
     display: inline-block;
 }

 /* Social Links */
 .aboutus .social-link {
     color: #666;
     text-decoration: none;
     transition: color 0.3s ease;
     display: block;
     margin-bottom: 0.5rem;
 }

 .aboutus .social-link:hover {
     color: var(--brand-deep);
 }

 /* Footer */
.aboutus  .footer-text {
     color: var(--brand-deep);
     font-weight: 700;
     font-size: 1.3rem;
     text-align: center;
 }

 /* Smooth animations */
 @keyframes fadeInUp {
     from {
         opacity: 0;
         transform: translateY(20px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 .aboutus .animate-fade-in {
     animation: fadeInUp 0.6s ease-out forwards;
 }

 .aboutus .delay-100 {
     animation-delay: 0.1s;
 }

 .aboutus .delay-200 {
     animation-delay: 0.2s;
 }

.aboutus .delay-300 {
     animation-delay: 0.3s;
 }

.aboutus .backgroundContent {
     background: #F8F8F8;
     border-radius: 15px;
     box-shadow: 1px 1px 8px #e0e0e0;
 }

 html{box-sizing:border-box;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;word-break:normal;tab-size:4}*,:before,:after{box-sizing:border-box;background-repeat:no-repeat}:before,:after{-webkit-text-decoration:inherit;text-decoration:inherit;vertical-align:inherit}*{margin:0;padding:0}hr{height:0;color:inherit;border:0;border-top:1px solid;overflow:visible}details,main{display:block}summary{display:list-item}small{font-size:80%}[hidden]{display:none!important}abbr[title]{border-bottom:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}a{background-color:#0000}a:active,a:hover{outline-width:0}code,kbd,pre,samp{font-family:monospace}pre{font-size:1em}b,strong{font-weight:bolder}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{border-color:inherit;text-indent:0}iframe{border-style:none}input{border-radius:0}[type=number]::-webkit-inner-spin-button{height:auto}[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}textarea{resize:vertical;overflow:auto}button,input,optgroup,select,textarea{font:inherit;color:inherit}optgroup{font-weight:700}button{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit],[role=button]{cursor:pointer}button::-moz-focus-inner{border-style:none;padding:0}[type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]::-moz-focus-inner{border-style:none;padding:0}[type=submit]::-moz-focus-inner{border-style:none;padding:0}button,html [type=button],[type=reset],[type=submit]{appearance:auto}button,input,select,textarea{background-color:#0000;border-style:none}button:-moz-focusring{outline:1px dotted buttontext}[type=button]::-moz-focus-inner{outline:1px dotted buttontext}[type=reset]::-moz-focus-inner{outline:1px dotted buttontext}[type=submit]::-moz-focus-inner{outline:1px dotted buttontext}select{appearance:none}a:focus,button:focus,input:focus,select:focus,textarea:focus{outline-width:0}select::-ms-expand{display:none}select::-ms-value{color:currentColor}legend{color:inherit;white-space:normal;border:0;max-width:100%;display:table}::-webkit-file-upload-button{appearance:auto;color:inherit;font:inherit}[disabled]{cursor:default}img{border-style:none}progress{vertical-align:baseline}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true]{cursor:default}ul,ol{list-style-type:none}figure{margin:0}@keyframes slide-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0%)}}.gradient-blue{background:radial-gradient(106.41% 128.47% at 50.15% 128.47%,#23abff 0%,#3066ff 100%)}.gradient-green{background:radial-gradient(92.26% 118.88% at 50.15% .13%,#00c3c3 0%,#00aab3 100%)}.gradient-purple{background:radial-gradient(165.12% 115.56% at 50.15% .13%,var(--brand) 0%,#00a0eb 100%)}.bg-blue{background-color:#f2f5ff}.bg-purple{background-color:var(--brand-tint)}.bg-green{background-color:#ebffed}.lock-screen{letter-spacing:normal;z-index:2147483638;border-radius:24px;width:327px;font-family:FigtreeVF,sans-serif;animation:.3s ease-in-out forwards slide-in;position:fixed;bottom:24px;right:24px;overflow:hidden;box-shadow:0 24px 32px #00000014}.lock-screen__content{padding:24px 24px 64px;position:relative}.lock-screen__close{opacity:.5;justify-content:center;align-items:center;width:24px;height:24px;display:flex;position:absolute;top:16px;right:16px}.lock-screen__label{color:#fff;background-color:#fff3;border-radius:50px;justify-content:center;align-items:center;gap:8px;width:fit-content;height:26px;margin:-8px auto 16px;padding-inline:16px;font-size:12px;line-height:18px;display:flex}.lock-screen__title{color:#fff;text-align:center;margin-bottom:8px;font-size:20px;font-weight:600;line-height:28px}.lock-screen__description{color:#f5f6f7;text-align:center;font-size:14px;line-height:20px}.lock-screen__description b{font-weight:600}.lock-screen__card{z-index:1;background-color:#fff;border-radius:24px;margin-top:-44px;padding:32px 20px 20px;position:relative}.lock-screen__inner{margin-bottom:24px}.lock-screen__submit{color:#fff;background-color:#f70;border-radius:12px;justify-content:center;align-items:center;gap:10px;width:100%;height:40px;margin-bottom:16px;padding-inline:16px;font-size:16px;font-weight:700;display:flex}.lock-screen__skip{color:#82829c;justify-content:center;align-items:center;margin-inline:auto;font-size:14px;line-height:20px;display:flex}.price-card{background:linear-gradient(254.14deg,#fafbff .04%,#f5f8ff 100.04%);border:1px solid var(--surface-sunk);border-radius:24px;padding:24px 28px}.price-card__label{color:#4a5764;text-align:center;text-transform:uppercase;margin-bottom:16px;font-size:14px;line-height:20px}.price-card__price{justify-content:center;align-items:flex-start;column-gap:2px;margin-bottom:12px;display:flex}.price-card__currency{color:#515478;font-size:18px;line-height:28px}.price-card__number{color:#14142a;text-align:center;font-size:64px;line-height:54px}.price-card__wrap{flex-direction:column;display:flex}.price-card__decimal{color:#515478;font-size:18px;font-weight:600;line-height:28px}.price-card__period{color:#515478;margin-top:-6px;font-size:14px;line-height:20px}.price-card__discount{justify-content:center;align-items:center;margin-bottom:12px;display:flex;position:relative}.price-card__discount-divider{z-index:0;background-color:#dbe2f9;width:100%;height:1px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.price-card__discount-icon{z-index:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.price-card__discount-text{z-index:2;color:#fff;font-size:12px;font-weight:600;line-height:18px;position:relative}.price-card__features{justify-content:center;align-items:center;column-gap:16px;display:flex}.price-card__feature{color:#222e3a;align-items:center;gap:6px;font-size:14px;line-height:20px;display:flex}.price-card__feature:before{content:"";background-color:#20df9e;border-radius:50%;flex-shrink:0;width:4px;height:4px;display:block}.features-list{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.features-list__item{flex-direction:column;align-items:center;gap:6px;display:flex}.features-list__icon{border-radius:12px;justify-content:center;align-items:center;width:52px;height:52px;display:flex}.features-list__text{color:#293a53;text-align:center;letter-spacing:-.1px;font-size:16px;line-height:24px}
/*
 * ══ وأصنافُ اللون في النصّ المخزَّن ══
 *
 * في متن الصفحة `text-purple-600` مكتوبةً في HTML المحفوظ في القاعدة —
 * **ولا تُمَسّ**: نصُّ المالك ملكُه، وتعديلُ صفٍّ في القاعدة لتغيير لونٍ
 * يُفقد المرجعَ إلى ما كتبه.
 *
 * فتُغطّى هنا بصنفٍ أخصَّ منها (`.aboutus` تسبقه)، ولا تحتاج `!important`.
 */
.aboutus .text-purple-600,
.aboutus .text-purple-700 { color: var(--brand-deep); }