/*Main*/

body {
    margin: 0;
    font-family: 'Roboto', sans-serif;
    background-color: #F5F5DC;
    color: #023e8a;
}

header {
    background-color: #0B1D3A;
    padding: 60px 30px; /* Increased top and bottom padding for a taller header */
    text-align: center;
    border-bottom: 1px solid #000000;
}

header.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 40px; /* Adjusted for spacing within the header */
}

header h1 {
    font-family: 'Playfair Display', serif;
    font-size: 4rem; /* Increased font size for prominence */
    margin: 0;
    color: #D4AF37;
}

nav {
    display: flex;
    gap: 30px;
}

nav a {
    color: #D4AF37;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.4rem; /* Increased font size for links */
}

nav a:hover {
    color: #F5F5DC; /* Hover effect remains */
}

/* Logo in the navbar */
.logo-container {
    display: flex;
    font-family: 'Playfair Display', serif;
    font-size: 4rem; /* Increased font size for prominence */
    margin: 0;
    color: #D4AF37;
    align-items: center;
    
}

.logo {
    height: 80px; /* Adjust as needed */
    margin-right: 10px;
}

/* Hero section logo */
.hero-logo-container h1 {
    text-align: center;
    margin-bottom: 10px;
    margin-top: 100px;
    display: flex;
    font-family: 'Playfair Display', serif;
    font-size: 4rem; /* Increased font size for prominence */
    color: #D4AF37;
    align-items: center;
}

/* Center the logo horizontally in the container */
.hero-logo-container {
    display: flex;
    justify-content: center;  /* Centers the logo horizontally */
    align-items: center;      /* Centers the logo vertically (if height is set) */
    margin-bottom: 20px;      /* Adjust this for space between the logo and the heading */
    margin-top: 80px;
}

/* Optional: Make sure the logo is sized appropriately */
.hero-logo {
    max-width: 80%;  /* Adjust the size of the logo */
    height: 100px;    /* Maintain aspect ratio */
}


