@font-face {
    font-family: "Playfair Display";
    src: url("https://fonts.gstatic.com/s/playfairdisplay/v30/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYh5fK.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Poppins";
    src: url("https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrJJLmr19VF9SI.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

:root {
    --maroon: #5d121c;
    /* Deeper maroon for a royal feel */
    --maroon-light: #7a1f28;
    --gold: #c5a028;
    /* Richer gold */
    --gold-light: #d4af37;
    --gold-soft: rgba(212, 175, 55, 0.15);
    --ivory: #fffdf5;
    /* Creamier ivory */
    --peach: #fce4dc;
    --deep: #1a0f0a;
    --text: #333333;
    --royal-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

html {
    scroll-behavior: smooth
}

body {
    font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif;
    color: var(--text);
    background-color: #fff
}

h1,
h2,
h3,
h4,
.display-1,
.display-2,
.display-3 {
    font-family: "Playfair Display", serif;
    color: var(--deep)
}

.navbar {
    background: linear-gradient(90deg, var(--ivory), #fff);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .06)
}

.navbar .navbar-brand {
    font-weight: 700;
    color: var(--maroon)
}

.brand-text {
    font-size: 24px;
    /* Mobile first */
}

@media (min-width: 992px) {
    .brand-text {
        font-size: 32px;
        /* Desktop */
    }
}

.navbar .nav-link {
    color: #4a4a4a;
    font-weight: 600;
    margin: 0 5px;
    position: relative;
    transition: var(--transition);
}

.navbar .nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: var(--maroon);
    transition: var(--transition);
}

.navbar .nav-link:hover {
    color: var(--maroon);
}

.navbar .nav-link:hover::after,
.navbar .nav-link.active::after {
    width: 100%;
}

.navbar .nav-link.active {
    color: var(--maroon);
}

.brand-border {
    border-top: 4px solid var(--gold)
}

.btn-gold {
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    color: #fff;
    border: none;
    padding: 12px 30px;
    font-weight: 600;
    transition: var(--transition);
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(197, 160, 40, 0.3);
}

.btn-gold:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(197, 160, 40, 0.5);
    color: #fff;
    filter: brightness(1.1);
}

.btn-maroon {
    background: linear-gradient(135deg, var(--maroon), var(--maroon-light));
    color: #fff;
    border: none;
    padding: 12px 30px;
    font-weight: 600;
    transition: var(--transition);
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(93, 18, 28, 0.3);
}

.btn-maroon:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(93, 18, 28, 0.5);
    color: #fff;
    filter: brightness(1.1);
}

.hero-carousel .carousel-item {
    height: 80vh;
    min-height: 520px
}

.hero-carousel .carousel-item img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.hero-overlay {
    position: absolute;
    inset: 0;
    /* background: linear-gradient(180deg, rgba(43, 26, 20, .35), rgba(122, 31, 40, .45)) */
}

.hero-caption {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff
}

.hero-caption h1 {
    color: #fff;
    text-shadow: 0 8px 30px rgba(0, 0, 0, .4)
}

.section {
    padding: 80px 0
}

.section-soft {
    background: linear-gradient(180deg, #fff, var(--ivory))
}

.section-title {
    margin-bottom: 24px
}

.subtitle {
    color: #6a6a6a
}

.service-card {
    transition: var(--transition);
    border-radius: 20px;
    border: 1px solid rgba(197, 160, 40, 0.1);
    background: #fff;
    overflow: hidden;
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--royal-shadow);
    border-color: var(--gold-light);
}

.service-img-top {
    width: 100%;
    height: 160px;
    object-fit: cover;
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
    transition: transform .5s ease, filter .5s ease
}

.service-card:hover .service-img-top {
    transform: scale(1.04);
    filter: brightness(.97)
}

.why-item {
    padding: 30px 20px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid rgba(197, 160, 40, 0.15);
    transition: var(--transition);
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.why-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--gold-soft), transparent);
    z-index: -1;
    opacity: 0;
    transition: var(--transition);
}

.why-item:hover {
    transform: translateY(-8px);
    box-shadow: var(--royal-shadow);
    border-color: var(--gold-light);
}

.why-item:hover::before {
    opacity: 1;
}

.icon-circle {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--gold-light), var(--gold));
    color: #fff;
    box-shadow: 0 10px 20px rgba(197, 160, 40, 0.2);
    border: 3px solid #fff;
    transition: var(--transition);
}

.why-item:hover .icon-circle {
    transform: rotateY(360deg);
}

.icon-circle i {
    font-size: 1.6rem
}

