:root {
  color-scheme: light;
  --base: #F8FAFC; --frost: #E3EDF2; --lilac: #E4DEF8;
  --deep: #181C24; --quiet: #455865; --spark: #5630DC; --line: #C9D7E0;
  font-family: Barlow, Arial, sans-serif;
  color: var(--deep);
  background: var(--base);
}
* { box-sizing: border-box; }
body { margin: 0; font-size: 1.125rem; line-height: 1.55; }
html[lang="ar"] { font-family: "Noto Sans Arabic", Arial, sans-serif; }
.frame { width: min(70rem, 100% - 2 * clamp(1rem, 4.4vw, 4rem)); margin-inline: auto; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .23em; }
a:focus-visible { outline: .2rem solid var(--spark); outline-offset: .3rem; }
.skip { position: absolute; inset-inline-start: 1rem; top: -8rem; padding: .65rem 1rem; background: white; z-index: 1; }
.skip:focus { top: 1rem; }
.mast { min-height: 5.5rem; display:flex; align-items:center; justify-content:space-between; border-bottom: 1px solid var(--line); }
.mast img { display:block; object-fit:contain; }
.language { display:grid; place-items:center; min-height: 2.75rem; min-width: 4rem; color: var(--spark); font-weight:600; }
.intro { padding-block: clamp(3.25rem, 8vw, 7rem) clamp(3rem, 6vw, 5rem); }
h1,h2,h3 { margin: 0; font-family: Archivo, Arial, sans-serif; line-height: 1.07; }
[lang="ar"] :is(h1,h2,h3) { font-family: inherit; line-height: 1.25; }
h1 { max-width: 15ch; font-size: clamp(2.75rem, 7.7vw, 6.7rem); font-weight:600; letter-spacing:-.067em; text-wrap:balance; }
[lang="ar"] h1 { max-width: 19ch; letter-spacing: 0; font-size: clamp(2.5rem, 6.5vw, 5.6rem); }
h2 { font-size: clamp(1.5rem, 3.5vw, 2.55rem); font-weight:600; letter-spacing:-.035em; }
[lang="ar"] h2 { letter-spacing: 0; }
h3 { font-size: clamp(1.28rem, 2.3vw, 1.72rem); font-weight:600; }
p { margin: .75rem 0 0; color: var(--quiet); }
.intro p { max-width: 33rem; font-size: clamp(1.18rem, 2.5vw, 1.45rem); margin-top: 1.3rem; }
.actions { display:flex; flex-wrap:wrap; align-items:center; gap: .8rem 1.5rem; margin-top: 1.65rem; }
.actions a { font-weight:600; min-height: 2.75rem; display:inline-flex; align-items:center; }
.primary { text-decoration:none; background:var(--spark); color:#fff; border-radius: 4rem; padding: .7rem 1.3rem; text-align: center; }
.primary:hover { background: #4221B9; }
.decision { border-block-start: 1px solid var(--line); padding-block-start: clamp(1.75rem,4vw,3rem); }
.decision h2 { margin-bottom: 1.25rem; }
.decision-row { display:grid; grid-template-columns:minmax(12rem, 1fr) minmax(0, 1.7fr); border-top: 1px solid var(--line); gap: clamp(1rem,4vw,3rem); padding: 1.5rem clamp(1rem,3vw,2rem); background: white; }
.decision-row:last-child { border-bottom: 1px solid var(--line); }
.signal { align-self:start; border-inline-start:.2rem solid var(--spark); padding-inline-start:.8rem; font-weight:600; }
.decision-row p,.detail p { margin-top:.5rem; }
.detail { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem 2rem; padding-block:clamp(2.75rem,6vw,5rem); }
.detail h2 { font-size:1.25rem; letter-spacing:-.015em; }
.proof { align-self:start; color:var(--spark); font-weight:600; }
.close { border-block:1px solid var(--line); padding-block:clamp(2rem,5vw,4rem); background:linear-gradient(118deg,var(--lilac),var(--frost) 84%); }
.footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem 1.25rem; padding-block:1.3rem; color:var(--quiet); font-size:.96rem; }
@media(max-width: 44rem) {
  .decision-row, .detail { grid-template-columns: 1fr; }
  .decision-row { gap: .75rem; }
  .detail { gap: 1.65rem; }
}