/* emmanuelnyame.com: shared styles for the inner pages (About, Speaking, Books, Press, Contact) and the footer on every page.
   Same tokens as the homepage: black and white, Geist for text, Onest for headings, Geist Mono for small labels.
   Square buttons with slightly rounded corners (6px). Photos in black and white, colour on hover. */
:root {
  --black: #0a0a0a; --ink-2: #161616; --white: #f5f5f3; --paper: #ffffff; --grey: #8a8a86; --soft: #c9c9c5;
  --line: rgba(245, 245, 243, .16); --line-d: rgba(10, 10, 10, .12);
  --sans: "Geist", "Helvetica Neue", Arial, sans-serif;
  --head: "Onest", "Geist", "Helvetica Neue", Arial, sans-serif;
  --mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --gut: max(20px, env(safe-area-inset-left, 0px));
  color-scheme: dark;
}

/* ---------- inner pages ---------- */
body.inner { margin: 0; background: var(--black); color: var(--white); font-family: var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.inner * { box-sizing: border-box; }
.inner a { color: inherit; text-decoration: none; }
.inner :focus-visible { outline: 1.5px solid currentColor; outline-offset: 4px; border-radius: 4px; }
.inner img { max-width: 100%; }
.inner .wrap { max-width: 1320px; margin: 0 auto; padding: 0 clamp(20px, 3vw, 40px); }

/* nav (same as the homepage) */
.inner .nav { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 84px;
  padding: env(safe-area-inset-top, 0px) clamp(20px, 3vw, 32px) 0; background: rgba(10, 10, 10, .82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid transparent; transition: border-color .3s; }
.inner .nav.scrolled { border-bottom-color: var(--line); }
.inner .logo { display: inline-flex; align-items: baseline; font: 500 20px/1 var(--head); letter-spacing: -0.03em; text-transform: lowercase; }
.inner .logo i { font-style: normal; color: var(--grey); }
.inner .links { display: flex; align-items: center; gap: 36px; list-style: none; margin: 0; padding: 0; }
.inner .links a { font: 400 14px/1 var(--sans); color: var(--grey); transition: color .2s; }
.inner .links a:hover, .inner .links a[aria-current="page"] { color: var(--white); }
.inner .nav-r { display: flex; align-items: center; gap: 10px; }
.inner .contact { display: inline-flex; align-items: center; height: 42px; padding: 0 22px; border-radius: 6px; background: var(--white); color: var(--black); font: 500 14px/1 var(--sans); transition: background .2s; }
.inner .contact:hover { background: #ffffff; }
.menu-btn { display: none; width: 42px; height: 42px; border-radius: 6px; border: 1px solid var(--line); background: transparent; position: relative; cursor: pointer; padding: 0; }
.menu-btn i { position: absolute; left: 12px; right: 12px; height: 1.5px; background: var(--white); transition: transform .3s ease, top .3s ease; }
.menu-btn i:first-child { top: 16px; } .menu-btn i:last-child { top: 24px; }
.menu-btn.x i:first-child { top: 20px; transform: rotate(45deg); } .menu-btn.x i:last-child { top: 20px; transform: rotate(-45deg); }
.inner .mnav { position: fixed; inset: 0; z-index: 30; background: var(--black); display: flex; flex-direction: column; padding: calc(21px + env(safe-area-inset-top, 0px)) 20px calc(28px + env(safe-area-inset-bottom, 0px)); opacity: 0; transition: opacity .35s ease; }
.inner .mnav.on { opacity: 1; }
.inner .mnav[hidden] { display: none; }
.inner .mnav-top { display: flex; align-items: center; justify-content: space-between; height: 42px; }
.inner .mnav nav { margin-top: 40px; display: flex; flex-direction: column; }
.inner .mnav nav a { font: 400 40px/1.15 var(--sans); letter-spacing: -0.03em; padding: 10px 0; border-bottom: 1px solid var(--line); opacity: 0; transform: translateY(12px); transition: opacity .45s ease, transform .45s ease; }
.inner .mnav.on nav a { opacity: 1; transform: none; }
.inner .mnav.on nav a:nth-child(2) { transition-delay: .05s; } .inner .mnav.on nav a:nth-child(3) { transition-delay: .1s; } .inner .mnav.on nav a:nth-child(4) { transition-delay: .15s; } .inner .mnav.on nav a:nth-child(5) { transition-delay: .2s; } .inner .mnav.on nav a:nth-child(6) { transition-delay: .25s; }
.inner .mnav-foot { margin: auto 0 0; font: 400 11px/1.5 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--grey); }
html.menu-open, html.menu-open body { overflow: hidden; }
@media (max-width: 860px) { .inner .links { display: none; } .inner .nav { height: 72px; } .inner .logo { font-size: 18px; } }
@media (max-width: 760px) { .menu-btn { display: block; } .inner .nav-r .contact { padding: 0 16px; } }

/* labels, headings, text */
.kick { display: block; margin: 0 0 20px; font: 500 13px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--grey); }
.h1 { margin: 0 0 0 -0.045em; font: 700 clamp(48px, 8.4vw, 136px)/0.95 var(--head); letter-spacing: -0.05em; text-wrap: balance; }
.h1 em, .h2 em { font-style: normal; color: var(--grey); }
.h2 { margin: 0 0 0 -0.035em; font: 700 clamp(36px, 4.6vw, 72px)/1 var(--head); letter-spacing: -0.04em; text-wrap: balance; }
.h3 { margin: 0; font: 600 clamp(20px, 1.7vw, 26px)/1.15 var(--head); letter-spacing: -0.025em; }
.lede { margin: 28px 0 0; max-width: 44ch; font: 300 clamp(18px, 1.5vw, 22px)/1.5 var(--sans); color: var(--soft); text-wrap: pretty; }
.body { font: 300 clamp(16px, 1.15vw, 18px)/1.7 var(--sans); color: var(--soft); }
.body p { margin: 0 0 1.1em; max-width: 62ch; }
.body b, .body strong { font-weight: 500; color: var(--white); }
.mono { font: 400 12px/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--grey); }