/*Index*/
.hero {
    background: url('Images/LOGO.png') no-repeat center center/cover;
    height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.hero h2 {
    color: #D4AF37; /* Gold color */
    font-family: 'Playfair Display', serif;
    font-size: 3.5rem;
}

.hero p {
    font-size: 1.5rem;
    margin: 10px 0;
}

/* Call-to-Action Button */
.cta-button {
    display: inline-block;
    padding: 10px 30px;
    margin-top: 10px;
    margin-bottom: 90px;
    background-color: #0B1D3A;
    color: #D4AF37;
    text-decoration: none;
    font-size: 1.2rem;
    font-weight: bold;
    border: solid 2px;                /* Define border width and style */
    border-color: #D4AF37;            /* Gold border color */
    border-radius: 5px;
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.cta-button:hover {
    background-color: #a2d2ff;
    transform: scale(1.05); /* Slight hover zoom effect */
}

/* Gallery Container */
.gallery {
    display: flex;
    justify-content: center; /* Horizontally centers images */
    align-items: center; /* Vertically centers images */
    flex-wrap: wrap; /* Allow wrapping of images to the next line if necessary */
    gap: 20px; /* Optional: Adds space between images */
}

/* Individual Image Styling */
.gallery img {
    width: 400px; /* Set a uniform size */
    height: 500px; /* Ensures all images are square */
    object-fit: cover; /* Ensures the images fit the size */
    border-radius: 10px; /* Slight rounded corners for style */
    transition: transform 0.5s ease; /* Slow hover effect */
    margin-bottom: 50px;
    margin-top: 80px;
}

.gallery img:hover {
    transform: scale(1.05); /* Slight zoom-in on hover */
}


/*About */

.about {
    padding: 40px 20px;
    text-align: center;
}

.about h2 {
    font-family: 'Playfair Display', serif;
    font-size: 4rem;
    margin-bottom: 20px;
}

.about p {
    font-size: 1.2rem;
    line-height: 1.8;
    margin: 20px auto;
    max-width: 800px;
}


/*Quaterzip*/

.hero {
    background: url('quaterzip-hero.jpg') no-repeat center center/cover;
    height: 60vh;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.hero h2 {
    font-family: 'Playfair Display', serif;
    font-size: 3rem;
    color: #415a77;
}

.products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    padding: 40px;
    background-color: #bdbbbb; /* Light gray background */
}

/* Initially hide the size options */
.size-options {
    display: none; /* Hidden by default */
    margin-top: 10px;
    text-align: center;
}

.size-options.show {
    display: block;
}

/* Size option buttons styling */
.sizes {
    display: flex;
    justify-content: space-around;
    margin-bottom: 10px;
}

.size-option {
    background-color: #9c9c9c;
    border: solid 2px;                /* Define border width and style */
    border-color: #D4AF37;            /* Gold border color */
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

/* Optionally, you can also change the background color of the size options section */
.size-options {
    background-color: #d9d9d9; /* Lighter gray */
    padding: 10px;
    border: solid 2px;                /* Define border width and style */
    border-color: #D4AF37;            /* Gold border color */
    border-radius: 8px;
}

.size-option:hover {
    background-color: #ddd;
}

button:hover {
    background-color: #fcfcfc;
}

.confirm-size {
    width: 100%;
    margin-top: 10px;
    border: solid 2px;                /* Define border width and style */
    border-color: #D4AF37;            /* Gold border color */
}

.product {
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    padding: 20px;
}

.checkout-section {
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    background-color: #bbbaba;
}

.checkout-container {
    text-align: center;
}

.checkout-button {
    background-color: #0B1D3A; /* Match style of existing buttons */
    color: #D4AF37;
    border: solid 2px;                /* Define border width and style */
    border-color: #D4AF37;            /* Gold border color */
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px;
    font-family: 'Roboto', sans-serif;
    transition: background-color 0.3s ease;
    margin-bottom: 50px;
}

.checkout-button:hover {
    background-color: #a2d2ff; /* Add hover effect */
}


/* Individual Image Styling */
.product img {
    width: 100%; /* Responsive size */
    height: auto; /* Maintain aspect ratio */
    object-fit: cover;
    border-radius: 10px;
    transition: transform 0.5s ease;
    justify-content: center;
}

.product img:hover {
    transform: scale(1.05);
}

.product h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.8rem;
    margin: 15px 0 10px;
}

.product p {
    font-size: 1rem;
    margin-bottom: 15px;
}

.product button {
    padding: 10px 20px;
    border-color: #D4AF37;
    font-size: 1rem;
    font-weight: bold;
    color: #D4AF37;
    cursor: pointer;
    border-radius: 5px;
}

.product button:hover {
    background-color: #135797;
}

/* Main container for the product */
.product-container {
    display: flex;
    flex-direction: column;      /* Logo at the top */
    align-items: center;         /* Center the logo and content */
    padding: 20px;
}

/* Centered, smaller logo */
.product-logo-container {
    text-align: center;
    margin-bottom: 20px;         /* Spacing below the logo */
    width: 300px;
}

.product-logo {
    max-width: 500px;            /* Smaller logo */
    height: auto;                /* Maintain aspect ratio */
}

/* Two-column layout for product content */
.product-content {
    display: flex;
    justify-content: space-between; /* Push image and description apart */
    align-items: center;            /* Align items vertically */
    width: 100%;                    /* Full width for flexibility */
    max-width: 1200px;              /* Limit width on large screens */
}

/* Image on the left */
.product-image-container {
    flex: 1.1;                      /* Take up equal space */
    text-align: center;           /* Center-align the image */
    padding-right: 20px;          /* Space between image and description */
}

.product-image {
    max-width: 80%;               /* Adjust image size */
    height: auto;                 /* Maintain aspect ratio */
}

/* Product Description Styles */
.product-details {
    flex: 1;                           /* Equal space for description */
    padding-left: 20px;                /* Space between description and image */
    text-align: left;                  /* Align text to the left */
    line-height: 1.6;                  /* Improve readability with spacing */
    font-family: 'Arial', sans-serif;  /* Clean and professional font */
    color: #161616;                       /* Neutral text color for readability */
}

/* Paragraphs within the product description */
.product-details p {
    margin-bottom: 15px;               /* Add spacing between paragraphs */
    text-align: justify;               /* Neatly align the text for consistency */
    font-size: 16px;                   /* Standard font size */
}

/* Product Title */
.product-details h3 {
    margin-bottom: 10px;               /* Space below the title */
    font-size: 22px;                   /* Larger font for emphasis */
    font-weight: bold;                 /* Make the title stand out */
    color: #000;                       /* Darker color for emphasis */
}

/* Product Price */
.product-price {
    font-size: 18px;                   /* Slightly larger font for price */
    font-weight: bold;                 /* Bold to highlight the price */
    color: #000000;                    /* Use brand color for the price */
    margin-top: 15px;                  /* Space above the price */
}

/* Buttons (Add to Cart and Size Selection) */
.add-to-cart, .size-option, .confirm-size {
    margin-top: 10px;
    padding: 10px 20px;
    background-color: #0B1D3A;        /* Button background */
    color: #D4AF37;                      /* White text for contrast */
    cursor: pointer;                  /* Pointer cursor for interactivity */
    border-radius: 5px;               /* Rounded corners */
    box-shadow: none;
}



.size-options h4 {
    margin-top: 20px;                 /* Space above the size section */
    font-size: 18px;                  /* Larger font for section heading */
    font-weight: bold;
}

/* Size Buttons */
.sizes {
    display: flex;
    gap: 10px;                        /* Even spacing between size buttons */
    margin-top: 10px;
}


.product-details {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.product-details h3,
.product-details p,
.product-details .product-price,
.product-details .add-to-cart {
    margin-bottom: 10px;
}


/* Style for the dropdown container */
.dropdown-container, .dropdown-containers {
    margin: 20px 0;
    text-align: left; /* Centers the arrow */
}

/* Button that includes the down arrow */
.dropdown-buttons, .dropdown-button {
    background-color: transparent; /* No background */
    color: #0B1D3A;                /* Red color for the arrow */
    font-size: 30px;               /* Larger arrow size */
    border: none;                  /* Remove border */
    cursor: pointer;               /* Pointer cursor for interactivity */
    padding: 0;                    /* Remove padding */
    display: inline-block;         /* Align inline */
}

/* Styling for the dropdown description */
.dropdown-description, .dropdown-descriptions {
    display: none;  /* Hidden by default */
    color: #D4AF37;
    margin-top: 10px;
    padding: 10px;
    background-color: #0B1D3A;
    border: 1px solid #ddd;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

/* Optional: Styling when the description is shown */
.dropdown-description.show, .dropdown-descriptions.show {
    display: block;
}



/* Responsive Design with Media Queries */

/* Small Mobile Phones (Max width: 480px) */
@media (max-width: 480px) {
    .product-container {
        flex-direction: column; /* Stack elements vertically */
        text-align: center;
    }

    .product-image-container {
        max-width: 100%; /* Full width */
        margin-right: 0;
        margin-bottom: 15px;
    }

    .product h3 {
        font-size: 1.5rem;
    }

    .product p {
        font-size: 0.9rem;
    }

    .product button {
        font-size: 0.9rem;
    }
}

/* Medium Mobile Phones (481px - 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    .product-container {
        flex-direction: column; /* Stack elements vertically */
        text-align: center;
    }

    .product-image-container {
        max-width: 80%; /* Smaller size for better layout */
        margin-right: 0;
        margin-bottom: 20px;
    }

    .product h3 {
        font-size: 1.6rem;
    }

    .product p {
        font-size: 1rem;
    }
}

/* Small Tablets (769px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .product-container {
        flex-wrap: wrap; /* Allow wrapping */
        justify-content: space-around; /* Centered alignment */
    }

    .product-image-container {
        max-width: 50%; /* Adjust size */
        margin-right: 10px;
    }
}

