/* =============================================================================
   LaboraIQ Health — landing page
   ========================================================================== */

.wrap--narrow { max-width:820px; }

/* ---------- hero ---------- */
.hero { position:relative; overflow:hidden; padding-block:clamp(3rem,7vw,6rem) clamp(3.5rem,8vw,6.5rem); }
.hero-glow {
  position:absolute; inset:-30% -10% auto -10%; height:80%; pointer-events:none;
  background:
    radial-gradient(60% 60% at 75% 25%, color-mix(in srgb,var(--teal-500) 22%,transparent), transparent 70%),
    radial-gradient(50% 50% at 15% 10%, color-mix(in srgb,var(--sand) 12%,transparent), transparent 70%);
  filter:blur(10px);
}
.hero .wrap { position:relative; }
.hero-grid { display:grid; gap:clamp(2rem,5vw,4rem); grid-template-columns:1.05fr .95fr; align-items:center; }
@media (max-width:960px) { .hero-grid { grid-template-columns:1fr; } .hero-visual { order:-1; } }
.hero-copy h1 { margin-top:.7rem; }
.hero-sub { font-size:var(--step-1); color:var(--text-2); max-width:52ch; }
.hero-cta { display:flex; flex-wrap:wrap; gap:.7rem; margin:1.6rem 0 .8rem; }
.hero-note { margin:0; }
.hero-stats {
  display:flex; flex-wrap:wrap; gap:clamp(1.2rem,4vw,2.6rem); margin:2.2rem 0 0; padding:1.4rem 0 0;
  border-top:1px solid var(--border);
}
.hero-stats div { margin:0; }
.hero-stats dt { font-size:var(--step-2); font-weight:800; color:var(--primary-strong); line-height:1; font-variant-numeric:tabular-nums; }
.hero-stats dd { margin:.3rem 0 0; font-size:var(--step--1); color:var(--muted); max-width:18ch; }

/* ---------- report mock ---------- */
.hero-visual { perspective:1400px; }
.mock {
  border-radius:var(--r-xl); box-shadow:var(--shadow-lg); padding:1.3rem 1.4rem;
  transform:rotateY(-6deg) rotateX(2deg); transform-origin:center;
}
html[dir="rtl"] .mock { transform:rotateY(6deg) rotateX(2deg); }
@media (max-width:960px) { .mock { transform:none; } }
.mock-head { display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding-bottom:.9rem; border-bottom:1px solid var(--border); }
.mock-brand { display:flex; align-items:center; gap:.5rem; font-size:.92rem; }
.mock-brand img { border-radius:7px; }
.mock-engine { font-size:.66rem; font-weight:700; color:var(--primary-strong); background:var(--primary-soft); padding:.2rem .5rem; border-radius:100px; }
.mock-hero { display:flex; align-items:center; gap:1.1rem; padding:1.1rem 0; }
.mock-score p { margin:.4rem 0 0; font-size:.86rem; }
.mock-cats { display:grid; gap:.55rem; padding:.9rem 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.mock-cat { display:grid; grid-template-columns:1fr 90px 30px; align-items:center; gap:.6rem; font-size:.78rem; color:var(--text-2); }
.mock-cat i { display:block; height:6px; border-radius:6px; background:var(--surface-2); position:relative; overflow:hidden; }
.mock-cat i::after { content:""; position:absolute; inset-block:0; inset-inline-start:0; width:var(--w); background:var(--c,var(--ok)); border-radius:6px; }
.mock-cat b { text-align:end; font-variant-numeric:tabular-nums; font-size:.82rem; }
.mock-rows { display:grid; gap:.4rem; padding:.9rem 0; }
.mock-row { display:grid; grid-template-columns:1fr auto auto; gap:.6rem; align-items:center; font-size:.8rem; }
.mock-row span { color:var(--muted); font-variant-numeric:tabular-nums; }
.mock-foot { text-align:center; font-size:.7rem; color:var(--muted); border-top:1px dashed var(--border); padding-top:.7rem; }

.gauge {
  --val:0; width:104px; height:104px; flex:0 0 auto; border-radius:50%; display:grid; place-items:center; position:relative;
  background:conic-gradient(var(--primary) calc(var(--val)*1%), var(--surface-2) 0);
}
.gauge::before { content:""; position:absolute; inset:9px; border-radius:50%; background:var(--surface); }
.gauge--sm { width:72px; height:72px; }
.gauge--sm::before { inset:7px; }
.gauge-in { position:relative; text-align:center; line-height:1; }
.gauge-in b { display:block; font-size:1.7rem; font-weight:800; font-variant-numeric:tabular-nums; }
.gauge--sm .gauge-in b { font-size:1.2rem; }
.gauge-in span { font-size:.62rem; color:var(--muted); }

.pill { display:inline-block; font-size:.7rem; font-weight:700; padding:.18rem .55rem; border-radius:100px; }
.pill--ok { color:var(--ok); background:var(--ok-bg); }
.pill--low { color:var(--warn); background:var(--warn-bg); }
.pill--bad { color:var(--bad); background:var(--bad-bg); }

/* ---------- flow ---------- */
.flow { list-style:none; margin:0; padding:0; display:grid; gap:clamp(1rem,2.5vw,1.6rem); grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); counter-reset:f; }
.flow-item { position:relative; padding:1.5rem 1.3rem 1.3rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); }
.flow-item h3 { font-size:var(--step-1); margin-bottom:.3rem; }
.flow-item p { margin:0; font-size:var(--step--1); }
.flow-num {
  position:absolute; top:-16px; inset-inline-start:1.3rem; width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center; font-weight:800; font-size:.9rem;
  background:var(--primary); color:var(--on-primary); box-shadow:var(--shadow-sm);
}

