/* Saqqar redesign — shared editorial design system (landing / auth / pricing).
   Scoped to .sq so it never leaks into the console or other surfaces. */
.sq, .sq * { box-sizing: border-box; }
.sq {
  --font-serif:'Newsreader',Georgia,serif;
  --font-sans:'Hanken Grotesk',-apple-system,system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --canvas:#F4F6FB; --surface:#FFFFFF; --surface-2:#F8FAFD;
  --ink:#1A2238; --ink-2:#545B73; --ink-3:#8A90A6;
  --line:#E5E8F1; --line-2:#D3D8E6;
  --accent:#43C2C4; --accent-deep:#0E7E81; --accent-soft:#D7F0F1;
  --navy:#284080; --navy-deep:#1C2E5E; --navy-soft:#E6EAF6;
  --approve:#1E9E6A; --approve-soft:#DCEFE5; --danger:#C0392B;
}
[data-theme="dark"] .sq {
  --canvas:#0E1322; --surface:#161C2E; --surface-2:#1C2338;
  --ink:#EAEDF6; --ink-2:#A2A9C0; --ink-3:#6E7691;
  --line:#283149; --line-2:#37415C;
  --accent:#43C2C4; --accent-deep:#5BD3D5; --accent-soft:#123139;
  --navy:#4660B8; --navy-deep:#36488F; --navy-soft:#1A2342;
  --approve:#3DBB85; --approve-soft:#13291F; --danger:#E0614F;
}
.sq ::selection{ background:var(--accent-soft); color:var(--ink); }
@keyframes sqFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes sqPulse{0%,100%{box-shadow:0 0 0 0 rgba(67,194,196,.32)}50%{box-shadow:0 0 0 7px rgba(67,194,196,0)}}
@keyframes sqDraw{from{stroke-dashoffset:600}to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.sq *{animation:none!important;transition:none!important}}
[x-cloak]{display:none!important}

/* theme-conditional logo + toggle icon */
.sq-logo-dark, .sq-ico-dark{display:none}
.sq-logo-light{display:block}
[data-theme="dark"] .sq-logo-dark{display:block}
[data-theme="dark"] .sq-logo-light{display:none}
[data-theme="dark"] .sq-ico-dark{display:block}
[data-theme="dark"] .sq-ico-light{display:none}

/* hover polish */
.sq-navlink{transition:color .15s} .sq-navlink:hover{color:var(--ink)!important}
.sq-btn{transition:transform .14s,background .2s,border-color .2s,filter .2s}
.sq-btn:active{transform:scale(.97)}
.sq-navy:hover{background:var(--navy-deep)!important}
.sq-outline:hover{border-color:var(--accent)!important}
.sq-accent:hover{filter:brightness(1.06)}
.sq-card{transition:border-color .2s,transform .2s}
.sq-card:hover{border-color:var(--accent)!important;transform:translateY(-3px)}
.sq-icobtn{transition:color .15s,border-color .15s}
.sq-icobtn:hover{color:var(--ink)!important;border-color:var(--accent)!important}

