/* صوت ستوديو — تكملة صفحات الموقع فوق ss.css (نظام التصميم). لا ألوان خام هنا: كل شيء من tokens.css. */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 12px); }
body { margin: 0; background: var(--bg); }
.ss-header { top: env(safe-area-inset-top, 0px); }
.ss-nav a { position: relative; }
.ss-mobile-nav { display: none; position: absolute; inset-inline: var(--space-4); top: calc(var(--header-height) + 8px); z-index: 30; }
.ss-mobile-nav.open { display: grid; }
.ss-hero .ss-container { display: flex; align-items: center; justify-content: space-between; gap: var(--space-7); flex-wrap: wrap; }
.ss-hero .ss-wave-wrap { position: relative; z-index: 1; }
@media (max-width: 760px) { .ss-hero .ss-wave-wrap { display: none; } }
.ss-section .ss-container { display: grid; gap: var(--space-7); }
.ss-section-head p { color: var(--ink-2); }
.ss-on-dark .ss-section-head p { color: rgba(255,255,255,.80); }
.ss-chips-note { color: rgba(255,255,255,.72); font-size: 15px; max-width: 70ch; }
.ss-grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: var(--space-5); }
.ss-grid-4 > * { min-width: 0; }
.ss-fine { font-size: 14px; color: var(--muted); max-width: 80ch; }
.ss-price-amount .cur { color: var(--muted); font-size: 14px; }
.ss-player audio { display: none; }
.ss-player-bars i { transition: background-color .15s; }
/* نموذج الانتظار */
.ss-wait { position: relative; display: grid; gap: var(--space-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-6); box-shadow: var(--shadow); max-width: 760px; }
.ss-wait .row { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.ss-wait .hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; inset: 0 auto auto 0; }
.ss-msg { font-size: 15px; min-height: 1.6em; }
.ss-msg.ok { color: var(--green-text); } .ss-msg.err { color: var(--orange-text); }
.ss-consent { font-size: 13px; color: var(--muted); }
.ss-consent a { color: var(--purple); }
/* الصفحات القانونية */
.ss-legal { max-width: 780px; margin-inline: auto; padding-block: var(--space-8); display: grid; gap: var(--space-3); }
.ss-legal h1 { font-size: clamp(1.6rem, 3.4vw, 2.3rem); }
.ss-legal h2 { font-size: 1.2rem; color: var(--purple); margin-top: var(--space-5); font-weight: 600; }
.ss-legal p, .ss-legal li { color: var(--ink-2); }
.ss-legal ul { padding-inline-start: 1.3em; margin: 0; display: grid; gap: 6px; }
.ss-legal .meta { color: var(--muted); font-size: 14px; }
.ss-footer .ss-footer-brand img { height: 36px; width: auto; }

/* رابطُ التخطّي (يظهر عند التركيز) ورسالةُ noscript */
.ss-skip{position:absolute;inset-inline-start:16px;top:-48px;z-index:50;padding:10px 16px;border-radius:var(--r-pill);background:var(--purple);color:var(--on-purple);text-decoration:none;font-size:15px}
.ss-skip:focus{top:12px;outline:2px solid var(--teal);outline-offset:2px}
.ss-noscript{padding:12px 16px;text-align:center;background:var(--yellow);color:var(--purple-dd);font-size:15px}

