* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}


body {

  background: linear-gradient(to bottom right, #fafaf9, #fffbeb, #fff1f2);



  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;



}



.font-system {

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

}

.clrr-brown {

  color: #92400e;

}

.wh-40 {
  width: 40px;
  height: 40px;
}



.bg-amber-50 {

  background-color: #fffbeb;

}



.fit-content {

  width: fit-content;

}



.font-12 {

  font-size: 12px !important;

}

.font-13 {

  font-size: 13px !important;

}

.fw-400 {
  font-weight: 400 !important;

}
.fw-700 {
  font-weight: 700 !important;

}

.nav-link-footer {
  font-size: 14px !important;

}


.font-16 {

  font-size: 16px !important;

}



.font-17 {

  font-size: 17px !important;

}



.font-18 {

  font-size: 18px !important;

}



.font-20 {

  font-size: 20px !important;

}



.font-36 {

  font-size: 36px !important;

}



.font-30 {

  font-size: 30px !important;

}



.font-24 {

  font-size: 24px !important;

}



.border-radius-15 {

  border-radius: 15px;

}



.border-radius-50 {

  border-radius: 50px;

}



.border-line-bottom {

  border-bottom: 1px solid #f3f4f6;

}



.font-serif {

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

}



.font-sans {

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

}



.header-mains {

  max-width: 880px !important;


}



.clock {

  color: #8B5E3C;

  font-size: 20px !important;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

}



.custom-header {



  background: rgb(255 255 255 / 0.8);

  border-radius: 40px;

  padding: 17px 35px;

  box-shadow: 0 8px 32px rgba(129, 89, 74, 0.08);

  border: 1px solid rgba(129, 89, 74, 0.12);

  display: flex;

  align-items: center;

  gap: 20px;

  backdrop-filter: blur(24px);

}



.custom-header.sticky-top {

  top: 0;

  /* stick from very top */

  z-index: 1050;

  /* high value to stay above content */

}



.padding-40 {

  padding: 32px !important;

}



.padding-42 {

  padding: 42px !important;

}



.padding-16 {

  padding: 16px !important;

}



.padding-12-24 {

  padding: 12px 24px !important;

}



.padding-12-32 {

  padding: 12px 32px !important;

}



.logo-circle {

  width: 35px;

  height: 35px;

  border-radius: 50%;

  background: #8B5E3C;

  color: #fff;

  font-weight: bold;

  display: flex;

  align-items: center;

  justify-content: center;

}



.brand-text {

  font-family: Georgia, serif;

  font-size: 18px;

  color: #8B5E3C;

}



.nav-item-btn {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));

  color: #fff;

  padding: 8px 16px;

  border-radius: 20px;

  font-size: 14px;

  font-weight: 600;
  white-space: nowrap;

}



.nav-items-btn {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));

  width: 34px;

  height: 34px;

}



.nav-items-btn p {

  font-size: 21px !important;

}



.nav-link-custom {

  color: #4b5563;

  text-decoration: none;

  font-size: 14px;

  font-weight: 600;

  white-space: nowrap;

}



.nav-link-custom:hover {

  color: #8B5E3C;

}



.object-fit-cover {

  object-fit: cover;



}



.w-140 {

  width: 140px;

}



.rounded-20 {

  border-radius: 20px !important;

}



.rounded-100 {

  border-radius: 100px !important;

}



.search-box {

  height: 52px !important;

  border-radius: 20px !important;

  padding-left: 40px !important;

  background: #f9fafb !important;

  color: #9ca3af !important;

}



.maginfiy {

  position: absolute;

  top: 84px;

  left: 39px;

  color: #9ca3af;



}



.search-placeholder {

  height: 240px;

  overflow-y: auto;

  scrollbar-width: none;

}



.border-grey {

  border-bottom: 1px solid #f3f4f6;

}



