*{
	margin:0;padding:0;box-sizing:border-box
}
:root{
	--charcoal: #2c2c2c;
	--dark-gray: #3a3a3a;
	--medium-gray: #5a5a5a;
	--light-gray: #e8e8e8;
	--off-white: #f5f5f5;
	--white: #ffffff;
	--gold: #c9a961;
	--gold-hover: #b89650;
	--spacing-xs: 8px;
	--spacing-sm: 16px;
	--spacing-md: 24px;
	--spacing-lg: 32px;
	--spacing-xl: 48px;
	--spacing-2xl: 64px;
	--spacing-3xl: 96px
	}
html{
	scroll-behavior:smooth
}
body{
	font-family: Playfair Display, serif;
	line-height:1.6;
	color:var(--charcoal);
	background-color:var(--white);
	overflow-x:hidden}
.container{
	max-width:1200px;
	margin:0 auto;
	padding:0 var(--spacing-md)
}

.navbar{
	position:fixed;
	top:0;
	width:100%;
	background-color:#fffffff2;
	-webkit-backdrop-filter:blur(10px);
	backdrop-filter:blur(10px);
	box-shadow:0 2px 8px #6245350d;
	z-index:1000;
	transition:all .3s ease;
}

.navbar.scrolled{
	box-shadow:0 2px 16px #6245351a;
}
.nav-container{
	max-width:1200px;
	margin:0 auto;
	padding:0 var(--spacing-md);
	display:flex;
	justify-content:space-between;
	align-items:center;
	height:72px;
}
.nav-logo{
	font-family:Playfair Display,serif;
	font-size:1.5rem;
	font-weight:700;
	color:var(--charcoal);
	text-decoration:none;
	transition:color .3s ease;
}
.nav-logo:hover{
	color:var(--gold);
}
.nav-menu{
	display:flex;
	list-style:none;
	align-items:center;
	gap:var(--spacing-lg);
}
.nav-link{
	color:var(--charcoal);
	text-decoration:none;
	font-weight:500;
	font-size:.95rem;
	transition:color .3s ease;
	position:relative;
}
.nav-link:hover{
	color:var(--gold);
}
.nav-link:after{
	content:"";
	position:absolute;
	bottom:-4px;
	left:0;
	width:0;
	height:2px;
	background-color:var(--gold);
	transition:width .3s ease;
}
.nav-link:hover:after{
	width:100%;
}
.nav-cta{
	background-color:var(--gold);
	color:var(--white);
	padding:var(--spacing-xs) var(--spacing-md);
	border-radius:4px;
	transition:background-color .3s ease;
}
.nav-cta:hover{
	background-color:var(--gold-hover);
}
.nav-cta:after{
	display:none;
}
.nav-toggle{
	display:none;
	flex-direction:column;
	background:none;
	border:none;
	cursor:pointer;
	padding:var(--spacing-xs);
}
.nav-toggle span{
	width:24px;
	height:2px;
	background-color:var(--charcoal);
	margin:3px 0;
	transition:all .3s ease;
}
.hero{
	position:relative;
	height:100vh;
	min-height:600px;
	display:flex;
	align-items:center;
	justify-content:center;
	background-size:cover;
	background-position:center;
	background-attachment:fixed;
}
.hero-overlay{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:linear-gradient(135deg,#2c2c2cd9,#3a3a3abf);
}
.hero-content{
	position:relative;
	z-index:1;
	text-align:center;
	color:var(--white);
	padding:var(--spacing-md);
	animation:fadeInUp 1s ease;
}
.hero-title{
	font-size:clamp(1.5rem,5vw,3rem);
	font-weight:600;
	margin-bottom:var(--spacing-sm);
	line-height:1.2;
}
.hero-name{
	display:block;
	font-size:clamp(2.5rem,7vw,5rem);
	font-weight:700;
	color:var(--gold);
	margin-top:var(--spacing-xs);
}
.hero-tagline{
	font-size:clamp(1.1rem,2.5vw,1.5rem);
	margin-bottom:var(--spacing-xl);
	font-weight:400;
	opacity:.95;
}
.hero-buttons{
	display:flex;
	gap:var(--spacing-md);
	justify-content:center;
	flex-wrap:wrap;
}
.btn{
	display:inline-block;
	padding:var(--spacing-sm) var(--spacing-lg);
	font-size:1rem;
	font-weight:600;
	text-decoration:none;
	border-radius:4px;
	transition:all .3s ease;
	cursor:pointer;
}
.btn-primary{
	background-color:var(--gold);
	color:var(--white);
	border:2px solid var(--gold);
}
.btn-primary:hover{
	background-color:var(--gold-hover);
	border-color:var(--gold-hover);
	transform:translateY(-2px);
	box-shadow:0 8px 16px #c9a9614d;
}
.btn-secondary{
	background-color: var(--white);
	color:#c9a961;
	border:2px solid var(--white);
}
.btn-secondary:hover{
	background-color:var(--white);
	color:var(--charcoal);
	transform:translateY(-2px);
}
section{
	padding:var(--spacing-3xl) 0;
}
.section-header{
	text-align:center;
	margin-bottom:var(--spacing-2xl);
}
.section-title{
	font-family:Playfair Display,serif;
	font-size:clamp(2rem,4vw,2.75rem);
	font-weight:700;
	color:var(--charcoal);
	margin-bottom:var(--spacing-sm);
}
.section-subtitle{
	font-size:1.125rem;
	color:var(--medium-gray);
	max-width:600px;
	margin:0 auto;
}

.services-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
	gap:var(--spacing-lg);
}
.service-card{
	background-color:var(--white);
	padding:var(--spacing-xl);
	border-radius:8px;
	text-align:center;
	transition:all .3s ease;
	box-shadow:0 2px 8px #6245350d;
}
.service-card:hover{
	transform:translateY(-8px);
	box-shadow:0 12px 24px #6245351a;
}
.service-icon{
	font-size:3rem;
	margin-bottom:var(--spacing-md);
}
.service-name{
	font-size:1.5rem;
	font-weight:600;
	color:var(--charcoal);
	margin-bottom:var(--spacing-xs);
}
.service-price{
	font-size:1.75rem;
	font-weight:700;
	color:var(--gold);
	margin-bottom:var(--spacing-sm);
}
.service-description{
	font-size:.95rem;
	color:var(--medium-gray);
	line-height:1.5;
}
.features-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
	gap:var(--spacing-xl);
}
.feature-card{
	text-align:center;
	padding:var(--spacing-md);
}
.feature-icon{
	font-size:3.5rem;
	margin-bottom:var(--spacing-md);
}
.feature-title{
	font-size:1.375rem;
	font-weight:600;
	color:var(--charcoal);
	margin-bottom:var(--spacing-sm);
}
.feature-description{
	font-size:1rem;
	color:var(--medium-gray);
	line-height:1.5;
}