.why-title {
    font-family: "Playfair Display", serif;
    font-weight: 700;
    color: var(--deep);
    margin-top: 8px
}

.why-desc {
    color: #6a6a6a
}

/* Custom FAQ Accordion */
.accordion-item {
    border: none;
    margin-bottom: 15px;
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.accordion-button {
    font-weight: 600;
    color: var(--deep);
    background-color: #fff;
    padding: 20px;
    transition: var(--transition);
}

.accordion-button:not(.collapsed) {
    color: var(--maroon);
    background-color: var(--gold-soft);
    box-shadow: none;
}

.accordion-button:focus {
    box-shadow: none;
    border-color: var(--gold);
}

.accordion-body {
    background-color: #fff;
    padding: 20px;
    color: #555;
    line-height: 1.7;
}

.quote-section {
    background: linear-gradient(135deg, rgba(212, 175, 55, .12), rgba(122, 31, 40, .08));
    border-radius: 16px
}

.quote-img {
    border-radius: 16px;
    object-fit: cover;
    width: 100%;
    height: 100%
}

.testimonial-card {
    border: none;
    border-radius: 16px;
    box-shadow: 0 14px 28px rgba(0, 0, 0, .08)
}

.testimonial-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .12)
}

.footer {
    background: linear-gradient(135deg, var(--deep), #2c1a14);
    border-top: 5px solid var(--gold);
    color: #eee;
    padding-top: 80px;
    padding-bottom: 40px;
    position: relative;
    overflow: hidden;
}

.footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('https://www.transparenttextures.com/patterns/pinstripe-dark.png');
    opacity: 0.1;
    pointer-events: none;
}

.footer a {
    color: #ccc;
    text-decoration: none;
    transition: var(--transition);
}

.footer a:hover {
    color: var(--gold-light);
    padding-left: 5px;
}

.footer-title {
    font-size: 1.5rem;
    margin-bottom: 25px;
    position: relative;
    padding-bottom: 10px;
}

.footer-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 3px;
    background: var(--gold);
}

.social-icons a {
    width: 45px;
    height: 45px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(197, 160, 40, 0.3);
    color: var(--gold-light);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-right: 12px;
    transition: var(--transition);
}

.social-icons a:hover {
    background: var(--gold);
    color: #fff;
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(197, 160, 40, 0.4);
}

.social-icons i {
    color: #2b1a14
}

.gallery-grid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px
}

.gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: 12px
}

.gallery-item img {
    transition: transform .5s ease, filter .5s ease
}

.gallery-item:hover img {
    transform: scale(1.06);
    filter: brightness(.95)
}

.map-embed {
    border-radius: 12px;
    overflow: hidden
}

.form-control:focus {
    box-shadow: 0 0 0 .25rem rgba(212, 175, 55, .25);
    border-color: var(--gold)
}

.badge-plan {
    background: linear-gradient(135deg, var(--gold), #f3d067);
    color: #2b2b2b
}

.price {
    color: var(--maroon);
    font-weight: 700
}

.card.plan {
    border-radius: 16px;
    border: 1px solid rgba(212, 175, 55, .35);
    box-shadow: 0 12px 24px rgba(0, 0, 0, .06)
}

.sticky-whatsapp {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 1030
}

.navbar-shrink {
    padding-top: .25rem;
    padding-bottom: .25rem;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .08)
}

.image-card {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .08);
    transition: transform .3s, box-shadow .3s
}

.image-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .12)
}

.image-card img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    transition: transform .6s ease, filter .6s ease
}

.image-card:hover img {
    transform: scale(1.08);
    filter: brightness(.95)
}

.image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(43, 26, 20, .0), rgba(43, 26, 20, .55));
    opacity: 0;
    transition: opacity .4s
}

.image-card:hover .image-overlay {
    opacity: 1
}

.image-caption {
    position: absolute;
    left: 16px;
    bottom: 16px;
    color: #fff
}

.promo-banner {
    position: relative
}

.promo-banner .promo-img {
    width: 100%;
    height: 60vh;
    min-height: 420px;
    object-fit: cover;
    border-radius: 30px;
}

.promo-banner .promo-caption {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    text-align: center
}

.page-banner {
    position: relative
}

.page-banner .banner-img {
    width: 100%;
    height: 65vh;
    min-height: 150px;
    object-fit: cover
}

.banner-caption {
    position: absolute;
    left: 10%;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;
    text-align: left;
    max-width: 80%;
}

/* Venue Gallery Section */
.venue-gallery-section {
    padding: 80px 0;
    background-color: #fff;
}

