html {
		  scroll-behavior: smooth;
		}
		
        /* General body styles */
        body {
            font-family: Comfortaa, sans-serif;
			font-weight: 200; /* Set font weight to 300 for Light version */
            margin: 0;
            padding: 0;
            background-color: #000;
            color: #fff;
            line-height: 1.66;  /* 33% more space between lines of text */
			font-size: 16px; /* Increased base font size */
        }

        /* Fixed navigation bar styles */
        nav {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            background-color: #000000;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0px;
            z-index: 100;
        }

        nav .logo img {
            height: 40px;
            margin-left: 20px;
        }

        nav ul {
            display: flex;
            list-style: none;
            margin-right: 40px;
            margin-top: 10px;
            margin-bottom: 10px;
            justify-content: flex-end;
            white-space: nowrap;
        }

        nav ul li {
            margin-left: 4px;
        }

        nav ul li a {
            color: #808080;
            text-decoration: none;
            font-size: 1rem;
            transition: background-color 0.3s, color 0.6s, border-radius 0.3s; /* Added transition for border-radius */
            padding: 10px;
        }

		nav ul li a:hover {
		    color: #00B0FF;  /* Hover background color */
		    border-radius: 6px;  /* Rounded corners on hover */
		}
		
        .menu-button {
            display: none;
            font-size: 30px;
            color: white;
            margin-right: 20px;
            cursor: pointer;
            z-index: 1001;
        }

        nav ul.show {
            display: flex;
            flex-direction: column;
            position: absolute;
            top: 60px;
            left: 0;
            width: 100%;
            background-color: rgba(0, 0, 0, 0.9);
            padding: 20px;
            z-index: 1000;
        }

        nav ul.show li {
            margin: 20px 0;
        }

        nav ul.show li a {
            text-decoration: none;
            color: white;
            font-size: 1.2rem;
            padding: 10px;
            border-radius: 5px;
            transition: background-color 0.3s;
        }

        nav ul.show li a:hover {
            background-color: #019EFF;
        }

        section {
            padding: 100px 20px;
        }

        /* Styles for the home section */
        #home {
            background-image: url('images/slide5.jpg');
            background-size: cover;
            background-position: center;
            color: white;
            height: 60vh;
            text-align: center;
        }

        #home img {
            width: 60vw;
            height: auto;
            margin-top: 20vh;
        }

        .text-primary {
            font-size: 1rem;
            color: #019EFF;            
        }
        
        /* Define fade-in animation */
		@keyframes fadeInTextSecondary {
		    0% {
		        opacity: 0;
		        color: #80D0FF; /* Initial color */
		    }
		    100% {
		        opacity: 1;
		        color: #80D0FF; /* End color */
		    }
		}

        .text-secondary {
            font-size: 1.2rem;
            color: #0080D0FF;
		    opacity: 0; /* Text is transparent initially */
			animation: fadeInTextSecondary 4s ease-out forwards;
    		animation-delay: 2s; /* Delay the start by 2 second */
        }

        /* Styles for info sections */
        #vision, #product, #features, #pricing {
            text-align: left;
            padding-left: 15%;
            padding-right: 15%;
            position: relative;
			font-weight: 200; /* Set font weight to 300 for Light version */
        }

        /* Odd-numbered info sections have background color #000000 */
        #vision, #features {
            background-color: #000000;
        }

        /* Even-numbered info sections have background color #151515 */
        #product, #pricing {
            background-color: #151515;
        }

        #vision h2, #product h2, #features h2, #pricing h2 {
            color: #FFFFFF;
            margin-bottom: 20px;
			font-weight: 200; /* Set font weight to 300 for Light version */
			padding-left: 8px;
        }

        #vision h3, #product h3, #features h3, #pricing h3 {
            color: #FF470D;
            margin-bottom: 20px;
			font-weight: 200; /* Set font weight to 300 for Light version */
        }

        /* Subtitle color */
        #vision .subtitle {
            color: #FF470D;
            margin-top: 20px;
			font-weight: 200; /* Set font weight to 300 for Light version */
        }

        #vision::before, #product::before, #features::before, #pricing::before {
            content: '';
            display: block;
            background-color: #FF470D;
            position: absolute;
            top: 120px;
            width: 2px;
            height: 180px;
        }

        /* Default rectangle width for larger screens */
        #vision::before, #product::before, #features::before, #pricing::before {
            left: 12%;
        }

        /* Mobile view adjustments */
        @media (max-width: 768px) {
            nav ul {
                display: none;
                flex-direction: column;
            }

            nav ul.show {
                display: flex;
                flex-direction: column;
                position: absolute;
                top: 80px;
                left: 0;
                width: 100%;
                background-color: rgba(0, 0, 0, 0.9);
                padding: 20px;
                z-index: 1000;
            }

            #home img {
                width: 80vw;
            }

            .menu-button {
                display: block;
            }

            /* Adjust left-right padding for smaller screens */
            #vision, #product, #features, #pricing {
                padding-left: 10%;
                padding-right: 10%;
            }

            /* Rectangle width for mobile */
            #vision::before, #product::before, #features::before, #pricing::before {
	            left: 5%;
            }
        }

        /* Styles for the two-column layout in the Features section */
        .feature-columns {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-bottom: 40px;
        }

		.feature-block {
		    flex: 1 1 320px;
		    background-color: #151515;
		    padding: 20px;
		    border-radius: 8px;
		    min-width: 240px;
		    box-sizing: border-box;
		    transition: background-color 0.3s ease; /* Add transition for background color */
		}
		
		.feature-block:hover {
		    background-color: #202020; /* Change background color on hover */
		}

        .feature-block h3 {
            color: #FF470D;
            margin-bottom: 15px;
		    white-space: nowrap; /* Prevent text wrapping */
		    overflow: hidden;    /* Hide any overflowing text */
		    text-overflow: ellipsis; /* Add ellipsis for overflowing text */
        }

		/* Initial state for the feature-block text */
		.feature-block p {
		    color: #505050; /* Initial color is gray */
		    opacity: 1; /* Make it fully transparent initially */
		    transition: color 1s ease, opacity 1s ease; /* Transition for color and opacity */
		}
		
		
		
		
		
		

        
        .pricing-columns {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-bottom: 40px;
		    justify-content: space-around; /* Adjust spacing between items */
        }

		.pricing-block {
		    flex: 1 1 120px;
		    background-color: #000000;
		    padding: 20px;
		    border-radius: 8px;
		    min-width: 240px;
		    box-sizing: border-box;
		    transition: background-color 0.3s ease; /* Add transition for background color */
		}
		
		.pricing-block:hover {
		    background-color: #202020; /* Change background color on hover */
		}

        .pricing-block h3 {
            color: #FF470D;
            margin-bottom: 15px;
		    white-space: nowrap; /* Prevent text wrapping */
		    overflow: hidden;    /* Hide any overflowing text */
		    text-overflow: ellipsis; /* Add ellipsis for overflowing text */
        }
        
        
        
        
		
		
		
		
		
		
		/* Animation for fading in */
		@keyframes fadeInText {
		    0% {
		        opacity: 0.2;
		        color: #fff; /* Start with gray */
		    }
		    100% {
		        opacity: 1;
		        color: #fff; /* Fade to white */
		    }
		}
		
		/* Animation for fading out */
		@keyframes fadeOutText {
		    0% {
		        opacity: 1;
		        color: #fff; /* Start at white */
		    }
		    100% {
		        opacity: 0.2;
		        color: #fff; /* Fade back to gray */
		    }
		}
		
		/* Classes to trigger animations */
		.feature-block p.animate-text {
		    animation: fadeInText 2s ease-out forwards;
		}
		
		.feature-block p.fade-out-text {
		    animation: fadeOutText 2s ease-out forwards;
		}
                                
                
		        /* Classes to trigger animations */
		.animate-text {
		    animation: fadeInText 2s ease-out forwards;
		}
		
		.fade-out-text {
		    animation: fadeOutText 2s ease-out forwards;
		}
	                
        
        
                
		/* Footer styles */
		footer {
		    background-color: #000;  /* Set a dark background color for the footer */
		    color: #505050;  /* Set text color to #505050 */
		    padding: 20px 0;  /* Add padding to the top and bottom */
		    text-align: left;  /* Center-align text */
		    margin-left: 40px;
		    margin-right: 40px;
		    margin-top: 20px;
		    margin-bottom: 20px;
		}
		
		footer a {
		    color: #505050;  /* Set link color to #505050 */
		    text-decoration: none;  /* Remove underline from links */
		    transition: color 0.3s ease;  /* Add smooth transition for hover effect */
		}
		
		footer a:hover {
		    color: #019EFF;  /* Change color of links on hover to #019EFF */
		}




/* chat */

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Product description",
  "information": "orange dogs eat chairs"
}
</script>