/* ----------------------------------------------------------------
	Custom CSS

	New Color Palette inspired by Salon Interior & Business Card:
	- Brass Gold: #bf9456 (Traditional Barber)
	- Deep Black: #1a1a1a (Lamps & Chairs)
	- Brick Red: #A64B2A (Interior Wall)
	- Slate Blue: #5D707F (Salon Doors)
	- Off-White: #F4F4F4 (Business Card)
-----------------------------------------------------------------*/

:root {
	--brand-gold: #bf9456;
	--brand-black: #1a1a1a;
	--brand-brick: #A64B2A;
	--brand-slate: #5D707F;
	--brand-white: #fdfdfd;
	/* WCAG AA Compliant Text Colors */
	--text-gold: #9B7743;
	/* 4.6:1 on white */
	--text-slate: #4D5D6A;
	/* 5.2:1 on white */
}




#testimonial h3,
#testimonial .testi-content p {
	color: #FFF !important;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

#testimonial .testi-meta {
	color: #bf9456 !important;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Accessibility & Contrast Fixes */
:focus {
	outline: 2px solid #bf9456 !important;
	outline-offset: 2px !important;
}

.subtitle {
	color: #555 !important;
	font-weight: 500;
}

/* Darker Gold for better contrast on light backgrounds (AA 4.5:1) */
.section:not(.dark) .color,
.section:not(.dark) a:not(.button),
#about p strong {
	color: #9B7743 !important;
}

/* Ensure headings in dark sections are actually light */
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6 {
	color: #FFF !important;
}

/* Skip link visibility */
.visually-hidden-focusable:focus {
	position: static !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	overflow: visible !important;
	clip: auto !important;
	white-space: normal !important;
	background: #bf9456;
	color: #FFF;
	padding: 10px 20px !important;
	z-index: 10000;
}


/* Responsive Fixes */
iframe {
	max-width: 100% !important;
}

html,
body {
	overflow-x: hidden;
	width: 100%;
	position: relative;
}

#wrapper {
	overflow-x: hidden;
	width: 100%;
}

/* Floating Social Buttons */
.floating-social-btns {
	position: fixed;
	bottom: 100px;
	right: 20px;
	z-index: 9999;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.social-btn {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50% !important;
	color: #FFF;
	font-size: 24px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	text-decoration: none !important;
}

.social-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
	color: #FFF;
}

/* Brand Specific Accents */
.bg-brand-white {
	background-color: var(--brand-white) !important;
}

.signature-img {
	mix-blend-mode: multiply;
	filter: contrast(1.1);
}


/* Unified Horizontal Bars */
.heading-block h2::after {
	content: '';
	display: block;
	width: 80px;
	height: 4px;
	background-color: var(--brand-brick) !important;
	margin: 15px auto 0;
	border: none !important;
}


#about h2,
#review-cta h2 {
	color: var(--brand-brick) !important;
}


#service .feature-box .fbox-content h3 {
	color: var(--text-slate) !important;
}


/* Text Highlights */
.feature-box .fbox-content p strong {
	color: var(--brand-brick) !important;
	font-weight: 600;
}


/* Subtle pattern for brand-white sections to mimic business card */
.brand-texture {
	background-color: var(--brand-white);
}


.price-name a {
	color: var(--brand-brick) !important;
}

.price-dots .separator-dots {
	border-bottom: 1px dashed var(--brand-slate) !important;
}

/* Section Breaks & Dividers */
.section-break-brick {
	border-top: 5px solid var(--brand-brick) !important;
}

.heading-block.center h2::after {
	width: 80px;
	height: 4px;
}


#about,
#service,
#price,
#contact {
	border-top: 1px solid rgba(166, 75, 42, 0.1);
}

#testimonial {
	border-top: 5px solid var(--brand-brick);
	border-bottom: 5px solid var(--brand-brick);
}


.social-btn.whatsapp {
	background-color: var(--brand-gold) !important;
	box-shadow: 0 6px 12px rgba(191, 148, 86, 0.4), 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.social-btn.whatsapp:hover {
	background-color: var(--brand-brick) !important;
	transform: translateY(-5px) scale(1.05);
	box-shadow: 0 10px 18px rgba(166, 75, 42, 0.5), 0 3px 8px rgba(0, 0, 0, 0.15) !important;
}





.social-btn.google {
	background-color: #4285F4;
}

.social-btn.google:hover {
	background-color: #3367D6;
}


/* ============================================= 
   Google Reviews Widget
   ============================================= */

#google-reviews {
	background-color: #fff;
	border-top: 5px solid var(--brand-brick);
}

#google-reviews .widget-header h3 {
	font-size: 28px;
	font-weight: 600;
	color: #1a1a1a;
	margin-bottom: 5px;
}

#google-reviews .widget-rating {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: #666;
}

#google-reviews .widget-rating .stars {
	color: #fbbc04;
	font-size: 18px;
	letter-spacing: 2px;
}

#google-reviews .share-review-btn {
	background-color: var(--brand-black);
	color: var(--brand-gold);
	border: none;
	padding: 16px 32px;
	border-radius: 30px;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	box-shadow: 0 4px 20px rgba(191, 148, 86, 0.5);
	transition: all 0.3s ease;
	animation: pulse-glow 2s ease-in-out infinite;
}

@keyframes pulse-glow {

	0%,
	100% {
		box-shadow: 0 4px 20px rgba(191, 148, 86, 0.5);
	}

	50% {
		box-shadow: 0 6px 30px rgba(191, 148, 86, 0.8);
	}
}

#google-reviews .share-review-btn:hover {
	background-color: var(--brand-gold);
	color: var(--brand-black);
	transform: translateY(-3px) scale(1.05);
	box-shadow: 0 8px 35px rgba(191, 148, 86, 0.6);
	animation: none;
}

#google-reviews .share-review-btn:active {
	background-color: #fff;
	color: var(--brand-black);
	transform: scale(0.98);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
	transition: all 0.1s ease;
}

.google-review-card {
	background: #fff;
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	height: 100%;
	display: flex;
	flex-direction: column;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

/* Hover effect only for devices with true hover (not touch) */
@media (hover: hover) {
	.google-review-card:hover {
		transform: translateY(-4px);
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	}
}

/* Active/touch press effect for all devices */
.google-review-card:active {
	transform: scale(0.98);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	transition: transform 0.1s ease, box-shadow 0.1s ease;
}

.google-review-card .card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
}

.google-review-card .reviewer {
	display: flex;
	align-items: center;
	gap: 12px;
}

.google-review-card .avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--brand-gold), var(--brand-brick));
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 600;
	font-size: 16px;
}

.google-review-card .reviewer-info .name {
	font-weight: 600;
	font-size: 14px;
	color: #1a1a1a;
}

.google-review-card .reviewer-info .date {
	font-size: 12px;
	color: #999;
}

.google-review-card .google-icon {
	width: 24px;
	height: 24px;
}

.google-review-card .card-stars {
	color: #fbbc04;
	font-size: 16px;
	letter-spacing: 1px;
	margin-bottom: 12px;
}

.google-review-card .card-text {
	font-size: 14px;
	line-height: 1.6;
	color: #444;
	flex-grow: 1;
}