+main {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 1rem 2rem;
+ max-width: 960px;
+
+ .logo {
+ flex-shrink: 0;
+
+ img {
+ display: block;
+ max-width: 100%;
+ height: auto;
+ }
+ }
+
+ .details {
+ h1 {
+ margin-top: 0;
+ }
+ }
+}
+
+@media (min-width: 640px) {
+ body {
+ margin: 2rem;
+ }
+
+ main {
+ flex-direction: row;
+
+ .logo {
+ align-self: start;
+ }
+ }