.gradient-text {

  background: linear-gradient(135deg, #81594a, #a67c5a);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  background-clip: text;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

  font-size: 1.5rem;

  line-height: 2rem;



}



.gradient-brown {

  background: linear-gradient(135deg, #81594a, #a67c5a);

}



.modal-content {

  border-radius: 20px;

}



.prt-heading {

  color: #111827;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

}



.padding-top-bottom-48 {

  padding: 48px 0px;

}



.msg button {

  height: 130px;

  border-radius: 20px;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

  padding: 1rem;



  border: 1px solid #e5e7eb;

  font-size: 14px !important;

}



.Corporate-heading h2 {

  font-size: 48px;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

  margin-bottom: 20px;

  font-weight: 300;

  letter-spacing: .8px;



}



.Corporate-heading p {

  font-size: 20px;

  font-weight: 300;

  color: #4b5563;



}



.modal-foot .snd-msg {

  padding: 12px 24px;

  border-radius: 20px;

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90)) !important;

  font-weight: 500;

  font-size: 16px;

}



.msg button textarea::placeholder {

  color: #e5e7eb !important;

  /* apna desired color */

  opacity: 1;

  /* ensure visible */

}



.modal-foot .close-btn {

  padding: 12px 24px !important;

  color: #4b5563;

  border: 1px solid #e5e7eb !important;

  border-radius: 15px;

  font-size: 16px;

}



.p-color {

  color: #4b5563;

}



.background-brown-gradient {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90)) !important;

}



.background-brown-gradient-light {

  background: linear-gradient(135deg, rgb(129 89 74 / 48%), rgb(166 124 90 / 55%)) !important;

}



.wh-36 {

  width: 36px;

  height: 36px;

}



.wh-32 {

  min-width: 32px;

  height: 32px;

}



.marquee-container {

  width: 90%;

  margin: 40px auto;



  overflow: hidden;

  white-space: nowrap;

  border-radius: 20px;

  padding: 12px;

  background: #fff;

  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

  cursor: pointer !important;

}



.marquee-track {

  display: inline-block;



  animation: marquee 100s linear infinite;

}



.marquee-container:hover .marquee-track {

  animation-play-state: paused;

  /* hover par ruk jata hai */

}



@keyframes marquee {

  0% {

    transform: translateX(0%);

  }



  100% {

    transform: translateX(-100%);

  }

}



.animate-scroll {

  display: inline-flex;

  animation: scroll 120s linear infinite;

  /* Slow speed */

}



.marquee-item {

  display: inline-flex;

  align-items: center;

  gap: 6px;

  margin: 0 14px;

  font-family: Arial, sans-serif;

  font-size: 14px;

  color: #1f2937;

  font-weight: 500;

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

}



.marquee-item svg {

  width: 31px;

  height: 21px;

  flex-shrink: 0;

}



/*  */



.tab-box {

  background: #fff;

  border-radius: 14px;

  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);

  display: inline-flex;

  padding: 6px;

}



.tab-box .nav-link {

  border: none;

  border-radius: 12px;

  padding: 16px 26px;

  color: #4b5563;

  font-size: 14px;

  font-weight: 600;

  display: flex;

  flex-direction: column;

  align-items: start;

  transition: all 0.3s;

  min-width: 130px;

  /* box size fix */



  justify-content: flex-start;

  /* text top par */



}



.tab-box .nav-link {

  font-size: 16px !important;

}



.tab-box .nav-link p {

  font-size: 13px;

  font-weight: 500;

  color: #6b7280;

  display: block;

  margin-bottom: 0px;



  line-height: 1rem;

}



/* Active tab */

.tab-box .nav-link.active {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));



  color: #fff;

  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);

  height: 100%;

  align-items: center;

  justify-content: center;

}



.tab-box .nav-link.active p {

  color: #fff;

}



#all-tab.active {

  min-width: 70px !important;

  transform: scale(0.95);

  /* halka compress effect */

}



.tab-box .nav-link.active p {

  display: none;

}



/* Hover */

.roudend-25 {

  border-radius: 25px;

}



