/* Layout adapters for independent surfaces. Shared roles live in identity.css. */
.je-surface { height: auto; min-height: 100dvh; font: 400 var(--je-body-size)/var(--je-body-leading) var(--font-body); }
.je-surface *, .je-surface *::before, .je-surface *::after { box-sizing: border-box; border-radius: 0; }
.je-surface a { text-decoration: none; text-underline-offset: 4px; }
.je-surface a:hover { text-decoration: none; }
.je-surface ::selection { background: var(--ink); color: var(--surface); }
.je-surface input, .je-surface select, .je-surface textarea { color: var(--ink); background: var(--surface-2); caret-color: var(--ink); }
.je-surface input::placeholder { color: var(--muted); opacity: 1; }
.je-surface .page, .je-surface .discovery-main { width: 100%; max-width: 1600px; min-height: calc(100dvh - 100px); height: auto; margin: 0 auto; padding: 88px var(--page-gutter) 40px; }
.je-surface .surface-heading { margin: 0 0 48px; }
.je-surface .surface-title { max-width: 1100px; margin: 16px 0; overflow-wrap: anywhere; text-wrap: balance; }
.je-surface .subtitle { max-width: 70ch; margin: 24px 0 0; color: var(--muted); font: 400 12px/1.6 var(--font-body); letter-spacing: .08em; text-transform: uppercase; }
.je-surface .meta { color: var(--muted); font: 400 11px/1.5 var(--font-body); letter-spacing: .09em; text-transform: uppercase; }
.je-surface .footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px 32px; margin: 64px 0 0; padding: 24px 0 0; }
.je-surface .footer a:hover { text-decoration: underline; }
.je-surface .skip-link { position: absolute; left: 20px; top: -100px; z-index: 1000; padding: 12px; background: var(--ink); color: var(--surface); transform: none; }
.je-surface .skip-link:focus { top: 10px; }
/* CV uses the same reading hierarchy as the profile's WordPress content. */
.surface-cv .cv-content { width: min(100%, 70ch); margin: 0 auto; padding: 0; overflow-wrap: anywhere; }
.surface-cv .cv-content h2 { margin: 56px 0 24px; font: 500 28px/1.2 var(--font-display); letter-spacing: 0; }
.surface-cv .cv-content h2:first-child { margin-top: 0; }
.surface-cv .cv-content h3 { margin: 32px 0 16px; font: 500 20px/1.4 var(--font-display); }
.surface-cv .cv-content p, .surface-cv .cv-content ul { max-width: none; margin: 0 0 24px; }
.surface-cv .cv-content li { margin-bottom: 8px; }
.surface-cv .cv-content .content-resource { display: grid; grid-template-columns: 22px minmax(0, 1fr) 22px; align-items: center; gap: 16px; padding: 16px 12px; font: 400 15px/1.55 var(--font-body); }
.surface-cv .content-resource svg { width: 22px; height: 22px; }
.surface-cv .content-resource-title { display: block; overflow-wrap: anywhere; font-weight: 400; }
.surface-cv .content-resource-action { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.surface-cv .cv-content a:not(.content-resource) { text-decoration: underline; text-decoration-thickness: 1px; }
.surface-cv .cv-content .content-resource:hover { background: color-mix(in srgb, var(--ink) 5%, var(--surface)); }
/* Links follow the contact page's grouped directory rhythm. */
.surface-links .link-group { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(24px, 6vw, 100px); margin: 0 0 56px; }
.surface-links .directory-head { display: block; margin: 10px 0 0; }
.surface-links .directory-head h2 { margin: 0; font: 500 var(--je-section-size)/1.2 var(--font-display); overflow-wrap: break-word; hyphens: auto; }
.surface-links .directory-count { display: none; }
.surface-links .link-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 0 24px; }
.surface-links .link-list li { display: flex; min-width: 0; margin: 0; }
.surface-links .link-row { align-items: center; width: 100%; min-width: 0; min-height: 60px; padding: 12px; gap: 16px; font: 400 15px/1.5 var(--font-body); }
.surface-links .link-row:hover { background: var(--surface-2); }
.surface-links .link-label { gap: 18px; overflow-wrap: anywhere; }
.surface-links .link-icon { width: 28px; height: 28px; flex-basis: 28px; }
.surface-links .link-icon img { width: 28px; height: 28px; }
.surface-links .link-indicator { color: var(--ink); }
/* Vault keeps its browsing tools, using the main site's directory and type scale. */
.surface-nav { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 0 0 48px; padding: 0 0 12px; }
.surface-nav a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 12px; color: var(--muted); }
.surface-nav a[aria-current], .surface-nav a:hover { color: var(--ink); }
.surface-nav a[aria-current]::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.surface-vault .lead { max-width: 48ch; font-size: clamp(19px, 2.3vw, 28px); line-height: 1.65; color: var(--ink); margin: 0 0 64px; }
.vault-areas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 100px; margin: 64px 0; }
.vault-areas a { min-width: 0; }
.vault-areas h2 { display: flex; align-items: center; justify-content: space-between; gap: 24px; font: 500 clamp(38px, 4vw, 64px)/1.15 var(--font-display); margin: 0 0 20px; }
.vault-areas p { max-width: 38ch; color: var(--muted); margin: 0; font-size: 16px; }
.resource-row { display: block; padding: 28px 0; }
.resource-row h2 { font: 500 26px/1.25 var(--font-display); margin: 0 0 12px; }
.resource-row p { max-width: 70ch; margin: 0; color: var(--muted); font-size: 14px; }
.resource-row svg { width: 20px; height: 20px; margin-left: 12px; }
.surface-vault .discovery-layout { grid-template-columns: 230px minmax(0, 1fr); gap: 36px; }
.surface-vault .filter-panel { display: grid; gap: 16px; border: 0; background: transparent; }
.surface-vault .filter-panel > h2 { margin: 0; font: 500 20px/1.3 var(--font-display); }
.surface-vault .filter-panel > a { font-size: 12px; color: var(--muted); }
.surface-vault .filter-panel > label, .surface-vault .filter-disclosure { border: 0; padding: 0; }
.surface-vault .filter-disclosure summary { min-height: 44px; padding: 8px 0; text-transform: none; letter-spacing: 0; font-size: 14px; }
.surface-vault .filter-disclosure[open] { background: transparent; }
.surface-vault .filter-disclosure[open] summary { border: 0; }
.surface-vault .select-stack { padding: 8px 0; gap: 12px; scrollbar-color: var(--muted) var(--surface); }
.surface-vault .select-stack label { font-size: 12px; line-height: 1.55; }
.surface-vault .select-stack input { accent-color: var(--ink); }
.surface-vault .filter-panel .select-control, .surface-vault .search-control span { font-size: 12px; letter-spacing: 0; text-transform: none; }
.surface-vault input:not([type=checkbox]), .surface-vault select { min-height: 44px; border: 0; padding: 12px; font-size: 13px; }
.surface-vault button { min-height: 44px; font: 400 13px/1.5 var(--font-body); letter-spacing: 0; text-transform: none; }
.surface-vault .filter-panel > button { border: 0; }
.surface-vault .result-toolbar { flex-wrap: wrap; border: 0; gap: 16px 20px; margin-bottom: 24px; }
.surface-vault .result-toolbar > a { font-size: 12px; color: var(--muted); }
.surface-vault .show-list, .surface-vault .show-result { border: 0; }
.surface-vault .show-result { grid-template-columns: 128px minmax(0, 1fr); gap: 24px; padding: 28px 0 40px; }
.surface-vault .show-cover { width: 100%; max-width: none; border: 0; }
.surface-vault .show-cover img { object-fit: cover; }
.surface-vault .show-cover > span { display: grid; height: 100%; place-items: center; font: 500 48px/1 var(--font-display); }
.surface-vault .show-result h2 { font: 500 25px/1.25 var(--font-display); letter-spacing: -.015em; margin: 0 0 10px; overflow-wrap: anywhere; }
.surface-vault .show-result p { line-height: 1.8; }
.surface-vault .show-summary { color: var(--ink); font-size: 14px; max-width: 70ch; margin: 0 0 16px; }
.surface-vault .result-kicker, .surface-vault .meta-line { font-size: 11px; letter-spacing: 0; text-transform: none; line-height: 1.6; }
.surface-vault .result-kicker { margin-bottom: 10px; }
.surface-vault .meta-line { margin: 0 0 16px; }
.surface-vault .tag-row { gap: 8px 16px; margin: 0 0 16px; color: var(--muted); font-size: 12px; }
.surface-vault .external-links { gap: 8px 16px; }
.surface-vault .external-links a { display: inline-flex; gap: 5px; align-items: center; font-size: 12px; }
.surface-vault .external-links svg { width: 14px; height: 14px; }
.surface-vault .pagination { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; margin-top: 36px; font-size: 13px; }
@media (max-width: 900px) {
  .je-surface .page, .je-surface .discovery-main { padding-top: 60px; }
  .surface-links .link-group { grid-template-columns: 1fr; gap: 16px; }
  .surface-vault .discovery-layout { grid-template-columns: 190px minmax(0, 1fr); gap: 24px; }
  .surface-vault .show-result { grid-template-columns: 88px minmax(0, 1fr); gap: 18px; }
  .surface-vault .show-result h2 { font-size: 22px; }
  .vault-areas { gap: 56px; }
}
@media (max-width: 680px) {
  .je-surface .surface-heading { margin-bottom: 36px; }
  .je-surface .footer { margin-top: 40px; flex-direction: column; gap: 16px; }
  .surface-cv .cv-content h2 { font-size: 24px; margin-top: 48px; }
  .surface-links .directory-head h2 { font-size: 32px; }
  .surface-links .link-group { margin-bottom: 40px; }
  .surface-links .link-list { grid-template-columns: 1fr; }
  .surface-links .link-row { padding: 12px 0; }
  .surface-nav { gap: 4px 20px; margin-bottom: 32px; }
  .surface-nav a { font-size: 13px; }
  .surface-vault .lead { font-size: 17px; margin-bottom: 32px; }
  .vault-areas { grid-template-columns: 1fr; gap: 40px; margin: 40px 0; }
  .vault-areas h2 { font-size: 36px; }
  .surface-vault .discovery-layout { grid-template-columns: 1fr; gap: 32px; }
  .surface-vault .filter-panel { position: static; }
  .surface-vault .show-result { grid-template-columns: 72px minmax(0, 1fr); gap: 16px; padding: 24px 0 32px; }
  .surface-vault .show-result h2 { font-size: 20px; }
  .surface-vault .result-toolbar { align-items: flex-start; }
  .surface-vault .result-toolbar label { flex-direction: column; align-items: flex-start; }
  .surface-vault .tag-row, .surface-vault .external-links a { font-size: 11px; }
  .podcast-detail .show-summary { display: block; overflow: visible; -webkit-line-clamp: unset; }
}
@media (prefers-reduced-motion: no-preference) {
  .surface-links .link-indicator, .vault-areas svg { transition: transform .25s; }
  .surface-links .link-row:hover .link-indicator, .vault-areas a:hover svg { transform: translate(3px, -3px); }
}
/* The independent CV retains its original portrait above the reading column. */
.surface-cv .cv-heading { display: grid; grid-template-columns: minmax(0, 1fr) 190px; align-items: center; gap: 48px; margin-bottom: 64px; }
.cv-portrait { margin: 0; width: 100%; }
.cv-portrait img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; filter: grayscale(1); }
@media (max-width: 680px) {
  .surface-cv .cv-heading { grid-template-columns: 1fr; gap: 24px; margin-bottom: 40px; }
  .surface-cv .cv-portrait { max-width: 190px; }
}
.surface-links .subtitle{text-transform:none;letter-spacing:0;font-size:16px;max-width:52ch;line-height:1.65}