/* Small Laptops (1025px - 1366px) */
@media (min-width: 1025px) and (max-width: 1366px) {
    .product-container {
        padding: 15px;
    }

    .product h3 {
        font-size: 1.7rem;
    }

    .product p {
        font-size: 1.1rem;
    }
}

/* Large Laptops and Desktops (1367px and above) */
@media (min-width: 1367px) {
    .product img {
        width: 400px;
        height: 500px;
    }

    .product h3 {
        font-size: 1.8rem;
    }

    .product p {
        font-size: 1rem;
    }
}

/* Base styles (already provided above) */

/* Small Mobile Phones */
@media (max-width: 480px) {
    .product-container {
        padding: 10px;
    }

    .product-content {
        flex-direction: column; /* Stack image and description vertically */
        text-align: center;     /* Center align content for small screens */
    }

    .product-image-container {
        padding-right: 0;
    }

    .product-image {
        max-width: 100%;        /* Utilize full width */
    }

    .product-details {
        padding-left: 0;
    }

    .product-details h3,
    .product-details p,
    .product-price {
        font-size: 14px;       /* Smaller font sizes for readability */
    }

    .add-to-cart, .size-option, .confirm-size {
        padding: 8px 15px;
        font-size: 14px;
    }
}

/* Medium Mobile Phones */
@media (min-width: 481px) and (max-width: 767px) {
    .product-container {
        padding: 15px;
    }

    .product-content {
        flex-direction: column; /* Stack items vertically */
    }

    .product-image {
        max-width: 90%;        /* Slightly smaller image */
    }

    .product-details h3 {
        font-size: 18px;
    }

    .product-details p {
        font-size: 15px;
    }
}

