@import url('https://fonts.googleapis.com/css2?family=Alata&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alata&family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap');




/* General Footer Styles */
.footer-container {
background: #000;
color: #fff;
padding: 10px 80px;
width: 100%;
}

/* First Row - 4 Column Layout */
.footer-row1 {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 40px;
/* margin-bottom: 50px; */
}

/* Newsletter Section */
.newsletter {
margin-top: 40px;
background: #000000;
border-radius: 25px;
padding: 5px 25px;
width: 450px;
max-width: 450px;
box-shadow: 0 0 15px rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
height:fit-content;
}

.newsletter h3 {
color: #FFD700;
font-size: 24px;
margin-bottom: 15px;
font-weight: bold;
}

.newsletter p {
color: #ffffff;
margin-bottom: 20px;
font-size: 16px;
line-height: 1.5;
}

.newsletter-input {
width: 100%;
margin-top: 20px;
}

.take-input {
width: 100%;
padding: 12px 15px;
border: 2px solid #ffffff;
border-radius: 8px;
background: #ffffff;
font-size: 16px;
margin-bottom: 15px;
}

.take-input::placeholder {
color: #666;
}

.subscribe {
margin-left: 80px;
background: #FFD700;
color: #000000;
padding: 12px 30px;
border: none;
border-radius: 25px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
transition: background-color 0.3s ease;
}

.subscribe:hover {
background: #f4cc00;
}

/* Optional: Add focus styles for better accessibility */
.take-input:focus {
outline: none;
border-color: #FFD700;
box-shadow: 0 0 5px rgba(255, 215, 0, 0.3);
}
@media (max-width: 768px) {
.newsletter {
margin-top: 20px;
padding: 10px 15px; /* Reduces padding for smaller screens */
width: 100%; /* Takes the full width of the container */
max-width: 100%; /* Ensures no horizontal overflow */
flex-direction: column; /* Stacks elements vertically */
align-items: center; /* Centers content */
}

.newsletter h3 {
font-size: 20px; /* Reduces font size for better fit */
text-align: center; /* Centers the heading */
margin-bottom: 10px;
}

.newsletter p {
font-size: 14px; /* Adjusts font size for smaller screens */
text-align: center; /* Centers text */
margin-bottom: 15px;
line-height: 1.4; /* Adjusts line height */
}

.newsletter-input {
margin-top: 15px;
width: 100%; /* Ensures input takes full width */
}

.take-input {
width: 100%; /* Full-width input on mobile */
padding: 10px 12px; /* Adjusts padding for smaller size */
font-size: 14px; /* Reduces font size */
margin-bottom: 10px; /* Reduces margin for tighter layout */
}

.subscribe {
margin: 15px 0 0 0; /* Centers button with spacing above */
padding: 10px 20px; /* Adjusts padding for smaller screens */
font-size: 14px; /* Reduces font size */
width: 100%; /* Full-width button on mobile */
text-align: center; /* Centers text */
}
}


/* About Section */
.about-aueqi h3 {
color: #FFD700;
font-size: 24px;
margin-top: 50px;
}

.about-aueqi p {
line-height: 1.6;
}

/* Explore Section */
.explore-aueqi h3 {
color: #FFD700;
font-size: 24px;
margin-top: 50px;
}

.explore-aueqi ul {
list-style: none;
padding: 0;
}

.explore-aueqi ul li {
margin-bottom: 12px;
}

.explore-aueqi ul li a {
color: #fff !important;
text-decoration: none;
transition: color 0.3s;
}

.explore-aueqi ul li a:hover {
color: #FFD700;
}

/* Useful Links Section */
.useful-links-aueqi h3 {
color: #FFD700;
font-size: 24px;
margin-top: 50px;
}

.useful-links-aueqi ul {
list-style: none;
padding: 0;
}

.useful-links-aueqi ul li {
margin-bottom: 12px;
}

.useful-links-aueqi ul li a {
color: #fff !important;
text-decoration: none;
transition: color 0.3s;
}