.user {

  background: rgb(210, 180, 140);

  color: rgb(255, 255, 255);

  border: none;

  min-width: 50px;

  height: 50px;

}



.badge-user {

  background-color: rgba(59, 130, 246, 0.1) !important;

  color: rgb(29, 78, 216) !important;

  border: 1px solid #3b82f633;

  font-size: 0.75rem;

  line-height: 1rem;

  border-radius: 20px !important;

  padding: 5px 10px !important;

  font-weight: bold;

}



.badge-form {

  background-color: rgba(244, 63, 94, 0.1);

  color: rgb(190, 18, 60);

  border: 1px solid #f43f5e33;

  padding: 5px 10px;

  border-radius: 20px;

}



.card-heading {

  font-size: 24px !important;

  line-height: 1.625;

  font-weight: 500;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

  color: #212529 !important;

}



.card-form-heading {

  font-size: 32px !important;

  line-height: 1.625;

  font-weight: 500;

  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

}



.gap-40 {

  gap: 52px !important;

}



.roudend-100 {

  border-radius: 100px !important;

}



.wh-12 {

  width: 12px;

  height: 12px;

}



.w-16 {

  width: 16px;

}



.w-20 {

  width: 20px;

}



.wh-20 {

  width: 20px;

  height: 20px;

}



.wh-40 {

  width: 40px;

  height: 40px;

}



.wh-20 {

  width: 20px;

  height: 20px;

}



.wh-64 {

  min-width: 64px;

  height: 64px;

}



.font-14 {

  font-size: 14px;

}



.card-subheading {

  font-size: 16px;

  font-weight: 300;

  color: #4b5563;

  line-height: 26px;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  -webkit-box-orient: vertical;

  overflow: hidden;

}



.card-subheading strong,

.card-subheading span {

  font-size: 16px !important;

  font-weight: 300 !important;

  color: #4b5563 !important;

  line-height: 26px;

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

}



.card-form-subheading {

  font-size: 16px;

  font-weight: 400;

  color: #09090b;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin-bottom: 30px !important;

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

}



.luxury-shadow {

  box-shadow: 0 8px 32px rgba(129, 89, 74, 0.08) !important;

  border: 1px solid rgba(255, 255, 255, 0.3);

}



.clr_icon {

  color: #6b7280
}



.fw-300 {

  font-weight: 300 !important;

}



.margin-bottom-3 {

  margin-bottom: 3px !important;

}



.sticky-top {

  position: sticky !important;

  top: 15px;

  /* upar stick hoga */

}



/* Floating Action Button */

.fab {

  position: fixed;

  /* bottom: 70px; */
  bottom: 110px;
  right: 30px;

  width: 64px;

  height: 64px;

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  cursor: pointer;

  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);

  transition: background 0.3s ease;

  z-index: 1;

}





#button {

  position: fixed;

  bottom: 85px;

  right: 0;

  left: 0;

  transition: background-color .3s, opacity .5s, visibility .5s;

  opacity: 0;

  visibility: hidden;

  z-index: 1000;

  cursor: pointer;

}



#button.show {

  opacity: 1;

  visibility: visible;

}



.fixedTotop {

  background: transparent;

  background-image: none;

}

.fixedTotop {

  color: #6B7280;



}

/* Icon Styling */

.plus-icon {

  color: #fff;

  transition: transform 0.4s ease;

}



/* Hover Effect */

.fab:hover {

  background-color: #6b4429;

  width: 67px;

  height: 67px;

}



.fab:hover .plus-icon {

  transform: rotate(90deg);

  /* + se × ban jayega */

}



.cursor-hand {

  cursor: pointer !important;

}



.margin-top-12 {

  margin-top: 12px !important;

}



.badge-engagement {

  color: #ea580c;

  background: #fff7ed;

  padding: 4px 11px;

  font-size: 13px;

  border-radius: 20px;

  margin-left: 7px;

}



