body {
      font-family: 'Segoe UI', sans-serif;
      background-color: #fff0D5;
      margin: 0;
      padding: 0;
    }

    .hero {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      background: linear-gradient(to right, #eec7b7, #f9e3d6);
      gap: 100px;
      max-height: 400px;
    }

    .hero img {
      border-radius: 20px;
     
      height: 350px;
      max-width: 550px;
      /* max-height: 200px; */
      margin-right:150px;
    }

    .hero-text {
      max-width: 450px;
    }

    .hero-text h1 {
      font-size: 26px;
      margin-bottom: 10px;
    }

    .hero-text p {
      margin: 10px 0;
    }

    .highlight {
      background-color: #f9a825;
      color: white;
      border-radius: 6px;
      padding: 3px 8px;
      font-size: 13px;
      margin-left: 5px;
    }

    .features {
      display: flex;
      margin-top: 20px;
      gap: 20px;
    }

    .feature {
      text-align: center;
      font-size: 14px;
      color: #912b4a;
    }

    .feature-icon {
      font-size: 24px;
      margin-bottom: 5px;
    }

    .sip-calculator {      padding: 50px 20px;      text-align: center;    }    .sip-calculator h2 {      color: #912b4a;    }    /* .sip-toggle {      margin: 20px auto;      display: flex;      justify-content: center;      gap: 15px;    }    .sip-toggle button {      border: 2px solid #912b4a;      padding: 8px 18px;      border-radius: 20px;      background: none;      font-weight: bold;      cursor: pointer;    } */    /* .sip-toggle button:first-child {      background-color: #912b4a;      color: #eec7b7;    } */    .sell-switch {  display: flex;  gap: 20px;  margin-bottom: 30px;  justify-content: center;}.active-tab {  background-color: #9C1137;  color: white;  border: none;  padding: 12px 30px;  border-radius: 50px;  font-size: 16px;  cursor: pointer;}.inactive-tab {  background: none;  color: #9C1137;  border: 2px solid #ffaa0f;  padding: 12px 30px;  border-radius: 50px;  font-size: 16px;  cursor: pointer;}    .sip-description {      color: #444;      font-size: 18px;      text-align: center;    }    .sip-estimator {      margin: 30px auto;      display: flex;      justify-content: center;      max-width: 1000px;      gap: 20px;    }    .estimator-box {      flex: 1;      border: 1px solid #912b4a;      border-radius: 10px;      padding: 20px;      background-color: white;    }    .estimator-box h3 {      font-size: 18px;      margin-bottom: 15px;    }        .icon-section {  display: flex;  gap: 40px;  justify-content: center;  margin: 30px 0;}.icon-card {  text-align: center;  color: #b52b50; /* adjust as needed */}.icon-card img.icon {    width: 50px;      /* adjust size as needed */    height: 80px;    object-fit: contain; /* keeps proportions without stretching */    margin-bottom: 8px; /* space between image and text */    margin-right: 20px;} .estimator-container {      display: flex;      max-width: 1000px;      border: 1px solid #a21d3d;      border-radius: 10px;      margin: auto;      background-color: #fef2e0;    }    .estimator-left, .estimator-right {      flex: 1;      padding: 30px;    }    .estimator-left {      border-right: 1px solid #a21d3d;    }    .estimator-left h3 {      margin: 0;      font-weight: 600;    }    .estimator-left p {      color: #333;      font-size: 14px;      margin-top: 5px;      margin-bottom: 25px;    }    .input-label {      color: #999;      font-weight: 500;    }    .input-line {      width: 100%;      border: none;      border-bottom: 1px solid #aaa;      margin-bottom: 25px;      padding: 8px 0;      font-size: 16px;      background: none;    }    .slider-label {      font-weight: 600;      font-size: 14px;      margin-top: 20px;    }    .slider-container {      display: flex;      align-items: center;      justify-content: space-between;    }    .slider {      width: 100%;      margin: 10px 0;    }    input[type=range] {      /* -webkit-appearance: none; */      width: 100%;      height: 2px;      background: #a21d3d;      border-radius: 5px;      outline: none;    }    input[type=range]::-webkit-slider-thumb {      -webkit-appearance: none;      height: 12px;      width: 12px;      border-radius: 50%;      background: #a21d3d;      cursor: pointer;    }    .estimator-right {      text-align: center;    }    .estimator-right h4 {      margin: 0 0 10px;      font-weight: 500;    }    .amount {      font-size: 24px;      color: #888;      margin-bottom: 20px;    }    .pie-chart {      width: 180px;      height: 180px;      border-radius: 50%;      background: conic-gradient(#b14b56 90%, #e0b84a 10%);      margin: auto;      position: relative;    }    .legend {      display: flex;      justify-content: center;      margin-top: 20px;      gap: 30px;      font-size: 14px;    }    .legend-item {      display: flex;      /* align-items: center; */      gap: 10px;    }    .legend-color {      width: 14px;      height: 14px;      border-radius: 50%;    }    .invested { background: #b14b56; }    .invested1 { background: #e0b84a; } h2 {      text-align: center;      margin-top: 40px;      font-size: 28px;    }        .title {      font-size: 24px;      font-weight: 600;      margin-bottom: 30px;    }    .steps {      display: flex;      flex-direction: column;      align-items: flex-start;      max-width: 400px;      margin: 0 auto;      gap: 20px;    }    .step {      border: 1px solid orange;      border-radius: 20px;      padding: 15px 20px;      font-size: 16px;      background-color: #fdf0d9;      width: 100%;      text-align: left;    }    .step strong {      display: block;      color: #6f0c27;      margin-bottom: 5px;    }    .video-placeholder {      background-color: #ccc;      height: 200px;      width: 200px;      margin: 30px auto;    }    .videos {      display: flex;      justify-content: center;      gap: 20px;      margin-top: 40px;      flex-wrap: wrap;    }    .video {      background-color: black;      height: 280px;      width: 160px;    }    .highlight {      color: #a21d3d;      border-bottom: 2px solid #f4c267;      display: inline-block;      padding-bottom: 5px;    }        .start-sip{      display: flex;    }    /* benefits */    h2 {      color: #b3434d;      margin: 40px 0;      font-size: 42px; /* bigger heading */      font-weight: bold;      text-align: center;    }    .benefits-container {      display: grid;      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* bigger cards */      gap: 40px;      width: 90%;   /* full width */      max-width: 1400px; /* stretched for laptop screens */      margin: auto;      justify-content: center;    }    .benefit-card {  background: linear-gradient(135deg, #D6B0A5, #C28978);      color: white;      border-radius: 25px;      padding: 60px 30px 30px; /* bigger card */      text-align: center;      position: relative;      transition: transform 0.3s ease;      font-size: 22px; /* bigger text */    }    .benefit-card:hover {      transform: translateY(-12px);    }    .benefit-card img {      width: 90px;   /* bigger icon */      height: 90px;      background: #fff8ef;      border-radius: 50%;      padding: 15px;      position: absolute;      top: -45px;      left: 50%;      transform: translateX(-50%);      transition: transform 0.5s ease;    }    .benefit-card:hover img {      transform: translateX(-50%) scale(1.3) rotate(10deg);    }    .benefit-card p {      margin-top: 60px;      font-size: 22px;      font-weight: bold;    }     /* Accumulated Digital Gold/Silver */    h2 {            font-size: 28px;      margin-bottom: 60px;          }    .card-container {      display: flex;      justify-content: center;      gap: 25px;      flex-wrap: wrap;        }    .card {      background:#fff0d5;      color:black;      width: 280px;      padding: 30px 20px;      border-radius: 16px;      text-align: center;      transition: transform 0.3s ease, box-shadow 0.3s ease;      cursor: pointer;      position: relative;    }    .card:hover {      transform: translateY(-10px);      box-shadow: 0 10px 25px rgba(0,0,0,0.15);    }    .card img {      width: 70px;      margin-bottom: 20px;      transition: transform 0.5s ease;    }    .card:hover img {      transform: scale(1.2) rotate(10deg);    }    .card h3 {      margin: 15px 0 10px;      font-size: 20px;      font-weight: bold;    }    .card p {      font-size: 14px;      line-height: 1.5;    }/*     Start Now SIP */    .container1 {    display: flex;    justify-content: space-between;    align-items: flex-start;    padding: 40px;  }  .steps {    flex: 1;    max-width: 40%;  }  .step {    background: #fff0c2;    border-radius: 10px;    /* padding: 25px; */    margin-bottom: 25px;    font-size: 18px;    cursor: pointer;    transition: 0.3s;    position: relative;  }  .step.active {    background: #f1b02c;    color: white;    font-weight: bold;  }  .step:hover {    background: #f7c85a;  }  .step p {    display: none;    margin-top: 10px;    font-size: 14px;  }  .step.active p {    display: block;  }  .image-box {    flex: 1;    text-align: center;  }  .image-box img {    width: 350px;    height: 450px;    object-fit: contain;    border-radius: 20px;    display: none;    margin-left: 250px;  }  .image-box img.active {    display: block;  }  /* Separate button styling */ .sip-button {  margin-top: 20px;  margin-left: 1in; /* moves button 2 inches to the right */}.sip-button button {  padding: 15px 40px;  background: #9C1137;  color: white;  font-size: 18px;  border: none;  border-radius: 13px;  cursor: pointer;  transition: 0.3s;}.sip-button button:hover {  background: #b83b52;}/*Targetamount.css*/.sip-description {      color: #444;      font-size: 18px;      text-align: center;    }    .sip-estimator {      margin: 30px auto;      display: flex;      justify-content: center;      max-width: 1000px;      gap: 20px;    }    .estimator-box {      flex: 1;      border: 1px solid #912b4a;      border-radius: 10px;      padding: 20px;      background-color: white;    }    .estimator-box h3 {      font-size: 18px;      margin-bottom: 15px;    }    .benefits-section {      background: linear-gradient(to right, #d9a7c7, #fffcdc);      padding: 40px 20px;      text-align: center;    }    .benefits-section h2 {      color: #912b4a;      margin-bottom: 30px;      position: relative;      display: inline-block;    }    .benefits-section h2::after {      content: "";      position: absolute;      width: 100%;      height: 3px;      background-color: gold;      bottom: -10px;      left: 0;    }    .benefits-cards {      display: flex;      justify-content: center;      gap: 20px;      margin-top: 30px;    }    /* .benefit-card {      border: 1px solid #912b4a;      padding: 20px;      border-radius: 10px;      width: 150px;      background: #fefefe;    } */    .icon-section {  display: flex;  gap: 40px;  justify-content: center;  margin: 30px 0;}.icon-card {  text-align: center;  color: #b52b50; /* adjust as needed */}.icon-card img.icon {    width: 50px;      /* adjust size as needed */    height: 80px;    object-fit: contain; /* keeps proportions without stretching */    margin-bottom: 8px; /* space between image and text */    margin-right: 20px;} .estimator-container {        max-width: 1100px;        margin: 50px auto;        display: flex;        border: 1px solid #c96f6f;        border-radius: 8px;        background-color: #faebd7;    }    .left-panel {        flex: 1;        padding: 30px;        border-right: 1px solid #c96f6f;    }    .right-panel {        flex: 1;        padding: 30px;        display: flex;        flex-direction: column;        justify-content: center;        align-items: center;        text-align: center;    }    .icon-circle {        width: 50px;        height: 50px;        background-color: #e6d9cd;        border-radius: 50%;        display: flex;        justify-content: center;        align-items: center;        font-size: 24px;        margin-bottom: 10px;    }    .left-panel h2 {        font-size: 20px;        margin: 0;        color: #333;    }    .left-panel p {        font-size: 14px;        color: #555;        margin-top: 4px;        margin-bottom: 20px;    }    input[type="number"] {        width: 100%;        padding: 10px;        font-size: 16px;               border-bottom: 1px solid #aaa;        outline: none;        background: transparent;    }    .slider-section {        margin-top: 20px;    }    .slider-label {        display: flex;        justify-content: space-between;        font-size: 14px;        margin-bottom: 6px;        color: #333;    }    .slider-sub-label {        display: flex;        justify-content: space-between;        font-size: 12px;        color: #777;    }    input[type="range"] {                width: 100%;        height: 3px;        background: #ccc;        border-radius: 2px;        outline: none;    }    input[type="range"]::-webkit-slider-thumb {        -webkit-appearance: none;        width: 12px;        height: 12px;        background: #a51a35;        border-radius: 50%;        cursor: pointer;    }    .right-panel p {        font-size: 16px;        color: #333;        margin-bottom: 10px;    }    .investment-amount {        font-size: 26px;        font-weight: bold;        color: #999;        margin-bottom: 15px;    }    .disclaimer {        font-size: 13px;        color: #888;        line-height: 1.5;        max-width: 90%;    }