/* Components. Each block is one reusable element; variants are modifier classes. */

/* Layout primitives */
.wrap{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section-block)}
.section--surface{background:var(--color-surface)}
.measure{max-width:var(--measure)}
@media(max-width:700px){.section{padding-block:var(--section-block-sm)}}

/* Text styles */
.eyebrow{font-size:var(--text-xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--color-accent-strong);font-weight:var(--weight-text-strong);margin-bottom:var(--space-6)}
.label{font-size:var(--text-xs);letter-spacing:var(--tracking-caps-sm);text-transform:uppercase;color:var(--color-ink-2);font-weight:var(--weight-text-strong)}
.lead{font-size:var(--text-lg);line-height:1.6;color:var(--color-ink-2)}
.pull{font-family:var(--font-display);font-size:var(--text-2xl);line-height:1.25;font-weight:var(--weight-display);color:var(--color-ink);max-width:22ch}
.note{font-size:var(--text-sm);color:var(--color-ink-2)}
.prose p+p{margin-top:var(--space-4)}

/* Header */
.header{position:sticky;top:env(safe-area-inset-top,0px);z-index:var(--z-header);background:color-mix(in srgb,var(--color-ground) 88%,transparent);backdrop-filter:blur(8px);border-bottom:var(--rule)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:var(--header-height)}
.brand{text-decoration:none;color:var(--color-ink);display:flex;align-items:center;gap:14px;flex-wrap:nowrap;min-width:0}
.brand__mark{display:block;width:40px;height:40px;flex:0 0 auto}
.brand__mark img{width:40px;height:40px}
.brand__name{font-family:var(--font-display);font-size:22px;font-weight:var(--weight-display-strong)}
.brand__descriptor{font-size:var(--text-xs);letter-spacing:.06em;color:var(--color-ink-2);font-weight:var(--weight-text-medium);padding-left:14px;border-left:var(--rule);white-space:nowrap}
.nav{display:flex;align-items:center;gap:26px;font-size:15.5px;font-weight:var(--weight-text-medium);flex:0 0 auto}
.nav a{text-decoration:none;color:var(--color-ink-2);padding:var(--space-3) 0;white-space:nowrap}
.nav a:hover{color:var(--color-accent-strong)}
.nav .button{padding:0 18px;color:var(--color-on-ink)}
.nav .button:hover{color:#fff}
@media(max-width:1100px){.brand__descriptor{display:none}.nav{gap:20px}}
@media(max-width:860px){.brand__mark,.brand__mark img{width:34px;height:34px}.header .wrap{gap:10px}.nav{gap:16px}.nav a.nav__item--secondary{display:none}}
@media(max-width:400px){.nav{font-size:14px;gap:12px}}

/* Buttons and links */
.button{display:inline-flex;align-items:center;min-height:50px;padding:0 var(--space-6);border-radius:var(--radius-pill);background:var(--color-ink);color:var(--color-on-ink);text-decoration:none;font-weight:var(--weight-text-strong);font-size:var(--text-base);border:0;cursor:pointer;white-space:nowrap}
.button:hover{background:var(--color-accent-strong);color:#fff}
.button--small{min-height:40px;font-size:15px}
.button--ghost{background:transparent;color:var(--color-ink-2);border:var(--rule);min-height:auto;padding:6px 14px;font-size:var(--text-sm)}
.button--ghost:hover{background:transparent;border-color:var(--color-accent);color:var(--color-accent-strong)}
.textlink{font-weight:var(--weight-text-strong);color:var(--color-ink);text-decoration:none;border-bottom:var(--rule);padding-bottom:3px}
.textlink:hover{border-color:var(--color-accent)}
.links{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center}

/* Portrait: a framed photograph, 4:5 on desktop, 4:3 on phones (the page serves separate crops) */
.portrait{aspect-ratio:4/5;max-width:100%;background:var(--color-plate);border:0;border-radius:var(--radius-sm);overflow:hidden;margin:0}
.portrait picture,.portrait__img{display:block;width:100%;height:100%}
.portrait__img{object-fit:cover;object-position:50% 30%}
@media(max-width:860px){.portrait{aspect-ratio:4/3}}

/* Columns (Expertise) */
.columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-9) var(--space-8);margin-top:var(--space-2)}
.column{border-top:var(--rule-strong);padding-top:18px;min-width:0}
.column .label{margin-bottom:10px}
.column h3{margin-bottom:var(--space-3)}
.column p{color:var(--color-ink-2);font-size:16.5px}
@media(max-width:860px){.columns{grid-template-columns:1fr;gap:var(--space-7)}}