.fw-500 {

  font-weight: 500 !important;

}



.modal-body ::placeholder {

  color: #a3a9b4 !important;

}



.req-pop label {

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

  color: #374151 !important;



}



.req-pop-label {

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

  color: #374151 !important;



}



.leading-relaxed {

  line-height: 1.625;

}
.line-height-30 {

  line-height:30px;

}

.color-green{
 color: #16a34a;
 font-weight: 500;
}
.clr-374151 {

  color: #374141;

}
.big-dot::before {
    content: "•";
    font-size: 20px;   /* size badhao */
   
    line-height: 0;
}



li::marker {
    font-size: 20px;   /* dot ka size */
    color: #334155;       /* dot ka color */
}

.exploring{
      background: linear-gradient(135deg, rgb(51, 65, 85), rgb(71, 85, 105));
      height: 48px;
      color: #fff;
      font-weight: 500;
       font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;

}
.exploring:hover{
 transform: scale(1.05);
 
 
transition: transform 0.5s ease;

  
}


.editor-box {

  border: 1px solid #eee;

  border-radius: 15px;

  padding: 10px;

  background: #fff;

}



.toolbar {



  padding-bottom: 10px;

  margin-bottom: 5px;

}



.toolbar button {

  border: none;

  background: none;

  font-size: 16px;

  margin-right: 10px;

  cursor: pointer;

  color: #855e42;

}



.editor {

  min-height: 120px;



  border-radius: 10px 0px;

  padding: 10px;

  outline: none;

  resize: vertical;

  font-family: inherit;

}



.editor:empty:before {

  content: attr(data-placeholder);

  color: #aaa;

}



.reply-btn {

  background: #c9b5a7;

  color: white;

  border-radius: 10px;

  padding: 6px 18px;

  border: none;

  float: right;

  margin-top: 10px;

  display: flex;

  align-items: center;

  gap: 5px;

}



.reply-btn:hover {

  background: #a58e7b;

}



.tool {

  width: 100%;

  border: 1px solid #e5e7eb;

  border-radius: 15px;

  padding: 15px;

}





.search-box:focus {

  border: 2px solid #81594a;

  box-shadow: none;

}



.background-blue {

  background: linear-gradient(135deg, rgb(59, 130, 246), rgb(29, 78, 216)) !important;

}



.border-bottom-card {

  border-bottom: 1px solid #f3f4f6;

}



.reaction-popup {

  bottom: 120%;

  /* icon ke upar show karega */

  opacity: 0;

  visibility: hidden;

  transform: scale(0.9);

  transition: all 0.3s ease;

  z-index: 1000;

}



.reaction-btn:hover .reaction-popup {

  opacity: 1;

  visibility: visible;

  transform: scale(1);

}



.btn-accept .btn {

  background-color: #059669;

  height: 50px;

  border-radius: 15px;

}



.btn-accept .btn {

  transition: transform 0.2s ease, box-shadow 0.2s ease;

}



.btn-accept .btn:hover {

  transform: scale(1.05);

  /* 5% increase on hover */

  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

  /* optional shadow for better effect */

}



.list-clr {

  color: #4b5563;

  ;

}



.fw-600 {

  font-weight: 600;

}



.follow:hover svg,

.follow:hover span {

  color: #ef4444 !important;



}



.follow:hover span {

  color: #ef4444 !important;

}



.marquee-track {

  display: flex !important;

  align-items: center !important;

}



.offcanvas-end {

  width: 448px !important;

}



.user-name {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));

  color: #fff;

  border-radius: 100px;



}



.user-nme {

  background: #f3f4f6;

  color: #4b5563;

  border-radius: 100px;



}



.header-profile:hover {

  background-color: #fffbeb;

  border-radius: 20px !important;

}



.sticky-btn {

  position: sticky;

  bottom: 0;

  padding: 24px;

  background-color: #f9fafb;

  border: 1px solid #f3f4f6;

}



.header-profile:hover .user-nme {

  background-color: #FEF3C7;

}



