:root {
            --primary: #214559;
            --secondary: #0070ad;
            --light: #f4f4f4;
            --text: #212529;
        }

        body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: var(--text); line-height: 1.6; margin: 0; }
        header { background: var(--primary); color: #fff; padding: 2rem 1rem; text-align: center; }
        nav { background: #eee; padding: 1rem; text-align: center; }
        nav a { margin: 0 10px; color: var(--primary); text-decoration: none; font-weight: bold; }
        .container { max-width: 1000px; margin: 2rem auto; padding: 0 1rem; display: flex; flex-wrap: wrap; gap: 2rem; }
        .main-content { flex: 3; }
        .sidebar { flex: 1; min-width: 250px; background: var(--light); padding: 1rem; }
        img.portrait { max-width: 100%; height: auto; border: 5px solid #fff; box-shadow: 0 4px 6px rgba(0,0,0,0.1); border-radius: 4px; float: left; margin-right: 20px; }
        footer { background: #111; color: #ccc; padding: 2rem; text-align: center; font-size: 0.9rem; margin-top: 2rem; }
        
        @media (max-width: 768px) {
            .container { flex-direction: column; }
            .portrait { float: none; margin: 0 auto 20px; display: block; }
        }