.hero{
  background: linear-gradient(135deg, #ff1616 0%, #ff4d4d 40%, #cf2228 100%);
  color: #fff;
  padding: 50px 0 120px;
  position: relative;
  overflow: hidden;
}

/* soft glowing radial light */
.hero::before{
  content: "";
  position: absolute;
  top: -80px;
  right: -80px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(255,255,255,0.25), transparent 70%);
  border-radius: 50%;
}

/* bottom curve shape */
.hero::after{
  content: "";
  position: absolute;
  bottom: -70px;
  left: 0;
  width: 100%;
  height: 140px;
  background: #ffffff;
  border-radius: 50% 50% 0 0;
}

/* CTA */

/* Stats */
.stats h2{
  font-size: 42px;
}

.cta{
  background: linear-gradient(135deg,#ff1616,#cf2228);
  color: #fff !important;
  padding: 60px 30px;
  border-radius: 20px;
}

.cta h2, h3, h6{
    color: #fff !important;
}

/* CTA Section */
.cta {
  padding: 60px 30px;
  border-radius: 20px;
  background: linear-gradient(135deg, #ff1616, #cf2228);
  color: #fff;
  position: relative;
  overflow: hidden;

  /* soft border glow */
  border: 2px solid rgba(255, 255, 255, 0.15);

  /* smooth animation */
  transition: all 0.4s ease;
}

/* glowing animated border effect */
.cta::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 20px;
  background: linear-gradient(120deg, #ffffff33, transparent, #ffffff33);
  opacity: 0;
  transition: opacity 0.4s ease;
}

/* hover effect */
.cta:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 20px 50px rgba(207, 34, 40, 0.35);
}

/* show glow on hover */
.cta:hover::before {
  opacity: 1;
}

/* CTA button hover */
.cta .btn {
  transition: all 0.3s ease;
}

.cta .btn:hover {
  background: #fff;
  color: #cf2228;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

/* SERVICES SECTION BACKGROUND */
#services {
  background: #f8fafc;
}

/* SERVICE CARD BASE */
.service-card {
  border-radius: 18px;
  border: 1px solid #f1f1f1;
  background: #fff;
  position: relative;
  overflow: hidden;

  transition: all 0.35s ease;
}

/* glowing gradient border (hidden initially) */
.service-card::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 18px;
  background: linear-gradient(120deg, #ff1616, #ff4d4d, #cf2228);
  opacity: 0;
  transition: opacity 0.35s ease;
  z-index: 0;
}

/* inner white layer to keep content visible */
.service-card::after {
  content: "";
  position: absolute;
  inset: 1px;
  background: #fff;
  border-radius: 16px;
  z-index: 0;
}

/* keep content above pseudo layers */
.service-card * {
  position: relative;
  z-index: 2;
}

/* HOVER EFFECT */
.service-card:hover {
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
}

/* show glowing border */
.service-card:hover::before {
  opacity: 1;
}

/* ICON BOX */
.icon-box img {
  object-fit: contain;
  transition: transform 0.35s ease;
}

/* icon zoom animation */
.service-card:hover .icon-box img {
  transform: scale(1.12) rotate(360deg);
}

/* TEXT SMOOTH COLOR CHANGE */
.service-card h5 {
  transition: color 0.3s ease;
}

.service-card:hover h5 {
  color: #cf2228;
}

.mystyle{
    box-shadow: rgba(223, 53, 53, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
    border-radius:25px;
}