/* Tablets */
@media (min-width: 768px) and (max-width: 1024px) {
    .product-content {
        flex-direction: row; /* Restore two-column layout */
    }

    .product-image {
        max-width: 90%;        /* Slightly reduce image size */
        max-height: 200%;
    }

    .product-details h3 {
        font-size: 20px;
    }

    .product-details p {
        font-size: 16px;
    }

    .add-to-cart, .size-option, .confirm-size {
        padding: 10px 20px;
        font-size: 16px;
    }
}

/* Laptops and Desktops */
@media (min-width: 1025px) and (max-width: 1440px) {
    .product-container {
        padding: 30px;
    }

    .product-content {
        flex-direction: row; /* Maintain side-by-side layout */
    }

    .product-image {
        max-width: 80%;        /* Adjust for larger screens */
    }

    .product-details h3 {
        font-size: 24px;
    }

    .product-details p {
        font-size: 18px;
    }
}

/* Extra Large Screens */
@media (min-width: 1441px) {
    .product-container {
        padding: 40px;
    }

    .product-content {
        max-width: 1400px;
    }

    .product-image {
        max-width: 50%;        /* Optimize for large screens */
    }

    .product-details h3 {
        font-size: 26px;
    }

    .product-details p {
        font-size: 20px;
    }
}


/* General Styling for all devices */
.dropdown-container, .dropdown-containers {
    margin: 20px 0;
    text-align: left; /* Centers the arrow */
    width: 100%;  /* Ensure the container takes up the full width */
}

.dropdown-button, .dropdown-buttons {
    background-color: transparent;
    color: #0B1D3A;  /* Red color for the arrow */
    font-size: 30px;  /* Larger arrow size */
    border: none;
    cursor: pointer;
    padding: 0;
    display: inline-block;
}

/* Styling for the dropdown description */
.dropdown-description, .dropdown-descriptions {
    display: none;  /* Hidden by default */
    color: #D4AF37;
    margin-top: 10px;
    padding: 10px;
    background-color: #0B1D3A;
    border: 1px solid #ddd;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

/* Show descriptions when toggled */
.dropdown-description.show, .dropdown-descriptions.show {
    display: block;
}

/* Image Styling for dropdowns */
.dropdown-image {
    width: 100%;  /* Ensure images are responsive */
    max-width: 150px;  /* Limit max width to 400px */
    height: auto;  /* Maintain aspect ratio */
    margin-bottom: 10px;
}

/* Responsive Adjustments */

/* Small Mobile Devices (Up to 320px width) */
@media only screen and (max-width: 320px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 24px; /* Smaller font size for small screens */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 12px; /* Smaller text size */
        color: #D4AF37;
        padding: 8px;  /* Reduce padding for small devices */
    }
}

