.elementor-3381 .elementor-element.elementor-element-b781e25{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-65px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3381 .elementor-element.elementor-element-5197c18{--spacer-size:80px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-3381 .elementor-element.elementor-element-7e92391{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3381 .elementor-element.elementor-element-9075c33{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3381 .elementor-element.elementor-element-736f6c3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3381 .elementor-element.elementor-element-736f6c3{--content-width:1140px;}}/* Start custom CSS for container, class: .elementor-element-b781e25 *//* ===== PAGE ID 3357– HEADER ALWAYS WHITE + TEXT ALWAYS BLACK ===== */

body.page-id-3381 #site-header.she-header-transparent-yes {
    background: #ffffff !important;
}

body.page-id-3381 #site-header.she-header-transparent-yes .wpr-menu-item span {
    color: #000000 !important;
}

body.page-id-3381 #site-header.she-header .wpr-menu-item span {
    color: #000000 !important;
}

body.page-id-3381 #site-header .wpr-mobile-menu-item {
    color: #000000 !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c602dc2 *//* ABOUT US – TOP HERO SECTION */
.about-hero {
  max-width: 1800px;
  margin: 0 auto 40px;
  text-align: center;
  padding: 80px 40px 70px;
  position: relative;
  overflow: hidden;
  background: #ffffff;
  isolation: isolate;
}

/* SAME GRID LINES AS cp-hero (visible lines) */
.about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(
      to right,
      rgba(0, 26, 112, 0.09) 1px,
      transparent 1px
    ),
    linear-gradient(
      to bottom,
      rgba(0, 26, 112, 0.09) 1px,
      transparent 1px
    );
  background-size: 80px 80px;
  opacity: 1;
}

/* optional soft fade top, same as contact */
.about-hero::after {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 60px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95), transparent);
  z-index: -1;
}

/* HEADING + SUBTEXT */
.about-hero h1 {
  font-size: 34px;
  margin: 0 0 10px;
  color: #001a70;
  font-weight: 800;
}

.about-hero p {
  margin: 0;
  font-size: 15px;
  color: #4b5675;
}

/* RESPONISVE */
@media (max-width: 640px) {
  .about-hero {
    padding: 60px 16px 50px;
  }

  .about-hero h1 {
    font-size: 26px;
  }

  .about-hero p {
    font-size: 14px;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d338552 *//* ============ PRODUCT DETAILS SECTION ============ */

/* MAIN WRAPPER */
.product-details {
  padding: 0 40px;
  max-width: 1400px;
  margin: 0 auto;
  background: #ffffff;
}

/* ROW 1: IMAGE + KEY FACTS */
.product-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 40px;
  align-items: stretch;               /* dono columns same row height */
}

/* LEFT IMAGE ONLY */
.big-img {
  width: 100%;
  border-radius: 6px;
}

/* ============ RIGHT SIDE – KEY FACTS (same design) ============ */

.right-side {
  display: flex;
  flex-direction: column;
  justify-content: center;            /* ⭐ image ke respect me middle */
  height: 100%;                       /* full row height */
}

.kf-title {
  color: #001a70;
  font-size: 24px;
  margin: 0 0 20px;
}

/* 2-column layout for 8 points */
.key-facts-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 40px;
  row-gap: 10px;
  margin-top: 0;
}

.fact-block h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #001a70;
}

.fact-block p {
  margin: 4px 0 10px;
  color: #4b5675;
  font-size: 15px;
}

/* Sirf Shade Options ka text ek line me (desktop) */
.fact-block.shade-options p {
  white-space: nowrap;
}

/* Dotted divider */
.divider {
  border-bottom: 1px dashed #8aa0c0;
  margin-bottom: 12px;
}

/* ============ ROW 2: TEXT + BUTTON BELOW ============ */

/* yahan width sirf image ke jitni rahegi */
.product-bottom {
  margin-top: 32px;
  /* image column width = total width - right column (380px) - gap (40px) */
  max-width: calc(100% - 380px - 40px);
}

.prod-text {
  font-size: 16px;
  line-height: 1.6;
  color: #4b5675;
  margin: 0 0 20px;
}

/* BUTTON */
.contact-btn {
  display: inline-block;
  background: #001a70;       /* primary */
  color: #ffffff;
  padding: 10px 34px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
}

.contact-btn:hover {
  background: #596aa2;       /* secondary */
  color: #ffffff;
}

.contact-btn,
.contact-btn:hover,
.contact-btn:focus,
.contact-btn:active {
  text-decoration: none !important;
}

/* ============ RESPONSIVE (MOBILE) ============ */

@media (max-width: 900px) {

  .product-details {
    padding: 40px 16px;
  }

  .product-grid {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: flex-start;
  }

  .right-side,
  .kf-title {
    text-align: center;
    align-items: center;
  }

  .key-facts-grid {
    grid-template-columns: 1fr;
  }

  .fact-block h4,
  .fact-block p {
    text-align: center;
  }

  /* mobile pe Shade Options wrap karne do */
  .fact-block.shade-options p {
    white-space: normal;
  }

  .product-bottom {
    max-width: 100%;
    text-align: center;
    margin-top: 24px;
  }

  .contact-btn {
    margin-left: auto;
    margin-right: auto;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b37a371 *//* OUTER SECTION */
.key-characteristics {
  padding: 0px 20px;
}

/* CARD / PANEL */
.key-inner {
  max-width: 1070px;
  margin: 0 auto;
  padding: 32px 32px 28px;
  background: linear-gradient(
               135deg,
               rgba(0, 26, 112, 0.03),
               rgba(89, 106, 162, 0.02)
             );
  border-radius: 16px;
  border: 1px solid rgba(0, 26, 112, 0.10);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
}

/* HEADING */
.key-inner h2 {
  font-size: 26px;
  font-weight: 700;
  color: #001a70;              /* primary */
  text-align: center;
  margin: 0 0 20px;
  position: relative;
}

/* small underline */
.key-inner h2::after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  margin: 10px auto 0;
  border-radius: 999px;
  background: #596aa2;         /* secondary */
}

/* LIST RESET */
.key-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 30px;              /* row, column gap */
}

/* EACH ITEM */
.key-list li {
  position: relative;
  padding-left: 32px;
  font-size: 15px;
  line-height: 1.6;
  color: #2f3a57;
}

/* ICON CIRCLE */
.key-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #596aa2;                   /* secondary */
  box-shadow: 0 0 0 4px rgba(89,106,162,0.20);
}

.key-list li::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 12px;
  width: 6px;
  height: 3px;
  border-left: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  transform: rotate(-45deg);             /* small tick inside */
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .key-inner {
    padding: 24px 18px 22px;
  }

  .key-inner h2 {
    font-size: 22px;
  }

  .key-list {
    grid-template-columns: 1fr;          /* single column on mobile */
    gap: 10px 0;
  }

  .key-list li {
    font-size: 14px;
  }
}/* End custom CSS */