:root {
  --consbi-ink: #17243b;
  --consbi-blue: #365b73;
  --consbi-blue-dark: #29475d;
  --consbi-navy: #13283a;
  --consbi-gold: #d99608;
  --consbi-muted: #63718a;
  --consbi-line: #e5eaf1;
}

body {
  background: #fff;
  color: var(--consbi-ink);
  font-family: "DM Sans", sans-serif;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .sd-h1, .sd-mv, .sd-cta-quote {
  font-family: Manrope, sans-serif !important;
  letter-spacing: 0;
}

.sd-h1 {
  color: var(--consbi-ink);
  font-size: clamp(42px, 5vw, 63px);
  line-height: 1.08;
}

.sd-hero {
  background: radial-gradient(ellipse at 73% 35%, #e8edff 0, transparent 44%),
    linear-gradient(115deg, #f9fbff 18%, #f5f8ff 100%);
}

.sd-hero-inner, .sd-section-inner {
  width: min(1200px, 100%);
  max-width: 1200px;
}

.sd-tagline {
  color: var(--consbi-blue-dark);
  font-size: clamp(21px, 2.7vw, 28px);
  line-height: 1.2;
}

.sd-short {
  color: var(--consbi-muted);
  font-size: 16px;
  line-height: 1.7;
}

.cbg, .sd-what-box h2 span {
  background: none;
  color: var(--consbi-blue);
  -webkit-text-fill-color: var(--consbi-blue);
}

.cbl, .sd-badge {
  color: #4b63ce;
  letter-spacing: .12em;
}

.sd-metric { border-radius: 8px; padding: 10px; }

.sd-section-head h2 {
  color: var(--consbi-ink);
  font-size: clamp(30px, 3.5vw, 43px);
  line-height: 1.12;
}

.sd-what-box h2, .sd-highlight-box h2, .sd-int-left h2 {
  font-size: clamp(26px, 2.8vw, 36px);
  line-height: 1.16;
}

.sd-what-box h2, .sd-section-head h2, .sd-int-left h2 {
  color: var(--consbi-ink);
}

.sd-section p {
  color: var(--consbi-muted);
  font-size: 13px;
  line-height: 1.7;
}

.sd-pain-card p, .sd-feat-card p, .sd-wf-desc,
.sd-aud-card p, .sd-int-left p, .sd-faq-a { font-size: 12px; }
.sd-what-box p, .sd-highlight-box > p { font-size: 14px; }
.sd-highlight-box > p { color: rgba(255, 255, 255, .82); }

.sd-pain-card h3, .sd-benefit-card h3, .sd-feat-card h3, .sd-aud-card h3 {
  color: var(--consbi-ink);
  font-size: 15px;
  line-height: 1.4;
}

.sd-section-head { margin-bottom: 24px; }

.sd-pain-card, .sd-feat-card, .sd-wf-card, .sd-aud-card, .sd-other-card {
  background: #fff;
  border: 1px solid var(--consbi-line);
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(23, 36, 59, .05);
}

.sd-pain-card:hover, .sd-feat-card:hover, .sd-wf-card:hover,
.sd-aud-card:hover, .sd-other-card:hover {
  background: #fff;
  border-color: #cbd6df;
  box-shadow: 0 12px 28px rgba(23, 36, 59, .1);
}

.sd-what-box {
  background: linear-gradient(145deg, #fff, #f7f9fc);
  border: 1px solid var(--consbi-line);
  border-radius: 12px;
  box-shadow: 0 6px 24px rgba(23, 36, 59, .06);
}

.sd-highlight-box, .sd-benefit-card, .sd-cta-box {
  background: var(--consbi-navy);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(19, 40, 58, .16);
}

.sd-highlight-box h2 span {
  color: var(--consbi-gold);
  -webkit-text-fill-color: var(--consbi-gold);
}

.sd-benefit-card {
  background: #fff;
  border: 1px solid var(--consbi-line);
  box-shadow: 0 4px 14px rgba(23, 36, 59, .05);
}
.sd-benefit-card:hover { background: #fff; }
.sd-benefit-card h3 { color: var(--consbi-ink); }
.sd-benefit-card p { color: var(--consbi-muted); font-size: 12px; }
.sd-benefit-card .sd-bcheck { background: #edf0ff; }

.sd-pain-ico, .sd-what-hico, .sd-feat-ico, .sd-wf-ico,
.sd-aud-ico, .sd-oc-ico {
  background: var(--consbi-blue);
  border-radius: 9px;
}

.sd-pain-ico { background: #fff3df; }
.sd-pain-ico svg { stroke: var(--consbi-gold); }
.sd-wf-card:hover { background: #fff; }
.sd-bcheck { background: #edf0ff; }
.sd-bcheck svg { stroke: var(--consbi-blue); }
.sd-wf-dot.active, .sd-wf-bar-fill { background: var(--consbi-gold); }
.sd-wf-title, .sd-oc-name { color: var(--consbi-ink); font-size: 15px; }
.sd-oc-link, .sd-oc-link svg { color: var(--consbi-blue); stroke: var(--consbi-blue); }
.sd-ftag-ico { background: var(--consbi-blue); }
.sd-mv { background: none; color: var(--consbi-blue); -webkit-text-fill-color: var(--consbi-blue); }

.sd-int-box, .sd-faq-item {
  background: #fff;
  border: 1px solid var(--consbi-line);
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(23, 36, 59, .05);
}

.sd-int-chip {
  border-color: var(--consbi-line);
  border-radius: 7px;
  color: var(--consbi-blue-dark);
}

.sd-int-chip:hover, .sd-faq-q:hover { color: var(--consbi-blue); }
.sd-faq-q { color: var(--consbi-ink); font-size: 14px; }
.sd-cta-orb1, .sd-cta-orb2 { display: none; }

.sd-cta-quote {
  color: #fff;
  font-size: clamp(24px, 3.1vw, 40px);
  line-height: 1.2;
}

.sd-cta-main, .sd-cta-out {
  min-height: 46px;
  padding: 0 20px;
  border-radius: 9px;
  font-size: 13px;
}

.sd-cta-main { background: var(--consbi-blue); color: #fff; }
.sd-cta-main svg { stroke: #fff; }
.sd-cta-out { border: 1px solid rgba(255, 255, 255, .4); }

@media (max-width: 768px) {
  .sd-h1 { font-size: clamp(40px, 11vw, 56px); }
  .sd-section-head h2 { font-size: clamp(28px, 8vw, 36px); }
  .sd-what-box h2, .sd-highlight-box h2, .sd-int-left h2 {
    font-size: clamp(24px, 7vw, 32px);
  }
  .sd-section p, .sd-pain-card p, .sd-feat-card p, .sd-wf-desc,
  .sd-aud-card p, .sd-int-left p, .sd-faq-a { font-size: 12px; }
}

@media (max-width: 420px) {
  .sd-hero, .sd-section { padding-left: 16px; padding-right: 16px; }
  .sd-hero-inner, .sd-section-inner, .sd-faq-inner { width: 100%; }
  .sd-h1 { font-size: clamp(34px, 10vw, 44px); line-height: 1.08; }
  .sd-tagline { font-size: clamp(19px, 6vw, 23px); }
  .sd-short { font-size: 14px; line-height: 1.65; }
  .sd-visual { height: auto; min-height: 0; margin-top: 22px; }
  .sd-img-wrap { position: relative; inset: auto; width: 100%; border-radius: 14px; }
  .sd-img-wrap img { width: 100%; height: auto; }
  .sd-metrics { gap: 6px; }
  .sd-metric { min-width: 0; padding: 9px 5px; }
  .sd-metric strong { font-size: 21px; }
  .sd-metric span { font-size: 9px; line-height: 1.35; }
  .sd-cta-box { padding: 34px 16px; border-radius: 16px; }
  .sd-cta-quote { font-size: 25px; }
  .sd-site-footer { padding-left: 16px; padding-right: 16px; }
  .sd-footer-bottom { font-size: 10px; overflow-wrap: anywhere; }
  .whatsapp-float { right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); width: 52px; height: 52px; }
}

@media (max-height: 780px) and (min-width: 769px) {
  .sd-h1 { font-size: 46px; line-height: 1.04; }
  .sd-section-head h2 { font-size: 38px; }
  .sd-visual { height: 420px; }
}

@media (max-height: 640px) and (min-width: 769px) {
  .sd-h1 { font-size: 40px; line-height: 1.02; }
  .sd-tagline { font-size: 19px; }
  .sd-visual { height: 360px; }
}
