:root {
  --son-navy: #0d3b52;
  --son-teal: #0f6e8c;
  --son-teal-light: #158fb3;
  --son-rose: #d98f82;
  --son-rose-light: #f3ded9;
  --son-bg: #f7fafb;
  --son-ink: #16323f;
  --son-muted: #5b7280;
  font-synthesis: none;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--son-ink);
  background-color: #ffffff;
}

h1, h2, h3, h4, h5, .display-font {
  font-family: 'Poppins', 'Inter', sans-serif;
  font-weight: 600;
  color: var(--son-navy);
}

a { color: var(--son-teal); }
a:hover { color: var(--son-navy); }

/* Navbar */
.son-navbar {
  background: linear-gradient(90deg, var(--son-navy), var(--son-teal));
  padding-top: .65rem;
  padding-bottom: .65rem;
}
.brand-text {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.15;
  color: #fff;
}
.navbar-nav .nav-link {
  color: rgba(255,255,255,.85);
  font-weight: 500;
  padding-left: .85rem;
  padding-right: .85rem;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: #fff;
  font-weight: 600;
}
.son-btn-cta {
  background-color: var(--son-rose);
  border: none;
  color: #fff;
  font-weight: 600;
  padding: .45rem 1.15rem;
  border-radius: 30px;
}
.son-btn-cta:hover { background-color: #c97a6b; color: #fff; }

/* Buttons */
.btn-son-primary {
  background-color: var(--son-teal);
  border-color: var(--son-teal);
  color: #fff;
  font-weight: 600;
  border-radius: 30px;
  padding: .6rem 1.6rem;
}
.btn-son-primary:hover { background-color: var(--son-navy); border-color: var(--son-navy); color: #fff; }
.btn-son-outline {
  border: 2px solid #fff;
  color: #fff;
  font-weight: 600;
  border-radius: 30px;
  padding: .55rem 1.5rem;
}
.btn-son-outline:hover { background-color: #fff; color: var(--son-navy); }
.btn-son-outline-teal {
  border: 2px solid var(--son-teal);
  color: var(--son-teal);
  font-weight: 600;
  border-radius: 30px;
  padding: .55rem 1.5rem;
}
.btn-son-outline-teal:hover { background-color: var(--son-teal); color: #fff; }

/* Hero */
.son-hero {
  background: radial-gradient(circle at 15% 20%, rgba(255,255,255,.08), transparent 40%),
              linear-gradient(120deg, var(--son-navy) 0%, var(--son-teal) 65%, var(--son-teal-light) 100%);
  color: #fff;
  padding: 5.5rem 0 6rem;
  position: relative;
  overflow: hidden;
}
.son-hero h1 { color: #fff; }
.son-hero .lead { color: rgba(255,255,255,.9); }
.hero-badge {
  display: inline-block;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.35);
  color: #fff;
  padding: .35rem 1rem;
  border-radius: 30px;
  font-size: .85rem;
  font-weight: 500;
  letter-spacing: .02em;
}
.hero-stat {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 14px;
  padding: 1.1rem 1rem;
}
.hero-stat .num { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.6rem; color: #fff; }
.hero-stat .label { font-size: .8rem; color: rgba(255,255,255,.8); }

/* Page hero (inner pages) */
.page-hero {
  background: linear-gradient(120deg, var(--son-navy), var(--son-teal));
  color: #fff;
  padding: 4rem 0 4.5rem;
}
.page-hero h1 { color: #fff; }
.page-hero .lead { color: rgba(255,255,255,.9); }

/* Section spacing */
.son-section { padding: 4.5rem 0; }
.son-section-alt { background-color: var(--son-bg); }
.eyebrow {
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .8rem;
  font-weight: 700;
  color: var(--son-rose);
}

/* Cards */
.son-card {
  background: #fff;
  border: 1px solid #e9eef1;
  border-radius: 16px;
  padding: 1.75rem;
  height: 100%;
  transition: transform .15s ease, box-shadow .15s ease;
}
.son-card:hover { transform: translateY(-4px); box-shadow: 0 1rem 2rem rgba(13,59,82,.1); }
.icon-circle {
  width: 56px; height: 56px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 1rem;
}

.bg-son-teal { background-color: var(--son-teal) !important; }
.bg-son-navy { background-color: var(--son-navy) !important; }
.bg-son-rose { background-color: var(--son-rose) !important; }
.bg-e-educate { background-color: #2f7dc0 !important; }
.bg-e-engage { background-color: #4c9a6a !important; }
.bg-e-enable { background-color: #e0973f !important; }
.bg-e-enhance { background-color: #1f9e9e !important; }
.bg-e-empower { background-color: #7b5ea3 !important; }

.text-son-muted { color: var(--son-muted); }

/* Timeline / journey */
.journey-step {
  text-align: center;
  padding: 0 .5rem;
}
.journey-step .step-circle {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--son-teal);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  margin: 0 auto .75rem;
  font-size: 1.15rem;
}
.journey-arrow {
  color: var(--son-rose);
  font-size: 1.5rem;
  align-self: center;
}

/* Framework pillar blocks */
.pillar-block {
  border-radius: 18px;
  padding: 2rem;
  margin-bottom: 1.75rem;
  border: 1px solid #e9eef1;
}
.pillar-num {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  opacity: .18;
  line-height: 1;
}

/* Quote / commitment block */
.quote-block {
  border-left: 4px solid var(--son-rose);
  padding: 1rem 1.5rem;
  font-style: italic;
  font-size: 1.15rem;
  color: var(--son-navy);
  background: var(--son-bg);
  border-radius: 0 12px 12px 0;
}

/* Founder */
.founder-photo {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 1.5rem 3rem rgba(13,59,82,.18);
}
.founder-photo img { width: 100%; display: block; }

/* Image framing */
.img-framed {
  border-radius: 18px;
  box-shadow: 0 1rem 2.5rem rgba(13,59,82,.12);
  width: 100%;
}

/* Value pill */
.value-pill {
  border: 1px solid #e9eef1;
  border-radius: 30px;
  padding: .5rem 1.15rem;
  font-weight: 600;
  color: var(--son-navy);
  background: #fff;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

/* Footer */
.son-footer {
  background: var(--son-navy);
  color: #fff;
}
.footer-brand { color: #fff; font-family: 'Poppins', sans-serif; }
.footer-heading { color: rgba(255,255,255,.6); text-transform: uppercase; font-size: .78rem; letter-spacing: .06em; margin-bottom: 1rem; }
.footer-links li { margin-bottom: .5rem; color: rgba(255,255,255,.75); font-size: .92rem; }
.footer-links a { color: rgba(255,255,255,.75); text-decoration: none; }
.footer-links a:hover { color: #fff; }
.footer-value {
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 30px;
  padding: .25rem .9rem;
  font-size: .8rem;
  color: rgba(255,255,255,.85);
}

/* Alert / form */
.form-control:focus, .form-select:focus {
  border-color: var(--son-teal);
  box-shadow: 0 0 0 .2rem rgba(15,110,140,.15);
}

@media (max-width: 991.98px) {
  .son-hero { padding: 3.5rem 0 4rem; }
  .son-section { padding: 3rem 0; }
}