/* Medium Mobile Devices (Up to 480px width) */
@media only screen and (max-width: 480px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 26px; /* Adjust font size for medium mobile screens */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 14px;  /* Adjust font size */
        padding: 10px;  /* Default padding */
    }
}

/* Large Mobile Devices (Up to 768px width) */
@media only screen and (max-width: 768px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 28px;  /* Slightly larger arrow for larger mobile devices */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 16px;  /* Adjust text size */
        padding: 12px;  /* Default padding */
    }
}

/* Small Tablets (Up to 1024px width) */
@media only screen and (max-width: 1024px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 30px; /* Larger font for tablets */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 18px; /* Larger text */
        padding: 15px;  /* Adequate padding for tablet screens */
    }
}

/* Medium Tablets (1024px - 1280px width) */
@media only screen and (min-width: 1025px) and (max-width: 1280px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 32px; /* Larger arrow */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 20px; /* Larger text for more space */
        padding: 20px;  /* Adequate padding */
    }
}

/* Large Tablets (1280px - 1440px width) */
@media only screen and (min-width: 1281px) and (max-width: 1440px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 34px; /* Slightly larger font for larger tablets */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 22px; /* Increase text size */
        padding: 22px;  /* Adjust padding */
    }
}

/* Small Laptops (1440px - 1600px width) */
@media only screen and (min-width: 1441px) and (max-width: 1600px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 36px; /* Larger arrow for laptops */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 24px; /* Increase text size */
        padding: 25px;  /* Adjust padding */
    }
}

/* Medium Laptops (1600px - 1800px width) */
@media only screen and (min-width: 1601px) and (max-width: 1800px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 38px; /* Larger arrow */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 26px; /* Larger text for more screen space */
        padding: 28px;  /* Adequate padding */
    }
}

/* Large Laptops (1800px - 2000px width) */
@media only screen and (min-width: 1801px) and (max-width: 2000px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 40px; /* Larger font for bigger screens */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 28px; /* Larger text size */
        padding: 30px;  /* Adequate padding */
    }
}

/* Extra Large Screens (2000px and above) */
@media only screen and (min-width: 2001px) {
    .dropdown-button, .dropdown-buttons {
        font-size: 42px; /* Extra large arrows for huge screens */
    }

    .dropdown-description, .dropdown-descriptions {
        font-size: 30px; /* Larger font for very wide screens */
        padding: 35px;  /* Adjust padding */
    }
}



/*CONTACT*/

        .mobile-menu {
            display: block;
        }

        @media (min-width: 768px) {
            .mobile-menu {
                display: none;
            }
        }

        /* Contact Form styles */
        .contact-form {
            max-width: 42rem;
            margin: 0 auto;
            padding: 3rem 2rem;
        }

        .form-title {
            font-family: 'Playfair Display', serif;
            font-size: 1.875rem;
            margin-bottom: 2rem;
        }

        .form-description {
            color: #4b5563;
            margin-bottom: 2rem;
        }

        .form-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1.5rem;
        }

        @media (min-width: 768px) {
            .form-grid {
                grid-template-columns: 1fr 1fr;
            }
        }

        .form-group {
            margin-bottom: 1.5rem;
        }

        label {
            display: block;
            font-size: 0.875rem;
            font-weight: 500;
            color: #374151;
            margin-bottom: 0.25rem;
        }

        input, select, textarea {
            width: 100%;
            padding: 0.5rem 1rem;
            border: 1px solid #d1d5db;
            outline: none;
        }

        input:focus, select:focus, textarea:focus {
    outline: 1px solid #6b7280; /* Gray border */
    box-shadow: 0 0 0 2px #d1d5db; /* Optional to add a subtle glow or emphasis */
}


        .phone-input {
            display: flex;
        }

        .phone-input select {
            width: auto;
        }

        button[type="submit"] {
            width: 100%;
            background-color: #D4AF37;
            color: white;
            padding: 0.75rem 1.5rem;
            border: solid;
            cursor: pointer;
            transition: background-color 0.2s;
        }

        button[type="submit"]:hover {
            background-color: #023e8a;
            border-color: #D4AF37;
        }

        /* Contact Info styles */
        .contact-info {
            background-color: #f9fafb;
            padding: 3rem 2rem;
        }

        .contact-info-content {
            max-width: 42rem;
            margin: 0 auto;
        }

        .info-section {
            margin-bottom: 2rem;
        }

        .info-title {
            font-weight: 500;
            margin-bottom: 0.5rem;
        }

        .info-text {
            color: #2F2F2F;
        }

        .contact-method {
            display: flex;
            align-items: center;
            gap: 1rem;
            margin-bottom: 1rem;
        }

        .icon {
            color: #D4AF37;
        }

        #cartItems div {
            border-bottom: 1px solid #ddd;
            padding: 10px 0;
        }
        #cartTotal {
            font-weight: bold;
            color: #333;
        }

        /* Target the bin icon inside the cart */
