/* DC — CTA Banner (forest green panel + floating photo cards, no marquee) */
.dc-banner {
  position: relative;
  background: var(--sf-green);
  color: var(--sf-light);
  padding-block: clamp(60px, 6.5vw, 100px);
  isolation: isolate;
  overflow: hidden;
}
.dc-banner::before {
  content: "";
  position: absolute;
  inset: -10% 50% -10% -10%;
  background:
    radial-gradient(ellipse at 30% 30%, rgba(255,216,74,0.16) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 70%, rgba(200,35,59,0.18) 0%, transparent 60%);
  filter: blur(40px);
  z-index: -1;
}

.dc-banner__grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(28px, 4vw, 64px);
  align-items: center;
}

.dc-banner__copy .dc-eyebrow { color: var(--sf-yellow); }
.dc-banner__title {
  margin: 14px 0 14px;
  font-size: clamp(30px, 3.6vw, 56px);
  letter-spacing: -0.02em;
  line-height: 1.05;
  font-weight: 600;
  color: var(--sf-light);
}
.dc-banner__title em {
  font-style: italic;
  font-weight: 500;
  background: linear-gradient(120deg, var(--sf-yellow) 0%, #ffba4a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.dc-banner__lead {
  margin: 0 0 22px;
  color: rgba(252,250,243,0.78);
  font-size: 14.5px;
  line-height: 1.6;
  max-width: 46ch;
}

.dc-banner__usps {
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.dc-banner__usps li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(252,250,243,0.07);
  border: 1px solid rgba(252,250,243,0.16);
  font-family: var(--dc-font-sans);
  font-size: 12.5px;
  color: var(--sf-light);
  font-weight: 600;
  letter-spacing: 0.01em;
}
.dc-banner__usp-ico {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: var(--sf-yellow);
  color: var(--sf-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dc-banner__usp-ico svg { width: 12px; height: 12px; }

.dc-banner__ctas { display: inline-flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.dc-banner__phone {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 16px 6px 6px;
  border-radius: 999px;
  background: transparent;
  color: var(--sf-light);
  transition: background var(--dc-dur) var(--dc-ease);
}
.dc-banner__phone:hover { background: rgba(252,250,243,0.08); }
.dc-banner__phone-ico {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--sf-red);
  color: var(--sf-light);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dc-banner__phone-ico svg { width: 14px; height: 14px; }
.dc-banner__phone-meta { display: flex; flex-direction: column; line-height: 1.1; }
.dc-banner__phone-meta small {
  font-family: var(--dc-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(252,250,243,0.65);
  font-weight: 700;
}
.dc-banner__phone-meta strong { font-size: 13px; font-weight: 700; color: var(--sf-light); }

/* Stage */
.dc-banner__stage {
  position: relative;
  aspect-ratio: 5 / 4.4;
  min-height: 380px;
}
.dc-banner__pic {
  position: absolute;
  border-radius: 22px;
  overflow: hidden;
  border: 5px solid var(--sf-light);
  box-shadow: 0 30px 50px -22px rgba(0,0,0,0.5);
}
.dc-banner__pic img { width: 100%; height: 100%; object-fit: cover; }
.dc-banner__pic--main {
  inset: 4% 14% 16% 0;
  transform: rotate(-3deg);
}
.dc-banner__pic--acc {
  width: 50%;
  aspect-ratio: 5 / 4;
  right: 0;
  bottom: 0;
  transform: rotate(5deg);
}

.dc-banner__chip {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  background: var(--sf-yellow);
  color: var(--sf-ink);
  font-family: var(--dc-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  z-index: 2;
  box-shadow: 0 10px 20px -8px rgba(0,0,0,0.4);
}
.dc-banner__chip svg { width: 12px; height: 12px; }
.dc-banner__chip--top    { top: -6px; left: 14%; transform: rotate(-6deg); }
.dc-banner__chip--bottom { bottom: 30%; left: -10px; background: var(--sf-red); color: var(--sf-light); transform: rotate(-4deg); }

@media (max-width: 900px) {
  .dc-banner__grid { grid-template-columns: 1fr; }
  .dc-banner__usps { grid-template-columns: 1fr; }
}