.header-profile:hover .log-outt {

  color: #dc2626;

}



.header-profile:hover svg {

  stroke: #B45309;

}



.button-cross {



  display: flex;

  justify-content: center;

  align-items: center;

  font-size: 14px;

}



.btn-close {

  border-radius: 50%;

  padding: 6px;

  transition: background-color 0.3s ease;

}



/* 👇 Hover effect */

.btn-close:hover {



  background-color: #f3f4f6 !important;

}



.user-detail h1 {

  color: #111827;

}

.user-detail span {
  font-size: 12px !important;
}



.edit-pro {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90)) !important;

  width: 120px;

  height: 120px;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 50%;

  font-size: 32px;

  color: #fff;

  font-weight: 500;

  opacity: .9;

}



.edit-name p {

  color: #4b5563;

}



.green-light {

  background-color: #EFFCF3;

}



.account-detail {

  background-color: #f9fafb;

  border-radius: 20px;

}



.account-detail .active {

  color: #16a34a;

  font-size: 14px;

  font-weight: 600;



}



.red-clr {

  color: #dc2626;

}



.btn-logout {

  background-color: #FEF2F2 !important;

  padding: 16px 0px;

  border-radius: 20px;

}









nav-tabs {

  border-bottom: none;

}



/* Custom brown tab style */

.custom-tab {

  border: none !important;

  background: transparent;

  color: #4b5563;

  font-weight: 500;

  border-radius: 10px;

  padding: 8px 18px;

  margin-right: 8px;

  border-radius: 15px !important;

}



.custom-tab.active {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));

  color: #fff !important;

}



.custom-tab:hover {

  background-color: #EFF0F2;

  color: #4b5563;

}



.unfollow {

  padding: 7px 17px;

  border-radius: 11px;

  border: 1px solid #dc2626
}



.email-edit {

  background-color: #eff6ff;

  width: 40px;

  height: 40px;

  border-radius: 100px;

}



.member-edit {

  background-color: #faf5ff;

  width: 40px;

  height: 40px;

  border-radius: 100px;

}



.account-status {

  background-color: #f0fdf4;

  width: 40px;

  height: 40px;

  border-radius: 100px;

}



.btn-logout .logout-icon {

  transition: transform 0.25s ease;



}



.btn-logout:hover {

  background-color: #FEE2E2 !important;

  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);

}





.btn-logout:hover .logout-icon {

  transform: scale(1.15);

}



.bg-white {

  background: rgb(255 255 255 / 0.7) !important;

  backdrop-filter: blur(4px) !important;

}



.modal-terms {

  max-width: 657px !important;

}



.modal-multistep {

  max-width: 672px !important;

}



.padding-24 {

  padding: 24px;

}



.padding-32 {

  padding: 32px;

}



.btn-accept {

  background-color: #ccc;

  padding: 12px 32px;

  font-size: 15px;

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

  color: #fff;

  font-weight: 600;

  background-color: #81594a;

  border: 0px;

  border-radius: 20px;

  margin-top: 24px;



}



/* Step header */



.step {

  width: 36px;

  height: 36px;

  border-radius: 50%;

  background: #E5E7EB;

  color: #374151;

  display: flex;

  align-items: center;

  justify-content: center;

  font-weight: 600;

  font-size: 15px;

  transition: 0.3s;

}



.step.active {

  background: #DC8016;

  /* orange */

  color: white;

}



.step-label {

  color: #374151;

  transition: 0.3s;

  font-size: 14px !important;

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;



}



.step-label.text-orange {

  color: #374151;

  font-size: 14px;

  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;



}



/* Progress Line (default grey → animated orange) */

.border-progress {

  position: relative;

  height: 3px !important;

  background-color: #E5E7EB;

  border: none !important;

  transition: all 0.4s ease;

  overflow: hidden;

}



.border-progress::after {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  height: 3px !important;

  width: 0%;

  background-color: #DC8016;

  transition: width 0.4s ease;

}



