```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>About Us - iPhone</title>
    <style>
        /* General Styles */
        body {
            font-family: 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            line-height: 1.6;
            color: #333;
            background-color: #f8f8f8;
        }

        header {
            background-color: #2c3e50;
            color: #fff;
            padding: 1rem 0;
            text-align: center;
        }

        nav {
            background-color: #3498db;
            color: #fff;
            padding: 1rem 0;
            text-align: center;
        }

        main {
            padding: 2rem;
        }

        footer {
            background-color: #2c3e50;
            color: #fff;
            text-align: center;
            padding: 1rem 0;
            position: fixed;
            bottom: 0;
            width: 100%;
        }

        /* Hero Section */
        .hero {
            background-color: #1f77b4; /* A nice blue from the palette */
            color: #fff;
            text-align: center;
            padding: 4rem 0;
        }

        .hero h1 {
            font-size: 3rem;
            margin-bottom: 0.5rem;
        }

        /* Image Styling */
        img {
            max-width: 100%;
            height: auto;
            display: block; /* Removes extra space below image */
        }

        /* Section Styling */
        .section {
            margin-bottom: 2rem;
        }

        .section h2 {
            font-size: 2.5rem;
            margin-bottom: 1rem;
            color: #3498db;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .hero h1 {
                font-size: 2.5rem;
            }
            nav {
                padding: 0.5rem;
            }
        }
    </style>
</head>
<body>

    <header>
        <h1>About Us</h1>
    </header>

    <nav>
        <a href="#">Home</a> | <a href="#">Services</a> | <a href="#">Contact</a>
    </nav>

    <main>
        <section class="section">
            <h2>Our Story</h2>
            <img src="https://source.unsplash.com/random/600x400?iphone" alt="iPhone Image">
            <p>We are a team of passionate individuals dedicated to creating innovative and user-friendly mobile solutions.  We believe in simplicity and quality.  Our journey began with a desire to make technology accessible to everyone.</p>
        </section>

        <section class="section">
            <h2>Our Team</h2>
            <img src="https://source.unsplash.com/random/300x200?team" alt="Team Image">
            <img src="https://source.unsplash.com/random/300x200?developer" alt="Developer Image">
            <p>Our team is comprised of experienced designers, developers, and product specialists who are committed to delivering exceptional results.</p>
        </section>

        <section class="section">
            <h2>Our Mission</h2>
            <img src="https://source.unsplash.com/random/400x300?mission" alt="Mission Image">
            <p>Our mission is to empower individuals and businesses with cutting-edge mobile experiences.  We strive to constantly improve and stay ahead of the curve, pushing the boundaries of what's possible in mobile technology.</p>
        </section>
    </main>

    <footer>
        <p>&copy; 2024 iPhone - All rights reserved.</p>
    </footer>

</body>
</html>
```