.venue-card {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 24px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: var(--transition);
    height: 350px;
    cursor: pointer;
}

.venue-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.venue-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.venue-card:hover .venue-card-img {
    transform: scale(1.1);
}

.venue-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.7) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    transition: background 0.4s ease;
}

.venue-card:hover .venue-card-overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8) 100%);
}

.venue-card-title {
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    font-family: "Playfair Display", serif;
}

.venue-section-title {
    text-align: center;
    margin-bottom: 50px;
    position: relative;
}

.venue-section-title h2 {
    font-size: 2.5rem;
    color: var(--deep);
    margin-bottom: 15px;
}

.venue-section-title::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 2px;
    background-color: #333;
}

/* Occasion Section Styling */
.occasion-section {
    padding: 80px 0;
    background-color: #fff;
}

.occasion-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    gap: 30px;
    margin-top: 50px;
}

@media (max-width: 576px) {
    .occasion-grid {
        grid-template-columns: 1fr;
    }
}

.occasion-card {
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    height: 180px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    transition: var(--transition);
    position: relative;
    border: none;
}

.occasion-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

.occasion-content {
    flex: 1;
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 2;
}

.occasion-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--deep);
}

.occasion-subtitle {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 0;
}

.occasion-image-wrapper {
    width: 40%;
    position: relative;
    overflow: hidden;
}

.occasion-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    clip-path: ellipse(100% 100% at 100% 50%);
    transition: transform 0.6s ease;
}

.occasion-card:hover .occasion-img {
    transform: scale(1.1);
}

/* Specific Background Colors for Occasions */
.bg-wedding {
    background-color: #e8d0cc;
}

.bg-engagement {
    background-color: #e0f2f1;
}

.bg-corporate {
    background-color: #e3f2fd;
}

.bg-social {
    background-color: #f3e5f5;
}

.bg-religious {
    background-color: #fff9c4;
}

.bg-birthday {
    background-color: #ffe0b2;
}

/* Stats Bar Section */
.stats-section {
    position: relative;
    z-index: 10;
    margin-top: -50px;
    /* Overlap with hero slightly */
    padding-bottom: 40px;
}

.stats-container {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
    padding: 30px 20px;
    border-top: 4px solid var(--gold);
}

.stat-item {
    text-align: center;
    padding: 10px;
}

.stat-icon {
    font-size: 2.5rem;
    color: var(--maroon);
    margin-bottom: 15px;
    color: var(--gold);
}

.stat-number {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    color: var(--deep);
    color: var(--gold);
    font-family: "Playfair Display", serif;
}

.stat-label {
    display: block;
    font-size: 1rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}

@media (max-width: 768px) {
    .stats-section {
        margin-top: 20px;
    }
}

/* Contact Card New Section */
.contact-card-new {
    background-color: #f58634;
    /* Orange color from image */
    padding: 30px 20px;
    text-align: center;
    color: #fff;
    border-radius: 4px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}

.contact-card-new:hover {
    transform: translateY(-5px);
}

.contact-icon-wrapper {
    margin-bottom: 15px;
}

.contact-icon-new {
    font-size: 2.5rem;
    color: #fff;
}

.contact-info-new p {
    font-size: 1.1rem;
    font-weight: 500;
}