.gallery-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
	gap:var(--spacing-md);
	padding-top: 70px;
	max-width: 1124px; 
	margin: 0 auto;
	}
.tiktok {
	padding-left: 40px;
	}
	
.txt {
	max-width: 90vw;
	}
.gallery-item{
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	aspect-ratio: 1;
	box-shadow: 0 4px 12px #6245351a;
}
.gallery-item img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .5s ease
}
.gallery-item:hover img{
transform:scale(1.1);
}
.contact-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:var(--spacing-xl);
}
.contact-info{
display:flex;
flex-direction:column;
gap:var(--spacing-md);
}
.info-card{
background-color:var(--off-white);
padding:var(--spacing-md);
border-radius:8px;
border-left:4px solid var(--gold);
}
.info-icon{
font-size:2rem;
margin-bottom:var(--spacing-xs);
}
.info-card h3{
font-size:1.125rem;
font-weight:600;
color:var(--charcoal);
margin-bottom:var(--spacing-xs);
}
.info-card p{
font-size:.95rem;
color:var(--medium-gray);
line-height:1.6;
}
.info-card a{
color:var(--gold);
text-decoration:none;
font-weight:500;
transition:color .3s ease;
}
.info-card a:hover{
color:var(--gold-hover);
text-decoration:underline;
}
.facebook-link{
display:inline-flex;
align-items:center;
gap:var(--spacing-xs);
}
.facebook-icon{
display:inline-block;
vertical-align:middle;
transition:transform .3s ease;
}
.facebook-link:hover .facebook-icon{
transform:scale(1.1);
}
.contact-map{
min-height:400px;
border-radius:8px;
overflow:hidden;
box-shadow:0 4px 12px #6245351a;
}
.footer{
background-color:var(--charcoal);
color:var(--white);
padding:var(--spacing-2xl) 0 var(--spacing-md);
}
.footer-content{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:var(--spacing-xl);
margin-bottom:var(--spacing-xl);
}
.footer-section h3,.footer-section h4{
margin-bottom:var(--spacing-sm);
color:var(--gold);
}
.footer-logo{
font-family:Playfair Display,serif;
font-size:1.5rem;
font-weight:700;
}
.footer-section p{
font-size:.9rem;
color:#624535;
line-height:1.8;
}
.footer-section a{
color:#624535;
text-decoration:none;
transition:color .3s ease;
}
.footer-section a:hover{
color:var(--gold);
}
.social-link{
display:inline-block;
margin-top:var(--spacing-xs);
}
.footer-bottom{
text-align:center;
padding-top:var(--spacing-md);
border-top:1px solid rgba(255,255,255,.1);
}
.footer-bottom p{
font-size:.875rem;
color:#624535;
}
@keyframes fadeInUp{
0%{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}

}
.fade-in{
opacity:0;
animation:fadeInUp .8s ease forwards
}
@media (max-width: 768px){
.nav-menu{
position:fixed;
left:-100%;
top:72px;
flex-direction:column;
background-color:var(--white);
width:100%;
text-align:center;
transition:left .3s ease;
box-shadow:0 8px 16px #6245351a;
padding:var(--spacing-md) 0;
gap:var(--spacing-md)
}
.nav-menu.active{
left:0
}
.nav-toggle{
display:flex
}
.nav-toggle.active span:nth-child(1){
transform:rotate(45deg) translate(5px,5px)
}
.nav-toggle.active span:nth-child(2){
opacity:0
}
.nav-toggle.active span:nth-child(3){
transform:rotate(-45deg) translate(7px,-6px)
}
.hero{
background-attachment:scroll
}
.hero-buttons{
flex-direction:column;
align-items:center
}
.btn{
width:100%;
max-width:300px
}

.services-grid,.features-grid,
.gallery-grid,.contact-grid{
grid-template-columns:1fr;
}
.footer-content{
grid-template-columns:1fr;
text-align:center;
}
section{
padding:var(--spacing-2xl) 0;
}

}
@media (min-width: 769px) and (max-width: 1024px){
.services-grid,.features-grid,
.gallery-grid{
grid-template-columns:repeat(2,1fr);
}

}



@media (max-width: 768px) {
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-sm);
  }
}

/*Background even-odd*/
section{
	background-color:var(--white);
}
section:nth-child(2n){
	background-color:var(--off-white);
}
/*BookSalon overlay fix*/
#booksalon-overlay-open-button{
	margin-bottom: 20px;
}