.useful-links-aueqi ul li a:hover {
color: #FFD700;
}

@media (max-width: 995px) { /* Tablet and below */
.useful-links-aueqi h3 {
margin-top: 0;
margin-bottom: 15px; /* Adjust as needed */
}

.explore-aueqi h3 {
margin-top: 0;
margin-bottom: 15px; /* Adjust as needed */
}

.about-aueqi h3 {
margin-top: 0;
margin-bottom: 15px; /* Adjust as needed */
}
}

/* Second Row - Let's Talk Section */
/* .footer-row2 {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30px 0;
border-top: 1px solid rgba(255, 255, 255, 0.1);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
} */

/* For larger screens */
.lets-talk {
display: flex; /* Enable flexbox for layout */
justify-content: space-between; /* Space between .lets-talk-content and .footer-follow-us */
align-items: center; /* Vertically align items */
flex-wrap: nowrap; /* Prevent wrapping */
margin-top: 8px !important;
}

/* Ensure content inside .lets-talk-content stays aligned */
.lets-talk-content {
display: flex;
align-items: center;
gap: 10px; /* Adjust gap between logo and info */
}

/* Logo adjustments */
.footer-logo {
width: 135px; /* Set logo size for large screens */
height: auto; /* Maintain aspect ratio */
margin-left: 0; /* Remove margin offsets */
margin-top: 0;
}

/* Styling for lets-talk-info */
.lets-talk-info h3 {
color: #FFD700;
font-size: 28px;
margin-bottom: 15px;
}

.lets-talk-info ul {
list-style: none;
padding: 0;
}

.lets-talk-info ul li {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 12px;
}

.lets-talk-info ul li a {
color: #fff;
text-decoration: none;
}

/* Social Media Section */
.footer-follow-us {
display: flex;
flex-direction: column; /* Stack items vertically */
align-items: flex-end; /* Align items to the right */
gap: 10px;
}