/* About Us New Section */
.btn-black {
    background-color: #000;
    color: #fff;
    padding: 12px 35px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

.btn-black:hover {
    background-color: #333;
    color: #fff;
}

.about-img-wrapper img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Services Gold Section Redesign */
.services-gold-section {
    padding: 0 !important;
    overflow: hidden;
}

.bg-gold-gradient {
    background: radial-gradient(ellipse at center, #ffd700 0%, #aa841c 100%);
    /* Fallback/Alternative sophisticated gold gradient */
    background: linear-gradient(135deg, #eebb5d 0%, #c4912b 40%, #eebb5d 80%, #c4912b 100%);
    position: relative;
    min-height: 500px;
}

.bg-gold-gradient::before {
    /* Optional: Overlay to soften */
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none;
}

.bg-gold-light {
    background: linear-gradient(135deg, #eebb5d 0%, #f3d067 100%);
    /* Matching the gold feel but lighter/different tone if needed, or consistent gold */
    background: radial-gradient(circle at center, #e6c87e 0%, #c4912b 100%);
}

.service-grid-card {
    background-color: rgba(255, 253, 245, 0.92);
    border-radius: 20px;
    padding: 30px;
    height: 100%;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.service-grid-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
}

/* Ensure text is readable on gold */
.service-text-content {
    position: relative;
    z-index: 2;
}

/* Photo Gallery New Section */
.gallery-photo-item {
    border-radius: 12px;
    overflow: hidden;
    height: 250px;
    position: relative;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.gallery-photo-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.gallery-photo-item:hover img {
    transform: scale(1.1);
}

/* Exquisite Cuisine Section */
.bg-sage {
    background-color: #e3edc8;
    /* Light sage green from reference */
}

.text-dark-green {
    color: #1a3c34;
    /* Dark greenish-black for heading */
}

.text-dark-green-soft {
    color: #2c4a42;
    /* Slightly softer dark green for text */
    font-size: 1.1rem;
    line-height: 1.8;
}

.btn-sage {
    background-color: #a8bd86;
    /* Darker sage for button */
    color: #fff;
    padding: 12px 30px;
    border-radius: 4px;
    /* Sharper corners like reference */
    font-weight: 700;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    border: none;
    text-decoration: none;
    /* Ensure link looks like button */
    display: inline-block;
    /* Ensure padding works */
}

.btn-sage:hover {
    background-color: #8da36d;
    color: #fff;
    transform: translateY(-2px);
}

.object-fit-cover {
    object-fit: cover;
}

/* Home Page Carousel */
.home-gallery-carousel .carousel-img-wrapper {
    height: 300px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.home-gallery-carousel .carousel-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.home-gallery-carousel .carousel-img-wrapper:hover img {
    transform: scale(1.05);
}

.home-gallery-carousel .carousel-control-prev,
.home-gallery-carousel .carousel-control-next {
    width: 5%;
    opacity: 1;
    /* Reset default opacity for better visibility of custom icon */
}

/* Custom positioning for controls if needed, usually default absolute is fine but let's ensure they are visible outside content if container permits, or inside. Container constrains them so we'll keep inside. */

@media (max-width: 768px) {
    .home-gallery-carousel .carousel-img-wrapper {
        height: 250px;
    }
}

/* Menu Redesign Items */

/* Utilities */
.bg-maroon {
    background-color: var(--maroon) !important;
}

.text-gold {
    color: var(--gold) !important;
}

.bg-gold-soft {
    background-color: var(--gold-soft) !important;
}

/* Dessert Table */
.dessert-table th {
    font-family: "Playfair Display", serif;
    color: var(--maroon);
    font-size: 1.1rem;
    border-bottom: 2px solid var(--gold-soft);
}

.dessert-table td {
    font-family: "Poppins", sans-serif;
    color: var(--deep);
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.dessert-table tr:last-child td {
    border-bottom: none;
}

.dessert-table tr:hover td {
    background-color: var(--ivory);
    transition: background-color 0.3s ease;
}

/* Menu Cards */
.menu-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid rgba(197, 160, 40, 0.15) !important;
    /* Subtle gold border */
}

.menu-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(93, 18, 28, 0.1) !important;
    /* Maroon shadow hint */
    border-color: var(--gold) !important;
}

.menu-title {
    font-family: "Playfair Display", serif;
    color: var(--maroon);
    font-weight: 700;
}

/* Menu Items List */
.icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: var(--ivory);
    border-radius: 50%;
    color: var(--maroon);
    font-size: 1.2rem;
    flex-shrink: 0;
    border: 1px solid var(--gold-soft);
}

.menu-item strong {
    color: var(--deep);
    font-weight: 600;
}

/* Pricing Section */
.price-large {
    font-family: "Playfair Display", serif;
    font-weight: 700;
    font-size: 2rem;
}

.price-secondary {
    font-family: "Playfair Display", serif;
    font-weight: 600;
}

.token-badge {
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}

/* Custom Tabs Styling */
.custom-tabs .nav-link {
    color: var(--maroon);
    background-color: var(--ivory);
    border: 1px solid var(--gold-soft);
    margin: 0 5px;
    border-radius: 50px;
    padding: 10px 25px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.custom-tabs .nav-link:hover {
    background-color: #fff8e1;
    /* Very light gold */
    transform: translateY(-2px);
    border-color: var(--gold);
}

.custom-tabs .nav-link.active {
    background-color: var(--maroon);
    color: #fff;
    border-color: var(--maroon);
    box-shadow: 0 4px 15px rgba(93, 18, 28, 0.3);
}

@media (max-width: 768px) {
    .custom-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 10px;
        justify-content: flex-start !important;
        /* Align left for scroll */
    }

    .custom-tabs .nav-link {
        white-space: nowrap;
        margin-bottom: 0;
    }
}