<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Conrad Barrett</title>
    <meta name="description" content="Conrad Barrett - Personal website">
    <link rel="stylesheet" href="styles.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
</head>
<body>
    <div class="container">
        <header>
            <h1 class="name">Conrad Barrett</h1>
            <p class="tagline">
                <i class="fas fa-beer beer-icon"></i>
                Building at the intersection of internet culture and timeless brands
            </p>
        </header>

        <nav>
            <a href="#about" class="nav-link">About</a>
            <a href="#projects" class="nav-link">Projects</a>
            <a href="#contact" class="nav-link">Contact</a>
        </nav>

        <main>
            <section id="about" class="section">
                <h2>About</h2>
                <p>I grew up building products on the Internet. I've been fascinated with everlasting brands that find ways to continuously define culture of the moment.</p>
                <p>I'm a builder, not just a developer. I lean into new technologies while exploring and understanding internet culture—trying to understand the new while taking from the old ways of the internet.</p>
                <p>Currently at AB InBev, exploring how legacy brands can evolve in digital spaces.</p>
            </section>

            <section id="projects" class="section">
                <h2>Projects</h2>
                <div class="project-grid">
                    <article class="project">
                        <div class="project-header">
                            <i class="fas fa-car project-icon"></i>
                            <h3>FSD Tracker</h3>
                        </div>
                        <p>Application for tracking and analyzing Full Self-Driving performance metrics. Building tools to understand autonomous vehicle behavior and performance.</p>
                        <div class="project-tags">
                            <span class="tag">Python</span>
                            <span class="tag">Data Analysis</span>
                            <span class="tag">Tesla API</span>
                        </div>
                    </article>
                </div>
            </section>

            <!-- Writing section - hidden until content is ready -->
            <!-- <section id="writing" class="section">
                <h2>Writing</h2>
                <div class="writing-list">
                    <article class="writing-item">
                        <time>2024</time>
                        <a href="#" class="writing-link">Thoughts on minimalist web design</a>
                    </article>
                    <article class="writing-item">
                        <time>2024</time>
                        <a href="#" class="writing-link">Building better e-commerce experiences</a>
                    </article>
                </div>
            </section> -->

            <section id="contact" class="section">
                <h2>Contact</h2>
                <p>If you like cold beers and good memes, drop me a line.</p>
                <div class="contact-links">
                    <a href="mailto:conradbarrett@gmail.com" class="contact-link">
                        <i class="fas fa-envelope"></i>
                        <span>conradbarrett@gmail.com</span>
                    </a>
                    <a href="https://twitter.com/conradd" class="contact-link" target="_blank" rel="noopener">
                        <i class="fab fa-twitter"></i>
                        <span>@conradd</span>
                    </a>
                </div>
            </section>
        </main>

        <footer>
            <p>&copy; 2024 Conrad Barrett. Built with simplicity in mind.</p>
        </footer>
    </div>

    <script src="script.js"></script>
</body>
</html>