.sp-cs-page,
.sp-cs-page a,
.sp-cs-page h1,
.sp-cs-page h2,
.sp-cs-page h3,
.sp-cs-page p,
.sp-cs-page small,
.sp-cs-page span {
  font-family: Poppins, sans-serif;
  font-weight: 500;
}
.sp-cs-heading-label small,
.sp-cs-label {
  letter-spacing: 2px;
  text-transform: uppercase;
}
.sp-cs-card-image img,
.sp-cs-hero-image img {
  object-position: center top;
  object-fit: cover;
}
.sp-cs-page {
  --cs-maroon: #971426;
  --cs-maroon-dark: #74101f;
  --cs-gold: #bd6b2d;
  --cs-border: #e5b985;
  --cs-cream: #fffaf4;
  --cs-light: #fffdf9;
  --cs-text: #171717;
  background: var(--cs-light);
  color: var(--cs-text);
}
.sp-cs-page *,
.sp-cs-page ::after,
.sp-cs-page ::before {
  box-sizing: border-box;
}
.sp-cs-page p {
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
}
.sp-cs-page a {
  text-decoration: none;
}
.sp-cs-hero {
  overflow: hidden;
  background: #fffaf4;
  border-top: 1px solid var(--cs-border);
  border-bottom: 1px solid var(--cs-border);
}
.sp-cs-hero-content {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 42px 30px 30px 15px;
  overflow: hidden;
}
.sp-cs-btn,
.sp-cs-hero-features {
  align-items: center;
  position: relative;
  z-index: 1;
}
.sp-cs-hero-content::before {
  content: "";
  position: absolute;
  left: -85px;
  top: 15px;
  width: 165px;
  height: 290px;
  /* border: 1px solid rgba(189, 107, 45, 0.25); */
  border-radius: 50%;
}
.sp-cs-label {
  position: relative;
  z-index: 1;
  display: block;
  margin-bottom: 6px;
  color: var(--cs-gold);
  font-size: 16px;
  line-height: 1.5;
}
.sp-cs-hero-content h1 {
  position: relative;
  z-index: 1;
  margin: 0 0 8px;
  color: var(--cs-maroon);
  font-size: clamp(40px, 4vw, 58px);
  line-height: 1.04;
}
.sp-cs-hero-content h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 7px;
  color: #171717;
  font-size: 18px;
  line-height: 1.5;
}
.sp-cs-hero-content > p {
  position: relative;
  z-index: 1;
  margin-bottom: 18px;
}
.sp-cs-btn {
  align-self: flex-start;
  display: inline-flex;
  justify-content: center;
  gap: 12px;
  min-height: 48px;
  padding: 11px 22px;
  color: #fff;
  background: var(--cs-maroon);
  border: 1px solid var(--cs-maroon);
  border-radius: 5px;
  font-size: 16px;
  transition:
    transform 0.3s,
    background 0.3s,
    box-shadow 0.3s;
}
.sp-cs-btn:hover {
  color: #fff;
  background: var(--cs-maroon-dark);
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(116, 16, 31, 0.18);
}
.sp-cs-btn i {
  transition: transform 0.3s;
}
.sp-cs-btn:hover i,
.sp-cs-view:hover i {
  transform: translateX(5px);
}
.sp-cs-hero-features {
  display: flex;
  flex-wrap: wrap;
  gap: 13px;
  margin-top: 23px;
}
.sp-cs-hero-feature {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.sp-cs-hero-feature i {
  color: var(--cs-gold);
  font-size: 19px;
}
.sp-cs-divider {
  width: 1px;
  height: 24px;
  background: #d8ad85;
}
.sp-cs-hero-image {
  min-height: 430px;
  overflow: hidden;
}
.sp-cs-hero-image img {
  display: block;
  width: 100%;
  height: 100%;
  transition: transform 0.8s;
}
.sp-cs-hero:hover .sp-cs-hero-image img {
  transform: scale(1.025);
}
.sp-cs-hero-quote {
  min-height: 430px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 25px 15px;
  text-align: center;
  background: linear-gradient(145deg, #7b1220, #4f0b12);
  color: #fff;
}
.sp-cs-hero-quote > p {
  color: #fff;
  font-size: 20px;
  line-height: 1.5;
  font-style: italic;
}
.sp-cs-quote-line {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 18px;
  color: #dca04e;
}
.sp-cs-quote-line span {
  width: 30px;
  height: 1px;
  background: #dca04e;
}
.sp-cs-quote-line i {
  font-size: 18px;
}
.sp-cs-products {
  position: relative;
  padding: 43px 0 25px;
  background: #fffdf9;
  overflow: hidden;
}
.sp-cs-products::after {
  content: "";
  position: absolute;
  right: -85px;
  top: 30px;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(189, 107, 45, 0.25);
  border-radius: 50%;
  pointer-events: none;
}
.sp-cs-heading {
  position: relative;
  z-index: 1;
  text-align: center;
  margin-bottom: 30px;
}
.sp-cs-heading-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 7px;
  color: var(--cs-gold);
}
.sp-cs-heading-label > span {
  width: 38px;
  height: 1px;
  background: #d8aa79;
}
.sp-cs-heading-label i,
.sp-cs-heading-label small,
.sp-cs-point p {
  font-size: 16px;
}
.sp-cs-heading h2 {
  margin: 0 0 8px;
  color: #181818;
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1.2;
}
.sp-cs-heading > p {
  width: 70%;
  margin: auto;
  font-size: 16px;
}
.sp-cs-card {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--cs-border);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 5px 15px rgba(70, 31, 15, 0.04);
  transition:
    transform 0.35s,
    box-shadow 0.35s,
    border-color 0.35s;
}
.sp-cs-card:hover {
  transform: translateY(-8px);
  border-color: #bd7131;
  box-shadow: 0 15px 35px rgba(91, 42, 20, 0.14);
}
.sp-cs-about,
.sp-cs-cta {
  border-bottom: 14px solid #fefefe;
  overflow: hidden;
}
.sp-cs-card-image {
  position: relative;
  display: block;
  width: 100%;
  height: 430px;
  overflow: hidden;
  background: #f4e7da;
}
.sp-cs-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
}
.sp-cs-card:hover .sp-cs-card-image img {
  transform: scale(1.055);
}
.sp-cs-card-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(104, 13, 29, 0.14);
  opacity: 0;
  transition: opacity 0.3s;
}
.sp-cs-card-overlay i {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cs-maroon);
  background: #fff;
  border-radius: 50%;
  font-size: 20px;
  transform: translateY(12px);
  transition: transform 0.3s;
}
.sp-cs-card:hover .sp-cs-card-overlay {
  opacity: 1;
}
.sp-cs-card:hover .sp-cs-card-overlay i {
  transform: translateY(0);
}
.sp-cs-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 14px 15px 16px;
}
.sp-cs-card-body h3 {
  margin: 0 0 8px;
  color: #171717;
  font-size: 16px;
  line-height: 1.5;
}
.sp-cs-view {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  color: var(--cs-maroon);
  font-size: 16px;
  transition: color 0.25s;
}
.sp-cs-view:hover {
  color: #b3293f;
}
.sp-cs-view i {
  transition: transform 0.25s;
}
.sp-cs-features {
  padding: 0 0 20px;
  background: #fffdf9;
}
.sp-cs-features-box {
  background: #fffaf5;
  border: 1px solid var(--cs-border);
  border-radius: 10px;
  overflow: hidden;
}
.sp-cs-feature {
  height: 100%;
  padding: 25px 15px;
  text-align: center;
  border-right: 1px solid #dfbd9b;
  transition:
    background 0.3s,
    transform 0.3s;
}
.sp-cs-features .col-lg-3:last-child .sp-cs-feature {
  border-right: 0;
}
.sp-cs-feature:hover {
  background: #fff4e9;
  transform: translateY(-3px);
}
.sp-cs-feature > i {
  display: block;
  margin-bottom: 9px;
  color: var(--cs-maroon);
  font-size: 36px;
}
.sp-cs-feature h3 {
  margin: 0 0 4px;
  font-size: 16px;
  line-height: 1.4;
}
.sp-cs-feature p {
  font-size: 14px;
  line-height: 1.5;
}
.sp-cs-about {
  position: relative;
  background: #fffaf4;
  border-top: 1px solid var(--cs-border);
}
.sp-cs-about-image {
  min-height: 445px;
  overflow: hidden;
}
.sp-cs-about-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.8s;
}
.sp-cs-about:hover .sp-cs-about-image img {
  transform: scale(1.035);
}
.sp-cs-about-content {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 42px 40px;
  overflow: hidden;
}
.sp-cs-about-content::after {
  content: "";
  position: absolute;
  right: -100px;
  bottom: -70px;
  width: 250px;
  height: 250px;
  border: 1px solid rgba(189, 107, 45, 0.22);
  border-radius: 50%;
}
.sp-cs-about-content h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 12px;
  color: #171717;
  font-size: clamp(30px, 3vw, 40px);
  line-height: 1.25;
}
.sp-cs-about-content > p {
  position: relative;
  z-index: 1;
}
.sp-cs-about-points {
  position: relative;
  z-index: 1;
  margin-top: 20px;
}
.sp-cs-point {
  display: flex;
  align-items: center;
  gap: 11px;
}
.sp-cs-point > span {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--cs-maroon);
  color: #fff;
  border-radius: 50%;
  transition:
    transform 0.3s,
    background 0.3s;
}
.sp-cs-point:hover > span {
  transform: rotate(8deg) scale(1.08);
  background: var(--cs-maroon-dark);
}
.sp-cs-cta {
  background: #fff3e7;
}
.sp-cs-cta-grid {
  min-height: 265px;
  display: grid;
  grid-template-columns: 1.1fr 1.25fr 0.65fr 0.6fr;
  align-items: stretch;
}
.sp-cs-cta-image {
  overflow: hidden;
}
.sp-cs-cta-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s;
}
.sp-cs-cta:hover .sp-cs-cta-image img {
  transform: scale(1.04);
}
.sp-cs-cta-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
  text-align: center;
}
.sp-cs-cta-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 6px;
}
.sp-cs-cta-label span {
  width: 32px;
  height: 1px;
  background: #d2a16f;
}
.sp-cs-cta-label small {
  color: var(--cs-gold);
  font-size: 15px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
.sp-cs-cta-content h2 {
  margin: 0 0 8px;
  color: var(--cs-maroon);
  font-size: clamp(29px, 3vw, 40px);
  line-height: 1.25;
}
.sp-cs-cta-content > p {
  margin-bottom: 18px;
}
.sp-cs-cta-content .sp-cs-btn {
  align-self: center;
}
.sp-cs-cta-quote {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px;
  text-align: center;
}
.sp-cs-cta-quote > p {
  color: var(--cs-maroon);
  font-size: 18px;
  line-height: 1.5;
  font-style: italic;
}
.sp-cs-cta-quote > div {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  color: var(--cs-maroon);
}
.sp-cs-cta-quote > div span {
  width: 30px;
  height: 1px;
  background: #c67d40;
}
.sp-cs-cta-lamp {
  display: flex;
  align-items: flex-end;
}
.sp-cs-cta-lamp img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right bottom;
}
@media (max-width: 1199.98px) {
  .sp-cs-hero-content {
    padding: 35px 20px;
  }
  .sp-cs-hero-content h1 {
    font-size: 45px;
  }
  .sp-cs-hero-features {
    gap: 9px;
  }
  .sp-cs-card-image {
    height: 390px;
  }
  .sp-cs-about-content {
    padding: 35px 28px;
  }
  .sp-cs-cta-grid {
    grid-template-columns: 1fr 1.15fr 0.65fr;
  }
  .sp-cs-cta-lamp {
    display: none;
  }
}
@media (max-width: 991.98px) {
  .sp-cs-about-content,
  .sp-cs-hero-content {
    padding: 38px 25px;
  }
  .sp-cs-hero-image {
    min-height: 580px;
  }
  .sp-cs-hero-quote {
    min-height: auto;
    padding: 27px 20px;
  }
  .sp-cs-hero-quote > p br {
    display: none;
  }
  .sp-cs-heading > p {
    width: 90%;
  }
  .sp-cs-card-image {
    height: 510px;
  }
  .sp-cs-feature {
    border-bottom: 1px solid #dfbd9b;
  }
  .sp-cs-features .col-6:nth-child(2) .sp-cs-feature {
    border-right: 0;
  }
  .sp-cs-features .col-6:nth-child(3) .sp-cs-feature,
  .sp-cs-features .col-6:nth-child(4) .sp-cs-feature {
    border-bottom: 0;
  }
  .sp-cs-about-image {
    min-height: 550px;
  }
  .sp-cs-cta-grid {
    grid-template-columns: 1fr 1fr;
  }
  .sp-cs-cta-image {
    min-height: 350px;
  }
  .sp-cs-cta-quote {
    grid-column: 1/-1;
    border-top: 1px solid #dfbd9b;
  }
}
@media (max-width: 575.98px) {
  .sp-cs-page p {
    font-size: 16px;
  }
  .sp-cs-hero-content {
    padding: 30px 12px;
  }
  .sp-cs-divider,
  .sp-cs-hero-content::before,
  .sp-cs-products::after {
    display: none;
  }
  .sp-cs-label {
    font-size: 14px;
    letter-spacing: 1.5px;
  }
  .sp-cs-hero-content h1 {
    font-size: 38px;
  }
  .sp-cs-hero-content h2 {
    font-size: 17px;
  }
  .sp-cs-btn,
  .sp-cs-heading > p {
    width: 100%;
  }
  .sp-cs-hero-features {
    display: grid;
    grid-template-columns: 1fr;
    gap: 11px;
  }
  .sp-cs-hero-image {
    min-height: 500px;
  }
  .sp-cs-products {
    padding: 35px 0 22px;
  }
  .sp-cs-heading {
    margin-bottom: 23px;
  }
  .sp-cs-heading-label {
    gap: 6px;
  }
  .sp-cs-heading-label > span {
    width: 18px;
  }
  .sp-cs-heading-label small {
    font-size: 14px;
    letter-spacing: 1px;
  }
  .sp-cs-card-image {
    height: 520px;
  }
  .sp-cs-card-body {
    padding: 14px;
  }
  .sp-cs-feature {
    padding: 21px 8px;
  }
  .sp-cs-feature > i {
    font-size: 31px;
  }
  .sp-cs-feature h3 {
    font-size: 15px;
  }
  .sp-cs-feature p {
    font-size: 13px;
  }
  .sp-cs-about-image {
    min-height: 460px;
  }
  .sp-cs-about-content,
  .sp-cs-cta-content {
    padding: 30px 15px;
  }
  .sp-cs-about-points {
    margin-top: 18px;
  }
  .sp-cs-cta-grid {
    display: block;
  }
  .sp-cs-cta-image {
    min-height: 300px;
  }
  .sp-cs-cta-quote {
    padding: 25px 15px;
    border-top: 1px solid #dfbd9b;
  }
}
@media (max-width: 390px) {
  .sp-cs-hero-content h1 {
    font-size: 35px;
  }
  .sp-cs-card-image {
    height: 465px;
  }
  .sp-cs-about-image {
    min-height: 410px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sp-cs-page *,
  .sp-cs-page ::after,
  .sp-cs-page ::before {
    animation: none !important;
    transition: none !important;
  }
}