.follow-button {
position: relative;
background: linear-gradient(to right, #ff6b6b, #7c3aed);
color: white;
padding: 8px 20px;
border-radius: 8px;
font-weight: 600;
font-size: 14px;
}

/* Speech bubble pointer */
.follow-button:after {
content: '';
position: absolute;
bottom: -8px;
left: 50%;
transform: translateX(-50%);
width: 0;
font-size: large;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #7c3aed;
}

.social-icons-wrapper {
background: #fff;
padding: 10px 20px;
border-radius: 25px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
margin-left: 50px;
}

.social-icons {
align-items: center;
margin-bottom: -25px;
}

.social-list__items {
list-style: none;
}

.social-list__links {
color: #000;
font-size: 18px;
transition: transform 0.3s ease;
display: flex;
align-items: center;
}

.social-list__links:hover {
transform: translateY(-2px);
}

/* Optional: Add specific hover colors for each social platform */
.social-list__links .fa-twitter:hover {
color: #1DA1F2;
}

.social-list__links .fa-whatsapp:hover {
color: #25D366;
}

.social-list__links .fa-facebook:hover {
color: #4267B2;
}

.social-list__links .fa-linkedin:hover {
color: #0077b5;
}

.social-list__links .fa-instagram:hover {
color: #E4405F;
}

.social-list__links .fa-youtube:hover {
color: #FF0000 !important;
}

/* Footer Bottom */
.footer-bottom {
display: flex;
align-items: center; /* Ensures vertical alignment */
justify-content: flex-start; /* Aligns content to the left */
padding: 20px 0; /* Removes extra padding */
margin: 0; /* Removes any default margins */
text-align: left;
}

.footer-contentt {
display: flex;
align-items: center; /* Keeps items vertically aligned */
gap: 10px; /* Adds spacing between elements */
color: #fff;
background-color: white;
color: #000;
border-radius: 15px;
border:1px solid #ffd700;
padding: 4px; /* Adds internal spacing for the content */
margin: 0; /* Ensures no extra margin */
}


.footer-contentt a {
color: black;
text-decoration: underline !important;
}

.footer-contentt a:hover {
color: #FFD700;
}

/* Responsive Design for 1024px and above */
@media (min-width: 1024px) {
.footer-bottom {
width: 100%; /* Ensures full-width alignment */
}

.footer-contentt {
margin: 0; /* Removes any offset */
padding-left: 0; /* Ensures it starts at the exact left edge */
}
}

/* Responsive Design */
@media (max-width: 1200px) {
.footer-container {
padding: 5px 40px;
}
}

/* @media (max-width: 992px) {
.footer-row1 {
grid-template-columns: repeat(2, 1fr);
}
} */


@media (max-width: 992px) {
/* Ensure footer-row1 sections stack vertically */
.footer-row1 {
display: flex;
flex-direction: column;
align-items: flex-start; /* Align items to the left */
gap: 20px; /* Add some space between the sections */
padding-left: 20px; /* Add some padding from the edge of the screen */
}

.footer-section {
width: 100%; /* Make each section take full width */
text-align: left; /* Align text to the left */
}

.footer-section ul{
    margin-left:18px !important;
}

/* Ensure footer-follow-us is below the footer-row1 */
.footer-follow-us {
display: flex;
flex-direction: column;
align-items: flex-start; /* Align content to the left */
margin-top: 20px; /* Add spacing from the footer-row1 */
padding-left: 20px; /* Add padding to match footer-row1 alignment */
margin-bottom:20px;
}

.follow-button {
margin-bottom: 15px; /* Add spacing between the button and social icons */
}

.social-icons-wrapper {
margin-left: 0; /* Align the social icons wrapper to the left */
}

.social-icons {
flex-wrap: wrap; /* Allow social icons to wrap if needed */
justify-content: flex-start; /* Align social icons to the left */
}

.social-list__items {
margin: 0 10px 10px 0; /* Add spacing between social icons */
}

.lets-talk {
flex-direction: column; /* Stack .lets-talk-content and .footer-follow-us vertically */
align-items: flex-start; /* Center align items */
gap: 20px; /* Add spacing between sections */
}

.lets-talk-content {
flex-direction: row; /* Keep logo and lets-talk-info side by side */
align-items: center;
gap: 10px;
}

.footer-logo {
width: 120px; /* Adjust logo size for smaller screens */
}

.lets-talk-info h3 {
font-size: 18px; /* Reduce heading size */
}

.lets-talk-info ul li {
font-size: 14px; /* Reduce font size for smaller text */
}

.footer-follow-us {
align-items: center; /* Center the follow-us section */
gap: 15px;
}

.follow-button {
font-size: 12px; /* Adjust button size */
padding: 6px 15px; /* Reduce padding */
}

.social-icons-wrapper {
margin-left: 0; /* Reset left margin */
padding: 10px; /* Adjust padding */
}





.footer-contentt span, 
.footer-contentt a {
white-space: nowrap; /* Prevent wrapping of individual elements */
}
}



@media (max-width: 479px) {
.footer-row1 {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 10px; /* Reduce spacing for smaller screens */
padding-left: 10px; /* Adjust padding */
}

.footer-section {
width: 100%; /* Full width */
text-align: left;
font-size: 12px; /* Smaller font for compact screens */
}

.footer-follow-us {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
margin-top: 15px;
padding-left: 10px;
margin-bottom:15px;
}

.follow-button {
font-size: 10px; /* Adjust button size */
padding: 5px 10px; /* Compact button padding */
}

.social-icons-wrapper {
margin-left: 0;

}

.social-icons {
gap: 3px; /* Reduce space between icons */
}

.social-list__items {
font-size: 8px; /* Smaller icons */
margin: 0 5px 5px 0; /* Adjust spacing */
padding:5px !important;
}

.lets-talk {
gap: 10px; /* Reduce spacing */
}

.lets-talk-content {
gap: 5px; /* Adjust spacing between elements */
}

.footer-logo {
width: 80px; /* Smaller logo */
}

.lets-talk-info h3 {
font-size: 14px; /* Smaller heading */
}

.lets-talk-info ul li {
font-size: 10px; /* Compact text size */
}

.footer-bottom {
display: flex;
justify-content: center !important; /* Align content to the left */
align-items: center; /* Vertically center the elements */
flex-wrap: nowrap; /* Keep elements in one row */

}





.footer-contentt a {
text-decoration: underline;
color: black;
}
}

@media (max-width:768px){
    .footer-bottom{
        justify-content: center !important;
    }
}


@media (max-width: 375px) {
.footer-row1 {
gap: 8px;
padding-left: 8px;
}

.footer-follow-us {
gap: 5px;
padding-left: 8px;
}

.follow-button {
font-size: 9px;
padding: 4px 8px;
}

.footer-logo {
width: 70px;
}

.footer-bottom {
display: flex;
justify-content: flex-start; /* Align content to the left */
align-items: center; /* Vertically center the elements */
flex-wrap: nowrap; /* Keep elements in one row */

}

.footer-contentt {
display: flex;
gap: 6px; /* Reduce space between elements */
margin: 0; /* Remove margin */
}

.footer-contentt span, 
.footer-contentt a {
white-space: nowrap; /* Prevent wrapping */
font-size: 6px; /* Adjust font size to fit smaller screens */
}

.footer-contentt a {
text-decoration: underline;
color: black;
}
}

@media (max-width: 320px) {
.footer-row1 {
gap: 5px;
padding-left: 5px;
}

.footer-follow-us {
gap: 4px;
padding-left: 5px;
}

.follow-button {
font-size: 8px;
padding: 3px 6px;
}

.footer-logo {
width: 60px;
}

.footer-bottom {
display: flex;
justify-content: flex-start; /* Align content to the left */
align-items: center; /* Vertically center the elements */
flex-wrap: nowrap; /* Keep elements in one row */

}

.footer-contentt {
display: flex;
flex-direction:row;
gap: 5px; /* Further reduce space between elements */
margin: 0; /* Remove margin */
}

.footer-contentt span, 
.footer-contentt a {
white-space: nowrap; /* Prevent wrapping */
font-size: 6px; /* Reduce font size significantly for small screens */
}

.footer-contentt a {
text-decoration: underline;
color: black;
}
}


@media (max-width: 640px) and (min-width: 480px) {
.footer-bottom {
display: flex;
justify-content: flex-start; /* Align content to the left */
align-items: center; /* Vertically center the elements */
flex-wrap: wrap; /* Allow wrapping if necessary */
padding: 10px; /* Add padding for smaller screens */
}

.footer-contentt {
display: flex;
flex-direction: row; /* Ensure content stays in a row */
gap: 5px; /* Reduce the gap between elements */
margin: 0; /* Remove margins to ensure alignment */
font-size: 10px; /* Reduce overall font size for this range */
}

.footer-contentt span, 
.footer-contentt a {
white-space: nowrap; /* Prevent text wrapping */
font-size: 10px; /* Adjust font size for better readability */
}

.footer-contentt a {
text-decoration: underline;
color: black; /* Maintain clear visibility of links */
}
}


@media (min-width: 800px) and (max-width: 992px) {
.social-icons {
align-items: center;
margin-bottom: -15px;
}
.social-icons a {
color: #000;
text-decoration: none;
font-size: 20px;
}
}

@media(max-width:799px){
    .social-icons{
        margin-bottom: -15px;
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .subscribe {
        margin: 15px auto 0 auto; /* Centers the button horizontally */
        padding: 10px 20px; /* Keeps the padding consistent */
        font-size: 14px; /* Keeps font size same */
        width: auto; /* Allows button to size according to content */
        max-width: 250px; /* Adjust the width as needed */
        text-align: center; /* Centers text */
        display: block; /* Ensures it's a block element for margin auto to work */
    }
}

ol{
    margin-bottom:1.5rem;
}