/* buttons: square with slightly rounded corners */
.inner .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 56px; padding: 0 30px; border-radius: 6px; border: 0; font: 500 16px/1 var(--sans); cursor: pointer; transition: background .2s, color .2s, box-shadow .2s; }
.btn.light { background: var(--white); color: var(--black); }
.btn.light:hover { background: #ffffff; }
.btn.ghost { box-shadow: inset 0 0 0 1px var(--line); color: var(--white); background: none; }
.btn.ghost:hover { box-shadow: inset 0 0 0 1px var(--white); }
.btn.dark { background: var(--black); color: var(--white); }
.btn.dark:hover { background: #2a2a2a; }
.btn.line-d { box-shadow: inset 0 0 0 1.5px var(--black); color: var(--black); background: none; }
.btn.line-d:hover { background: var(--black); color: var(--white); }
.btn svg { width: 16px; height: 16px; }
.row { display: flex; flex-wrap: wrap; gap: 12px; }

/* page hero */
.hero { padding: clamp(56px, 8vw, 120px) 0 clamp(56px, 7vw, 104px); }
.hero.split .wrap { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: clamp(32px, 5vw, 80px); align-items: end; }
.hero .pic { position: relative; aspect-ratio: 4 / 5; border-radius: 6px; overflow: hidden; background: var(--ink-2); }
.hero .pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) { .hero.split .wrap { grid-template-columns: minmax(0, 1fr); } .hero .pic { max-width: 420px; } }

/* photos: black and white, colour on hover */
.bw { filter: grayscale(1); transition: filter .7s ease, transform 1.2s cubic-bezier(.2,.8,.15,1); }
@media (hover: hover) { .bw:hover, a:hover .bw, figure:hover .bw { filter: grayscale(0); } }

/* sections */
.sec { padding: clamp(80px, 10vw, 152px) 0; }
.sec.white { background: var(--paper); color: var(--black); }
.sec.white .body, .sec.white .lede { color: #4a4a47; font-weight: 400; }
.sec.white .body b, .sec.white .body strong { color: var(--black); }
.sec.white .kick, .sec.white .mono { color: #6f6f6b; }
.sec.white .h1 em, .sec.white .h2 em { color: #a3a3a0; }
.sec.line { border-top: 1px solid var(--line); }
.sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); align-items: end; margin-bottom: clamp(40px, 5vw, 72px); }
.sec-head .lede { margin: 0; }
@media (max-width: 900px) { .sec-head { grid-template-columns: minmax(0, 1fr); } }
.two { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 112px); }
@media (max-width: 900px) { .two { grid-template-columns: minmax(0, 1fr); } }
.sticky { position: sticky; top: 120px; align-self: start; }
@media (max-width: 900px) { .sticky { position: static; } }

/* list rows (timeline, press, appearances) */
.rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.sec.white .rows { border-top-color: var(--line-d); }
.rows > li { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: clamp(16px, 3vw, 40px); align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--line); }
.sec.white .rows > li { border-bottom-color: var(--line-d); }
.rows .yr { font: 400 13px/1.4 var(--mono); letter-spacing: .1em; color: var(--grey); }
.rows .what { font: 500 clamp(17px, 1.4vw, 21px)/1.35 var(--head); letter-spacing: -0.015em; }
.rows .what small { display: block; margin-top: 6px; font: 300 15px/1.5 var(--sans); letter-spacing: 0; color: var(--grey); }
.rows .tag { font: 400 11px/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--grey); white-space: nowrap; }
.rows a.what:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.rows .arrow { display: inline-block; margin-left: 6px; transition: transform .25s; }
.rows a:hover .arrow { transform: translate(3px, -3px); }
@media (max-width: 640px) { .rows > li { grid-template-columns: 64px minmax(0, 1fr); } .rows .tag { grid-column: 2; } }

