/**
Theme Name: Vintage Frets Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vintage-frets-child
Template: astra
*/
/* Nav link hover */
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .menu-item > .menu-link:hover {
    color: #C8A96E;
}

.main-header-bar {
    background-color: #F5F0E8;
}



.vf-hero {
    display: flex;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    min-height: 100vh;
    margin: 0;
}

.vf-hero__image {
    flex: 0 0 50%;
    overflow: hidden;
}

.vf-hero__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.vf-hero__content {
    flex: 0 0 50%;
    background-color: #2C1A0E;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 4rem 3rem;
    position: relative;
    overflow: hidden;
}

/* Grain texture overlay */
.vf-hero__texture {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background-image: 
        repeating-linear-gradient(
            45deg,
            transparent,
            transparent 2px,
            rgba(0,0,0,0.03) 2px,
            rgba(0,0,0,0.03) 4px
        ),
        repeating-linear-gradient(
            -45deg,
            transparent,
            transparent 2px,
            rgba(255,255,255,0.015) 2px,
            rgba(255,255,255,0.015) 4px
        ),
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 8px,
            rgba(0,0,0,0.02) 8px,
            rgba(0,0,0,0.02) 9px
        );
    background-size: 8px 8px, 8px 8px, 100% 100%;
}

.vf-hero__rule {
    display: block;
    width: 60px;
    height: 1px;
    background-color: #C8A96E;
    margin-bottom: 0.4rem;
}

.vf-hero__ornament {
    display: block;
    color: #C8A96E;
    font-size: 1rem;
    margin-bottom: 1.2rem;
    letter-spacing: 0.3em;
}

.vf-hero__content h1 {
    font-family: 'Playfair Display', serif;
    font-size: 2.8rem;
    color: #F5F0E8;
    line-height: 1.2;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
}

.vf-hero__sub {
    font-family: 'Lora', serif;
    font-size: 1.1rem;
    color: #C8A96E;
    font-style: italic;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
}

.vf-hero__credentials {
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    color: #8B6E4E;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
}

.vf-hero__btn {
    display: inline-block;
    background-color: transparent;
    color: #C8A96E;
    padding: 0.8rem 1.8rem;
    font-family: 'Playfair Display', serif;
    font-size: 0.9rem;
    letter-spacing: 0.1em;
    text-decoration: none;
    text-transform: uppercase;
    border: 1px solid #C8A96E;
    align-self: flex-start;
    transition: all 0.3s ease;
    position: relative;
    z-index: 1;
    margin-top: 1.5rem;
}

.vf-hero__btn:hover {
    background-color: #C8A96E;
    color: #2C1A0E;
}

/* Featured Section */
.vf-featured {
    background-color: #F5F0E8;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    padding: 5rem 2rem;
    text-align: center;
    overflow: hidden;
}

.vf-featured__header {
    margin-bottom: 3rem;
}

.vf-featured__label {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #C8A96E;
    margin-bottom: 1rem;
}

.vf-featured__header h2 {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    color: #2C1A0E;
    margin-bottom: 1rem;
}

.vf-featured__rule {
    display: block;
    width: 60px;
    height: 1px;
    background-color: #C8A96E;
    margin: 0 auto;
}

.vf-swiper {
    width: 100%;
    padding: 2rem 0 4rem !important;
}

.swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.swiper-button-next,
.swiper-button-prev {
    color: #C8A96E !important;
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.swiper-pagination-bullet-active {
    background-color: #C8A96E !important;
}

.vf-guitar__img-wrap {
    transition: transform 0.4s ease, filter 0.4s ease;
    transform: rotate(-3deg);
    filter: drop-shadow(0 20px 40px rgba(0,0,0,0.25));
}

.vf-guitar__img-wrap img {
    max-height: 500px;
    width: auto;
    display: block;
}

.swiper-slide:hover .vf-guitar__img-wrap {
    transform: translateY(-24px) rotate(-1deg);
    filter: drop-shadow(0 40px 50px rgba(0,0,0,0.35));
}

.vf-guitar__info {
    margin-top: 2rem;
    text-align: center;
}

.vf-guitar__info h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.3rem;
    color: #2C1A0E;
    margin-bottom: 0.4rem;
}

