/* =========================================================
   Homepage promo for Omega Nestcraft uPVC (index.php)
   Classes prefixed `ncp-`; uses the theme's own variables.
   ========================================================= */
.ncp {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(32px, 4vw, 64px); align-items: center;
  padding: clamp(28px, 4vw, 56px);
  border-radius: 24px; background: var(--smoke-color4, #F5F7F9);
}
.ncp::before { /* soft brand glow */
  content: ""; position: absolute; left: -140px; bottom: -160px; width: 420px; height: 420px; border-radius: 50%;
  background: radial-gradient(circle, rgba(236, 28, 37, .12), transparent 70%); pointer-events: none;
}
.ncp > * { position: relative; }

.ncp__badge {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; padding: 6px 14px;
  border-radius: 999px; background: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
  font-family: var(--title-font); font-size: 13px; font-weight: 600; letter-spacing: .04em; color: var(--title-color);
}
.ncp__badge::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--theme-color); box-shadow: 0 0 0 4px rgba(236, 28, 37, .18); }
.ncp .ncp__logo { display: block; height: 52px; width: auto; max-width: 100%; margin-bottom: 22px; } /* beats theme img reset */
.ncp .sec-title { margin-bottom: 16px; }
.ncp .sec-text { margin-top: 14px; margin-bottom: 0; }

.ncp__points { list-style: none; margin: 26px 0 32px; padding: 0; display: grid; gap: 12px; }
.ncp__points li { display: flex; align-items: center; gap: 12px; margin: 0; font-weight: 500; color: var(--title-color); }
.ncp__points li i {
  flex: none; width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center;
  background: var(--theme-color); color: #fff; font-size: 13px;
}
.ncp__btns { display: flex; flex-wrap: wrap; gap: 14px; }

/* Media: one large render + three product thumbnails */
.ncp__media { display: grid; gap: 14px; }
.ncp__main, .ncp__thumb { position: relative; display: block; overflow: hidden; border-radius: 16px; }
.ncp .ncp__main img, .ncp .ncp__thumb img {
  position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease;
}
.ncp__main { aspect-ratio: 16 / 10; box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .35); }
.ncp__main:hover img, .ncp__thumb:hover img { transform: scale(1.05); }
.ncp__main-cap {
  position: absolute; z-index: 1; left: 16px; bottom: 16px; padding: 8px 14px; border-radius: 999px;
  background: rgba(255, 255, 255, .92); font-family: var(--title-font); font-size: 14px; font-weight: 600; color: var(--title-color);
}
.ncp__thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ncp__thumb { aspect-ratio: 4 / 3; }
.ncp__thumb span {
  position: absolute; z-index: 1; inset: auto 0 0 0; padding: 22px 12px 10px;
  background: linear-gradient(transparent, rgba(0, 0, 0, .7));
  font-family: var(--title-font); font-size: 13px; font-weight: 600; line-height: 1.25; color: #fff;
}

@media (max-width: 1199px) {
  .ncp { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
  .ncp { border-radius: 18px; }
  .ncp .ncp__logo { height: 42px; }
  .ncp__thumbs { gap: 8px; }
  .ncp__thumb span { font-size: 11px; padding: 18px 8px 8px; }
  .ncp__btns .th-btn { width: 100%; justify-content: center; }
}