/* ===== Body & Global Styles ===== */
body {
    background-color: #1d2025;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 0;
    color: #b7a96a;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
	text-transform:uppercase;
	 color: #b7a96a;
}

h2{
	font-size: 2.8em;
	font-weight: bold;
}

a{
	color:#b7a96a;
	text-decoration: none;
}

/* ===== Header Styles ===== */

#header-container{
	position: sticky;
    top: 0;
    z-index: 1000;
}

div#header-container{
	background-color: #342e35;
}

/* ===== Navbar Styles ===== */
.navbar {
    margin-bottom: 2rem;
}

/* Optional: make nav links a bit more spaced */
.site-title, .footer-text, .navbar-nav .nav-link {
    margin-left: 1rem;
	 color: #b7a96a;
}
.site-title{
	font-size:2em;
}

i{
font-size:1.6em;
}

/* ===== Footer Styles ===== */
footer {
    background-color: #342e35;
	 color: #b7a96a;
    padding: 2rem 0;
    text-align: center;
    font-size: 0.9rem;
    color: #666;
}

/* ===== Mobile Footer Stack ===== */
@media (max-width: 768px) {

    .site-footer .row {
        flex-direction: column;
        align-items: flex-start; /* left align everything */
        text-align: left;
    }

    .site-footer .col-md-6 {
        width: 100%;
        text-align: left !important;
    }

    .footer-link {
        display: block;          /* stack vertically */
        margin: 0.3rem 0;
    }
	
	.footer-link i {
    width: 18px;       /* aligns icons nicely */
}

    .footer-text {
        margin-bottom: 0.8rem;
    }
}

/* ===== Mobile Footer Alignment Fix ===== */
@media (max-width: 768px) {

    .site-footer .row {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .site-footer .col-md-6 {
        width: 100%;
        text-align: left !important;
    }
	
	.social-list{
		margin-left:32px
	}

    /* Each link becomes a flex row */
    .footer-link {
        display: flex;
        align-items: center;
        gap: 10px;              /* consistent spacing between icon and text */
        margin: 0.4rem 0;
    }

    /* Force all icons to occupy same width */
    .footer-link i {
        width: 20px;            /* KEY: aligns all text */
        text-align: center;
        flex-shrink: 0;
    }

    /* Align copyright with same left edge */
    .footer-text {
        margin-bottom: 0.8rem;
    }
}

/* ===== Gallery Masonry Layout ===== */
#gallery {
    column-count: 4;          /* number of columns for desktop */
    column-gap: 1rem;         /* spacing between columns */
    max-width: 1200px;        /* limit gallery width */
    margin: 0 auto;           /* center gallery horizontally */
}

.gallery-item {
    display: inline-block;    /* needed for CSS masonry */
    width: 100%;
    margin-bottom: 1rem;
    text-align: center;       /* center images inside item */
    transition: transform 0.3s ease;
}

.gallery-item img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;       /* rounded corners */
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Optional hover effect */
.gallery-item img:hover {
    transform: scale(1.03);
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

/* ===== Responsive Breakpoints ===== */
@media (max-width: 1200px) {
    #gallery {
        column-count: 3;
    }
}

@media (max-width: 768px) {
    #gallery {
        column-count: 2;
    }
}

@media (max-width: 576px) {
    #gallery {
        column-count: 1;
    }
}

/*===== Listing Styles =====*/
.title-copy-module{
	background-color: #342e35;
	padding: 32px;
    border-radius: 8px;
}

button#btnOriginal {
    background-color: #d94f4f;
    border: 0;
    color: #1d2025;
}
button#btnPrint {
    background-color: #4a90a4;
    border: 0;
    color: #1d2025;
}
button#btnOriginal:hover, button#btnPrint:hover{
	background-color: #b7a96a;
}
h4.price-original{
	color:#d94f4f;
}
h4.price-print{
	color:#4a90a4;
}	

img#mainArtwork {
    border: solid 16px #342e35;
}