/* author.css - author pages (team profiles).
   Part of the SJRP inner component library (prefix .in-), ported 1:1 from the
   canvas artboards; tokens only, the design's breakpoints. See inner.css. */

/* 9. Author page ------------------------------------------------------------ */

.in-author { padding-block: 40px 48px; display: grid; grid-template-columns: minmax(0,360px) minmax(0,1fr); gap: clamp(28px,4vw,56px); align-items: start; }
.in-author__img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; border-radius: 10px; display: block; }
.in-author--text { grid-template-columns: minmax(0,1fr); }
.in-author__text { display: flex; flex-direction: column; gap: 18px; }
.in-author__lead { display: flex; flex-direction: column; gap: 10px; margin-top: -4px; }
.in-author__lead p { margin: 0; font-size: 1.03125rem; line-height: 1.5; color: var(--dd-text); max-width: 58ch; }
.in-author__lead p + p { font-size: 1rem; }
.in-glance { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.in-glance__cell { background: var(--dd-white); padding: 14px 16px; display: flex; flex-direction: column; gap: 3px; }
.in-glance__label { font-size: 0.75rem; font-weight: 600; color: var(--dd-green-accent); }
.in-glance__value { font-size: 0.90625rem; font-weight: 500; }
.in-author__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }


.in-biogrid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); gap: clamp(32px,5vw,72px); align-items: start; }
.in-bio { display: flex; flex-direction: column; gap: 16px; }
.in-bio__title { margin: 0 0 8px; }
.in-bio__body { display: flex; flex-direction: column; gap: 16px; }
.in-bio__body p { margin: 0; font-size: 1rem; color: var(--dd-text); max-width: 66ch; }
.in-bio__body strong { font-weight: 600; color: var(--dd-ink); }
.in-bio__body h3 { margin: 16px 0 0; font-size: clamp(1.375rem,2vw,1.625rem); letter-spacing: -.025em; line-height: 1.2; }

.in-articles__title { margin: 0 0 14px; }
.in-articles__intro { margin: 0 0 clamp(28px,3vw,40px); display: flex; flex-direction: column; gap: 10px; }
.in-articles__intro p { margin: 0; font-size: 1.03125rem; color: var(--dd-text); max-width: 64ch; }
.in-articles .in-eyebrow { margin: 0 0 12px; }
.in-rows { display: flex; flex-direction: column; gap: 12px; }
.in-row { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 18px 20px 18px 22px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px 24px; align-items: center; text-decoration: none; color: inherit; }
.in-row__body { display: flex; flex-direction: column; gap: 4px; }
.in-row__meta { font-size: 0.75rem; font-weight: 600; color: var(--dd-green-accent); }
.in-row__title { margin: 0; font-size: clamp(1.0625rem,1.3vw,1.1875rem); letter-spacing: -.02em; line-height: 1.25; }
.in-row__text { font-size: 0.875rem; color: var(--dd-text); line-height: 1.5; }
.in-row__btn { justify-self: end; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border: 1px solid var(--dd-ink-a18); border-radius: 8px; font-size: 0.90625rem; font-weight: 600; white-space: nowrap; box-sizing: border-box; }
.in-articles__more { margin: 20px 0 0; }
.in-articles__policy { margin: 14px 0 0; font-size: 0.875rem; color: var(--dd-text); }

@media (max-width:1100px) { .in-glance { grid-template-columns: repeat(2,minmax(0,1fr)); } }
/* h1: credentials under the name, smaller than the name but h1-scaled */
.in-author .in-title .in-creds { margin-top: 10px; font-size: clamp(0.9375rem,1.3vw,1.125rem); }

@media (max-width:900px) {
	/* Phones: crumbs, kicker, name and lead first, then the photo, then the
	   facts and buttons - the text column's children join the page grid. */
	.in-author { grid-template-columns: minmax(0,1fr); gap: 18px; }
	.in-author__text { display: contents; }
	.in-author__text > * { order: 2; }
	.in-author__text > .in-crumbs, .in-author__text > .in-kicker, .in-author__text > .in-title, .in-author__text > .in-author__lead { order: 0; }
	.in-author__img { order: 1; max-width: 320px; }
	.in-biogrid { grid-template-columns: minmax(0,1fr); }
	.in-side { position: static; }
	.in-row { grid-template-columns: minmax(0,1fr); padding: 16px 18px; }
	.in-row__btn { justify-self: start; }
}
@media (max-width:560px) { .in-glance { grid-template-columns: minmax(0,1fr); } }

/* The rest of the team */
.in-team4 { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.in-mini { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: inherit; }
.in-mini__img { width: 100%; aspect-ratio: 1/1; object-fit: cover; object-position: center top; border-radius: 10px; display: block; margin-bottom: 12px; }
.in-mini__name { margin: 0; font-size: 1.1875rem; letter-spacing: -.02em; }
.in-mini__role { font-size: 0.875rem; font-weight: 500; color: var(--dd-green-accent); }

@media (max-width:1100px) { .in-team4 { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .in-team4 { grid-template-columns: minmax(0,1fr); } }