img.scale-50, #Content img {
	max-width: 65%;
	height: auto;
}


.unique-img-container {
  position: relative;
  width: 85%; /* Adjust width as necessary */
  margin: auto;
  overflow: hidden;
  display: flex;
  margin-top: 50px;
}

.unique-img-item {
  box-sizing: border-box;
  margin: 5px; /* Optional spacing between images */

}

.unique-img-item img {
  width: 100%;
  display: block;
  border-radius: 10px;
}


.ele-text{
	max-width:70%;
	text-align:center;
	margin: 0 auto;
}

.join-text{
	max-width:80%;
	text-align:left;
}


.products-category-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 20px;
		width: 80%;
}

.products-category {
    width: 30%;
    margin: 50px 20px 20px 20px;
    text-align: center;
    border-radius: 15px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}


.products-category img {
	width: 100%;
	height: auto;
	border-radius: 50%;
	margin: 50px 20px 10px 20px;
}

.products-category p {
    font-size: 1.4em;
		font-weight: bold;
    color: #333;
    padding: 15px;
}

.products-category:hover {
    transform: translateY(-5px);
    cursor: pointer;
}

@media (max-width: 768px) {
    .products-category {
        width: 100%;
    }
}

.button_start{
	background: #7249d5;
	padding: 12px 20px 12px 20px;
	color: white;
    border-radius: 10px;
}

.advantages {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.advantage {
    background: white;
    padding: 0 0 50px 0;
    margin: 10px 0 10px 0;
    width: 30%;
    display: flex; /* Maintain flex display */
    align-items: start; /* Align items to the top */
}

.advantage img {
    width: 70px;
    height: 70px;
    margin-right: 20px; /* Right margin for spacing */
}

.advantage .adv-content {
    display: block; /* Default, can be omitted */
}

.advantage h4 {
    margin-top: 0; /* Ensure no top margin for alignment */
    margin-bottom: 5px; /* Small bottom margin to space title from description */
    font-size: 25px;
    color: #333; /* Theme color */
}

.advantage p {
    font-size: 16px;
    color: #666;
    margin: 0; /* Remove margin to control spacing */
}


.affiliate {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap; /* Allows wrapping on smaller screens */
		width: 80%;
}

.affiliate-category {
    padding: 20px;
    margin: 10px;
    width: 40%; /* Adjust the width as needed */
		text-align: center;
		margin: 0 auto;
}

.affiliate-category img {
    width: 250px; /* Adjust based on your design */
    height: auto;
    margin-bottom: 10px;
}

.affiliate-category h2 {
    font-size: 25px;
    color: #333;
}


/* Pricing Tabs*/
.pricing-tabs {
    display: flex;
    justify-content: center;
    margin: 50px auto;
}

/* Fully isolated button styles */
.pricing-tabs .pricing-tab-button {
    all: unset; /* Resets all inherited styles */
    display: inline-block;
    padding: 12px 24px;
    cursor: pointer;
    font-size: 18px;
    font-weight: bold;
    background-color: #f1f1f1;
    border-radius: 20px;
    margin: 0 8px;
    text-align: center;
    transition: all 0.3s ease-in-out;
    border: none; /* Ensures no border issues */
}

.pricing-tabs .pricing-tab-button:hover {
    background-color: #7249d5;
    color: white;
}

.pricing-tabs .pricing-tab-button.active {
    background-color: #7249d5;
    color: white;
}

.pricing-content {
    display: none;
    padding: 20px;
    border-radius: 10px;
    width: 80%;
    margin: 0 auto;
}

.pricing-content.active {
    display: block;
}

.month {
    font-size: 20px;
    color: #12263A;
}

.bill {
    font-size: 20px;
    color: #2B4051;
    line-height: 0;
    font-style: italic;
}

.price-suibtitle {
    font-size: 20px;
    color: #2B4051;
    font-style: italic;
    font-weight: bold;
    text-align: left;
}

/* END Pricing Tabs*/

.list_custom{
    text-align: left; 
    color: #12263A; 
    font-size: 22px;
}



ul.list_custom li i.fa-regular.fa-circle-check {
    color: #6C4BCD;
    font-size: 1.5rem; /* Set size here */
}

hr {
    border: none;               /* Remove the default border */
    border-top: 2px solid #E8E5D9;  /* Set the thickness and color */
}

/* Style for the image icon (WhatsApp) */
.social-icons {
    width: 30px; /* Adjust icon size */
    height: 30px; /* Adjust icon size */
}

ul.list_custom div {
    padding: 15px 0 0 0;
}

.start-btn{
    margin: 40px 0 0 0;
}


/* Input & Textarea Styling */
input,
textarea {
  width: 100%;
  padding: 14px 18px;
  margin-bottom: 16px;
  border: 2px solid #cfdced !important; /* ⬅️ thicker border */
  border-radius: 8px;
  font-size: 16px !important;         /* ⬅️ bigger font */
  color: #000 !important; 
  background-color: none;
  box-sizing: border-box;
  transition: border-color 0.3s ease, background-color 0.3s ease;
}

/* Focus State */
input:focus,
textarea:focus {
  outline: none;
  border-color: #7249d5 !important; 
  background-color: #fff;
}

/* Placeholder Styles */
input::placeholder,
textarea::placeholder {
   color: #aebccf;
  opacity: 1;
}

input:focus::placeholder,
textarea:focus::placeholder {
  color: #cfdced;
  opacity: 1;
}

/* Textarea Specific */
textarea {
  min-height: 160px;
  resize: vertical;
}

#responseOutput {
    margin-top: 20px;
    padding: 16px 0px;
    color: #333;
    font-size: 22px;
    white-space: pre-wrap; /* wrap text instead of scrolling horizontally */
    word-break: break-word;
    margin:  0 auto;
  }

  /* END Input & Textarea Styling */

  .footer-link {
    color: #fff !important;
    text-decoration: underline !important;
    transition: color 0.3s ease;
  }
  
  .footer-link:hover {
    color: #fff !important;
    text-decoration: underline !important;
  }

  .contact-font{
    font-family:'Zen Kaku Gothic New',Arial,Tahoma,sans-serif;
    font-size:18px;
    line-height:22px;
    font-weight:bold;
    letter-spacing:0px;
    color:#12263a;
  }

  .contact-font:hover{
    color:#12263a;
  }

  .contact-icon {
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 52px 52px; /* 统一 icon 尺寸 */
    padding: 15px 0 20px 70px; /* 留出左边空间给icon */
    line-height: 50px;
}

.contact-icons-section {
    display: flex;
    justify-content: center;
    gap: 0px; /* space between blocks */
    flex-wrap: wrap; /* allow responsive wrapping */
    padding: 10px 0;
    margin: 0 auto;
    width: 100%;
}

.fa-brands, .fab {
    font-weight: 400;
    color: #fff !important;
}

.fa-brands, .fab:hover{
    color: #c79aff !important; /* New color on hover */
}

/* Xiaohongshu Icon - using background images for precise color control */
.xiaohongshu-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-image: url('images/xiaohongshu.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    transition: background-image 0.3s ease;
}

.xiaohongshu-icon:hover {
    background-image: url('images/xiaohongshu-hover.svg');
}