:root {
  --cw-navy: #102A43;
  --cw-blue: #2F80ED;
  --cw-blue-hover: #1C64C7;
  --cw-green: #2F9E44;
  --cw-charcoal: #243B53;
  --cw-soft-gray: #F5F7FA;
  --cw-border: #D9E2EC;
  --cw-white: #FFFFFF;
}

body {
  color: var(--cw-charcoal);
}

.cw-hero,
.cw-section,
.cw-cta {
  padding: 90px 24px;
}

.cw-hero {
  background: linear-gradient(180deg, #FFFFFF 0%, #F5F7FA 100%);
}

.cw-soft-bg {
  background: var(--cw-soft-gray);
}

.cw-eyebrow {
  color: var(--cw-blue);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-bottom: 16px;
  text-transform: uppercase;
}

.cw-h1 {
  color: var(--cw-navy);
  font-size: clamp(38px, 5vw, 54px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 22px;
}

.cw-h2 {
  color: var(--cw-navy);
  font-size: clamp(30px, 4vw, 38px);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 22px;
}

.cw-lead {
  color: var(--cw-charcoal);
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.6;
  margin-bottom: 30px;
}

.cw-card,
.cw-hero-card {
  background: var(--cw-white);
  border: 1px solid var(--cw-border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(16, 42, 67, 0.06);
  padding: 28px;
}

.cw-card h3,
.cw-hero-card h3 {
  color: var(--cw-navy);
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 14px;
}

.cw-card p,
.cw-hero-card p,
.cw-card li,
.cw-hero-card li {
  font-size: 17px;
  line-height: 1.6;
}

.cw-check-list {
  padding-left: 20px;
}

.cw-check-list li {
  margin-bottom: 10px;
}

.cw-primary-button .wp-block-button__link {
  background: var(--cw-blue);
  border: 1px solid var(--cw-blue);
  border-radius: 8px;
  color: var(--cw-white);
  font-weight: 600;
  padding: 14px 24px;
}

.cw-primary-button .wp-block-button__link:hover {
  background: var(--cw-blue-hover);
  border-color: var(--cw-blue-hover);
}

.cw-secondary-button .wp-block-button__link {
  background: transparent;
  border: 1px solid var(--cw-navy);
  border-radius: 8px;
  color: var(--cw-navy);
  font-weight: 600;
  padding: 14px 24px;
}

.cw-secondary-button .wp-block-button__link:hover {
  background: var(--cw-soft-gray);
}

.cw-cta {
  background: var(--cw-navy);
  color: var(--cw-white);
}

.cw-cta .cw-h2,
.cw-cta .cw-lead {
  color: var(--cw-white);
}

@media (max-width: 768px) {
  .cw-hero,
  .cw-section,
  .cw-cta {
    padding: 56px 20px;
  }

  .cw-card,
  .cw-hero-card {
    padding: 24px;
  }
}