:root{
  /* ===== COLOURS ===== */
  --scs-bg:#ffffff;
  --scs-card:#ffffff;
  --scs-text:#000000;
  --scs-muted:#dddddd;
  --scs-border:#e5e7eb;

  /* ===== LAYOUT ===== */
  --scs-radius:0;
  --scs-max:1100px;
  --scs-gap:16px;

  /* ===== TYPOGRAPHY ===== */
  --scs-font: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family:var(--scs-font);
  background:#ffffff;
  color:#000000;
  line-height:1.55;
}

a{
  color:#2563eb;
  text-decoration:none;
}
a:hover{text-decoration:underline}

/* ======================================================
   CONTAINER
====================================================== */

.scs-container{
  max-width:var(--scs-max);
  margin:0 auto;
  padding:0 18px;
}

/* ======================================================
   HEADER / NAV
====================================================== */

.scs-header{
  position:sticky;
  top:0;
  z-index:50;
  background:#ffffff;
  border-bottom:1px solid var(--scs-border);
}

.scs-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:64px;
  gap:var(--scs-gap);
}

.scs-brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:700;
}
.scs-brand-name{
  font-size:16px;
  letter-spacing:.2px;
}

/* ======================================================
   MENU
====================================================== */

.scs-menu{
  display:flex;
  gap:10px;
  list-style:none;
  padding:0;
  margin:0;
}

.scs-menu a{
  padding:8px 10px;
  color:#000000;
}

.scs-menu a:hover{
  background:#f3f4f6;
  text-decoration:none;
}

/* ======================================================
   MAIN CONTENT
====================================================== */

.scs-main{
  padding:26px 0;
}

/* ======================================================
   CARDS (FLAT)
====================================================== */

.scs-card{
  background:var(--scs-card);
  border-radius:0;
  padding:18px;
  margin:0 0 14px 0;
}

.scs-card-title{
  margin:0 0 6px 0;
  font-size:18px;
  font-weight:600;
}

.scs-meta{
  color:#dddddd;
  font-size:13px;
}

.scs-title{
  margin:0 0 14px 0;
  font-size:26px;
  font-weight:600;
}

/* ======================================================
   CONTENT
====================================================== */

.scs-content :where(p,ul,ol){
  color:#000000;
}

.scs-content a{
  text-decoration:underline;
}

/* ======================================================
   FOOTER
====================================================== */

.scs-footer{
  border-top:1px solid var(--scs-border);
  padding:18px 0;
  color:#dddddd;
}

.scs-footer-inner{
  display:flex;
  gap:14px;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
}

.scs-footer-menu{
  display:flex;
  gap:12px;
  list-style:none;
  padding:0;
  margin:0;
}

.scs-footer-menu a{
  color:#dddddd;
}
