.author-page { --author-ink: #1f2c31; --author-muted: #718087; --author-line: #dbe9ed; }
.author-page main { overflow: clip; }
.author-hero { padding-top: 154px; padding-bottom: 92px; }
.author-breadcrumb { display: flex; gap: 12px; color: #879498; font-size: 12px; }
.author-breadcrumb a { color: #5f7b82; }
.author-profile { display: flex; align-items: center; gap: 32px; max-width: 900px; margin: 70px auto 0; padding-bottom: 48px; border-bottom: 1px solid var(--author-line); }
.author-profile-avatar { display: grid; width: 108px; height: 108px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #3c88a0; background: linear-gradient(145deg, #def6ff, #c7ddf7); font-size: 42px; font-weight: 300; }
.author-profile-copy h1 { margin-top: 8px; color: var(--author-ink); font-size: clamp(38px, 5vw, 64px); font-weight: 300; line-height: 1.2; }
.author-profile-copy p { max-width: 650px; margin-top: 18px; color: var(--author-muted); font-size: 16px; line-height: 1.85; }
.author-profile-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.author-profile-tags span { padding: 6px 11px; border: 1px solid #d5e7eb; border-radius: 999px; color: #5d7d83; background: #f8fcfd; font-size: 11px; }
.author-intro { padding-bottom: 118px; }
.author-intro-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 100px; align-items: end; }
.author-intro h2 { max-width: 12em; margin-top: 16px; color: var(--author-ink); font-size: clamp(32px, 4vw, 54px); font-weight: 300; line-height: 1.25; }
.author-intro-grid > p { max-width: 560px; color: var(--author-muted); font-size: 16px; line-height: 2; }
.author-resources { padding-bottom: 126px; }
.author-resources-head { display: flex; align-items: end; justify-content: space-between; padding-bottom: 26px; border-bottom: 1px solid var(--author-line); }
.author-resources-head h2 { margin-top: 14px; color: var(--author-ink); font-size: clamp(34px, 4vw, 54px); font-weight: 300; }
.author-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 42px; }
.author-resource-card { display: flex; min-height: 220px; flex-direction: column; padding: 24px; border: 1px solid #d7e7ea; border-radius: 10px; color: inherit; transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.author-resource-card:hover, .author-resource-card:focus-visible { border-color: #8bd3de; box-shadow: 0 18px 35px #559bab19; transform: translateY(-4px); }
.author-resource-card > span { color: #0e9fb3; font-size: 12px; }
.author-resource-card h3 { max-width: 14em; margin-top: 28px; color: var(--author-ink); font-size: 22px; font-weight: 300; line-height: 1.45; }
.author-resource-card small { margin-top: auto; color: #9aa7aa; font-size: 11px; }
.author-hello { margin-top: 0; }
@media (max-width: 1000px) { .author-hero { padding-top: 120px; } .author-profile { margin-top: 54px; } .author-intro-grid { gap: 50px; } }
@media (max-width: 760px) { .author-hero { padding-top: 42px; padding-bottom: 70px; } .author-profile { align-items: flex-start; flex-direction: column; gap: 24px; margin-top: 42px; } .author-profile-avatar { width: 78px; height: 78px; font-size: 30px; } .author-profile-copy h1 { font-size: 40px; } .author-profile-copy p { font-size: 15px; } .author-intro { padding-bottom: 80px; } .author-intro-grid { display: block; } .author-intro-grid > p { margin-top: 28px; font-size: 15px; } .author-resources { padding-bottom: 84px; } .author-resources-head { align-items: flex-start; flex-direction: column; gap: 20px; } .author-resource-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 28px; } .author-resource-card { min-height: 175px; } }