FAQ Section
.faq-container {
width: 90%;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
margin: 20px auto;
padding: 10px;
}
.faq-header {
text-align: center;
padding: 10px 0;
}
.faq-header h2 {
font-size: 24px;
font-weight: bold;
}
.faq-item {
padding: 15px 20px;
border-top: 1px solid #e0e0e0;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
transition: background-color 0.3s ease-in-out;
}
.faq-item:first-child {
border-top: none;
}
.faq-item:hover {
background-color: #f9f9f9;
}
.faq-question {
font-size: 18px;
font-weight: 700;
display: flex;
align-items: center;
}
.faq-question img {
margin-right: 8px;
height: 24px;
width: 24px;
}
.faq-answer {
font-size: 16px;
line-height: 1.6;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out;
padding: 0 20px;
}
.faq-answer p {
margin: 10px 0;
}
.faq-answer.active {
padding: 10px 20px;
}
.icon-container i {
font-size: 16px;
transition: transform 0.3s ease-in-out;
}
.icon-container i.active {
transform: rotate(90deg);
}
Frequently Asked Questions
What is Hydrogel Sunblocker, and how is it different from regular sunscreens?
Hydrogel Sunblocker is a lightweight, gel-based sunscreen that absorbs quickly and feels refreshing. Unlike regular sunscreens that can feel thick or greasy, this one is non-sticky, non-greasy, and leaves no white cast. It's one of the best sunscreens for face because it protects your skin while keeping it fresh and breathable.
Is Hydrogel Sunblocker suitable for all skin types?
Yes! This sunscreen is perfect for all skin types—oily, dry, combination, and sensitive. It hydrates dry skin while controlling excess oil, making it the best sunscreen for oily skin.
Can I use it on my body as well?
Absolutely! While it's designed as a sunscreen for face, you can also apply it to your neck, arms, and hands for full sun protection.
Can I wear Hydrogel Sunblocker under makeup?
Yes! Milagro Beauty Hydrogel Sunblocker is perfect to wear under makeup because it's lightweight and non-greasy. It works as a great primer, helping your foundation last longer without making your skin oily.
Can I use Hydrogel Sunblocker if I have acne-prone skin?
Yes! This sunscreen for the face is non-comedogenic, meaning it won't clog pores. It protects your skin from the sun while keeping it breathable and shine-free, making it one of the best sunscreens for oily and acne-prone skin.
Can I apply Hydrogel Sunblocker over my moisturizer?
Yes, always apply sunscreen as the last step of your skincare routine. After moisturizing, apply Hydrogel Sunblocker to protect your skin from UV rays while staying hydrated.
Which type of sunscreen is best?
The best sunscreen protects against UVA and UVB rays, feels comfortable, and suits your skin type. Hydrogel Sunblocker is one of the best sunscreens for the face because it's lightweight, non-greasy, and perfect for everyday use.
Which sunscreen is better, gel or cream?
It depends on your skin type! Gel-based sunscreens, like Milagro Beauty Hydrogel Sunblocker, are perfect for oily and combination skin because they absorb quickly and don't feel greasy. Cream sunscreens work better for dry skin as they provide extra moisture. If you have oily skin, a gel sunscreen is the best choice.
What types of sunscreen are best for the face?
The best sunscreen for face should be lightweight, non-greasy, and offer broad-spectrum SPF protection. Hydrogel Sunblocker is a great option because it protects your skin from the sun while keeping it fresh and oil-free. If you're looking for the best sunscreen for oily skin, this one is a perfect match!
Should I use sunscreen every day?
Yes! Sunscreen is essential every day, even when you're indoors or when it's cloudy. UV rays can cause wrinkles, dark spots, and skin damage, so using Hydrogel Sunblocker daily will keep your skin healthy and glowing. If you want the best sunscreen for face, choose one you enjoy wearing daily!
document.querySelectorAll('.faq-item').forEach((item) => {
item.addEventListener('click', () => {
const answer = item.nextElementSibling;
const icon = item.querySelector('.icon-container i');
if (answer.classList.contains('active')) {
answer.classList.remove('active');
answer.style.maxHeight = null;
icon.classList.remove('active');
} else {
document.querySelectorAll('.faq-answer.active').forEach((activeAnswer) => {
activeAnswer.classList.remove('active');
activeAnswer.style.maxHeight = null;
activeAnswer.previousElementSibling.querySelector('.icon-container i').classList.remove('active');
});
answer.classList.add('active');
answer.style.maxHeight = answer.scrollHeight + 'px';
icon.classList.add('active');
}
});
});