.vf-guitar__price {
    display: block;
    font-family: 'Lora', serif;
    font-size: 1rem;
    color: #C8A96E;
    font-style: italic;
    margin-bottom: 0.8rem;
}

.vf-guitar__link {
    display: inline-block;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #C8A96E;
    text-decoration: none;
    border-bottom: 1px solid #C8A96E;
    padding-bottom: 2px;
    transition: color 0.3s ease, border-color 0.3s ease;
}

.vf-guitar__link:hover {
    color: #2C1A0E;
    border-bottom-color: #2C1A0E;
}

/* Arrows */
.vf-carousel__btn {
    background: none;
    border: 1px solid #C8A96E;
    color: #C8A96E;
    width: 48px;
    height: 48px;
    font-size: 1.2rem;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.vf-carousel__btn:hover {
    background-color: #C8A96E;
    color: #2C1A0E;
}

/* Dots */
.vf-carousel__dots {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 2rem;
}

.vf-carousel__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #D4C4A8;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.vf-carousel__dot.active {
    background-color: #C8A96E;
}

/* About Section */
.vf-about {
    background-color: #2C1A0E;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    overflow: hidden;
}

.vf-about h1 {
    font-family: 'Playfair Display', serif;
    font-size: 2.8rem;
    color: #F5F0E8;
    line-height: 1.2;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
}

.vf-about__image {
    flex: 0 0 50%;
    position: relative;
    align-self: stretch;
}

.vf-about__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 100%);
    mask-image: linear-gradient(to right, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 100%);
}

.vf-about__inner {
    flex: 0 0 50%;
    padding: 1rem 4rem 3rem 2rem;
    position: relative;
    z-index: 1;
}

.vf-about__logo {
    width: 450px;
    margin-bottom: 0.8rem;
    display: block;
    align-items: center;
}

.vf-about__label {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #C8A96E;
    margin-bottom: 1.5rem;
}

.vf-about__rule {
    display: block;
    width: 60px;
    height: 1px;
    background-color: #C8A96E;
    margin: 0 0 2.5rem;
}

.vf-about__body {
    font-family: 'Lora', serif;
    font-size: 1.1rem;
    color: #F5F0E8;
    line-height: 1.9;
    margin-bottom: 2rem;
    font-style: italic;
}

/* Why Vintage Section */
.vf-why {
    background-color: #2C1A0E;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    padding: 6rem 2rem;
    text-align: center;
}

.vf-why__inner {
    max-width: 1100px;
    margin: 0 auto;
}

.vf-why__label {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #C8A96E;
    margin-bottom: 1rem;
}

.vf-why__heading {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    color: #F5F0E8;
    margin-bottom: 1rem;
}

.vf-why__rule {
    display: block;
    width: 60px;
    height: 1px;
    background-color: #C8A96E;
    margin: 0 auto 4rem;
}

.vf-why__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.vf-why__item {
    padding: 2.5rem;
    border: 1px solid #C8A96E;
    position: relative;
}

.vf-why__item::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 2px;
    background-color: #2C1A0E;
}

.vf-why__icon {
    display: block;
    color: #C8A96E;
    font-size: 1.2rem;
    margin-bottom: 1.2rem;
    letter-spacing: 0.3em;
}

.vf-why__item h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.2rem;
    color: #F5F0E8;
    margin-bottom: 1rem;
}

.vf-why__item h3::after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    background-color: #C8A96E;
    margin: 0.8rem auto 0;
}

.vf-why__item p {
    font-family: 'Lora', serif;
    font-size: 0.95rem;
    color: #D4C4A8;
    line-height: 1.9;
    font-style: italic;
}

/* Browse by Category */
.vf-categories {
    background-color: #F5F0E8;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    padding: 5rem 4rem;
    text-align: center;
}

.vf-categories__inner {
    max-width: 1200px; /* or whatever your site's content width is */
    margin: 0 auto;
}

.vf-categories__label {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #C8A96E;
    margin-bottom: 1rem;
}

.vf-categories__heading {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    color: #2C1A0E;
    margin-bottom: 1rem;
}

.vf-categories__rule {
    display: block;
    width: 60px;
    height: 1px;
    background-color: #C8A96E;
    margin: 0 auto 3rem;
}

.vf-categories__grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 1.5rem;
}

