
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;500;600;700&display=swap');

:root {
    --primary-black: #222;
    --secondary-black: #444;
    --primary-white: #fff;
    --secondary-white: #f8f8f8;
    --silver: #c0c0c0;
    --section-padding: 4rem 0;
    --header-font: 'Montserrat', sans-serif;
}

body {
    font-family: 'Arial', sans-serif;
    color: var(--primary-black);
    background: linear-gradient(135deg, #c0c0c0, #888888);
    position: relative;
}

/* Background Image */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('assets/bg_smoke23.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: grayscale(50%) opacity(0.8);
    z-index: -1;
    pointer-events: none;
}
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
    position: relative;
    z-index: 1;
}

/* Hero Section */

/* Homepage Image */
.hero {
    height: 75vh;
    background-image: url('assets/logo-sec143.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    isolation: isolate;
    border-bottom: 1px solid black;
    transition: filter 0.3s ease;
    box-shadow: 0 10px 60px rgba(0, 0, 0, 0.70);
}



.hero:hover {

    filter: brightness(1.1);
}


.hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    color: var(--primary-white);
    padding: 0 1rem;
}
.hero-title {
    font-family: Arial, sans-serif;
    font-size: clamp(2.1rem, 4.5vw, 3.3rem);
    font-weight: 600;
    letter-spacing: 1px;
    margin-top: 3rem;
    margin-bottom: 1rem;
    text-align: center;
    padding-top: .8rem;
    position: relative;
    background: linear-gradient(90deg, #c0c0c0, #868686);
    -webkit-background-clip: text;
    background-clip: text;
    color: rgb(211, 211, 211);
    animation: heroColorShift 3s ease infinite;
    background-size: 200% auto;
    transition: transform 0.8s ease, text-shadow 0.4s ease;
    transform-style: preserve-3d;
}

.hero-title:hover {
    transform: perspective(500px) rotateX(5deg) translateY(-5px);
    text-shadow: 4px 4px 8px rgba(182, 168, 168, 0.5);
}

/* First letter cursive styling */
.hero-title::first-letter {
    font-family: 'Dancing Script', 'Brush Script MT', cursive;
    font-size: 1.3em;
}

/* 2px underline for "xecutive Meals" */
.underline-2px {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

/* Black underline only under "xecutive Meals" - animated single line */
.underline-text {
    text-decoration: none;
    position: relative;
}

.underline-text::after {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, #c0c0c0, #888888);
    transform: scaleX(1);
    transform-origin: left;
    animation: underlineGradient 3s ease infinite;
    background-size: 200% auto;
}

@keyframes underlineGradient {
    0% { 
        background-position: 0% center;
        background: linear-gradient(90deg, #c0c0c0, #888888);
    }
    25% {
        background: linear-gradient(90deg, #888888, #c0c0c0);
    }
    50% {
        background-position: 100% center;
        background: linear-gradient(90deg, #a0a0a0, #686868);
    }
    75% {
        background: linear-gradient(90deg, #686868, #a0a0a0);
    }
    100% { 
        background-position: 0% center;
        background: linear-gradient(90deg, #c0c0c0, #888888);
    }
}


.chef-name-fancy-large_hero {
    font-family: 'Dancing Script', 'Brush Script MT', cursive;
    font-weight: 600;
    font-size: 3.7rem;
    color: #c0c0c0;
    letter-spacing: 1px;
    text-shadow: 3px 3px 6px rgba(0,0,0,0.5), -1px -1px 2px rgba(255,255,255,0.1);
    -webkit-text-stroke: 1px black;
}

/* Federal Background Image Styles */
.federal-bg-image {
/*border-radius: 30rem;*/
border: 2px solid #8b8b8b;
position: absolute;
top: 2%;
left: 0;
width: 100%;
height: calc(100% - 40px);
background-image: url('assets/federal23.jpg');
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
z-index: -1; /* Behind text but in front of smoke background */
object-fit: cover;
object-position: top;
filter: blur(2px);
opacity: 0.9;
/*clip-path: inset(25px 0 25px 0); /* Crop 25px from top only, responsive */
overflow: hidden; /* Ensure content respects border-radius */
}

/* Federal Image Container Styles */
.federal-image-container {
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.federal-image {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}



/* Gallery Image Classes */
.gallery-item-waffle {
    background-image: url('assets/waffle23.jpg');
}

.gallery-item-sushi {
    background-image: url('assets/sushi23.jpg');
}

.gallery-item-bread {
    background-image: url('assets/bread23.jpg');
}

.gallery-item-mexican {
    background-image: url('assets/mexican_platter23.jpg');
}

.gallery-item-soup {
    background-image: url('assets/rice_bowl23.webp');
}

.gallery-item-pasta {
    background-image: url('assets/pasta23.jpg');
}

.gallery-item-the_man {
    background-image: url('assets/the_man.jpg');
}

.gallery-item-flyer1 {
    background-image: url('assets/flyer13.jpg');
}

.gallery-item-flyer2 {
    background-image: url('assets/flyer23.jpg');
}

.gallery-item-flyer3 {
    background-image: url('assets/flyer33.jpg');
}

.gallery-item-many_dishes {
    background-image: url('assets/many_dishes.webp');
}
.gallery-item-tacos {
    background-image: url('assets/tacos.webp');
}
.gallery-item-sushi2 {
    background-image: url('assets/sushi2.webp');
}

.gallery-item-asian_platter {
    background-image: url('assets/asian_platter.jpg');
}

.gallery-item-bc {
    background-image: url('assets/BC3.webp');
}
.gallery-item-grilled_cheese {
    background-image: url('assets/grilled_cheese.webp');
}




/* Events Subtitle */
.events-subtitle {
    font-family: var(--header-font);
    font-size: clamp(1.6rem, 3vw, 2.5rem);
    font-weight: 700;
    letter-spacing: 1px;
    text-shadow: 2px 2px 4px rgba(182, 168, 168, 0.3);
    margin-bottom: 2rem;
    text-align: center;
    margin-top: 3rem;
    position: relative;
    animation: subtitleColorShift 2s ease infinite;
}

/* Events subtitle decorative line - engulfing the text */
.events-subtitle.decorative-line::before {
    content: '';
    position: absolute;
    padding-top: 11rem;
    left: 50%;
    width: 100vw;
    height: 60px;
    /* Events - Top thin decorative line - 1px */
    background: 

        /* Events - Middle gradient band - 3px */
        linear-gradient(to right, 
            #c0c0c0 0%, 
            #888888 25%, 
            #c0c0c0 50%, 
            #888888 75%, 
            #c0c0c0 100%
        ) 0 50% / 100% 3px no-repeat,
        /* Events - Bottom thin decorative line - 1px */
        linear-gradient(to right, 

        ) 0 95% / 100% 1px no-repeat;
    animation: shimmer 3s ease-in-out infinite;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
    pointer-events: none;
    z-index: 1;
    /* Position to engulf the text vertically */
    top: 40%;
    transform: translate(-50%, -50%);
}

/* Event Image Classes */
.event-image-sober {
    background-image: url('assets/sober23.png');
}

.event-image-wedding {
    background-image: url('assets/wedding23.jpg');
}

.event-image-crisis {
    background-image: url('assets/crisis23.jpg');
}

.event-image-gala {
    background-image: url('assets/gala23.jpg');
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Parent text-flow class - all text elements inherit from this */
.text-flow .section-title,
.text-flow .hero-title,
.text-flow .hero-subtitle,
.text-flow .chef-name-fancy-large_hero,
.text-flow .chef-name-fancy-large_contact,
.text-flow .contact-info,
.text-flow .important-text,
.text-flow .important-text-2,
.text-flow .bio-text,
.text-flow .bio-heading,
.text-flow .chef-title-fancy,
.text-flow .chef-name-initial,
.text-flow .mission-text,
.text-flow .phone-number,
.text-flow .chef-name-fancy-large,
.text-flow .event-item h3 {
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow-x: hidden;
    max-width: 100%;
}



@keyframes gradientShift {
    0% { 
        background-position: 0% center;
        background: linear-gradient(90deg, #c0c0c0, #888888);
    }
    25% {
        background: linear-gradient(90deg, #888888, #c0c0c0);
    }
    50% {
        background-position: 100% center;
        background: linear-gradient(90deg, #a0a0a0, #686868);
    }
    75% {
        background: linear-gradient(90deg, #686868, #a0a0a0);
    }
    100% { 
        background-position: 0% center;
        background: linear-gradient(90deg, #c0c0c0, #888888);
    }
}

@keyframes subtitleColorShift {
    0% {
        color: #3b3b3b;
    }
    33% {
        color: #888888;
    }
    66% {
        color: #3d3d3d;
    }
    100% {
        color: #727272;
    }
}

@keyframes heroColorShift {
    0% {
        color: #c0c0c0;
    }
    33% {
        color: #e6e6e6;
    }
    66% {
        color: #c1bebe;
    }
    100% {
        color: #c0c0c0;
    }
}

/* Sections */

.section {
padding: var(--section-padding);
position: relative;
}




.section-title {
    font-family: var(--header-font);
    font-size: calc(1.5rem + 6pt);
    font-weight: 900;
    color: var(--primary-black);
    margin-bottom: 2rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
    position: relative;
    display: inline-block;
}

/* Gallery Section Title - Move down 35px */
.gallery-section .section-title {
    margin-top: 6rem;
}



/* Mobile: decorative line ABOVE Gallery Title - .decorative-line class applied to h2.section-title */
@media (max-width: 767px) {
    .decorative-line::before {
        content: '';
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 100vw;
        height: 40px;
        /* Gallery mobile: gradient styling */
        background: 
            /* Gallery - Top thin decorative line - 1px */
            linear-gradient(to right, 
                transparent 0%, 
                #c0c0c0 5%, 
                #888888 20%, 
                #c0c0c0 35%, 
                transparent 50%, 
                transparent 50%, 
                #c0c0c0 55%, 
                #888888 70%, 
                #c0c0c0 80%, 
                transparent 95%, 
                transparent 100%
            ) 0 -20px / 100% 1px no-repeat,
            /* Gallery - Middle gradient band - 3px */
            linear-gradient(to right, 
                #c0c0c0 0%, 
                #888888 25%, 
                #c0c0c0 50%, 
                #888888 75%, 
                #c0c0c0 100%
            ) 0 30% / 100% 3px no-repeat,
            /* Gallery - Bottom thin decorative line - 1px */
            linear-gradient(to right, 
            
                transparent 50%, 
                #c0c0c0 55%, 
                #888888 70%, 
                #c0c0c0 80%, 
                transparent 95%, 
                transparent 100%
            ) 0 80% / 100% 1px no-repeat;
        animation: shimmer-mobile 1.5s ease-in-out infinite;
        filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
        pointer-events: none;
        z-index: 1;
        /* Position above the title */
        bottom: 100%;
        margin-bottom: -25px;
    }
}

/* Gallery Section Decorative Gradient */
.section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #c0c0c0, #888888);
    transform: scaleX(1);
    transform-origin: left;
    animation: underlineGradient 3s ease infinite;
    background-size: 200% auto;
}
@keyframes underlineGradient {
    0% { 
        background-position: 0% center;
        background: linear-gradient(90deg, #c0c0c0, #888888);
    }
    25% {
        background: linear-gradient(90deg, #888888, #c0c0c0);
    }
    50% {
        background-position: 100% center;
        background: linear-gradient(90deg, #a0a0a0, #686868);
    }
    75% {
        background: linear-gradient(90deg, #686868, #a0a0a0);
    }
    100% { 
        background-position: 0% center;
        background: linear-gradient(90deg, #c0c0c0, #888888);
    }
}
/* Two Column Layout */
.two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

.column {
    padding: 1rem;
}

/* Gallery Section Grid */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.gallery-item {
    aspect-ratio: 1;
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    transition: transform 0.6s ease;
}

.gallery-item:hover {
    transform: scale(1.12);
    filter: brightness(1.1);
}



/* Events Section */
.events-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.event-item {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.event-image {
    aspect-ratio: 1;
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.event-image:hover {
    transform: scale(1.03);
    filter: brightness(1.1);
}
.event-item h3 {
    font-family: var(--header-font);
    font-size: 1.4rem;
    font-weight: 700;
    text-align: center;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 0.5rem;
    position: relative;
    display: inline-block;
    padding-bottom: 5px;
}

.event-item h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: px;
    background: linear-gradient(90deg, #c0c0c0, #888888);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
    animation: underlineGradient 3s ease infinite;
    background-size: 200% auto;
}

.event-item:hover h3::after {
    transform: scaleX(1);
    animation: underlineGradient 3s ease infinite;
}
/* Video Section Styles */
.video-container {
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    background: #000;
    margin-bottom: 2rem;
}

.responsive-video {
    width: 100%;
    height: auto;
    display: block;
    background: #000;
}

.centered-title {
    text-align: center;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

/* Video Section Text Container */
.video-text-container {
    max-width: 100%;
    margin: 0 auto;
    margin-top: 2rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.35);
    border-radius: 15px;
    padding: 2.5rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.video-text-container h2.section-title {
    text-align: center;
    margin-bottom: 2rem;
    margin-left: 0;
}



.video-text-container .contact-info:last-child {
    margin-bottom: 0;
}

/* About Section*/
.about-section .contact-info {
    text-align: center;
    margin: 0 auto 1.5rem auto;
    line-height: 1.8;
    max-width: 800px;
 
  
    font-size: .3rem;
    font-weight: 600;

}

/* Biography*/
.bio-heading {
    font-size: 1.5rem;
    text-decoration: underline;
    text-decoration-color: #000000;
    text-underline-offset: 8px;
}



/* Contact Section */
.contact-section .contact-info {
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.8;
    background: rgba(255, 255, 255, 0.20);
    border-radius: 15px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    padding: 1.5rem;
    margin-bottom: 1rem;
}

.bio-text {
    font-size: 1.3rem;
    font-weight: 600;
   /* background: rgba(255, 255, 255, 0.20);*/
    border-radius: 15px;
    box-shadow: 160px 70px 70px rgba(0, 0, 0, 0.09);
    padding: 1.5rem;
    margin-bottom: -1rem;
    text-align: center;
    line-height: 2.5;
}

.bio-div{
    padding-top: 0;
    position: relative;
    
}

/* Full-width decorative line under chef image - bio section */
.bio-div::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 40px;
    background: 
        /* Bio - Top thin decorative line */
        linear-gradient(to right, 
            transparent 0%, 
            #c0c0c0 5%, 
            #888888 20%, 
            #c0c0c0 35%, 
            transparent 50%, 
            transparent 50%, 
            #c0c0c0 55%, 
            #888888 70%, 
            #c0c0c0 80%, 
            transparent 95%, 
            transparent 100%
        ) 0 0 / 100% 4px no-repeat,
        /* Bio - Middle gradient band */
        linear-gradient(to right, 
            #c0c0c0 0%, 
            #888888 25%, 
            #c0c0c0 50%, 
            #888888 75%, 
            #c0c0c0 100%
        ) 0 50% / 100% 8px no-repeat,
        /* Bio - Bottom thin decorative line */
        linear-gradient(to right, 
            transparent 0%, 
            #c0c0c0 5%, 
            #888888 20%, 
            #c0c0c0 35%, 
            transparent 50%, 
            transparent 50%, 
            #c0c0c0 55%, 
            #888888 70%, 
            #c0c0c0 80%, 
            transparent 95%, 
            transparent 100%
        ) 0 100% / 100% 4px no-repeat;
    margin-top: 20rem;
    animation: shimmer 3s ease-in-out infinite;
    background-size: 100% 100%;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
    pointer-events: none;
}

@keyframes shimmer {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Mobile: 50% faster shimmer animation */
@keyframes shimmer-mobile {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}


/* Bio image */
.chef-image {
    width: 330px;
    height: auto;
    float: right;
    /* margin: 25px 0 10px 10px;*/
    padding-right: 1rem;
    padding-bottom: 0rem;
    position: relative;
    margin-top: -40px;
    margin-bottom: -.5rem;
    border-radius: 4px;
    transition: filter 0.3s ease;
    z-index: 10;
}

.chef-image:hover {
    filter: brightness(1.1);
}



/* Fancy cursive font for Chef Anthony */


/* Fancy cursive font for Chef Anthony */
.chef-title-fancy {
    font-family: 'Dancing Script', 'Brush Script MT', cursive;
    font-weight: 700;
    font-size: 2.8rem;
    color: #c0c0c0;
    letter-spacing: 1px;
    text-shadow: 3px 3px 6px rgba(0,0,0,0.5), -1px -1px 2px rgba(255,255,255,0.1);
    -webkit-text-stroke: 1px black;
    white-space: nowrap;
}

/* Special styling for the letter "A" in Anthony */
.chef-name-initial {    font-family: 'Dancing Script', 'Brush Script MT', cursive;
    font-weight: 600;
    font-size: 4.3rem;
    color: #c0c0c0;
    letter-spacing: 1px;
    text-shadow: 3px 3px 6px rgba(0,0,0,0.5), -1px -1px 2px rgba(255,255,255,0.1);
    -webkit-text-stroke: 1px black;
}

/* Chef Anthony name styling for contact section */

.chef-name-fancy-large_contact {
    font-family: 'Dancing Script', 'Brush Script MT', cursive;
    font-weight: 600;
    font-size: 2.9rem;
    color: #3c4b83;
    letter-spacing: 1px;
    line-height: 3.1rem;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.1);

}

.mission-text p {
    /* Fluid typography with min/max bounds - better readability and accessibility */
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    /* Unitless line-height for consistent relative sizing */
    line-height: 1.6;
    /* Remove default paragraph margin and control spacing via custom margin */
    margin-top: 0;
    margin-bottom: 0.3em;
}

/* Second paragraph has tighter spacing via negative margin */
.mission-text-tight {
    margin-top: -0.8em;
    margin-bottom: 0;
}

.mission-text {
    font-size: clamp(1.2rem, 2.5vw, 2.2rem);
    font-weight: 550;
    text-align: center;
    line-height: 1.8;
    background: rgba(255, 255, 255, 0.45);
    border-radius: 15px;
    padding: 2rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin: 2rem auto;
    max-width: 800px;
}

/* Tighter spacing for second paragraph in mission text */
.mission-text-tight {
    margin-top: -25px;
}

.important-text {
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 1.8;
    text-align: center;
    text-overflow: unset;
    color: rgb(130, 3, 28);
}

.important-text-2 {
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.8;
    color: rgb(130, 3, 28);
}

.icon-large {
font-size: 1.6em;
border-radius: 50%;
}

.phone-number {
    font-size: 2.067rem;
}
/* Responsive Adjustments */
@media (max-width: 768px) {
    .two-column {
        grid-template-columns: 1fr;
    }

    .gallery-grid,
    .events-grid {
    grid-template-columns: 1fr 1fr;
    }
    
    .hero {
    height: 50vh;
    }
    
    /* Mobile: remove fixed width override, inherit from main rule */
    .bio-div::after {
        width: 100%;
        left: 50%;
        transform: translateX(-50%);
    }

    /* Mobile: shift background image 25% to the right */
    body::before {
        background-position: 30% top;
        padding-left: 150%;
        margin-top: -26%;

    }
}

/* Mobile breakpoint: apply 6px downward offset to chef image */
@media (max-width: 767px) {
    .chef-image {
        transform: translateY(18px);
    }
}

/* Tablet and larger: add 10px top padding to gallery title */
@media (min-width: 768px) {
    .gallery-section .section-title {
        padding-top: 10px;
    }
}

@media (max-width: 480px) {
.gallery-grid,
.events-grid {
grid-template-columns: 1fr;
}

.section {
padding: 2rem 0;
}

.hero {
height: 50vh;
}



/* Mobile: decorative line positioned 20px higher - bio section */
.bio-div::before {
    content: '';
    margin-top: 24rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 40px;
    /* Bio section: gradient positioned 20px higher using background-position */
    background: 
        /* Bio - Top thin decorative line - 1px */
        linear-gradient(to right, 
            transparent 0%, 
            #c0c0c0 5%, 
            #888888 20%, 
            #c0c0c0 35%, 
            transparent 50%, 
            transparent 50%, 
            #c0c0c0 55%, 
            #888888 70%, 
            #c0c0c0 80%, 
            transparent 95%, 
            transparent 100%
        ) 0 -20px / 100% 1px no-repeat,
        /* Bio - Middle gradient band - 3px */
        linear-gradient(to right, 
            #c0c0c0 0%, 
            #888888 25%, 
            #c0c0c0 50%, 
            #888888 75%, 
            #c0c0c0 100%
        ) 0 30% / 100% 3px no-repeat,
        /* Bio - Bottom thin decorative line - 1px */
        linear-gradient(to right, 
            transparent 0%, 
            #c0c0c0 5%, 
            #888888 20%, 
            #c0c0c0 35%, 
            transparent 50%, 
            transparent 50%, 
            #c0c0c0 55%, 
            #888888 70%, 
            #c0c0c0 80%, 
            transparent 95%, 
            transparent 100%
        ) 0 80% / 100% 1px no-repeat;
    animation: shimmer-mobile 1.5s ease-in-out infinite;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
    pointer-events: none;
    z-index: 1;
}
}
