:root{
  --c-bg: #0b0f12;
  --c-text: #e8f0f4;
  --c-text-dim: rgba(232,240,244,.82);
  --c-pill: rgba(36, 120, 145, .62);
  --c-accent: #247891;

  --r-pill: 999px;
  --shadow-soft: 0 10px 30px rgba(0,0,0,.25);
  --maxw: 1320px;
}

/* Base */
body{
  background: var(--c-bg);
  color: var(--c-text);
}

/* Utility: boxed container width helper (use on Elementor containers via CSS class) */
.maxw{
  max-width: var(--maxw);
  margin-left: auto;
  margin-right: auto;
}

/* Pill header styling – apply class "pill-header" to the inner header container in Elementor */
.pill-header{
  background: var(--c-pill);
  border-radius: var(--r-pill);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: var(--shadow-soft);
}

.pill-header a{
  color: var(--c-text-dim);
  text-decoration: none;
}
.pill-header a:hover{
  color: var(--c-text);
}

/* Optional: small language switch styling if you build it with text links */
.lang-switch{
  display: inline-flex;
  gap: 10px;
  align-items: center;
}
.lang-switch a{
  font-size: 13px;
}
.lang-switch .is-active{
  color: var(--c-text);
  font-weight: 600;
}

/* Optional: button base class if you want consistent CTA styling in Elementor */
.btn-cta{
  border-radius: 999px;
  padding: 14px 28px;
}