:root {
  --ink: #37352f;
  --title: #191919;
  --paper: #ffffff;
  --line: #e9e9e7;
  --font: "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
strong { font-weight: 600; color: var(--title); }

/* Banner */
.cover img {
  width: 100%;
  aspect-ratio: 1584 / 396;
  object-fit: cover;
}

/* Page column */
.page {
  max-width: 740px;
  margin: 0 auto;
  padding: 0 24px 120px;
}

.page__icon {
  width: 96px;
  height: 96px;
  margin-top: -48px;
  position: relative;
  border-radius: 8px;
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(15, 15, 15, 0.06);
  background: #fff;
}

.page__title {
  margin: 28px 0 32px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--title);
}

.essay p { margin: 0 0 1.1em; }

/* Social links */
.social {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}
.social a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  font-size: 15px;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.social a:hover,
.social a:focus-visible { background: #f7f7f5; border-color: #d9d9d6; }
.social svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.social a[href*="linkedin"] svg { fill: #0a66c2; }

@media (max-width: 600px) {
  body { font-size: 16px; }
  .cover img { aspect-ratio: auto; height: 170px; object-position: 70% center; }
  .page { padding: 0 16px 80px; }
  .page__icon { width: 72px; height: 72px; margin-top: -36px; }
  .page__title { font-size: 32px; margin: 20px 0 24px; }
}