/*product.min.css*/


 
            /* instruments.php Specific Premium Light Styles */
            :root {
                --inst-bg-cream: #fbf9f6;
                --inst-bg-sand: #f4ede0;
                --inst-bg-white: #ffffff;
                --inst-text-dark: #2d241e;
                --inst-text-soft: #5c524f;
                --inst-gold: #c9a84c;
                --inst-clay: #b65a3f;
                --inst-border-soft: rgba(45, 36, 30, 0.08);
                --inst-border-gold: rgba(201, 168, 76, 0.25);
                --inst-shadow-soft: 0 15px 35px rgba(45, 36, 30, 0.04);
                --inst-shadow-hover: 0 25px 60px rgba(45, 36, 30, 0.1);
            }

            /* Intro Section */
            .inst-intro-section {
                background-color: var(--inst-bg-cream);
                padding: 130px 0 100px;
                text-align: center;
                position: relative;
                overflow: hidden;
            }

            .inst-subheading {
                display: inline-flex;
                align-items: center;
                gap: 12px;
                font-size: 10px;
                text-transform: uppercase;
                letter-spacing: 0.35em;
                color: var(--inst-clay);
                font-weight: 700;
                margin-bottom: 28px;
            }
            
            .inst-subheading::before, .inst-subheading::after {
                content: "";
                display: inline-block;
                width: 24px;
                height: 1px;
                background-color: var(--inst-clay);
            }

            .inst-heading {
                font-family: 'Cormorant Garamond', Georgia, serif;
                font-size: 58px;
                line-height: 1.15;
                color: var(--inst-text-dark);
                font-weight: 300;
                max-width: 850px;
                margin: 0 auto 35px;
            }

            .inst-desc {
                font-size: 17px;
                line-height: 1.85;
                color: var(--inst-text-soft);
                max-width: 650px;
                margin: 0 auto;
                font-weight: 300;
            }            /* Listing Section & Product Cards */
            .inst-listing-section {
                background-color: var(--inst-bg-cream);
                padding: 120px 0;
                position: relative;
            }

            .prod-card {
                display: flex;
                flex-direction: column;
                background-color: var(--inst-bg-white);
                border: 1px solid rgba(45, 36, 30, 0.05);
                position: relative;
                height: 100%;
                transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
                overflow: hidden;
                box-shadow: 0 10px 30px rgba(45, 36, 30, 0.03);
            }

            .prod-card:hover {
                transform: translateY(-8px);
                box-shadow: 0 30px 60px rgba(45, 36, 30, 0.08);
                border-color: rgba(201, 168, 76, 0.35);
            }

            .prod-card-img-wrap {
                position: relative;
                overflow: hidden;
                background-color: var(--inst-bg-sand);
            }
            
            .prod-card-img-wrap a{
                display: block;
            }

            /* Gold inner-border overlay that fades in on hover */
            .prod-card-img-wrap::after {
                content: "";
                position: absolute;
                top: 15px;
                left: 15px;
                right: 15px;
                bottom: 15px;
                border: 1px solid var(--inst-border-gold);
                opacity: 0;
                transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
                z-index: 2;
                pointer-events: none;
            }

            .prod-card:hover .prod-card-img-wrap::after {
                opacity: 1;
                top: 20px;
                left: 20px;
                right: 20px;
                bottom: 20px;
            }

            .prod-card-img {
                width: 100%;
                height: 350px; /* Fixed height for level grid */
                display: block;
                object-fit: cover;
                transition: transform 1.4s cubic-bezier(0.16, 1, 0.3, 1);
            }

            /* Clean luxury zoom on hover (no rotation) */
            .prod-card:hover .prod-card-img {
                transform: scale(1.04);
            }

            .prod-card-content {
    padding: 20px 15px 20px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}



            /* Editorial Category Label above Title */
            .prod-card-category {
                font-family: 'Plus Jakarta Sans', sans-serif;
                font-size: 10px;
                font-weight: 700;
                text-transform: uppercase;
                letter-spacing: 0.25em;
                color: var(--inst-clay);
                margin-bottom: 8px;
                display: none;
            }

            .prod-card-title {
                font-family: 'Cormorant Garamond', Georgia, serif;
                font-size: 24px;
                color: var(--inst-text-dark);
                margin-bottom: 18px;
                font-weight: 400;
                line-height: 1.25;
                transition: color 0.3s ease;
                letter-spacing: -0.01em;
            }

            .prod-card:hover .prod-card-title {
                color: var(--inst-clay);
            }

            /* Vertical specifications list with rows */
            .prod-specs-list {
                border-top: 1px solid rgba(45, 36, 30, 0.04);
                border-bottom: 1px solid rgba(45, 36, 30, 0.04);
                padding: 14px 0;
                margin-bottom: 22px;
                display: flex;
                flex-direction: column;
                gap: 6px;
            }

            .prod-spec-row {
                display: flex;
                justify-content: space-between;
                align-items: baseline;
                font-family: 'Plus Jakarta Sans', sans-serif;
            }

            .prod-spec-label {
                font-size: 8px;
                text-transform: uppercase;
                letter-spacing: 0.15em;
                color: #a49a95; /* softer label */
                font-weight: 700;
            }

            .prod-spec-value {
                font-size: 11px;
                color: var(--inst-text-soft);
                font-weight: 500;
                line-height: 1.3;
                text-align: right;
            }

            /* Boutique Serif Pricing Section */
            .prod-card-price-box {
                display: flex;
                align-items: baseline;
                gap: 10px;
                margin-bottom: 24px;
            }

            .prod-price-original {
                font-family: 'Plus Jakarta Sans', sans-serif;
                font-size: 12px;
                text-decoration: line-through;
                color: #a49a95;
                opacity: 0.7;
                font-weight: 400;
            }

            .prod-price-selling {
                font-family: 'Cormorant Garamond', Georgia, serif;
                font-size: 24px;
                font-weight: 600;
                font-style: italic;
                color: var(--inst-clay);
            }

            /* Action area with side-by-side responsive buttons */
            .prod-card-actions {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 10px;
                margin-top: auto;
                width: 100%;
            }

            .prod-btn-details,
            .prod-btn-whatsapp {
                flex: 1;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 6px;
                padding: 12px 6px;
                font-family: 'Plus Jakarta Sans', sans-serif;
                font-size: 9px;
                font-weight: 700;
                text-transform: uppercase;
                letter-spacing: 0.12em;
                text-decoration: none !important;
                border-radius: 0;
                white-space: nowrap;
                transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
            }

            /* View Details Button - Solid Dark */
            .prod-btn-details {
                background-color: var(--inst-text-dark);
                border: 1px solid var(--inst-text-dark);
                color: var(--inst-bg-white);
            }

            .prod-btn-details:hover {
                background-color: var(--inst-gold);
                border-color: var(--inst-gold);
                color: var(--inst-text-dark);
            }

            /* WhatsApp Button - Outline with Green Hover */
            .prod-btn-whatsapp {
                background-color: transparent;
                border: 1px solid rgba(45, 36, 30, 0.15);
                color: var(--inst-text-dark);
            }

            .prod-btn-whatsapp:hover {
                border-color: #25d366;
                background-color: rgba(37, 211, 102, 0.05);
                color: #128c7e;
            }

            .prod-btn-whatsapp i {
                font-size: 11px;
            }

            /* Responsive stacking for buttons on mobile/tablet */
            @media (max-width: 991px) {
                .prod-card-actions {
                    flex-direction: column;
                    gap: 8px;
                }
                .prod-btn-details,
                .prod-btn-whatsapp {
                    width: 100%;
                    padding: 14px 10px;
                    font-size: 10px;
                }
            } }

            /* FAQ Section */
            .

            .faq-container {
                max-width: 850px;
                margin: 70px auto 0;
            }

            /* Custom Premium Accordion Styling */
            .premium-faq-accordion .accordion-item {
                background-color: var(--inst-bg-white);
                border: 1px solid var(--inst-border-soft) !important;
                border-radius: 8px !important;
                margin-bottom: 18px;
                box-shadow: var(--inst-shadow-soft);
                overflow: hidden;
                transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
            }

            .premium-faq-accordion .accordion-item:hover {
                border-color: rgba(45, 36, 30, 0.15) !important;
                box-shadow: var(--inst-shadow-hover);
            }

            .premium-faq-accordion .accordion-button {
    background: none !important;
    border: none !important;
    padding: 10px 30px !important;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--inst-text-dark) !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    text-align: left;
    box-shadow: none !important;
    transition: color 0.4s ease, border-color 0.4s ease;
    border-bottom: 1px solid transparent !important;
    line-height: 1.8;
}

            .premium-faq-accordion .accordion-button:focus {
                box-shadow: none !important;
                border: none !important;
            }

            .premium-faq-accordion .accordion-button:not(.collapsed) {
                color: var(--inst-clay) !important;
                border-bottom-color: var(--inst-bg-sand) !important;
            }

            /* Premium Custom + and - icon details */
            .premium-faq-accordion .accordion-button::after {
                display: none !important; /* Hide native Bootstrap arrow */
            }

            .faq-icon-wrapper {
                position: relative;
                width: 32px;
                height: 32px;
                border: 1px solid var(--inst-border-gold);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                color: var(--inst-gold);
                background-color: transparent;
                transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
                flex-shrink: 0;
                margin-left: 20px;
            }

            .faq-icon-line {
                position: absolute;
                background-color: currentColor;
                transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
            }

            .faq-line-horizontal {
                width: 12px;
                height: 1px;
            }

            .faq-line-vertical {
                width: 1px;
                height: 12px;
            }

            /* Hover effects on the icon wrapper */
            .premium-faq-accordion .accordion-button:hover .faq-icon-wrapper {
                background-color: var(--inst-bg-sand);
                color: var(--inst-clay);
                border-color: var(--inst-clay);
            }

            /* Expanded states */
            .premium-faq-accordion .accordion-button:not(.collapsed) .faq-icon-wrapper {
                background-color: var(--inst-clay);
                border-color: var(--inst-clay);
                color: var(--inst-bg-white);
                transform: rotate(180deg);
            }

            .premium-faq-accordion .accordion-button:not(.collapsed) .faq-line-vertical {
                transform: rotate(90deg);
                opacity: 0;
            }

            .premium-faq-accordion .accordion-body {
                padding: 24px 30px 30px !important;
                color: var(--inst-text-soft) !important;
                font-size: 16px;
                line-height: 1.85;
                font-weight: 300;
                background-color: var(--inst-bg-white);
            }

            @media (max-width: 768px) {
                .inst-heading { font-size: 42px; }
                .inst-card-title { font-size: 26px; }
                .inst-card-content { padding: 35px 25px; }
                .premium-faq-accordion .accordion-button {
                    font-size: 20px;
                    padding: 20px 24px !important;
                }
                .premium-faq-accordion .accordion-body {
                    padding: 20px 24px 24px !important;
                }
            }

            /* Cinematic Dark "Why a Zenzula is Different" Section */
            .diff-section {
    background: radial-gradient(circle at 50% 50%, #331b0e 0%, #1C1613 100%);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(201, 168, 76, 0.1);
    border-bottom: 1px solid rgba(201, 168, 76, 0.1);
}

            .diff-card {
                background-color: rgba(255, 255, 255, 0.015);
                border: 1px solid rgba(255, 255, 255, 0.04);
                padding: 45px 30px;
                height: 100%;
                display: flex;
                flex-direction: column;
                position: relative;
                transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
            }

            .diff-card:hover {
                transform: translateY(-8px);
                background-color: rgba(255, 255, 255, 0.04);
                border-color: rgba(201, 168, 76, 0.25);
                box-shadow: 0 20px 45px rgba(201, 168, 76, 0.02);
            }

            .diff-icon-wrap {
                width: 60px;
                height: 60px;
                border: 1px solid rgba(201, 168, 76, 0.25);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                color: #c9a84c;
                font-size: 20px;
                margin-bottom: 28px;
                transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
                background-color: rgba(201, 168, 76, 0.02);
            }

            .diff-card:hover .diff-icon-wrap {
                background-color: #c9a84c;
                color: #1c1613;
                border-color: #c9a84c;
                transform: scale(1.05);
            }

            .diff-card-title {
                font-family: 'Cormorant Garamond', Georgia, serif;
                font-size: 22px;
                color: #ffffff;
                margin-bottom: 14px;
                font-weight: 400;
                line-height: 1.3;
            }

            .diff-card-text {
                font-family: 'Plus Jakarta Sans', sans-serif;
                font-size: 13px;
                line-height: 1.75;
                color: #C0B7B1;
                margin: 0;
            }

            @media (max-width: 991px) {
                .diff-section {
                    padding: 100px 0;
                }
                .diff-card {
                    padding: 35px 25px;
                }
            }
            
            .inst-faq-section {
                background-color: var(--inst-bg-cream);
                padding: 130px 0;
                position: relative;
            }

            /* Custom Audio Player Bar inside Product Cards */
            .prod-audio-player-bar {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 48px;
                background: rgba(28, 22, 19, 0.85);
                backdrop-filter: blur(10px);
                -webkit-backdrop-filter: blur(10px);
                z-index: 10;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 0 16px;
                transform: translateY(0);
                opacity: 1;
                border-top: 1px solid rgba(255, 255, 255, 0.08);
            }

            .prod-audio-toggle {
                background: none;
                border: none;
                color: #ffffff;
                cursor: pointer;
                width: 32px;
                height: 32px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.3s ease;
                padding: 0;
                outline: none;
            }

            .prod-audio-toggle:hover {
                background-color: rgba(255, 255, 255, 0.1);
                color: var(--inst-gold);
            }

            .prod-audio-toggle i {
                font-size: 12px;
            }

            .prod-audio-toggle .pause-icon {
                display: none;
            }

            .prod-card.playing .prod-audio-toggle .play-icon {
                display: none !important;
            }

            .prod-card.playing .prod-audio-toggle .pause-icon {
                display: block !important;
            }

            .prod-audio-status {
                display: flex;
                flex-direction: column;
                flex-grow: 1;
                margin-left: 12px;
                font-family: 'Plus Jakarta Sans', sans-serif;
                text-align: left;
            }

            .prod-audio-label {
                font-size: 9px;
                text-transform: uppercase;
                letter-spacing: 0.1em;
                color: #ffffff;
                font-weight: 700;
                line-height: 1.1;
            }

            .prod-audio-time {
                font-size: 9px;
                color: #a49a95;
                font-weight: 500;
                margin-top: 2px;
                line-height: 1.1;
            }

            /* Animated Equalizer Waveform */
            .prod-equalizer {
                display: flex;
                align-items: flex-end;
                gap: 2px;
                height: 14px;
                width: 30px;
                margin-left: 10px;
            }

            .eq-bar {
                width: 2px;
                height: 3px;
                background-color: var(--inst-gold);
                transition: height 0.2s ease;
            }

            .prod-card.playing .eq-bar {
                animation: bounce-eq 0.8s ease infinite alternate;
            }

            .prod-card.playing .eq-bar:nth-child(1) { animation-delay: 0.1s; }
            .prod-card.playing .eq-bar:nth-child(2) { animation-delay: 0.4s; }
            .prod-card.playing .eq-bar:nth-child(3) { animation-delay: 0.2s; }
            .prod-card.playing .eq-bar:nth-child(4) { animation-delay: 0.6s; }
            .prod-card.playing .eq-bar:nth-child(5) { animation-delay: 0.3s; }
            .prod-card.playing .eq-bar:nth-child(6) { animation-delay: 0.5s; }
            .prod-card.playing .eq-bar:nth-child(7) { animation-delay: 0.1s; }
            .prod-card.playing .eq-bar:nth-child(8) { animation-delay: 0.7s; }

            @keyframes bounce-eq {
                0% { height: 3px; }
                100% { height: 14px; }
            }

            /* Mobile styling - make audio player bar visible continuously */
            @media (max-width: 991px) {
                .prod-audio-player-bar {
                    transform: translateY(0);
                    opacity: 1;
                    background: rgba(28, 22, 19, 0.9);
                }
            }
            
            
            .breadcumb-section {
    position: relative; /* important */
   
    padding-top: 140px;
    padding-bottom: 140px;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
}

.breadcumb-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.5); /* black overlay (adjust opacity here) */
    
    z-index: -1; /* keeps it behind content */
}
.hero-heading {
    font-size: 64px;
    line-height: 1.2;
}