/* ================= SocialLayout — Βάση ================= */
.sl-page, .sl-dlg {
  --sl-primary: #1f5fbf;
  --sl-primary-dark: #174a96;
  --sl-navy: #0d2f5f;
  --sl-text: #1c2b45;
  --sl-muted: #5b6b82;
  --sl-bg-soft: #f2f7fd;
  --sl-border: #dbe7f5;
  --sl-radius: 14px;
  --sl-shadow: 0 6px 20px rgba(20, 60, 120, .08);
  --sl-max: 1440px;
  --sl-gutter: clamp(16px, 4vw, 64px);

  color: var(--sl-text);
  font-family: 'Commissioner', 'Segoe UI', Arial, sans-serif;
}
.sl-page {
  position: fixed;
  inset: 0;
  overflow-y: auto;
  overflow-x: hidden;
  background: #fff;
}
.sl-page *, .sl-page *::before, .sl-page *::after,
.sl-dlg *, .sl-dlg *::before, .sl-dlg *::after { box-sizing: border-box; }
.sl-page h1, .sl-page h2, .sl-page h3 { margin: 0; text-transform: none; letter-spacing: normal; }
.sl-page section[id] { scroll-margin-top: 96px; }
.sl-container {
  width: 100%;
  max-width: calc(var(--sl-max) + 2 * var(--sl-gutter));
  margin: 0 auto;
  padding: 0 var(--sl-gutter);
}


.sl-footer-bottom { background: #fff; color: var(--sl-muted); padding: 18px 0 14px; text-align: center; }
.sl-container {
  width: 100%;
  max-width: calc(var(--sl-max) + 2 * var(--sl-gutter));
  margin: 0 auto;
  padding: 0 var(--sl-gutter);
}

.sl-espa { display: block; width: auto; max-width: 100%; max-height: 70px; margin: 0 auto 10px; }