.remove-button i[data-lucide="trash-2"] {
    background-color: transparent; /* Remove the background */
    color: inherit; /* Use the current text color, which should match the background */
    font-size: 18px; /* Adjust size to make it smaller */
}

/* To make sure the bin icon is aligned well within the button */
.remove-button {
    background: none; /* Remove any background of the button */
    border: none; /* Remove border */
    padding: 15; /* Remove padding for better alignment */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/* Optional: If you want the button to look like an icon-only button */
.remove-button:hover i[data-lucide="trash-2"] {
    color: #000000; /* Example color change on hover */
}


        /* Footer styles */
        footer {
            background-color: #0B1D3A;
            color: F5F5DC;
            padding: 4rem 2rem;
            margin-top: auto;
        }

        .footer-content {
            max-width: 80rem;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr;
            gap: 3rem;
        }

        @media (min-width: 768px) {
            .footer-content {
                grid-template-columns: repeat(4, 1fr);
            }
        }

        .footer-section {
            margin-bottom: 2rem;
        }

        .footer-title {
            font-family: 'Playfair Display', serif;
            font-size: 1.25rem;
            margin-bottom: 1rem;
        }

        .footer-links {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .footer-links li {
            margin-bottom: 0.5rem;
        }

        .footer-links a {
            color: white;
            text-decoration: none;
            opacity: 0.9;
            transition: opacity 0.2s;
        }

        .footer-links a:hover {
            opacity: 0.7;
        }

        .newsletter-input {
            display: flex;
            border-bottom: 1px solid white;
            margin-bottom: 1rem;
        }

        .newsletter-input input {
            background: transparent;
            border: none;
            color: white;
            padding: 0.5rem 0;
            width: 100%;
        }

        .newsletter-input input::placeholder {
            color: F5F5DC(255, 0, 0, 0.6);
        }

        .newsletter-input button {
            background: transparent;
            border: none;
            color: white;
            padding: 0 1rem;
            cursor: pointer;
        }

/* FOOTER */

footer {
    background-color: #0B1D3A;
    color: #D4AF37;
    padding: 20px;
    text-align: center;
    font-size: 0.9rem;
}
footer p {
    margin: 0;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    /* Header */
    header.navbar {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px;
    }
    nav {
        flex-direction: column;
        gap: 10px;
    }

    /* Hero Section */
    .hero h2 {
        font-size: 2rem;
    }
    .hero p {
        font-size: 1rem;
    }
    .cta-button {
        font-size: 1rem;
        padding: 8px 20px;
    }

    /* Gallery and Products */
    .gallery {
        grid-template-columns: 1fr;
    }
    .gallery img {
        width: 100%;
        height: auto;
    }
    .products {
        grid-template-columns: 1fr;
    }
    .product {
        padding: 15px;
    }

    /* About Section */
    .about h2 {
        font-size: 2rem;
    }
    .about p {
        font-size: 1rem;
    }

    /* Contact Form */
    .contact form {
        grid-template-columns: 1fr;
    }

    /* Footer */
    footer .footer-content {
        grid-template-columns: 1fr;
    }
    footer .footer-links {
        margin-bottom: 1rem;
    }
}
  h3, h4 {
    text-align: center;
    font-weight: bold;
    text-decoration: underline;
}
p, ul, li {
    text-align: center;
}

.privacy-policy {
    padding: 20px;
}
ul {
    list-style-type: none;
    padding: 0;
}