.border-progress.progress-active::after {

  width: 100%;

}



.step svg {

  width: 18px;

  height: 18px;

  stroke: white;

}



/* Selectable boxes */

.genration-form {

  border: 1px solid #e5e7eb;

  border-radius: 15px;

  cursor: pointer;

  transition: all 0.3s;

  height: 74px;

  align-items: center
}



.genration-form.active {

  border-color: #DC8016 !important;

  background-color: #FFFBEB !important;

}



.height-66 {

  height: 66px !important;

}



.height-58 {

  height: 58px !important;

}





.completed {

  background-color: #DC8016;

}



.div-icon svg:hover {

  color: rgb(139, 94, 60) !important;

}



/* Form Boxes */





.follow-user-content-wrap {

  position: absolute;

  opacity: 0;

  padding: 10px 10px;

  border-radius: 6px;

  border: 1px solid rgba(129, 89, 74, 0.12);

  right: -10px;

  top: 30px;

  box-shadow: 0 8px 32px rgba(129, 89, 74, 0.08);

  background: rgb(255 255 255 / 0.8);

  backdrop-filter: blur(4px);

  cursor: pointer;

  transition: opacity 0.2s ease;

  pointer-events: auto;

  width: 120px;

}



/* Show tooltip when hovering wrapper or tooltip itself */

.follow-wrapper:hover .follow-user-content-wrap {

  opacity: 1;

}



.follow-user-content-wrap span {

  font-size: 12px;

  color: #6B7280;

}



.follow {

  cursor: pointer;

}



.follow:hover+.follow-user-content-wrap {

  opacity: 1;

}



.post-card-bottom-wrap {

  border-top: 1px solid #f3f4f6;

}



.reply-post-btn-wrap.active-button {

  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90)) !important;

}



#commentList {

  padding: 0
}



.padding-32-full {

  padding: 32px;

}



#commentList .header-mains {

  box-shadow: none !important;

  padding: 24px !important;

  margin: auto;

}



#commentList span,

#commentList p.font-16 {

  color: #6b7280;

  font-size: 14px !important;

}



#commentList svg {

  color: #6b7280;

  width: 16px;

  height: 16px;

}



.user.comment-reply-profile {

  min-width: 64px;

  height: 64px;

  font-size: 18px;

}



.form-heading-mains {

  max-width: 740px;

}





.profile-edit-btn-wrap {

  width: 20px;

  position: absolute;

  top: 0;

  right: -26px;

  bottom: 0;

  margin: auto;

  color: #636363;

}



.user-edit-profile-wrap {

  background: transparent;

  border: 0;

  border-bottom: 1px solid #81594a;

  padding-left: 4px;

  margin: 4px 0px;

  text-align: center;

}



.user-edit-profile-wrap:focus {

  border-bottom: 1px solid #81594a;

  outline: 0;

}

.margin-bottom-3 {
  margin-bottom: 58px !important;
}

body.modal-open {
  overflow: auto !important;
  padding-right: 0 !important;
  scrollbar-width: none !important;
}

@media (min-width: 992px) {
  .modal {
    overflow: hidden !important;
    /* modal box ke andar scroll hide */
  }

  .modal-body {
    overflow: hidden !important;
    /* modal ke content ko bhi fix kar de */
  }

  body.modal-open {
    overflow: hidden !important;
    /* page scroll bhi disable */
  }

  body.modal-open {
    overflow: auto !important;
    padding-right: 0 !important;
    scrollbar-width: none !important;
  }
}

.question {
  /* width:  320px !important; */
  width: 267px;
  /* height: 450px; */
  box-shadow: 0 20px 60px -12px rgba(0, 0, 0, 0.15), 0 10px 30px -10px rgba(0, 0, 0, 0.1);
  padding: 24px !important;
  position: absolute;
  /* bottom: 120px; */
  top: 95px;
  left: -182px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 25px !important;
  backdrop-filter: blur(4px);
}