/* Results strip (three figures) */
.results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-8);margin:var(--space-9) 0 60px;padding:30px 0;border-top:var(--rule);border-bottom:var(--rule)}
.results__figure{font-family:var(--font-display);font-size:var(--text-figure-lg);line-height:1.1;color:var(--color-accent-strong);margin-bottom:var(--space-3);font-variant-numeric:tabular-nums}
.results h3{font-family:var(--font-text);font-size:18px;font-weight:var(--weight-text-strong);line-height:1.4;margin-bottom:10px}
.results p:last-child{font-size:var(--text-base);color:var(--color-ink-2)}
@media(max-width:700px){.results{grid-template-columns:1fr;gap:var(--space-7);margin-block:30px var(--space-9)}.results>div+div{border-top:var(--rule);padding-top:var(--space-6)}}

/* Roles list */
.roles{border-top:var(--rule-strong)}
.roles li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px var(--space-5);padding:14px 0;border-bottom:var(--rule);align-items:baseline}
.roles b{font-weight:var(--weight-text-strong);display:block}
.roles span{color:var(--color-ink-2);font-size:15.5px}
.roles__org{color:var(--color-ink-2);font-size:14.5px;text-align:right;white-space:nowrap}
@media(max-width:520px){.roles li{grid-template-columns:1fr}.roles__org{text-align:left;white-space:normal}}

/* Credentials block */
.credentials{margin-top:var(--space-6);font-size:var(--text-base);color:var(--color-ink-2);line-height:1.7}
.credentials .eyebrow{margin-bottom:var(--space-4)}
.credentials p+p{margin-top:var(--space-5)}

/* Examples list (leadership examples) */
.examples{display:grid;gap:var(--space-7)}
.examples li{padding:0 0 27px;border-bottom:var(--rule)}
.examples__key{font-family:var(--font-display);font-size:var(--text-figure);line-height:1;font-weight:var(--weight-display);color:var(--color-accent-strong);font-variant-numeric:tabular-nums}
.examples__title{font-weight:var(--weight-text-strong);margin:var(--space-3) 0 var(--space-1)}
.examples p{color:var(--color-ink-2);font-size:var(--text-base)}

/* Contact block */
.contact{border-top:var(--rule-strong);padding-top:var(--space-6);display:grid;gap:18px}
.contact .label{margin-bottom:0}
.contact__value{font-family:var(--font-display);font-size:var(--text-xl);font-weight:var(--weight-display);word-break:break-word}
.contact a.contact__value{text-decoration:none;border-bottom:var(--rule)}
.contact a.contact__value:hover{border-color:var(--color-accent)}
.contact__pending{font-size:var(--text-base);color:var(--color-ink-2)}

/* Footer */
.footer{padding-block:var(--space-7) var(--space-9);border-top:var(--rule);font-size:var(--text-sm);color:var(--color-ink-2)}
.footer .wrap{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-7);justify-content:space-between}
.footer a{color:var(--color-ink-2);text-decoration:none}
.footer a:hover{color:var(--color-ink)}

/* Status badge (legal pages while content is pending) */
.badge{display:inline-block;font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;font-weight:var(--weight-text-strong);color:var(--color-accent-strong);border:var(--rule);border-radius:var(--radius-pill);padding:4px 12px;margin-bottom:var(--space-6)}