/* cards */
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
.grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
@media (max-width: 980px) { .grid3, .grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .grid3, .grid2, .grid4 { grid-template-columns: minmax(0, 1fr); } }
.card { padding: clamp(24px, 2.4vw, 36px); border-radius: 8px; box-shadow: inset 0 0 0 1px var(--line); display: flex; flex-direction: column; gap: 12px; transition: box-shadow .3s, transform .4s cubic-bezier(.2,.8,.15,1); }
.sec.white .card { box-shadow: inset 0 0 0 1px var(--line-d); }
.card .n { font: 400 12px/1 var(--mono); letter-spacing: .14em; color: var(--grey); }
.card p { margin: 0; font: 300 15.5px/1.6 var(--sans); color: var(--soft); }
.sec.white .card p { color: #4a4a47; }
@media (hover: hover) { .card:hover { box-shadow: inset 0 0 0 1px var(--white); } .sec.white .card:hover { box-shadow: inset 0 0 0 1px var(--black); } }

.photo { margin: 0; border-radius: 6px; overflow: hidden; background: var(--ink-2); }
.photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.photo figcaption { padding: 12px 0 0; font: 400 12px/1.5 var(--mono); letter-spacing: .06em; color: var(--grey); background: var(--black); }
.sec.white .photo figcaption { background: var(--paper); color: #6f6f6b; }

/* quotes */
.quotes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
@media (max-width: 980px) { .quotes { grid-template-columns: minmax(0, 1fr); } }
.tq { margin: 0; padding: clamp(26px, 2.6vw, 36px); border-radius: 8px; background: var(--ink-2); color: var(--white); display: flex; flex-direction: column; justify-content: space-between; gap: 28px; font-family: var(--sans); }
.tq blockquote { margin: 0; }
.tq p { margin: 0; font: 400 17px/1.6 var(--sans); letter-spacing: -0.005em; color: #e4e4e0; }
.tq p::before { content: "“"; } .tq p::after { content: "”"; }
.tq figcaption { display: flex; align-items: center; gap: 14px; padding-top: 20px; border-top: 1px solid var(--line); }
.tq figcaption img { width: 52px; height: 52px; flex: none; border-radius: 50%; object-fit: cover; object-position: 50% 30%; }
.tq figcaption b { display: block; font: 600 16px/1.25 var(--head); letter-spacing: -0.01em; color: var(--white); }
.tq figcaption span span { display: block; margin-top: 3px; font: 400 13px/1.35 var(--sans); color: var(--grey); }

/* chips (Press filters) */
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; }
.chip { height: 38px; padding: 0 16px; border-radius: 6px; border: 0; background: none; box-shadow: inset 0 0 0 1px var(--line); color: var(--grey); font: 400 14px/1 var(--sans); cursor: pointer; transition: all .2s; }
.chip:hover { color: var(--white); box-shadow: inset 0 0 0 1px var(--white); }
.chip[aria-pressed="true"] { background: var(--white); color: var(--black); box-shadow: none; }

/* form */
.form { display: grid; gap: 14px; }
.form .pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 640px) { .form .pair { grid-template-columns: minmax(0, 1fr); } }
.field { display: grid; gap: 8px; }
.field label { font: 400 12px/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--grey); }
.field input, .field select, .field textarea { width: 100%; min-height: 56px; padding: 16px; border-radius: 6px; border: 1px solid var(--line); background: var(--ink-2); color: var(--white); font: 400 16px/1.4 var(--sans); appearance: none; -webkit-appearance: none; }
.field textarea { min-height: 170px; resize: vertical; }
.field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8a86' stroke-width='1.8'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px; padding-right: 44px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--white); }
.field input::placeholder, .field textarea::placeholder { color: #5f5f5c; }
.note { margin: 4px 0 0; font: 300 14px/1.5 var(--sans); color: var(--grey); }
.note[data-ok] { color: var(--white); }

/* reveal on scroll */
.rv { opacity: 0; transform: translateY(18px); transition: opacity .9s ease, transform .9s cubic-bezier(.2,.8,.15,1); }
.rv.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .rv { opacity: 1; transform: none; transition: none; } .bw { transition: none; } }

