/* Hero */
.hero{display:flex;align-items:center;padding:96px 0 64px}
.hero-grid.clean-hero{display:block}
.hero-content{max-width:920px;margin-inline:auto;text-align:center}
.hero h1{font-size:var(--font-h1);line-height:1.25;margin:0;font-weight:950;letter-spacing:normal;text-wrap:balance}
.hero-actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:32px}
.visit-counter{display:inline-flex;align-items:center;gap:7px;color:var(--muted,#6b7787);font-size:12.5px}
.visit-counter-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 0 rgba(74,222,128,.6);animation:visit-pulse 2s ease-out infinite}
.visit-counter-value{font-weight:700;font-variant-numeric:tabular-nums}
.visit-counter-label{color:inherit}
@keyframes visit-pulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.55)}70%{box-shadow:0 0 0 6px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
.categories-section{padding-top:0}
.search-box{min-width:280px}

/* Why ABENAN */
.why-trigger-section{text-align:center}
.why-trigger{display:inline-flex;align-items:center;gap:12px;background:none;border:none;padding:0;margin:0;cursor:pointer;font:inherit;font-family:inherit;font-size:var(--font-h2);line-height:1.22;font-weight:950;color:var(--navy)}
.why-trigger-icon{font-size:.65em;transition:transform .16s ease}
.why-trigger:hover,.why-trigger:focus-visible{text-decoration:underline;text-underline-offset:8px}
.why-trigger:hover .why-trigger-icon,.why-trigger:focus-visible .why-trigger-icon{transform:translateX(-6px)}
.why-modal-card{width:min(860px,100%)}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.why-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}
.why-item h3{margin:0 0 8px;font-size:17px;font-weight:950}
.why-item p{margin:0;color:var(--muted);font-size:13.5px}

@media(max-width:980px){
  .why-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .hero{padding:40px 0 32px}
  .hero h1{font-size:30px;line-height:1.3}
  .hero-actions{flex-wrap:wrap;margin-top:24px}
  .why-trigger{font-size:26px}
}