/* ---------- steps ---------- */
.steps { display:grid; gap:clamp(1rem,2.5vw,1.5rem); grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.step { padding-top:1.6rem; border-top:3px solid var(--primary); }
.step-n { font-size:.78rem; font-weight:800; letter-spacing:.12em; color:var(--primary-strong); display:block; margin-bottom:.5rem; }
.step h3 { font-size:var(--step-1); }
.step p { font-size:var(--step--1); margin:0; }

/* ---------- report split ---------- */
.report-split { display:grid; gap:clamp(2rem,5vw,4rem); grid-template-columns:1fr 1fr; align-items:center; }
@media (max-width:900px) { .report-split { grid-template-columns:1fr; } }
.check-list { list-style:none; margin:0; padding:0; display:grid; gap:.7rem; }
.check-list li { position:relative; padding-inline-start:2rem; color:var(--text-2); }
.check-list li::before {
  content:"✓"; position:absolute; inset-inline-start:0; top:.05em; width:1.35rem; height:1.35rem;
  display:grid; place-items:center; border-radius:50%; font-size:.72rem; font-weight:800;
  background:var(--primary-soft); color:var(--primary-strong);
}
.check-list--lg li { font-size:var(--step-1); }
.report-visual .card { display:grid; gap:.7rem; }
.rep-line { height:10px; border-radius:6px; background:var(--surface-2); }
.rep-line--title { height:16px; width:55%; background:color-mix(in srgb,var(--primary) 22%,var(--surface-2)); }
.rep-line--short { width:70%; margin-top:.5rem; }
.rep-hero { display:flex; align-items:center; gap:1rem; padding:.4rem 0 .8rem; }
.rep-flag { background:var(--bad-bg); border:1px solid color-mix(in srgb,var(--bad) 30%,transparent); border-radius:var(--r-sm); padding:.7rem .85rem; font-size:.82rem; }
.rep-flag b { display:block; color:var(--bad); margin-bottom:.15rem; }
.rep-rec { display:flex; gap:.7rem; align-items:flex-start; font-size:.82rem; border:1px solid var(--border); border-radius:var(--r-sm); padding:.65rem .8rem; color:var(--text-2); }
.rep-rec b { flex:0 0 auto; font-size:.66rem; text-transform:uppercase; letter-spacing:.05em; color:var(--bad); background:var(--bad-bg); padding:.15rem .45rem; border-radius:5px; }
.rep-rec--low b { color:var(--ok); background:var(--ok-bg); }

/* ---------- sovereignty ---------- */
.sovereign { display:grid; gap:clamp(1.6rem,4vw,3.5rem); grid-template-columns:1fr 1fr; align-items:center; }
@media (max-width:900px) { .sovereign { grid-template-columns:1fr; } }

/* ---------- pricing ---------- */
.plans { display:grid; gap:clamp(1rem,2.5vw,1.5rem); grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); align-items:stretch; }
.plan {
  position:relative; display:flex; flex-direction:column; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--r-lg); padding:1.7rem 1.5rem 1.5rem; box-shadow:var(--shadow-sm);
}
.plan--popular { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 16%,transparent), var(--shadow); }
.plan-tagbadge {
  position:absolute; top:-13px; inset-inline-start:50%; transform:translateX(-50%);
  background:var(--primary); color:var(--on-primary); font-size:.68rem; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; padding:.3rem .8rem; border-radius:100px; white-space:nowrap;
}
html[dir="rtl"] .plan-tagbadge { transform:translateX(50%); }
.plan h3 { font-size:var(--step-1); margin-bottom:.15rem; }
.plan-tag { font-size:var(--step--1); color:var(--muted); margin-bottom:1.1rem; min-height:2.6em; }
.plan-price { display:flex; align-items:baseline; gap:.4rem; margin-bottom:.2rem; }
.plan-price b { font-size:var(--step-3); font-weight:800; line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.03em; }
.plan-price span { font-size:var(--step--1); font-weight:700; color:var(--muted); }
.plan-per { font-size:var(--step--1); color:var(--muted); margin-bottom:.4rem; }
.plan-credits { display:inline-flex; align-items:center; gap:.4rem; font-weight:700; font-size:var(--step--1); color:var(--primary-strong); background:var(--primary-soft); padding:.3rem .7rem; border-radius:100px; margin-bottom:1.2rem; align-self:flex-start; }
.plan-save { font-size:.7rem; font-weight:800; color:var(--sand); background:var(--sand-soft); padding:.15rem .5rem; border-radius:100px; margin-inline-start:.4rem; }
.plan .btn { margin-top:auto; }
.incl { list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem .9rem; padding:0; margin:1.6rem 0 0; }
.incl li { font-size:var(--step--1); color:var(--muted); display:flex; align-items:center; gap:.35rem; }
.incl li::before { content:"✓"; color:var(--primary); font-weight:800; }

