/* SECTION 1: Legacy Section */
        .about-us-section {
            min-height: 100vh;
            width: 100%;
            margin-top: 10vh;
            padding: 40px;
            display: flex;
            flex-direction: column;
        }

        /* Header section with title and subtitle */
        .header-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: flex-start;
            margin-bottom: 60px;
        }

        .title-container {
            flex: 1;
            min-width: 700px;
            max-width: 600px;
        }

        .main-title {
            font-size: 56px;
            font-weight: 900;
            line-height: 1.1;
            margin-bottom: 40px;
            background: linear-gradient(140deg, #222 20%, #ff4d0096 100%);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            position: relative;
            letter-spacing: -0.5px;
        }

        .subtitle-container {
            flex: 1;
            min-width: 300px;
            max-width: 500px;
            padding-top: 10px;
        }

        .subtitle {
            font-size: 20px;
            font-weight: 550;
            letter-spacing: -.5px;
            line-height: 1.4;
            color: #222;
        }

        /* Main image section */
        .image-container {
            width: 100%;
            height: 560px;
            margin-bottom: 40px;
            border-radius: 12px;
            overflow: hidden;
            position: relative;
        }

        .main-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
            transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        }

        .main-image.active {
            opacity: 1;
        }

        /* Timeline section below image */
        .timeline-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-start;
            gap: 30px;
            margin-left: 0;
        }

        .timeline-item {
            flex: 1;
            min-width: 200px;
            min-height: 250px;
            padding-top: 24px;
            position: relative;
            cursor: pointer;
            transition: all 0.5s ease;
            opacity: 0.6;
            display: flex;
            flex-direction: column;
        }

        .timeline-item.active {
            opacity: 1;
        }

        .timeline-item:hover {
            opacity: 1;
        }

        .timeline-title {
            font-weight: 900;
            font-size: 1.5rem;
            margin-bottom: 12px;
            color: #111;
        }

        .timeline-desc {
            font-weight: 300;
            font-size: 16px;
            color: #111;
            flex-grow: 1;
        }

        /* Default timeline bar (gray background) */
        .timeline-default-bar {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            height: 2px;
            background-color: #eee;
            border-radius: 2px;
            width: 100%;
        }

        /* Animated timeline bar (gold fill) */
        .timeline-fill-bar {
            position: absolute;
            left: 0;
            top: 0;
            width: 0;
            height: 2px;
            background: rgb(255, 84, 84);
            transition: width 3s linear;
            border-radius: 2px;
        }

        /* SECTION 2: Products & Values Section */
        .products-section {
            max-width: 100vw;
            background: #fff;
            position: relative;
        }

        .section-container {
            max-width: 100vw;
            padding: 0 40px;
        }

        .section-title-container {
            flex: 1;
            min-width: 50%;
            max-width: 600px;
            /* margin-left: 50px; */
            padding-top: 80px;
            margin-bottom: 40px;
        }

        .section-main-title {
            font-size: 56px;
            font-weight: 900;
            line-height: 1.1;
            margin-bottom: 80px;
            background: linear-gradient(140deg, #222 20%, #ff4d0096 100%);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            position: relative;
            letter-spacing: -0.5px;
        }

        .content-section-wrapper {
            position: relative;
        }

        .content-section {
            display: flex;
            align-items: flex-start;
            position: relative;
        }

        .content-left {
            width: 50%;
            padding-left: 50px;
        }

        .content-right {
            width: 50%;
            height: 100vh;
            position: relative;
        }

        .about-product-image-container {
            width: 80%;
            height: 75%;
            border-radius: 20px;
            overflow: hidden;
            position: absolute;
            top: 38%;
            left: 57%;
            transform: translate(-50%, -50%);
        }

        .about-product-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
            transition: opacity .4s ease-out;
        }

        .about-product-image.active {
            opacity: 1;
        }

        .content-block {
            margin-bottom: 70px;
        }

        .block-header {
            display: flex;
            width: 100%;
            margin-bottom: 25px;
        }

        .block-title {
            font-size: 20px;
            font-weight: 600;
            color: #888;
            margin-right: 20px;
        }

        .block-description {
            font-size: 20px;
            font-weight: 500;
            color: #000;
            max-width: 440px;
            margin-left: auto;
            margin-bottom: 40px;
        }

        .points-list {
            width: 66%;
            margin-left: auto;
        }

        .point-item {
            padding: 14px 0;
            border-bottom: 1px solid #ccc;
            font-weight: 500;
            color: #000;
            font-size: 16px;
            cursor: pointer;
            transition: color 0.3s ease;
        }

        .point-item:hover {
            color: #ff4d00;
        }

        .promise-container {
            margin-top: 60px;
            display: flex;
            padding-bottom: 150px;
        }

        .promise-title {
            color: #888;
            font-size: 20px;
            font-weight: 600;
        }

        .promise-text {
            font-size: 20px;
            color: #000;
            max-width: 440px;
            margin-left: auto;
        }

        /* Responsive Design */
        @media (max-width: 1200px) {
            .timeline-container {
                gap: 20px;
            }

            .timeline-item {
                min-width: 250px;
                padding-top: 24px;
            }

            .product-image-container {
                width: 85%;
                height: 70%;
            }
        }

        @media (max-width: 992px) {
            .about-us-section {
                padding: 30px;
            }

            .header-container {
                flex-direction: column;
                gap: 30px;
            }

            .title-container {
                min-width: 100%;
                max-width: 100%;
            }

            .image-container {
                height: 350px;
            }

            .main-title {
                font-size: 40px;
            }

            .timeline-container {
                flex-direction: column;
            }

            .timeline-item {
                min-height: 200px;
            }

            /* Section 2 responsive */
            .content-section {
                flex-direction: column;
            }

            .content-left,
            .content-right {
                width: 100%;
            }

            .content-left {
                padding-left: 0;
                padding-right: 0;
            }

            .content-right {
                height: 50vh;
                margin-top: 40px;
            }

            .product-image-container {
                width: 90%;
                height: 80%;
                position: relative;
                top: auto;
                left: auto;
                transform: none;
                margin: 0 auto;
            }

            .section-title-container {
                margin-left: 0;
                padding-top: 60px;
            }

            .section-main-title {
                font-size: 40px;
                margin-bottom: 60px;
            }
        }

        @media (max-width: 768px) {
            .about-us-section {
                padding: 30px 20px;
            }

            .main-title {
                font-size: 36px;
            }

            .section-main-title {
                font-size: 36px;
                margin-bottom: 40px;
            }

            .subtitle {
                font-size: 16px;
            }

            .image-container {
                height: 300px;
                margin-bottom: 40px;
            }

            .timeline-title {
                font-size: 20px;
            }

            .timeline-item {
                padding-top: 24px;
            }

            /* Section 2 responsive */
            .section-container {
                padding: 0 20px;
            }

            .block-description,
            .promise-text {
                font-size: 18px;
            }

            .points-list {
                width: 100%;
            }

            .block-header {
                flex-direction: column;
            }

            .block-title {
                margin-bottom: 15px;
            }
        }

        @media (max-width: 480px) {
            .main-title {
                font-size: 30px;
            }

            .section-main-title {
                font-size: 30px;
                margin-bottom: 30px;
            }

            .timeline-item {
                padding-top: 24px;
                min-height: auto;
            }

            .timeline-title {
                font-size: 18px;
            }

            .block-description,
            .promise-text {
                font-size: 16px;
            }

            .content-right {
                height: 40vh;
            }
        }



        /* SECTION */
        .owner-section {
            height: 100vh;
            width: 100%;
            display: flex;
            gap: 48px;
            padding: 40px;
        }

        .title-container-owner {
            flex: 1;
            min-width: 700px;
            max-width: 800px;
            padding: 40px;
        }

        /* LEFT SIDE – OWNER IMAGE */
        .owner-left {
            flex: 1;
            height: 100%;
            overflow: hidden;
        }

        .owner-left img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 4px;
        }

        /* RIGHT SIDE */
        .owner-right {
            flex: 1;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            position: relative;
        }

        /* OWNER CONTENT (TOP) */
        .owner-content {
            max-width: 100%;
        }

        .owner-content p {
            font-size: 1.8rem;
            line-height: 1.4;
            color: #222;
            font-weight: 400;
            font-style: italic;
        }

        space {
            margin-right: 150px;
        }

        /* SHOP DETAILS (BOTTOM – ASYMMETRICAL) */
        .shop-block {
            display: flex;
            align-items: flex-end;
            justify-content: right;
            gap: 36px;
            max-width: 100%;
        }

        .shop-text {
            font-size: 1rem;
            line-height: 1.4;
            font-weight: 350;
            color: #333;
            max-width: 350px;
            margin-right: auto;
            margin-bottom: 5px;
        }


        .shop-image {
            width: 280px;
            height: 270px;
            flex-shrink: 0;
            overflow: hidden;
            position: relative;
        }

        .shop-image img {
            border-radius: 4px;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        /* RESPONSIVE */
        @media (max-width: 900px) {
            .owner-section {
                flex-direction: column;
                height: auto;
            }

            .owner-left,
            .owner-right {
                height: auto;
            }

            .owner-left img {
                height: 60vh;
            }

            .shop-block {
                margin-top: 32px;
            }
        }