/* 1. Tokens and document primitives. No legacy stylesheet is imported. */
:root {
  --spc-navy: #02043f;
  --spc-royal: #0801a6;
  --spc-blue: #0337fd;
  --spc-blush: #f1e4ed;
  --spc-paper: #fcfafb;
  --spc-white: #fff;
  --spc-muted: #605c72;
  --spc-line: #dedee8;
  --spc-mint: #eaf0df;
  --spc-ice: #e7eefb;
  --spc-error: #a72638;
  --spc-success: #20583e;
  --spc-font: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
  --spc-radius: 18px;
  --spc-shadow: 0 12px 36px rgb(2 4 63 / 6%);
  --spc-section: 60px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: 104px; -webkit-text-size-adjust: 100%; }
body.spc-site { margin: 0; background: var(--spc-paper); color: var(--spc-navy); font: 400 16px/1.8 var(--spc-font); }
.spc-site :where(h1,h2,h3,h4,p,figure,blockquote) { margin: 0; }
.spc-site :where(h1,h2,h3,h4) { color: inherit; font-weight: 600; line-height: 1.42; overflow-wrap: anywhere; }
.spc-site h1 { font-size: clamp(2rem, 3.9vw, 3.5rem); }
.spc-site h2 { font-size: clamp(1.75rem, 2.65vw, 2.45rem); }
.spc-site h3 { font-size: 1.25rem; }
.spc-site p { overflow-wrap: anywhere; }
.spc-site img { max-inline-size: 100%; height: auto; vertical-align: middle; }
.spc-site :where(a) { color: inherit; text-decoration: none; text-underline-offset: 5px; }
.spc-site :where(a:hover) { color: var(--spc-blue); }
.spc-site :where(button,input,select,textarea) { font: inherit; }
.spc-site button { cursor: pointer; }
.spc-site :where(button,a,input,summary,textarea,select):focus-visible { outline: 3px solid var(--spc-blue); outline-offset: 4px; }
.spc-site :where(button:disabled,input:disabled,select:disabled) { cursor: not-allowed; opacity: .55; }
.spc-site :where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) { max-inline-size: 100%; min-block-size: 48px; border: 1px solid #b9b9cb; border-radius: 10px; background: white; padding: 10px 13px; color: var(--spc-navy); }
.spc-site :where(input[type=checkbox],input[type=radio]) { accent-color: var(--spc-blue); }
.spc-site input::placeholder, .spc-site textarea::placeholder { color: #605c72; opacity: 1; }
.spc-site textarea { min-block-size: 110px; resize: vertical; }
.spc-site :where(ul,ol) { margin: 0; padding-inline-start: 1.4em; }
.spc-site :where(table) { max-inline-size: 100%; border-collapse: collapse; }
.spc-site :where(th,td) { overflow-wrap: anywhere; }
.spc-site [hidden] { display: none !important; }
.spc-site ::selection { background: var(--spc-blush); color: var(--spc-navy); }
.spc-container { width: min(1280px, calc(100% - 64px)); margin-inline: auto; }
.spc-section { padding-block: var(--spc-section); }
.spc-icon { flex: 0 0 24px; display: inline-block; vertical-align: middle; }
.spc-eyebrow { display: block; margin-block-end: 12px; font-size: 14px; font-weight: 500; line-height: 1.6; color: var(--spc-royal); }
.spc-muted { color: var(--spc-muted); font-size: 14px; }
.spc-sr-only, .spc-site .screen-reader-text { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.spc-skip { position: fixed; inset-block-start: 10px; inset-inline-start: 10px; z-index: 999999; transform: translateY(-150%); background: white; border: 2px solid var(--spc-blue); border-radius: 8px; padding: 10px 18px; }
.spc-skip:focus { transform: translateY(0); }
.spc-site .spc-button, .spc-site .woocommerce a.button, .spc-site .woocommerce button.button, .spc-site .woocommerce input.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-block-size: 50px; border: 1px solid var(--spc-blue); border-radius: 10px; background: var(--spc-blue); color: white; padding: 11px 22px; font: 500 16px/1.45 var(--spc-font); text-align: center; text-decoration: none; transition: background-color .18s, border-color .18s, transform .18s; box-shadow: none; }
.spc-site .spc-button:hover, .spc-site .woocommerce a.button:hover, .spc-site .woocommerce button.button:hover { background: var(--spc-royal); color: white; border-color: var(--spc-royal); }
.spc-site .spc-button:active { transform: translateY(1px); }
.spc-site .spc-button--outline { background: transparent; color: var(--spc-navy); border-color: var(--spc-navy); }
.spc-site .spc-button--outline:hover { background: var(--spc-navy); border-color: var(--spc-navy); color: white; }
.spc-site .spc-button--full { inline-size: 100%; }

.spc-site .spc-button--light { background: white; border-color: white; color: var(--spc-navy); }
.spc-site .spc-button--light:hover { background: var(--spc-blush); border-color: var(--spc-blush); color: var(--spc-navy); }
.spc-site .spc-button--on-dark { background: #02043f; border-color: #c9c6fc; color: white; }
.spc-site .spc-button--on-dark:hover { background: #242674; border-color: white; color: white; }
.spc-icon-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; inline-size: 44px; block-size: 44px; padding: 8px; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--spc-navy); }
.spc-icon-button:hover { background: var(--spc-ice); }
.spc-text-link { display: inline-flex; align-items: center; gap: 10px; min-block-size: 44px; font-weight: 500; color: var(--spc-navy); text-decoration: underline; }
.spc-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.spc-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-block-end: 28px; }
.spc-section-head > * { min-inline-size: 0; }
.spc-section-head > p { max-inline-size: 350px; font-size: 15px; color: var(--spc-muted); }
.spc-page-heading { margin-block-end: 32px; }
.spc-page-heading h1 { margin-block: 14px; font-size: clamp(2rem,3.2vw,2.7rem); }
.spc-page-heading p { max-inline-size: 660px; color: var(--spc-muted); }
.spc-empty-page { text-align: center; max-inline-size: 740px; margin-inline: auto; padding-block: 40px; }
.spc-empty-page .spc-actions { justify-content: center; margin-block-start: 24px; }
.spc-empty-page p { margin-block: 16px; color: var(--spc-muted); }
.spc-404-number { display: block; color: var(--spc-blue); font: 700 clamp(90px,16vw,168px)/1.1 var(--spc-font); }
.spc-empty-note { border-radius: 12px; background: var(--spc-ice); padding: 24px; }
.spc-prose { max-inline-size: 820px; margin-inline: auto; font-size: 17px; }
.spc-prose > * + * { margin-block-start: 22px; }
.spc-prose h2 { font-size: 26px; margin-block-start: 36px; }
.spc-prose h3 { font-size: 21px; }
.spc-prose a { color: var(--spc-blue); text-decoration: underline; }
.spc-prose li + li { margin-block-start: 8px; }
.spc-prose table { inline-size: 100%; }
.spc-prose th, .spc-prose td { border-block-end: 1px solid var(--spc-line); padding: 14px; text-align: start; }
.spc-prose thead, .spc-prose caption { background: var(--spc-ice); }
.spc-prose caption { padding: 12px; font-weight: 600; text-align: start; }
.spc-prose blockquote { border-inline-start: 3px solid var(--spc-blue); padding-inline-start: 20px; }
.spc-prose .alignwide, .spc-prose .alignfull { max-inline-size: 100%; margin-inline: 0; }
.spc-table-wrap { overflow: auto; border: 1px solid var(--spc-line); border-radius: 12px; }
.spc-search-form { display: flex; gap: 12px; max-inline-size: 600px; }
.spc-search-form input { flex: 1; min-inline-size: 0; }
.spc-post-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.spc-post-card { padding: 24px; border: 1px solid var(--spc-line); border-radius: var(--spc-radius); background: white; }
.spc-post-card > * + * { margin-block-start: 16px; }
.spc-comments { max-inline-size: 820px; margin: 48px auto 0; }
.spc-comments textarea { inline-size: 100%; }
.spc-comments label { display: block; }
@media (max-width: 1000px) {
  :root { --spc-section: 48px; }
  .spc-container { width: calc(100% - 48px); }
  .spc-section-head { align-items: flex-start; }
  .spc-section-head > p { max-inline-size: 290px; }
}
@media (max-width: 700px) {
  :root { --spc-section: 36px; }
  .spc-container { width: calc(100% - 32px); }
  .spc-site h1 { font-size: 34px; }
  .spc-site h2 { font-size: 28px; }
  .spc-section-head { flex-wrap: wrap; gap: 12px; margin-block-end: 22px; }
  .spc-section-head > p { max-inline-size: 100%; }
  .spc-eyebrow { margin-block-end: 8px; }
  .spc-site .spc-button { padding-inline: 16px; }
  .spc-post-grid { grid-template-columns: 1fr; }
  .spc-prose { font-size: 16px; }
  html { scroll-padding-top: 84px; }
}
@media (prefers-reduced-motion: reduce) {
  .spc-site *, .spc-site *::before, .spc-site *::after { scroll-behavior: auto; transition-duration: 0s; animation: none; }
}