/* ——— ترويسةُ المسجَّل (الهبوط · ملاحظة أحمد 17/10): زرٌّ باسمه يفتح قائمةً صغيرة ——— */
.ss-user-menu { position: relative; }
.ss-user-btn i { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--teal, #0e9f8f); color: var(--white, #fff); font-style: normal; font-size: 12px; font-weight: 600; margin-inline-end: 6px; }
.ss-user-menu .ss-menu { position: absolute; inset-inline-end: 0; top: calc(100% + 6px); min-width: 180px; display: grid; gap: 2px; padding: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: 0 10px 28px rgba(0, 0, 0, .14); z-index: 40; }
.ss-user-menu .ss-menu[hidden] { display: none; }
.ss-user-menu .ss-menu a, .ss-user-menu .ss-menu button { display: block; width: 100%; text-align: start; padding: 10px 12px; border-radius: var(--r-sm); color: var(--ink); background: transparent; border: 0; font: inherit; cursor: pointer; text-decoration: none; }
.ss-user-menu .ss-menu a:hover, .ss-user-menu .ss-menu button:hover, .ss-user-menu .ss-menu a:focus-visible, .ss-user-menu .ss-menu button:focus-visible { background: var(--bg-alt); }
/* قائمة الهاتف: الزرّ المحدّد بلون البنفسجيّ على السطح الأبيض (كان أبيض على أبيض · QA على الإنتاج 19/10) */
.ss-mobile-nav a.ss-btn-outline { color: var(--purple); background: transparent; }
.ss-mobile-nav a.ss-btn-outline:hover { background: var(--bg-alt); }

/* PaymentRow (Voice Design 20/10 · ds-pending-v28): علامات طرق الدفع الرسميّة في التذييل؛ لا إعادةَ تلوين بحكم إرشادات العلامات */
.ss-payrow { display: grid; gap: 10px; justify-items: start; }
.ss-payrow-line { margin: 0; font-size: 14px; color: var(--ink-2); }
.ss-payrow-marks { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; list-style: none; margin: 0; padding: 0; }
.ss-payrow-marks li { display: flex; align-items: center; height: 24px; }
.ss-payrow-marks img { display: block; height: 22px; width: auto; }
.ss-payrow-marks .is-mc img { height: 24px; }
.ss-payrow-marks .is-card img { height: 24px; }
.ss-payrow-marks .is-gpay img { height: 44px; margin-block: -10px; } /* ملفّ Google فيه فراغ حماية مدمج (العلامة 54% من ارتفاعه) */
.ss-payrow-tax { margin: 0; font-size: 12.5px; color: var(--muted); }
/* في التذييل الداكن: تحت الأعمدة بخطّ فاصل وقبل سطر الحقوق */
.ss-footer-pay, .pg-foot-pay { border-top: 1px solid rgba(255,255,255,.12); padding-block: 18px; }
.ss-footer .ss-payrow-line, .pg-foot .ss-payrow-line { color: rgba(255,255,255,.80); }
.ss-footer .ss-payrow-tax, .pg-foot .ss-payrow-tax { color: rgba(255,255,255,.62); }

/* التذييل ٢ (Voice Design · design/footer-v2 · اعتماد أحمد 21/10) */
/* ——— التذييل ٢ ——— */
.ft{position:relative;padding:64px 0 28px;color:var(--ink-2);font-size:14.5px;background:radial-gradient(900px 360px at 85% 0%,color-mix(in srgb,var(--purple) 26%,transparent),transparent 65%),radial-gradient(700px 300px at 5% 100%,color-mix(in srgb,var(--teal) 10%,transparent),transparent 60%),var(--hero-1)}
.ft-in{max-width:1180px;margin:0 auto;padding-inline:32px;box-sizing:border-box}
/* شبكة واحدة: العلامة 2 · ثلاثة أعمدة روابط 1 لكلّ منها */
.ft-grid{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:40px;align-items:start}
.ft-brand{display:grid;gap:16px;align-content:start;justify-items:start}
.ft-brand img{display:block;height:36px}
.ft-brand p{margin:0;line-height:1.85;max-width:26em;color:rgba(255,255,255,.72)}
.ft-lang{display:inline-flex;padding:3px;border-radius:var(--r-pill);border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04)}
.ft-lang a{display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:var(--r-pill);font-size:13.5px;color:rgba(255,255,255,.75);text-decoration:none}
.ft-lang a[aria-current="true"]{background:rgba(255,255,255,.14);color:#fff;font-weight:500}
.ft-col{display:grid;gap:12px;align-content:start;justify-items:start}
.ft-col h4{margin:0 0 2px;font:600 14px/1.4 var(--font-body);color:#fff}
.ft-col a{color:rgba(255,255,255,.72);text-decoration:none;line-height:1.5}
.ft-col a:hover{color:#fff}
/* القاعدة: صفّ واحد بخطّ فاصل واحد · الحقوق يميناً والدفع يساراً */
.ft-base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12)}
.ft-legal{display:grid;gap:4px;font-size:13px;color:rgba(255,255,255,.6)}
.ft-pay{display:grid;gap:8px;justify-items:end}
.ft-pay-line{margin:0;font-size:13px;color:rgba(255,255,255,.72)}
.ft-pay-tax{margin:0;font-size:12px;color:rgba(255,255,255,.55)}
/* علامات الدفع: كلّها على بطاقات بيضاء بالحجم نفسه (كما تُعرض علامتا Apple Pay وGoogle Pay الرسميّتان أصلاً) */
.ft-marks{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;direction:ltr}
.ft-marks li{display:grid;place-items:center;width:52px;height:34px;box-sizing:border-box;border-radius:6px;background:#fff;border:1px solid #D9D9D9;overflow:hidden}
.ft-marks img{display:block;max-width:40px;max-height:20px;width:auto;height:auto}
.ft-marks .is-own{background:transparent;border:0}
.ft-marks .is-own img{max-width:none;max-height:none;width:52px;height:34px}
/* Google Pay داخل البطاقة البيضاء نفسها بحجمٍ بصريّ مساوٍ (اعتماد أحمد 21/10 · Voice Design): الكبسولة 69٪ من عرض الملفّ في الوسط ⇒ 66×45 تُظهرها 45×24؛
   flex لا grid: العنصرُ الفائض يتوسّط فتقصّ البطاقةُ فراغَ الحماية من الجهتين بالتساوي */
.ft-marks .is-gpay{display:flex;align-items:center;justify-content:center}
.ft-marks .is-gpay img{flex:none;width:66px;height:45px;max-width:none;max-height:none}
.ft-marks .is-pending{background:rgba(255,255,255,.06);border:1px dashed rgba(255,255,255,.4);color:rgba(255,255,255,.7);font:500 9.5px/1.15 var(--font-latin);text-align:center}
@media (max-width:900px){
.ft{padding:44px 0 24px}
.ft-in{padding-inline:20px}
.ft-grid{grid-template-columns:1fr 1fr;gap:32px 20px}
.ft-brand{grid-column:1 / -1}
.ft-col.is-contact{grid-column:1 / -1}
.ft-base{flex-direction:column-reverse;align-items:stretch;margin-top:36px}
.ft-pay{justify-items:start}
.ft-marks{direction:rtl;gap:6px}
}
.ft-pay-line a, .ft-paddle { color: #fff; text-decoration: underline; text-underline-offset: 3px; }