:root {
  /* Primray Color */
  --color-primary50: #F4F8FE;
--color-primary100: #EAF0FC;
--color-primary200: #CADBF8;
--color-primary300: #AAC5F3;
--color-primary400: #6B99EB;
--color-primary500: #2B6DE2;
--color-primary600: #2762CB;
--color-primary700: #1A4188;
--color-primary800: #133166;
--color-primary900: #0D2144;
--color-primary950: #09162D;

  /* Secondary Color*/
  --color-secondary50: #FFF9F4;
--color-secondary100: #FEF4E9;
--color-secondary200: #FDE3C9;
--color-secondary300: #FBD2A8;
--color-secondary400: #F9B067;
--color-secondary500: #F68E26;
--color-secondary600: #DD8022;
--color-secondary700: #945517;
--color-secondary800: #6F4011;
--color-secondary900: #4A2B0B;
--color-secondary950: #311C08;

}

.bg-gradient-1 {
  background: linear-gradient(180deg, #A8C7FE 0%, #2F70E2 100%);
}

.bg-keunggulan-home {
  background: linear-gradient(to bottom, #ffc527, #fbae25);
}

.bg-gradient-register {
  background: linear-gradient(to bottom, #F6B426, #F68E3F);
}

.bg-icon-register {
  background: #2B6DE2;
}

.bg-form-register {
  background: #2B6DE2;
}
    


.bg-keunggulan {
    background: #2B6DE2;
}

.bg-product-populer {
    background: #F68E26;
}

.bg_keunggulan_home {
    background: linear-gradient(to bottom, #ffc527, #fbae25);
    color: #000;
}

.button_general {
    background: #F68E26;
}

.title-product-populer {
    background: #2B6DE2;
    color: #fff;
}