/* ---------- roadmap ---------- */
.road { display:grid; gap:clamp(1rem,2.5vw,1.4rem); grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); }
.road-item { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.5rem; opacity:.82; }
.road-item--now { opacity:1; border-color:var(--primary); box-shadow:var(--shadow-sm); }
.road-tag { font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:.5rem; }
.road-item--now .road-tag { color:var(--primary-strong); }
.road-item h3 { font-size:var(--step-1); }
.road-item p { font-size:var(--step--1); margin:0; }

/* ---------- team ---------- */
.person { text-align:center; }
.person h3 { font-size:var(--step-0); margin-bottom:.2rem; }
.avatar {
  width:56px; height:56px; margin:0 auto .8rem; border-radius:50%; display:grid; place-items:center;
  font-weight:800; font-size:1.05rem; letter-spacing:.02em;
  background:linear-gradient(135deg,var(--teal-500),var(--teal-700)); color:#fff;
}

/* ---------- faq ---------- */
.faq { display:grid; gap:.6rem; }
.faq-item { background:var(--surface); border:1px solid var(--border); border-radius:var(--r); padding:0 1.2rem; }
.faq-item summary {
  cursor:pointer; padding:1.05rem 0; font-weight:650; list-style:none;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; font-size:1.3rem; color:var(--primary); font-weight:400; line-height:1; }
.faq-item[open] summary::after { content:"−"; }
.faq-item p { margin:0 0 1.05rem; font-size:var(--step--1); }

/* ---------- cta ---------- */
.cta-band { background:linear-gradient(135deg,var(--teal-700),var(--teal-900)); color:#eaf5f4; }
.cta-band h2 { color:#fff; }
.cta-band p { color:#bfe3e0; font-size:var(--step-1); }
.cta-band .btn { --btn-bg:#fff; --btn-fg:var(--teal-800); }

/* ---------- footer ---------- */
.site-footer { padding-block:0 2rem; }
.foot-cta {
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
  padding:1.6rem 1.8rem; margin:-2.2rem 0 2.6rem;
  background:linear-gradient(135deg,var(--primary-soft),var(--surface));
  border:1px solid var(--border); border-radius:var(--r-lg); box-shadow:var(--shadow-sm);
}
.foot-cta h3 { font-size:var(--step-1); margin:0 0 .2rem; }
.foot-cta p { margin:0; }
.foot-grid { grid-template-columns:1.5fr repeat(auto-fit,minmax(140px,1fr)); align-items:start; }
.foot-col--brand .brand { margin-bottom:.7rem; }
.foot-tagline { max-width:32ch; margin:0 0 .8rem; }
.foot-engine {
  display:inline-block; font-size:.7rem; font-weight:700; color:var(--primary-strong);
  background:var(--primary-soft); border:1px solid color-mix(in srgb,var(--primary) 22%,transparent);
  padding:.28rem .7rem; border-radius:100px;
}
.foot-col a { transition:color .15s ease; }
.foot-col a:hover { color:var(--primary-strong); text-decoration:none; }
.foot-note { display:block; padding:.28rem 0; }
.foot-made { display:block; padding:.5rem 0 0; font-size:var(--step--1); color:var(--text-2); }
.foot-made b { color:var(--primary-strong); font-weight:800; }
.foot-pay {
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  margin-top:2.2rem; padding-top:1.4rem; border-top:1px solid var(--border);
}
.foot-badges { display:flex; gap:.4rem; flex-wrap:wrap; }
.foot-badge {
  font-size:.7rem; font-weight:800; letter-spacing:.04em; color:var(--muted);
  border:1px solid var(--border-strong); border-radius:6px; padding:.25rem .6rem;
}
html[lang="ar"] .foot-badge { letter-spacing:0; }
.foot-bottom { margin-top:1.2rem; }
@media (max-width:760px) {
  .foot-cta { margin-top:-1.4rem; text-align:center; justify-content:center; }
  .foot-grid { grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
}

/* ═══════════ REVIEWS ═══════════
   Rendered by the Worker only when reviews.js holds real customer reviews;
   the same source feeds the Review / AggregateRating structured data. */
.review-stars {
  color:#f2a63b; font-size:1.05rem; letter-spacing:.08em; line-height:1;
  margin-bottom:.7rem;
}
.review h3 { font-size:var(--step-0); margin-bottom:.4rem; }
.review p { color:var(--text-2); }
.review p + p { margin-top:.8rem; }