.vf-category {
    position: relative;
    height: 280px;
    overflow: hidden;
    text-decoration: none;
    display: block;
    width: 100%;
}

.vf-category__img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.5s ease;
}

.vf-category:hover .vf-category__img {
    transform: scale(1.05);
}

.vf-category__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(44, 26, 14, 0.45);
    transition: background-color 0.3s ease;
}

.vf-category:hover .vf-category__overlay {
    background-color: rgba(44, 26, 14, 0.6);
}

.vf-category__content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.vf-category__content h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.4rem;
    color: #F5F0E8;
    margin-bottom: 0.5rem;
    letter-spacing: 0.05em;
}

.vf-category__link {
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #C8A96E;
    border-bottom: 1px solid #C8A96E;
    padding-bottom: 2px;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.vf-category:hover .vf-category__link {
    opacity: 1;
    transform: translateY(0);
}

/*Footer Styles*/

/* Footer background */
.site-footer,
.site-above-footer-wrap,
.site-below-footer-wrap {
    background-color: #2C1A0E;
}

/* Footer logo */
.vf-footer-logo {
    max-width: 400px;
    display: block;
    margin-bottom: 0.5rem;
}

/* Footer tagline */
.vf-footer-tagline {
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #C8A96E;
}

/* Footer text and links */
.site-footer,
.site-footer a,
.site-footer .ast-footer-copyright p,
.site-footer .ast-builder-html-element {
    color: #F5F0E8;
}

.site-footer a:hover {
    color: #C8A96E;
}

/* Social icons */
.site-footer .ast-social-element svg {
    fill: #F5F0E8;
    transition: fill 0.3s ease;
}

.site-footer .ast-social-element:hover svg {
    fill: #C8A96E;
}

/* Footer menu links */
.site-footer .footer-nav-menu .menu-link {
    font-family: 'Playfair Display', serif;
    color: #F5F0E8;
    letter-spacing: 0.1em;
}

.site-footer .footer-nav-menu .menu-link:hover {
    color: #C8A96E;
}

/* Row dividers */
.site-above-footer-wrap .ast-builder-grid-row,
.site-below-footer-wrap .ast-builder-grid-row {
    border-color: rgba(200, 169, 110, 0.2);
}

/*Shop Page Styles*/
/* Shop page background */
.woocommerce.archive .site-content,
.woocommerce.archive #primary {
    background-color: #2C1A0E;
}

/* Shop heading */
.woocommerce-products-header .page-title {
    font-family: 'Playfair Display', serif;
    color: #F5F0E8;
}

.vf-shop-header {
    text-align: center;
    padding: 3rem 0 2rem;
}

.vf-shop-header__label {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #C8A96E;
    margin-bottom: 1rem;
}

.vf-shop-header__heading {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    color: #F5F0E8;
    margin-bottom: 1rem;
}

.vf-shop-header__rule {
    display: block;
    width: 60px;
    height: 1px;
    background-color: #C8A96E;
    margin: 0 auto;
}

/* Hide breadcrumb too — doesn't fit the vibe */
.woocommerce-breadcrumb {
    display: none;
}

/* Breadcrumb */
.woocommerce-breadcrumb {
    color: #C8A96E;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
}

.woocommerce-breadcrumb a {
    color: #C8A96E;
}

/* Dark background behind the product grid */
.woocommerce ul.products {
    background-color: transparent;
    padding: 3rem 2rem;
    border-radius: 2px;
}

/* Hide category label */
.ast-woo-product-category,
.woocommerce ul.products li.product .ast-woo-product-category {
    display: none;
}

.woocommerce-result-count,
.woocommerce-ordering {
    display: none;
}

/* Product cards */
.woocommerce ul.products li.product {
    background-color: #F5F0E8;
    padding: 1.25rem;
    padding-bottom: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.woocommerce ul.products li.product:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}

/* Image hover zoom */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
    overflow: hidden;
}

.woocommerce ul.products li.product img {
    transition: transform 0.5s ease;
}

.woocommerce ul.products li.product:hover img {
    transform: scale(1.05);
}

/* Adjust text colors on card */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    padding-top: 0.75rem;
}

/* Product titles */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: 'Playfair Display', serif;
    color: #2C1A0E;
    font-size: 1.1rem;
}

