/* A quieter scale, preserving the Azure palette and existing page structure. */
main > section.mb-28 { margin-bottom: 4.5rem; }
main > header.mb-20 { margin-bottom: 3rem; }
main h1 { font-weight: 800; }
main > header h1 { line-height: 1.1; margin-bottom: 1.25rem; }
main > header p.text-lg, .home-hero p.text-lg { font-size: 1rem; line-height: 1.75; font-weight: 400; }
.home-hero-row { gap: 2rem; margin-bottom: 2rem; }
.home-hero-heading { line-height: .98; letter-spacing: -.045em; }
.home-hero .home-hero-portrait { width: 8rem; height: 8rem; }
main .rounded-xl { border-radius: 1.5rem; }
main h3.text-2xl { font-size: 1.3rem; line-height: 1.35; }
main h3.text-3xl { font-size: 1.6rem; line-height: 1.3; }
.blog-header { margin-bottom: 2rem; }
.post-card { padding: 1.4rem 1.5rem; }
article > div:first-child { margin-bottom: 2rem; }
article h1 { line-height: 1.12 !important; }
article .back-link { margin-bottom: 1.5rem; }
.article-body { line-height: 1.8; }
.article-body p + p { margin-top: 1.4rem; }
.article-body a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.rss-link { display: inline-flex; align-items: center; gap: .35rem; color: var(--c-primary); font-size: .875rem; font-weight: 600; }
.blog-header > .rss-link { margin-top: 1.25rem; }
.rss-link:hover { text-decoration: underline; text-underline-offset: .2em; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 4px; }
.footer-links { flex-wrap: wrap; align-items: center; }
@media (min-width: 768px) {
  main { padding-top: 3rem !important; padding-left: 3rem !important; padding-right: 3rem !important; }
  .home-hero .home-hero-portrait { width: 8.5rem; height: 8.5rem; }
  .blog-header { margin-bottom: 2.5rem; }
}
@media (max-width: 767px) {
  main > section.mb-28 { margin-bottom: 3rem; }
  .home-hero-row { flex-direction: row; align-items: center; gap: 1.25rem; }
  .home-hero .home-hero-portrait { width: 5rem; height: 5rem; }
  .home-hero-heading { font-size: clamp(2rem, 8vw, 3rem); }
  .home-hero-kicker { font-size: .625rem; letter-spacing: .14em; margin-bottom: .7rem; }
  .post-card > div > div > .flex { flex-wrap: wrap; gap: .5rem; }
}
@media (max-width: 359px) {
  .home-hero-row { flex-direction: column; align-items: flex-start; }
}

/* Editorial hierarchy: quiet labels, open article rows and clear next steps. */
main .uppercase { text-transform: none; letter-spacing: .035em; font-weight: 500; }
main .home-hero-kicker { letter-spacing: .08em; }
main > section.home-hero { margin-bottom: 2.5rem; }
.latest-writing { border-top: 1px solid var(--c-rule); border-bottom: 1px solid var(--c-rule); padding: 1.5rem 0 1.75rem; margin-bottom: 4rem; }
.section-heading { display: flex; justify-content: space-between; gap: 1rem; font-size: .8125rem; color: var(--c-on-surface-variant); margin-bottom: 1.25rem; }
.section-heading a, .read-article { color: var(--c-primary); }
.latest-writing-link { display: block; max-width: 43rem; }
.editorial-meta { font-size: .8125rem; color: var(--c-outline); margin: 0 0 .65rem; }
.latest-writing h2 { font-size: clamp(1.35rem, 2.5vw, 1.75rem); line-height: 1.3; letter-spacing: -.02em; margin: 0 0 .75rem; font-weight: 700; }
.latest-writing-link > p:not(.editorial-meta) { font-size: 1rem; color: var(--c-on-surface-variant); line-height: 1.65; margin: 0 0 1rem; }
.read-article { font-size: .875rem; font-weight: 600; }
.latest-writing-link:hover h2, .next-title:hover { color: var(--c-primary); }
.post-list .post-card { border: 0 !important; border-bottom: 1px solid var(--c-sidebar-border) !important; border-radius: 0; background: transparent !important; padding: 1.6rem 0; margin: 0; }
.post-list .post-card:first-child { padding-top: .25rem; }
.post-list .post-title { font-size: 1.2rem; font-weight: 600; line-height: 1.4; }
.post-list .post-card .rounded-full { background: none !important; padding: 0; color: var(--c-on-surface-variant); }
.post-list .post-card .text-\[9px\] { font-size: .75rem; }
.post-list .post-card p { max-width: 40rem; font-size: .9375rem; }
.article-next { border-top: 1px solid var(--c-rule); margin-top: 3rem; padding-top: 1.5rem; display: grid; grid-template-columns: 1.3fr 1fr; gap: 2rem; }
.next-title { font-family: 'Manrope', sans-serif; font-weight: 600; line-height: 1.5; display: block; }
.follow-blog p { font-weight: 600; margin: 0 0 .5rem; }
.follow-blog > span { font-size: .875rem; line-height: 1.5; display: block; color: var(--c-on-surface-variant); margin-bottom: .75rem; }
.subscribe-panel { scroll-margin-top: 5rem; padding: 1.75rem; background: var(--c-surface-low); border-radius: 1rem; margin-bottom: 3rem; }
.subscribe-panel h2 { font-size: 1.3rem; margin: 0 0 .75rem; }
.subscribe-panel p { color: var(--c-on-surface-variant); font-size: .9375rem; line-height: 1.6; }
.feed-address { display: flex; flex-wrap: wrap; gap: .75rem; }
.feed-address input { flex: 1 1 16rem; min-width: 0; border: 1px solid var(--c-outline-variant); border-radius: .4rem; padding: .7rem; background: var(--c-surface); color: var(--c-on-surface); font: inherit; font-size: .875rem; }
.feed-address button { padding: .7rem 1rem; background: var(--c-primary); color: var(--c-surface); border-radius: .4rem; font-size: .875rem; font-weight: 600; }
#feed-copy-status:empty { display: none; }
@media (max-width: 600px) { .article-next { grid-template-columns: 1fr; } .subscribe-panel { padding: 1.25rem; } }

/* Open homepage sections, with a quiet inset for the personal note. */
.hero-skills { list-style: none; margin: 0; padding: .25rem 0 .25rem 1.25rem; border-left: 1px solid var(--c-rule); color: var(--c-on-surface-variant); font-size: .875rem; line-height: 1.6; }
.hero-skills li + li { margin-top: .7rem; }
.capabilities-section > .grid > div { background: transparent; border-radius: 0; padding: 1.5rem 0; }
.capabilities-section > .grid > .thinking-note { background: var(--c-surface-low); border-radius: .75rem; padding: 1.5rem; justify-content: flex-start; }
.capabilities-section > .grid > div:nth-child(n+3) { border-top: 1px solid var(--c-rule); }
.capabilities-section > .grid, .projects-section > .grid { column-gap: 2rem; }
.projects-section > .grid > div { background: transparent; border-radius: 0; border-bottom: 1px solid var(--c-rule); }
.capabilities-section .mt-6 > span.rounded-full,
.projects-section .mt-6 > span.rounded-full { background: transparent; padding: 0; border-radius: 0; font-size: .75rem; letter-spacing: 0; }
.capabilities-section .mt-6.flex, .projects-section .mt-6.flex { column-gap: 1rem; row-gap: .5rem; }
@media (max-width: 767px) {
  .hero-skills { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; border-left: 0; border-top: 1px solid var(--c-rule); padding: 1rem 0 0; }
  .hero-skills li + li { margin-top: 0; }
}