/* ——— مراحل طلب تحليل الاستبانة ——— */
/* شريطٌ ثابتٌ بأربع مراحل، ورقمٌ صريح تحته: البسط والمقام معًا هما ما يطمئن. */
.stage-bar{display:flex;gap:6px;list-style:none;margin:0 0 6px;padding:0;flex-wrap:wrap}
.stage-chip{display:flex;align-items:center;gap:7px;flex:1 1 auto;min-width:0;
  padding:8px 10px;border-radius:10px;background:var(--surface-2,#f2f4f8);
  color:var(--muted,#6b7280);font-size:13px;transition:background .18s,color .18s}
.stage-chip-num{display:grid;place-items:center;inline-size:22px;block-size:22px;flex:none;
  border-radius:50%;background:#fff;color:inherit;font-weight:700;font-size:12px;
  box-shadow:inset 0 0 0 1px currentColor}
/* الاسم لا يُقصّ (قاعدة الموقع): يتلاشى عند الحافّة ويبقى كاملًا في الصفحة — **حين لا يتّسع له حقله وحده**، وفي جهة
   نهاية نصّه (2026-10-19). كان التلاشي دائمًا، فيبهت آخر الاسم العربي القصير وأوّلُ الإنجليزي («Jpload»).
   `data-clipped` يضعه `js/lib/fadeClip.js`. */
.stage-chip-name{overflow:hidden;white-space:nowrap;min-width:0}
.stage-chip-name[data-clipped]{-webkit-mask-image:linear-gradient(to left,#000 72%,transparent);mask-image:linear-gradient(to left,#000 72%,transparent)}
.stage-chip-name[data-clipped]:dir(ltr){-webkit-mask-image:linear-gradient(to right,#000 72%,transparent);mask-image:linear-gradient(to right,#000 72%,transparent)}
.stage-chip.is-current{background:var(--brand,#12203c);color:#fff}
.stage-chip.is-current .stage-chip-num{background:#fff;color:var(--brand,#12203c);box-shadow:none}
.stage-chip.is-done{background:#e8f5ee;color:#1d6a43}
.stage-chip.is-done .stage-chip-num{background:#1d6a43;color:#fff;box-shadow:none}
/* المرحلة التي تُجهَّز الآن: حالةٌ رابعة في الشريط، لا سكونٌ يوحي بأن شيئًا لا يحدث. */
.stage-chip.is-working{background:#fff7e6;color:#8a5a00}
.stage-chip.is-working .stage-chip-num{background:#d98c00;color:#fff;box-shadow:none;animation:abenan-pulse 1.1s ease-in-out infinite}
@keyframes abenan-pulse{0%,100%{opacity:1}50%{opacity:.45}}
.stage-counter{margin:0 0 16px;font-size:13px;color:var(--muted,#6b7280)}

/* «جاري معالجة الملف» — تحت حقل الملف، في المرحلة المفتوحة، حيث ينظر العميل. */
.spss-busy{display:flex;align-items:center;gap:10px;margin:12px 0 0;padding:12px 14px;
  border:1px solid var(--line,#e6e8ee);border-radius:10px;background:#f7f9fc;color:var(--text,#1c2536);font-size:14px}
.spss-spinner{inline-size:18px;block-size:18px;flex:none;border-radius:50%;
  border:2px solid rgba(0,0,0,.12);border-top-color:var(--brand,#12203c);animation:abenan-spin .8s linear infinite}
@keyframes abenan-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){
  .spss-spinner{animation:none}
  .stage-chip.is-working .stage-chip-num{animation:none}
}

.order-staged .stage{border-top:1px solid var(--line,#e6e8ee);padding:14px 0}
.order-staged .stage:first-of-type{border-top:0;padding-top:0}
/* المرحلة القادمة تبقى مرئيّة وغير نشطة: يعرف نهاية الطريق ولا يقفز إليها. */
/* المقفلة تُقرأ لا تُلمس: شفافية .55 كانت تهبط بالتباين إلى 2.1 (Lighthouse)، فاللون يُخفَّف لا الشفافية. */
.order-staged .stage.is-locked{pointer-events:none}
.order-staged .stage.is-locked .stage-head{color:var(--muted)}
.order-staged .stage.is-locked .stage-head-num{background:#f1f4f8;color:var(--muted)}
.order-staged .stage.is-locked .stage-body{display:none}

/* رأس المرحلة: اسمها ورقمها، ظاهران في حالاتها الثلاث. وبدونه كانت المرحلة المقفلة
   صندوقًا فارغًا لا يقول «ماذا بقي؟» — وهو سبب إظهارها أصلًا. */
.stage-head{display:flex;align-items:center;gap:9px;font-weight:600;color:var(--muted,#6b7280)}
.stage-head-num{display:grid;place-items:center;inline-size:22px;block-size:22px;flex:none;
  border-radius:50%;background:#eef1f6;color:var(--muted,#6b7280);font-size:13px}
.order-staged .stage.is-open .stage-head{color:var(--ink,#12203c)}
.order-staged .stage.is-open .stage-head-num{background:var(--brand,#12203c);color:#fff}
.order-staged .stage.is-done .stage-head{color:#1d6a43}
.order-staged .stage.is-done .stage-head-num{background:#1d6a43;color:#fff}
.order-staged .stage.is-done .stage-head-num::after{content:"✓"}
.order-staged .stage.is-done .stage-head-num{font-size:0}
.order-staged .stage.is-done .stage-head-num::after{font-size:13px}
.order-staged .stage.is-open .stage-body{margin-top:12px}

/* المنتهية تُطوى إلى ملخّص ما اعتُمد فيها، لا إلى عنوانٍ مجرّد. */
.stage-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}
.stage-done-line{display:flex;align-items:center;gap:10px;min-width:0}
.stage-next{margin-top:14px}

.read-summary{padding:2px 0}
.read-facts{list-style:none;margin:8px 0 12px;padding:0;display:grid;gap:4px;color:var(--muted,#6b7280)}
.read-facts strong{color:var(--ink,#12203c)}
/* الاستجابات الناقصة: خيار استبعادها تحت ما قرأناه من الملفّ، وعددها معه في قائمة التصنيف (2026-10-12). */
.read-choice{margin:0 0 12px}
.read-choice:empty{display:none}
.read-choice p{margin:0 0 6px;color:var(--muted,#6b7280)}
.read-choice p strong{color:var(--ink,#12203c)}
.link-button{background:none;border:0;padding:0;color:var(--brand,#12203c);
  font:inherit;text-decoration:underline;cursor:pointer}

.final-summary{display:grid;gap:8px;margin-bottom:14px}
.final-row{display:flex;gap:12px;align-items:baseline;justify-content:space-between}

@media (max-width:640px){
  .stage-chip-name{display:none}
  .stage-chip{flex:0 0 auto;padding:8px}
  .stage-summary{flex-direction:column;align-items:stretch}
}

/* ——— معمل أبينان /lab (2026-10-20): تجربتان تعليميتان، على هيئة بطاقات الموقع ——— */
.lab{max-width:880px}
.lab-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:22px;margin-top:22px;display:grid;gap:14px;min-width:0}
.lab-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.lab-head h2{margin:0;font-size:var(--font-h3)}
.lab-tag{font-size:12px;font-weight:800;color:var(--amber);background:var(--amber-soft);border-radius:var(--radius-pill);padding:4px 12px}
.lab-q{margin:0;font-weight:700}
.lab-choice{display:flex;gap:8px;flex-wrap:wrap}
.lab-pill{border:1px solid var(--line);background:var(--soft);color:var(--navy);font:inherit;font-size:14px;font-weight:800;border-radius:var(--radius-pill);padding:8px 16px;cursor:pointer;min-height:40px}
.lab-pill[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.lab-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px}
.lab-field{margin:0;display:grid;gap:6px;min-width:0}
.lab-input{display:flex;align-items:center;gap:8px}
.lab-input input{min-width:0;flex:1}
.lab-unit{color:var(--muted);font-weight:700;font-size:13px;min-width:38px}
.lab-slider{margin:0;display:grid;gap:6px}
.lab-slider input[type=range]{border:0;padding:0;min-height:auto;box-shadow:none;background:transparent;accent-color:var(--navy);width:100%}
.lab-card > .btn{justify-self:start}
.lab-result{display:grid;gap:12px;border-top:1px solid var(--line);padding-top:14px;min-width:0}
.lab-figures{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:10px;margin:0}
.lab-figures div{background:var(--soft);border-radius:var(--radius-sm);padding:10px 14px}
.lab-figures dt{font-size:13px;color:var(--muted);font-weight:700}
.lab-figures dd{margin:2px 0 0;font-size:24px;font-weight:850;color:var(--navy)}
.lab-note{margin:0;color:var(--muted);font-size:13px}
.lab-samples{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lab-samples figure{margin:0;display:grid;gap:4px;text-align:center}
.lab-samples svg{width:100%;height:auto;border:1px solid var(--line);border-radius:var(--radius-sm);background:#f3f9ff}
.lab-samples figcaption{font-size:13px;font-weight:700;color:var(--muted)}
.lab-dot{fill:#1d6fb8;opacity:.8}
.lab-feedback{margin:0;font-weight:800;color:var(--green)}
.lab-eq{margin:0;font-size:14px;color:var(--navy);background:var(--soft);border-radius:12px;padding:8px 12px;overflow-wrap:anywhere;text-align:left}
.lab-receptors{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;max-width:420px}
.lab-cell{aspect-ratio:1;border-radius:50%;border:2px solid #b8cde6;background:#fff}
.lab-cell.is-on{background:var(--green);border-color:var(--green)}
.lab-cell.is-part{background:linear-gradient(to top,var(--green) calc(var(--fill,0) * 100%),#fff 0);border-color:var(--green)}
.lab-curve{width:100%;max-width:520px;height:auto}
.lab-axis{fill:none;stroke:#b8cde6;stroke-width:1.2}
.lab-guide{fill:none;stroke:#cfdced;stroke-width:1;stroke-dasharray:4 4}
.lab-line{fill:none;stroke:var(--navy);stroke-width:2.5}
.lab-label{fill:var(--muted);font-size:10px;font-family:inherit}
.lab-mark{fill:var(--amber);stroke:#fff;stroke-width:2}
.lab-mark.is-out{fill:#fff;stroke:var(--amber)}
.lab-notes ul{margin:8px 0 0;padding-inline-start:18px;display:grid;gap:6px;font-size:13.5px}
.lab-notes a{overflow-wrap:anywhere}
@media (max-width:520px){.lab-card{padding:16px}.lab-figures dd{font-size:20px}}
/* ABENAN LAB خدمةٌ باشتراك (2026-10-20): التجربة المجانية تُعلَّم، والمقفلة بطاقة اشتراكٍ مكانها، وحال الاشتراك سطرٌ تحت العنوان. */
.lab-tag.is-free{color:var(--green);background:var(--green-soft)}
.lab-locked{background:var(--soft);border-style:dashed}
.lab-locked .lab-choice{align-items:center}
.lab-status{margin:10px 0 0;font-weight:800;color:var(--green)}