/* Price */
.woocommerce ul.products li.product .price {
    font-family: 'Playfair Display', serif;
    color: #C8A96E;
    font-size: 1rem;
}

/* Add to cart button */
.woocommerce ul.products li.product .button {
    background-color: transparent;
    color: #2C1A0E;
    border: 1px solid #2C1A0E;
    font-family: 'Playfair Display', serif;
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    transition: all 0.3s ease;
    margin-top: 0.5rem;
}


.woocommerce ul.products li.product .button:hover {
    background-color: #2C1A0E;
    color: #F5F0E8;
}

/* Results count and sorting */
.woocommerce-result-count,
.woocommerce-ordering select {
    font-family: 'Playfair Display', serif;
    color: #2C1A0E;
    font-size: 0.85rem;
}

/*Single Product Page*/

/* Single product dark background */
.single-product .site-content,
.single-product #primary {
    background-color: #2C1A0E;
}

.single-product .posted_in {
    display: none;
}

/* Product image card treatment */
.single-product .woocommerce-product-gallery {
    background-color: #F5F0E8;
    padding: 1.25rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}

/* Hide magnifying glass */
.woocommerce-product-gallery__trigger {
    display: none;
}

/* Product title */
.single-product .product_title {
    font-family: 'Playfair Display', serif;
    color: #F5F0E8;
    font-size: 2rem;
}

/* Price */
.single-product .price {
    font-family: 'Playfair Display', serif;
    color: #C8A96E !important;
    font-size: 1.5rem;
}

/* Hide category and quantity */
.single-product .product_meta,
.single-product .quantity {
    display: none;
}

/* Add to cart button */
.single-product .single_add_to_cart_button {
    background-color: transparent;
    color: #F5F0E8;
    border: 1px solid #C8A96E;
    font-family: 'Playfair Display', serif;
    font-size: 0.85rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 0.75rem 2rem;
    transition: all 0.3s ease;
}

.single-product .single_add_to_cart_button:hover {
    background-color: #C8A96E;
    color: #2C1A0E;
}

/* Description tabs */
.single-product .woocommerce-tabs ul.tabs li a {
    font-family: 'Playfair Display', serif;
    color: #F5F0E8;
}

.single-product .woocommerce-tabs ul.tabs li.active a {
    color: #C8A96E;
}

.single-product .woocommerce-tabs ul.tabs {
    border-bottom-color: rgba(200, 169, 110, 0.3);
}

.single-product .woocommerce-tabs ul.tabs li {
    background: transparent;
    border: none;
}

.single-product .woocommerce-tabs .panel {
    color: #F5F0E8;
    font-family: 'Playfair Display', serif;
}

.woocommerce-tabs ul.tabs li a,
.woocommerce-tabs ul.tabs li.active a {
    color: #C8A96E !important;
}

/* Hide reviews tab for now */
.single-product .woocommerce-tabs ul.tabs li.reviews_tab {
    display: none !important;
}

.single-product .related.products h2 {
    font-family: 'Playfair Display', serif;
    color: #F5F0E8;
}

@media (max-width: 768px) {

    /* Hero - stack vertically */
    .vf-about {
        display: flex;
        flex-direction: column;
    }

    .vf-about__image {
        width: 100%;
        height: 300px;
    }

    .vf-about__inner {
        width: 100%;
        padding: 2rem 1.5rem;
    }

    .vf-about h1 {
        font-size: 1.8rem;
    }

    .vf-about__body {
        font-size: 0.9rem;
    }

    /* Featured guitars carousel - 1 slide */
    .vf-featured .swiper {
        padding: 0 1rem;
    }

    /* Why Buy Vintage - single column */
    .vf-why__grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .vf-why__heading {
        font-size: 1.8rem;
    }

    /* Categories - 2 columns then stack */
    .vf-categories__grid {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .vf-category {
        height: 200px;
    }

    .vf-categories__heading {
        font-size: 1.8rem;
    }

    .vf-categories {
        padding: 3rem 1.5rem;
    }
}

@media (max-width: 480px) {

    /* Categories - single column on small phones */
    .vf-categories__grid {
        grid-template-columns: 1fr;
    }

    .vf-category {
        height: 180px;
    }
}