/* Shared header identity and social links, including the standalone article. */
.header-identity{display:flex;align-items:center;gap:20px;min-width:0}
.header-socials{display:flex;align-items:center;gap:8px}
.header-socials .social-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border:1px solid #dce0e8;border-radius:50%;background:#fff;transition:background .2s,border-color .2s}
.header-socials .social-icon img{display:block;object-fit:contain;border:0;border-radius:0;box-shadow:none}
.header-socials .social-icon:hover{background:#edf0ff;border-color:#253be8}
.header-socials .social-icon:focus-visible{outline:3px solid #253be8;outline-offset:4px}
@media(max-width:650px){
  .header,.site-header{height:auto;min-height:112px;display:flex;flex-wrap:wrap;gap:14px;padding-block:18px 14px}
  .header-identity{width:100%;justify-content:space-between;gap:12px}
  .header-socials .social-icon{width:40px;height:40px}
  .header nav,.site-header nav{width:100%;justify-content:flex-end;gap:24px;min-height:30px;align-items:center}
}

/* Room for the Resume link, including phones and enlarged text. */
.header nav,.site-header nav{flex-wrap:wrap;gap:8px 26px}
.header nav a,.site-header nav a{display:inline-flex;align-items:center;min-height:44px}
.header-socials .social-icon{width:44px;height:44px}
.about-resume-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:24px}
.about-resume-actions>a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;font-size:16px}
.about-resume-actions>a:not(.button){color:var(--blue);text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){.header,.site-header{height:auto;min-height:112px;flex-wrap:wrap;gap:8px 24px;padding-block:18px 14px}.header-identity{width:100%;justify-content:space-between}.header nav,.site-header nav{width:100%;justify-content:flex-end}}
@media(max-width:520px){.header nav,.site-header nav{justify-content:space-between;gap:4px 12px}.about-resume-actions{align-items:stretch;flex-direction:column}}
.header .brand,.site-header .brand{min-height:44px}