/* cursor with a name tag (same as the homepage) */
.cursor { position: fixed; z-index: 50; left: 0; top: 0; pointer-events: none; display: none; will-change: transform; mix-blend-mode: difference; }
.cursor svg { display: block; width: 20px; height: 20px; }
.cursor b { position: absolute; left: 16px; top: 18px; padding: 5px 9px; border-radius: 999px 999px 999px 4px; background: var(--white); color: var(--black); font: 500 12px/1 var(--sans); white-space: nowrap; }
@media (hover: hover) and (pointer: fine) { body.has-cursor .cursor { display: block; } body.has-cursor, body.has-cursor a, body.has-cursor button, body.has-cursor select { cursor: none; } body.has-cursor input, body.has-cursor textarea { cursor: text; } }

/* ---------- footer (every page, homepage included) ---------- */
.foot { background: var(--black); color: var(--white); border-top: 1px solid var(--line); font-family: var(--sans); padding: clamp(72px, 9vw, 128px) 0 calc(28px + env(safe-area-inset-bottom, 0px)); }
.foot * { box-sizing: border-box; }
.foot a { color: inherit; text-decoration: none; }
.foot .wrap { max-width: 1320px; margin: 0 auto; padding: 0 clamp(20px, 3vw, 40px); }
.foot-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: end; padding-bottom: clamp(56px, 7vw, 96px); border-bottom: 1px solid var(--line); }
.foot-cta h2 { margin: 0; font: 700 clamp(44px, 7vw, 112px)/0.95 var(--head); letter-spacing: -0.05em; }
.foot-cta h2 em { font-style: normal; color: var(--grey); }
.foot-cta a { display: inline-flex; align-items: center; justify-content: center; justify-self: start; margin-bottom: calc(clamp(44px, 7vw, 112px) * 0.475 - 28px); height: 56px; padding: 0 30px; border-radius: 6px; background: var(--white); color: var(--black); font: 500 16px/1 var(--sans); white-space: nowrap; }
.foot-cta a:hover { background: #ffffff; }
.foot-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 32px; padding: 48px 0; }
.foot-grid .logo { display: inline-flex; font: 500 22px/1 var(--head); letter-spacing: -0.03em; text-transform: lowercase; }
.foot-grid .logo i { font-style: normal; color: var(--grey); }
.foot-grid p { margin: 14px 0 0; max-width: 32ch; font: 300 15px/1.6 var(--sans); color: var(--grey); }
.foot-grid h3 { margin: 0 0 16px; font: 400 11px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--grey); }
.foot-grid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.foot-grid li a { font: 400 15px/1.3 var(--sans); color: #d6d6d2; transition: color .2s; }
.foot-grid li a:hover { color: var(--white); }
.foot-base { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 24px; padding-top: 24px; border-top: 1px solid var(--line); font: 400 14px/1.5 var(--sans); color: var(--grey); }
.foot-base a:hover { color: var(--white); }
@media (max-width: 860px) { .foot-cta { grid-template-columns: minmax(0, 1fr); } .foot-cta a { margin-bottom: 0; } .foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .foot-grid > div:first-child { grid-column: 1 / -1; } }

/* About (wiki style, 28 Oct): wide photo, then an encyclopedia-style article with contents, numbered sections,
   a summary box on the right, an honours table and numbered references. */
.wide-photo { margin: 0; }
.wide-photo img { display: block; width: 100%; max-width: none; height: clamp(320px, 62vw, 860px); object-fit: cover; object-position: 50% 40%; }
.wide-photo figcaption { padding-top: 14px; padding-bottom: 40px; font: 400 12px/1.5 var(--mono); letter-spacing: .06em; color: var(--grey); }
.wiki { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: clamp(32px, 5vw, 88px); align-items: start; }
.infobox { grid-column: 2; grid-row: 1; position: sticky; top: 108px; border-radius: 8px; box-shadow: inset 0 0 0 1px var(--line-d); padding: 14px; font: 400 14px/1.45 var(--sans); color: var(--black); }
.infobox img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; border-radius: 4px; }
.ib-name { margin: 14px 4px 10px; font: 600 18px/1.2 var(--head); letter-spacing: -0.02em; }
.infobox dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); }
.infobox dt, .infobox dd { margin: 0; padding: 9px 4px; border-top: 1px solid var(--line-d); }
.infobox dt { font: 400 11px/1.6 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #6f6f6b; padding-right: 14px; }
.article { grid-column: 1; grid-row: 1; max-width: 760px; color: #2b2b29; font: 400 clamp(16px, 1.1vw, 17.5px)/1.75 var(--sans); }
.article p { margin: 0 0 1.1em; }
.article .lead { font-size: clamp(18px, 1.4vw, 21px); line-height: 1.6; color: var(--black); }
.article b { font-weight: 500; color: var(--black); }
.article a:not(.ref) { text-decoration: underline; text-decoration-color: #b9b9b5; text-underline-offset: 3px; }
.article a:not(.ref):hover { text-decoration-color: var(--black); }
.article h2 { display: flex; gap: 14px; align-items: baseline; margin: 56px 0 18px; padding-bottom: 12px; border-bottom: 1px solid var(--line-d); font: 600 clamp(24px, 2.2vw, 32px)/1.15 var(--head); letter-spacing: -0.03em; color: var(--black); scroll-margin-top: 104px; }
.article h3 { display: flex; gap: 12px; align-items: baseline; margin: 32px 0 10px; font: 600 19px/1.25 var(--head); letter-spacing: -0.02em; color: var(--black); scroll-margin-top: 104px; }
.article h2 span, .article h3 span { font: 400 12px/1 var(--mono); letter-spacing: .08em; color: #8a8a86; }
.article .ref { font: 500 11px/1 var(--mono); vertical-align: super; margin-left: 1px; color: #6f6f6b; }
.article .ref:hover { color: var(--black); }
.toc { margin: 32px 0 8px; padding: 22px 26px; border-radius: 8px; background: #f4f4f2; display: inline-block; min-width: min(100%, 360px); }
.toc > p { margin: 0 0 10px; font: 400 11px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: #6f6f6b; }
.toc ol { margin: 0; padding-left: 20px; font-size: 15px; line-height: 1.8; }
.toc ol ol { padding-left: 18px; list-style: lower-alpha; }
.toc a { text-decoration: none !important; }
.toc a:hover { text-decoration: underline !important; }
.tbl { overflow-x: auto; margin: 0 0 1.2em; }
.article table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.article th { text-align: left; padding: 10px 12px; font: 400 11px/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: #6f6f6b; border-bottom: 1px solid var(--black); }
.article td { padding: 11px 12px; border-bottom: 1px solid var(--line-d); vertical-align: top; }
.article td:first-child { font-family: var(--mono); font-size: 13px; color: #6f6f6b; white-space: nowrap; }
.refs { margin: 0; padding-left: 22px; font-size: 14.5px; line-height: 1.6; color: #4a4a47; }
.refs li { margin-bottom: 8px; scroll-margin-top: 110px; }
.refs li:target { background: #f1f1ee; border-radius: 4px; }
@media (max-width: 900px) {
  .wiki { grid-template-columns: minmax(0, 1fr); }
  .infobox { grid-column: 1; grid-row: 1; position: static; max-width: 440px; }
  .article { grid-row: 2; }
}

/* Press (28 Oct): grouped under headings, filled by the daily search (data/press.json). */
.press-group { margin-top: clamp(48px, 6vw, 80px); }
.press-group:first-of-type { margin-top: 0; }
.press-group > h2 { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 18px; font: 700 clamp(26px, 2.6vw, 40px)/1.05 var(--head); letter-spacing: -0.035em; }
.press-group > h2 small { font: 400 12px/1 var(--mono); letter-spacing: .12em; color: var(--grey); }
.press-new { display: inline-block; margin-left: 8px; padding: 3px 7px; border-radius: 4px; background: var(--white); color: var(--black); font: 500 10px/1 var(--mono); letter-spacing: .12em; vertical-align: 3px; }

/* About as a story (28 Oct): one narrative column in chapters, broken by large quotes in Emmanuel's own words. */
.story .wrap { max-width: 1100px; }
.chapter { max-width: 720px; margin: 0 auto 0 0; }
.chapter + .chapter { margin-top: 8px; }
.story-body { font: 400 clamp(17px, 1.25vw, 19.5px)/1.75 var(--sans); color: #2b2b29; }
.story-body p { margin: 0 0 1.15em; }
.story-body b { font-weight: 500; color: var(--black); }
.story-body a { text-decoration: underline; text-decoration-color: #b9b9b5; text-underline-offset: 3px; }
.story-body .drop { font-size: clamp(21px, 1.8vw, 26px); line-height: 1.55; color: var(--black); }
.story .kick { margin-top: clamp(48px, 6vw, 88px); }
.story .chapter:first-child .kick { margin-top: 0; }
.pull { margin: clamp(40px, 6vw, 80px) 0; padding: 0; }
.pull p { margin: 0; max-width: 18ch; font: 700 clamp(40px, 5.6vw, 88px)/1.02 var(--head); letter-spacing: -0.045em; color: var(--black); text-wrap: balance; }
.pull p::before { content: "“"; } .pull p::after { content: "”"; }
.pull.small { margin: clamp(32px, 4vw, 56px) 0; padding-left: clamp(18px, 2vw, 28px); border-left: 2px solid var(--black); max-width: 760px; }
.pull.small p { max-width: 28ch; font: 500 clamp(24px, 2.4vw, 36px)/1.2 var(--head); letter-spacing: -0.03em; color: #3a3a37; }
.story-photo { margin: clamp(32px, 4vw, 56px) 0; max-width: 860px; }
.story-photo img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }
.story-photo figcaption { margin-top: 12px; font: 400 13px/1.5 var(--sans); color: #6f6f6b; }
.close-line { margin: 0; max-width: 22ch; font: 700 clamp(36px, 5vw, 80px)/1.04 var(--head); letter-spacing: -0.045em; text-wrap: balance; }

/* On stage (Speaking): photo cards that open the video. */
.stage-card { display: flex; flex-direction: column; gap: 18px; color: inherit; }
.stage-pic { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 6px; overflow: hidden; background: var(--ink-2); }
.stage-pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.stage-card:hover .stage-pic img { filter: grayscale(0); transform: scale(1.03); }
.play { position: absolute; left: 16px; bottom: 16px; width: 48px; height: 48px; border-radius: 50%; background: rgba(245,245,243,.92); display: grid; place-items: center; transition: transform .3s; }
.play svg { width: 18px; height: 18px; fill: var(--black); margin-left: 2px; }
.stage-card:hover .play { transform: scale(1.08); }
.stage-meta { display: grid; gap: 8px; }
.stage-meta .n { font: 500 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--grey); }
.stage-meta > span:not(.n):not(.mono) { font: 300 15.5px/1.55 var(--sans); color: var(--soft); }
.stage-meta .mono { margin-top: 4px; color: var(--white); }

/* Homepage testimonials (same cards as Speaking). */
.home-tq { background: var(--black); color: var(--white); padding: clamp(88px, 10vw, 152px) max(16px, env(safe-area-inset-right, 0px)) clamp(88px, 10vw, 152px) max(16px, env(safe-area-inset-left, 0px)); }
.home-tq-wrap { max-width: 1320px; margin: 0 auto; padding: 0 clamp(20px, 3vw, 40px); }
.home-tq .kick { display: block; margin: 0 0 20px; font: 500 13px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--grey); }
.home-tq h2 { margin: 0 0 clamp(40px, 5vw, 72px) -0.035em; font: 700 clamp(36px, 4.6vw, 72px)/1 var(--head); letter-spacing: -0.04em; }
.home-tq h2 em { font-style: normal; color: var(--grey); }

/* Anything clickable: the cursor turns into a hand, and its name tag inverts. */
.cursor .c-hand { display: none; }
.cursor.on-link .c-arrow { display: none; }
.cursor.on-link .c-hand { display: block; }
.cursor svg.c-hand { width: 24px; height: 24px; margin: -2px 0 0 -6px; }
.cursor b { transition: transform .2s ease; transform-origin: 0 0; }
.cursor.on-link b { transform: scale(1.08); }

/* Press, Muck Rack style (28 Oct): outlet logo, outlet and date, headline; filters hide rows. */
.prs { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.pr { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 20px 0; border-bottom: 1px solid var(--line); }
.pr[hidden], .rows > li[hidden] { display: none; }
.pr-logo { width: 40px; height: 40px; border-radius: 8px; overflow: hidden; background: #fff; display: grid; place-items: center; }
.pr-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.pr-logo.none { background: transparent; }
.pr-logo.none i { font: 600 15px/1 var(--head); font-style: normal; color: var(--grey); }
.pr-body { display: grid; gap: 6px; min-width: 0; }
.pr-meta { font: 400 13px/1.3 var(--sans); color: var(--grey); }
.pr-meta b { font-weight: 500; color: #d6d6d2; }
.pr-title { font: 500 clamp(17px, 1.4vw, 21px)/1.35 var(--head); letter-spacing: -0.015em; color: var(--white); }
.pr-title:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.pr-title .arrow { display: inline-block; margin-left: 6px; transition: transform .25s; }
.pr-title:hover .arrow { transform: translate(3px, -3px); }
.pr .tag { font: 500 11px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--grey); white-space: nowrap; }
@media (max-width: 640px) { .pr { grid-template-columns: 36px minmax(0, 1fr); gap: 14px; } .pr-logo { width: 36px; height: 36px; } .pr .tag { display: none; } }
.writing { align-items: start; }
.wcard { padding: clamp(24px, 2.6vw, 36px); border-radius: 8px; background: var(--ink-2); display: grid; gap: 20px; }
.wcard-head { display: flex; align-items: center; gap: 14px; }
.wcard-head img { width: 40px; height: 40px; border-radius: 8px; background: #fff; }
.wcard-head b { display: block; font: 600 18px/1.2 var(--head); }
.wcard-head span span { display: block; margin-top: 3px; font: 400 13px/1.35 var(--sans); color: var(--grey); }
.wcount { margin: 0; font: 300 16px/1.5 var(--sans); color: var(--soft); }
.wcount b { font: 700 32px/1 var(--head); color: var(--white); margin-right: 6px; }
.wlist { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.wlist li { display: grid; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.wlist a { font: 500 16px/1.4 var(--sans); color: var(--white); }
.wlist a:hover { text-decoration: underline; text-underline-offset: 3px; }
.wlist span { font: 400 13px/1.3 var(--sans); color: var(--grey); }
.wcard .btn { justify-self: start; }

/* Testimonials, v2 (28 Oct): one big quote, the three people as a selector with a progress line. Speaking + homepage. */
.tqx { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.75fr); gap: clamp(32px, 6vw, 112px); align-items: center; font-family: var(--sans); color: var(--white); }
.tqx-stage { position: relative; min-height: clamp(260px, 26vw, 380px); display: flex; align-items: center; }
.tqx-q { margin: 0; animation: tqxIn .8s cubic-bezier(.2,.8,.15,1); }
.tqx-q[hidden] { display: none; }
@keyframes tqxIn { from { opacity: 0; transform: translateY(14px); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }
.tqx-q blockquote { margin: 0; position: relative; }
.tqx-q blockquote::before { content: "“"; position: absolute; left: -0.06em; top: -0.62em; font: 700 clamp(120px, 12vw, 200px)/1 var(--head); color: rgba(245,245,243,.08); pointer-events: none; }
.tqx-q p { position: relative; margin: 0; font: 500 clamp(26px, 2.7vw, 42px)/1.22 var(--head); letter-spacing: -0.03em; color: var(--white); text-wrap: pretty; }
.tqx-q figcaption { display: flex; align-items: baseline; gap: 12px; margin-top: clamp(24px, 3vw, 40px); }
.tqx-q figcaption b { font: 600 16px/1.2 var(--head); }
.tqx-q figcaption span { font: 400 14px/1.3 var(--sans); color: var(--grey); }
.tqx-list { display: grid; gap: 0; border-top: 1px solid var(--line); }
.tqx-who { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; align-items: center; width: 100%; padding: 18px 4px; border: 0; border-bottom: 1px solid var(--line); background: none; color: inherit; text-align: left; cursor: pointer; opacity: .45; transition: opacity .35s; font: inherit; }
.tqx-who:hover, .tqx-who.on { opacity: 1; }
.tqx-who img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 25%; filter: grayscale(1); transition: filter .5s; }
.tqx-who.on img { filter: grayscale(0); }
.tqx-who b { display: block; font: 600 16px/1.2 var(--head); letter-spacing: -0.01em; color: var(--white); }
.tqx-who span span { display: block; margin-top: 3px; font: 400 13px/1.35 var(--sans); color: var(--grey); }
.tqx-bar { position: absolute; left: 0; bottom: -1px; height: 1px; width: 0; background: var(--white); }
.tqx-who.on .tqx-bar { width: 100%; }
.tqx-who.run .tqx-bar { width: 0; animation: tqxBar 8s linear forwards; }
.tqx-who.run.paused .tqx-bar { animation-play-state: paused; }
@keyframes tqxBar { to { width: 100%; } }
.tqx-who:focus-visible { outline: 1.5px solid var(--white); outline-offset: 2px; border-radius: 4px; }
@media (max-width: 900px) {
  .tqx { grid-template-columns: minmax(0, 1fr); }
  .tqx-stage { min-height: 0; order: 2; }
  .tqx-list { order: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 0; }
  .tqx-who { grid-template-columns: minmax(0, 1fr); justify-items: start; gap: 10px; padding: 0 0 14px; }
  .tqx-who img { width: 48px; height: 48px; }
  .tqx-who span span { display: none; }
}
@media (prefers-reduced-motion: reduce) { .tqx-q { animation: none; } }
@media (max-width: 900px) { .tqx-q blockquote::before { display: none; } .tqx { gap: 28px; } .tqx-who b { font-size: 14px; } }
/* Testimonials on phones (28 Oct, E!: "clamped"): quote first, then a clean row of photos only; the name sits under the quote. */
@media (max-width: 900px) {
  .tqx { gap: 32px; }
  .tqx-stage { order: 1; }
  .tqx-list { order: 2; display: flex; gap: 20px; border-top: 0; grid-template-columns: none; }
  .tqx-who { display: block; width: auto; padding: 0 0 12px; border-bottom: 0; opacity: .4; }
  .tqx-who > span { display: none; }
  .tqx-who img { display: block; width: 56px; height: 56px; }
  .tqx-bar { bottom: 0; height: 2px; border-radius: 2px; }
  .tqx-who.on .tqx-bar { width: 100%; }
  .tqx-q p { font-size: 24px; line-height: 1.3; }
  .tqx-q figcaption { flex-direction: column; gap: 4px; margin-top: 20px; }
}
.logo-mark { display: block; height: 30px; width: auto; } .foot-grid .logo-mark { height: 44px; } @media (max-width: 860px) { .logo-mark { height: 42px; } .foot-grid .logo-mark { height: 44px; } }
@media (max-width: 760px) { .logo-mark { height: 28px; } .foot-grid .logo-mark { height: 44px; } .menu-btn { width: 34px; height: 34px; } .menu-btn i { left: 9px; right: 9px; } .menu-btn i:first-child { top: 12.5px; } .menu-btn i:last-child { top: 19.5px; } .menu-btn.x i:first-child, .menu-btn.x i:last-child { top: 16px; } .contact, .inner .contact, .nav-r .contact, .inner .nav-r .contact { height: 34px; padding: 0 14px; font-size: 13px; } .loader .tag { top: calc(19px + env(safe-area-inset-top, 0px)); } }
/* Button pairs (E!, 28 Oct): side by side at equal width; stacked full width on phones. */
.row:has(> .btn + .btn) { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; width: max-content; max-width: 100%; }
@media (max-width: 600px) { .row:has(> .btn + .btn) { grid-auto-flow: row; width: 100%; } }
@media (max-width: 600px) { .book-card { flex-direction: column !important; align-items: flex-start !important; } }