/* ---------- Auth (two-column editorial card) ---------- */
.sq-authcard{
  display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line);
  border-radius:18px; overflow:hidden; min-height:540px; background:var(--surface);
  box-shadow:0 1px 2px rgba(20,30,75,.05),0 24px 48px -28px rgba(20,30,75,.2);
}
.sq-authbrand{
  background: linear-gradient(157deg, #21386F 0%, #16213D 55%, #101829 100%); padding:42px; position:relative; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-start; gap:24px;
}
.sq-authbrand .sq-authwm{ position:absolute; right:-40px; bottom:30px; width:360px; opacity:.06; transform:rotate(-6deg); pointer-events:none; }
.sq-authbrand h2{ font-family:var(--font-serif); font-weight:500; font-size:30px; line-height:1.2; letter-spacing:-.01em; color:#fff; margin:0 0 24px; }
.sq-authbrand .sq-check{ display:flex; gap:11px; align-items:center; }
.sq-authbrand .sq-check span{ font-size:14px; color:#C9CEDE; }
.sq-authform{ padding:42px 44px; display:flex; flex-direction:column; justify-content:center; min-width:0; }
.sq-authform h1{ font-family:var(--font-serif); font-weight:500; font-size:26px; letter-spacing:-.01em; margin:0 0 8px; color:var(--ink); }

/* auth tabs */
.sq-authtabs{ display:flex; gap:4px; background:var(--surface-2); border:1px solid var(--line); border-radius:10px; padding:4px; margin-bottom:26px; }
.sq-authtab{ flex:1; border:none; border-radius:7px; padding:9px; font-size:13px; font-weight:600; font-family:inherit; cursor:pointer; background:transparent; color:var(--ink-3); text-align:center; text-decoration:none; transition:background .2s,color .2s; }
.sq-authtab.is-active{ background:var(--navy); color:#fff; }

/* re-skin the existing functional form within the editorial card */
.sq .t-input,
.sq input[type="email"], .sq input[type="password"], .sq input[type="text"]{
  width:100%; border:1px solid var(--line-2); border-radius:9px; padding:12px 14px;
  font-size:14px; font-family:inherit; color:var(--ink); background:var(--surface);
  outline:none; transition:border-color .15s;
}
.sq .t-input:focus,
.sq input:focus{ border-color:var(--accent); }
.sq .t-input::placeholder, .sq input::placeholder{ color:var(--ink-3); }
.sq .t-text{ color:var(--ink); }
.sq .t-muted{ color:var(--ink-2); }
.sq .btn-gradient{
  width:100%; background:var(--navy); color:#fff; border:none; border-radius:9px;
  padding:13px; font-size:15px; font-weight:600; font-family:inherit; cursor:pointer;
  transition:transform .14s,background .2s;
}
.sq .btn-gradient:hover{ background:var(--navy-deep); }
.sq .btn-gradient:active{ transform:scale(.98); }
.sq .btn-ghost{
  width:100%; background:var(--surface); color:var(--ink); border:1px solid var(--line-2);
  border-radius:9px; padding:12px; font-size:14px; font-weight:600; font-family:inherit;
  cursor:pointer; transition:border-color .2s; text-decoration:none;
}
.sq .btn-ghost:hover{ border-color:var(--accent); }
.sq .auth-divider{ display:flex; align-items:center; gap:12px; color:var(--ink-3); font-size:11.5px; font-family:var(--font-mono); }
.sq .auth-divider::before, .sq .auth-divider::after{ content:""; flex:1; height:1px; background:var(--line); }
.sq .link-action, .sq .field-hint-link, .sq .resend-link{ background:none; border:none; color:var(--accent-deep); font-family:inherit; font-size:13px; font-weight:600; cursor:pointer; text-decoration:none; }
.sq .link-row{ margin-top:14px; text-align:center; }
.sq .auth-error{ color:var(--danger); background:rgba(192,57,43,.08); border:1px solid var(--danger); border-radius:9px; padding:10px 13px; font-size:13px; margin-bottom:4px; max-width:100%; overflow-wrap:anywhere; }
.sq .email-chip{ display:flex; align-items:center; gap:9px; border:1px solid var(--line-2); border-radius:9px; padding:10px 13px; background:var(--surface-2); font-size:13px; color:var(--ink); }
.sq .email-chip-edit{ margin-left:auto; background:none; border:none; color:var(--accent-deep); font-family:inherit; font-size:12px; cursor:pointer; }
.sq .field-help{ font-size:12px; color:var(--ink-3); }
.sq .field-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }

@media (max-width:760px){
  .sq-authcard{ grid-template-columns:1fr; }
  .sq-authbrand{ display:none; }
  .sq-authform{ padding:32px 24px; }
}

/* stop the brand logo from being stretched by flex align-items:stretch */
.sq-authbrand > img { align-self: flex-start; width: auto; max-width: 220px; }

/* auth brand panel polish */
.sq-authbrand::before { content:""; position:absolute; top:-70px; right:-50px; width:260px; height:260px; background:radial-gradient(circle, rgba(67,194,196,.16) 0%, transparent 68%); pointer-events:none; z-index:0; }
.sq-authmesh { position:absolute; left:0; bottom:0; width:92%; height:auto; opacity:.4; pointer-events:none; z-index:1; }
.sq-authlede { font-size:14px; line-height:1.6; color:#A9B2C9; margin:16px 0 0; max-width:340px; }
.sq-check-ic { width:28px; height:28px; border-radius:8px; background:rgba(67,194,196,.14); display:flex; align-items:center; justify-content:center; flex:none; }

/* mobile nav + footer */
@media (max-width: 860px) {
  header.sq nav { display: none !important; }
  .sq footer > div:first-child { grid-template-columns: 1fr 1fr !important; gap: 26px !important; }
}
@media (max-width: 520px) {
  header.sq img { height: 40px !important; }
  header.sq > div { height: 64px !important; padding-left: 16px !important; padding-right: 16px !important; gap: 10px !important; }
  .sq footer > div:first-child { grid-template-columns: 1fr !important; }
}

/* mobile logo: never compress */
  @media (max-width: 540px) {
    header.sq a[aria-label="Saqqar home"] { flex: 0 0 auto !important; }
    header.sq a[aria-label="Saqqar home"] img { height: 44px !important; width: auto !important; max-width: none !important; }
    header.sq button[onclick] { display: none !important; }
  }

/* trial form fields */
.sq .sq-flabel { display:block; font-size:12.5px; color:var(--ink-2); margin-bottom:7px; font-weight:500; }
.sq select { width:100%; border:1px solid var(--line-2); border-radius:9px; padding:12px 14px; font-size:14px; font-family:inherit; color:var(--ink); background:var(--surface); outline:none; }
.sq select:focus { border-color:var(--accent); }

.sq-authbrand > div:last-child { margin-top: auto; }

/* Arabic font (Tajawal) — applies to the whole .sq scope in RTL */
[dir="rtl"] .sq, html[lang="ar"] .sq {
  --font-serif:'Tajawal',sans-serif; --font-sans:'Tajawal',sans-serif; --font-mono:'Tajawal',sans-serif;
}
[dir="rtl"] .sq, [dir="rtl"] .sq * { font-family:'Tajawal',sans-serif; }

/* Arabic headings need more line-height */
[dir="rtl"] .sq h1, [dir="rtl"] .sq h2, [dir="rtl"] .sq h3, [dir="rtl"] .sq-authbrand h2 { line-height: 1.4 !important; }