.icon-ques {
  min-width: 48px;
  height: 48px;
  border-radius: 12px;
}

.qus-name p {
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;

}

.text-amber-600 {
  color: #d97706;
}

.ques_ans {
  border: 1px solid #e5e7eb;
  padding: 12px;
  border-radius: 10px;
  width: 100%;
  font-weight: 600;
  background: linear-gradient(to right, #F0F1F3 0%, #FDFDFA 70%);
}

.ques_ans p {
  /* white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; */
  /* max-width: 200px;  */
    font-weight: 600;
}

.form-check-input:checked {
  background-color: #d97706;
  border-color: #d97706;
}

.question-body {
  /* height: 180px;
  overflow-y: auto; */
  scrollbar-width: none;
  /* border-bottom: 1px solid #ccc; */
}

.ques_ans:hover {
  border: 2px solid #fbbf24;
   background: #fff !important;
 
  /* transform: scale(1.02) translateZ(0);
 transition: transform 1s ease; */


}

.ques_ans:hover .form-check-input {
  border: 2px solid #fbbf24;

}

.question-footer {
  border-top: 1px solid#ccc;
  padding-top: 10px;
}

.main_aboutus {
  /* width: 320px !important; */
  width: 267px;
  /* height: 450px; */
  box-shadow: 0 20px 60px -12px rgba(0, 0, 0, 0.15), 0 10px 30px -10px rgba(0, 0, 0, 0.1);
  padding: 24px !important;
  position: absolute;
 top: 95px;
    right: -170px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 25px !important;
  backdrop-filter: blur(4px);

}

.learnmore_btn {
  background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));
  color: #fff;
  padding: 8px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  width: 100%;
}

.custom-header {
  max-width: 940px
}

.font-georgia {
  font-family: Georgia, serif;
}


.ques-heading h4{
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  margin-top: 4px;
}
.width-max-650{
  max-width: 650px;
}
.c-logo{
      background: linear-gradient(135deg, rgb(51, 65, 85), rgb(71, 85, 105));
  width: 80px;
  height: 80px;
 border-radius: 100px;
 font-weight: 700;
}
.font-48{
  font-size: 48px;
}
.story-deatil-img{
    background: linear-gradient(135deg, rgb(51, 65, 85), rgb(71, 85, 105));
    width: 48px;
    height: 48px;
    border-radius: 100px;
}
.background-blue-light{
  background: #f3f4f6;
}

.clr-374151{
  color: #374151;
}
.mob-view{
  width: 288px !important;
}

.off-tittle{
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}
.canva-body-items .nav-link-custom{
  padding: 14px 0px;
}
.canva-body-items.nav-item-btn {
    background: linear-gradient(135deg, rgb(129, 89, 74), rgb(166, 124, 90));
    color: #fff;
    padding: 8px 16px;
    border-radius: 10px !important;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}

.button-lists{

 border-top: 1px solid #e5e7eb;
 padding-top: 30 !important;

}
.tracking-wider {
    letter-spacing: 0.05em;
}


.slider-box {
    width: 100%;
   margin-top: 22px;
    text-align: center;
}

.text-card {
    padding: 20px 10px;
    background: #fff;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
   
    transition: 0.3s ease;
    min-height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #e5e7eb !important;
}

.slide-controls {
    margin-top: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
}

.nav-btn {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #e5e7eb;
    border: none;
    font-size: 22px;
    cursor: pointer;
    transition: 0.2s;
}

/* .nav-btn:hover {
    background: #d6d9dd;
} */
.main_about {
  /* width: 320px !important; */
  width: 267px;
  /* height: 450px; */
  box-shadow: 0 20px 60px -12px rgba(0, 0, 0, 0.15), 0 10px 30px -10px rgba(0, 0, 0, 0.1);
  padding: 24px !important;
  position: absolute;
 top: 435px;
    right: -170px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 25px !important;
  backdrop-filter: blur(4px);

}