/* Transformation Unlocked - shared styles. Dark, brand-led. Brand colours: deep purple #5B1E8C and hot pink #E91E8C. */
:root {
  --bg: #120d1f;
  --surface: #1a1330;
  --surface-2: #241a42;
  --fg: #f6f1fb;
  --muted: #bfb4d6;
  --line: #35285a;
  --purple: #5b1e8c;
  --pink: #e91e8c;
  --pink-text: #ff74c4;
  --lav: #d8c2f5;
  --on-accent: #ffffff;
  --font-display: "Bebas Neue", "Oswald", Impact, "Arial Narrow", sans-serif;
  --font-body: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: auto; }
body { margin: 0; background: var(--bg); color: var(--fg); font-family: var(--font-body); font-size: 16px; line-height: 1.7; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 400; letter-spacing: 0.02em; line-height: 1; margin: 0; text-wrap: balance; }
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--pink-text); outline-offset: 3px; border-radius: 4px; }

.wrap { max-width: 1120px; margin: 0 auto; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.band { padding-block: 84px; }
.band.alt { background: var(--surface); }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--pink-text); margin-bottom: 14px; }
h2 { font-size: clamp(36px, 5vw, 58px); }
h3 { font-size: 30px; }
.lead { color: var(--muted); max-width: 62ch; margin-top: 18px; font-size: 18px; }
.prose p { color: var(--muted); max-width: 64ch; font-size: 17px; }
.prose p + p { margin-top: 16px; }
.prose strong { color: var(--fg); font-weight: 600; }

/* placeholders: visible so nothing ships by accident */
.ph { background: rgba(233, 30, 140, 0.14); color: #ffd3ec; border: 1px dashed var(--pink); border-radius: 6px; padding: 1px 8px; font-size: 0.88em; font-style: normal; white-space: nowrap; }

.btn { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 26px; border-radius: 999px; font-weight: 600; font-size: 15px; text-decoration: none; border: 1.5px solid transparent; transition: transform .15s ease, border-color .15s ease, background-color .15s ease; cursor: pointer; }
.btn-primary { background: linear-gradient(90deg, var(--purple), #c8167f); color: var(--on-accent); }
.btn-primary:hover { transform: translateY(-2px); }
.btn-ghost { border-color: var(--lav); color: var(--fg); }
.btn-ghost:hover { border-color: var(--pink-text); color: var(--pink-text); }
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }

/* header */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--bg); }
.site-head { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: rgba(18, 13, 31, 0.9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.head-in { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 68px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.brand img { height: 38px; width: auto; display: block; }
.brand span { font-family: var(--font-display); font-size: 25px; letter-spacing: 0.04em; white-space: nowrap; }
.brand i { font-style: normal; color: var(--pink-text); margin: 0 4px; font-size: 14px; vertical-align: 3px; }
nav { display: flex; align-items: center; gap: 26px; }
nav a { text-decoration: none; font-size: 14px; font-weight: 500; color: var(--muted); }
nav a:hover, nav a[aria-current="page"] { color: var(--fg); }
nav a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--pink); text-underline-offset: 8px; text-decoration-thickness: 2px; }
nav .btn { min-height: 40px; padding: 0 20px; font-size: 14px; color: var(--on-accent); white-space: nowrap; }
nav .btn:hover { color: var(--on-accent); }

/* home hero */
.hero { position: relative; overflow: hidden; padding-block: 72px 56px; }
.hero::before { content: ""; position: absolute; right: -10%; top: -20%; width: 70%; aspect-ratio: 1; background: radial-gradient(closest-side, rgba(233, 30, 140, 0.3), transparent); pointer-events: none; }
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: 48px; align-items: center; }
.hero h1 { font-size: clamp(54px, 9vw, 112px); line-height: 0.92; }
.hero h1 em, .page-hero h1 em { font-style: normal; background: linear-gradient(90deg, var(--pink-text), var(--lav)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.promise { margin-top: 26px; max-width: 54ch; font-size: 18px; color: var(--muted); }
.brandline { margin-top: 30px; font-style: italic; font-weight: 500; color: var(--lav); font-size: 18px; }
.hero-art { display: flex; justify-content: center; }
.hero-art img { width: min(100%, 340px); height: auto; filter: drop-shadow(0 0 60px rgba(233, 30, 140, 0.35)); }
.strip { position: relative; margin-top: 52px; padding-top: 22px; border-top: 1px solid; border-image: linear-gradient(90deg, var(--pink), var(--purple), transparent) 1; display: flex; flex-wrap: wrap; gap: 8px 28px; font-family: var(--font-display); font-size: 22px; letter-spacing: 0.06em; color: var(--pink-text); }
.strip span + span::before { content: "|"; color: var(--line); margin-right: 28px; }

.sector { padding-block: 24px; border-block: 1px solid var(--line); background: var(--surface); }
.sector p { color: var(--muted); font-size: 15px; display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline; }
.sector strong { color: var(--fg); font-weight: 600; }

/* inner page hero */
.page-hero { position: relative; overflow: hidden; padding-block: 76px 64px; border-bottom: 1px solid var(--line); }
.page-hero::before { content: ""; position: absolute; right: -15%; top: -60%; width: 60%; aspect-ratio: 1; background: radial-gradient(closest-side, rgba(91, 30, 140, 0.55), transparent); pointer-events: none; }
.page-hero .wrap { position: relative; }
.page-hero h1 { font-size: clamp(46px, 7.5vw, 92px); line-height: 0.95; max-width: 15ch; }
.page-hero .lead { font-size: 19px; max-width: 58ch; }
.crumb { display: inline-block; margin-bottom: 22px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); text-decoration: none; }
.crumb:hover { color: var(--pink-text); }

/* statement block */
.statement { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.statement h2 { max-width: 12ch; }

/* beliefs: editorial rows */
.rows { margin-top: 40px; border-top: 1px solid var(--line); }
.row { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 40px; padding: 30px 0; border-bottom: 1px solid var(--line); align-items: start; }
.row h3 { font-size: clamp(26px, 2.8vw, 34px); }
.row p { color: var(--muted); font-size: 16.5px; max-width: 58ch; }
.row p + p { margin-top: 12px; }
.pullquote { margin-top: 44px; font-family: var(--font-display); font-size: clamp(34px, 5vw, 60px); line-height: 1; color: var(--lav); max-width: 20ch; }
.pullquote em { font-style: normal; color: var(--pink-text); }

/* cards */
.cards { margin-top: 44px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 30px 28px 28px; display: flex; flex-direction: column; gap: 16px; }
.band.alt .card { background: var(--bg); }
.card h3 { font-size: 34px; }
.card p { color: var(--muted); font-size: 15px; flex: 1; }
.card a.more { font-weight: 600; font-size: 14px; color: var(--pink-text); text-decoration: none; display: inline-flex; gap: 8px; align-items: center; }
.card a.more:hover { text-decoration: underline; text-underline-offset: 4px; }
.cards.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cards.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cards.four .card { padding: 24px 22px; }
.cards.four h3 { font-size: 28px; }

/* lists with diamonds */
.diamonds { display: grid; gap: 14px; margin-top: 26px; }
.diamonds li { display: flex; gap: 14px; color: var(--muted); font-size: 16px; max-width: 64ch; }
.diamonds li::before { content: ""; flex: none; width: 8px; height: 8px; margin-top: 10px; background: var(--pink); transform: rotate(45deg); }
.diamonds li strong { color: var(--fg); font-weight: 600; }

/* diagnostic band */
.diag { background: linear-gradient(135deg, #2c0f52 0%, var(--purple) 55%, #a3166f 100%); color: #fff; border-radius: 20px; padding: 48px; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 40px; align-items: center; }
.diag .eyebrow { color: #ffc6e6; }
.diag h2 { font-size: clamp(36px, 5vw, 54px); }
.diag .lead { color: #f0dcf5; }
.diag ul { display: grid; gap: 14px; }
.diag li { display: flex; gap: 12px; font-size: 15px; color: #fbeefc; }
.diag li::before { content: ""; flex: none; width: 8px; height: 8px; margin-top: 9px; background: #ffc6e6; transform: rotate(45deg); }
.facts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; align-items: center; }
.facts .tag { font-size: 13px; font-weight: 600; letter-spacing: .04em; border: 1px solid #ffffff66; border-radius: 999px; padding: 4px 14px; }
.diag .btn { margin-top: 26px; background: #fff; color: #3a1456; }
.diag .btn:hover { background: #ffd3ec; }

/* sequence */
.steps { margin-top: 40px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: step; border-top: 1px solid var(--line); }
.step { padding: 26px 24px 8px 0; counter-increment: step; }
.step + .step { padding-left: 24px; border-left: 1px solid var(--line); }
.step::before { content: counter(step); display: block; font-family: var(--font-display); font-size: 44px; color: var(--pink-text); line-height: 1; margin-bottom: 8px; }
.step h3 { font-size: 26px; }
.step p { margin-top: 8px; color: var(--muted); font-size: 15px; }

/* testimonials */
.quotes { margin-top: 44px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.q { margin: 0; background: var(--surface); border-radius: 14px; padding: 28px; display: flex; flex-direction: column; gap: 20px; }
.band.alt .q { background: var(--bg); }
.q blockquote { margin: 0; font-style: italic; font-size: 15px; flex: 1; }
.q blockquote::before { content: "\201C"; display: block; font-family: var(--font-display); font-style: normal; font-size: 64px; line-height: .6; color: var(--pink-text); margin-bottom: 8px; }
.q cite { font-style: normal; font-size: 14px; color: var(--muted); }
.q cite b { display: block; color: var(--fg); font-weight: 600; }
.engagements { margin-top: 28px; color: var(--muted); font-size: 14px; max-width: 80ch; }

/* talk list */
.talks { margin-top: 36px; border-top: 1px solid var(--line); }
.talks li { padding: 24px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 12px 40px; }
.talks h3 { font-size: clamp(28px, 3vw, 36px); }
.talks p { color: var(--muted); font-size: 15px; }
.talks .take { grid-column: 2; font-size: 14px; }
.talks .take b { color: var(--pink-text); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: 11px; margin-right: 8px; }
.talks.compact li { grid-template-columns: minmax(0, 1fr); padding: 18px 0; }
.talks.compact h3 { font-size: 30px; }

/* about */
.about { display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); gap: 56px; align-items: start; }
.portrait { aspect-ratio: 4 / 5; max-width: 340px; border: 1px dashed var(--pink); border-radius: 16px; display: grid; place-items: center; text-align: center; color: #ffd3ec; background: rgba(233, 30, 140, 0.08); font-size: 14px; padding: 20px; }
.timeline { margin-top: 36px; border-top: 1px solid var(--line); }
.timeline li { display: grid; grid-template-columns: minmax(0, 0.45fr) minmax(0, 1fr); gap: 8px 32px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.timeline b { font-family: var(--font-display); font-weight: 400; font-size: 26px; letter-spacing: .03em; }
.timeline span { color: var(--muted); font-size: 15px; }

/* diagnostic radar */
.radar-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.radar { width: 100%; max-width: 480px; height: auto; margin-inline: auto; display: block; }
.radar text { fill: var(--fg); font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.radar .note { fill: var(--muted); font-weight: 500; font-size: 11px; }

/* stats (about only) */
.proof { margin-top: 36px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.stat { padding: 24px 24px 8px 0; }
.stat + .stat { padding-left: 24px; border-left: 1px solid var(--line); }
.stat b { display: block; font-family: var(--font-display); font-weight: 400; font-size: clamp(44px, 5.5vw, 64px); line-height: 1; color: var(--pink-text); }
.stat p { margin-top: 8px; color: var(--muted); font-size: 14px; max-width: 30ch; }

.closing h2 { max-width: 20ch; }
.contact-grid { margin-top: 40px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.contact-grid .card p { flex: none; overflow-wrap: anywhere; }
.copyline { font-weight: 600; color: var(--fg); user-select: all; }

footer { border-top: 1px solid var(--line); padding-block: 40px 28px; color: var(--muted); font-size: 13px; }
.foot-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px 40px; }
.foot-nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.foot-nav a { text-decoration: none; }
.foot-nav a:hover { color: var(--pink-text); }
.foot-base { margin-top: 24px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; }
footer em { color: var(--lav); }

.draftbar { background: rgba(233, 30, 140, 0.16); color: #ffd3ec; font-size: 13px; text-align: center; padding: 8px 16px; border-bottom: 1px dashed var(--pink); }

@media (max-width: 900px) {
  .band { padding-block: 60px; }
  .hero-grid, .diag, .about, .statement, .radar-wrap, .row, .talks li { grid-template-columns: minmax(0, 1fr); }
  .talks .take { grid-column: 1; }
  .hero-art { order: -1; justify-content: flex-start; }
  .hero-art img { width: 150px; }
  .cards, .cards.two, .cards.four, .quotes, .contact-grid, .found { grid-template-columns: minmax(0, 1fr); }
  .found a { border-left: 0; border-top: 1px solid var(--line); }
  .diag { padding: 32px 24px; }
  .steps { grid-template-columns: minmax(0, 1fr); }
  .step, .step + .step { padding: 22px 0 8px; border-left: 0; border-bottom: 1px solid var(--line); }
  nav a:not(.btn) { display: none; }
  .row { gap: 12px; }
  .timeline li { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .proof { grid-template-columns: minmax(0, 1fr); }
  .stat, .stat + .stat { padding: 20px 0 10px; border-left: 0; border-bottom: 1px solid var(--line); }
  .strip { font-size: 18px; gap: 6px 18px; }
  .strip span + span::before { margin-right: 18px; }
  .brand span { font-size: 16px; letter-spacing: 0.02em; }
  .brand { gap: 8px; }
  .brand i { margin: 0 2px; }
  .brand img { height: 32px; }
  .head-in { gap: 10px; }
  nav .btn { padding: 0 14px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .btn { transition: none; } .btn-primary:hover { transform: none; } }

.headshot { display: block; width: 100%; max-width: 340px; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 16px; border: 1px solid var(--line); }
.photos { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 22px; }
.photos img { width: 100%; height: 100%; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); display: block; min-height: 260px; }
@media (max-width: 900px) { .photos { grid-template-columns: minmax(0, 1fr); } .photos img { min-height: 0; height: auto; } }

.card .num { font-family: var(--font-display); font-size: 44px; line-height: .9; color: var(--pink-text); }

/* recognition */
.recog { padding-block: 56px; border-bottom: 1px solid var(--line); }
.recog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.recog-grid.one { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.recog-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 30px 28px; }
.band.alt .recog-card, .recog.alt .recog-card { background: var(--bg); }
.recog-card h3 { font-size: 32px; }
.recog-card .eyebrow { margin-bottom: 10px; }
.rc-sub { color: var(--muted); font-size: 14px; margin-top: 10px; }
.recog-card .diamonds { margin-top: 18px; gap: 10px; }
.recog-card .diamonds li { font-size: 15px; }
@media (max-width: 900px) { .recog-grid { grid-template-columns: minmax(0, 1fr); } }

/* recognition table + light line */
.recog-light { padding-block: 26px; border-bottom: 1px solid var(--line); }
.recog-line { font-size: 17px; max-width: 900px; }
.recog-line strong { color: var(--pink-text); font-weight: 600; }
.recog-line a { color: var(--pink-text); margin-left: 6px; white-space: nowrap; }
.recog-table { width: 100%; border-collapse: collapse; margin-top: 28px; }
.recog-table th { text-align: left; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding: 10px 14px; border-bottom: 1px solid var(--line); }
.recog-table td { padding: 14px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: 15px; }
.recog-table td:first-child { color: var(--lav); white-space: nowrap; }
@media (max-width: 760px) {
  .recog-table thead { display: none; }
  .recog-table, .recog-table tbody, .recog-table tr, .recog-table td { display: block; width: 100%; }
  .recog-table tr { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .recog-table td { border: 0; padding: 3px 0; }
  .recog-table td:first-child { white-space: normal; }
}

/* recognition table + light line */
.recog-light { padding-block: 26px; border-bottom: 1px solid var(--line); }
.recog-line { font-size: 17px; max-width: 900px; }
.recog-line strong { color: var(--pink-text); font-weight: 600; }
.recog-line a { color: var(--pink-text); margin-left: 6px; white-space: nowrap; }
.recog-table { width: 100%; border-collapse: collapse; margin-top: 28px; }
.recog-table th { text-align: left; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding: 10px 14px; border-bottom: 1px solid var(--line); }
.recog-table td { padding: 14px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: 15px; }
.recog-table td:first-child { color: var(--lav); white-space: nowrap; }
@media (max-width: 760px) {
  .recog-table thead { display: none; }
  .recog-table, .recog-table tbody, .recog-table tr, .recog-table td { display: block; width: 100%; }
  .recog-table tr { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .recog-table td { border: 0; padding: 3px 0; }
  .recog-table td:first-child { white-space: normal; }
}

.strip-top { margin-top: 0; margin-bottom: 30px; padding-top: 0; border-top: 0; font-size: 20px; }
.cred { margin-top: 22px; font-size: 15px; color: var(--muted); max-width: 560px; }
.cred a { color: var(--pink-text); white-space: nowrap; }

@media (max-width: 600px) { .strip-top { flex-direction: column; gap: 4px; font-size: 18px; margin-bottom: 22px; } .strip-top span + span::before { content: none; margin: 0; } }

.hero-art { flex-direction: column; align-items: center; }
.hero-art .brandline { margin-top: 18px; text-align: center; }
@media (max-width: 900px) { .hero-art { align-items: flex-start; } .hero-art .brandline { margin-top: 10px; text-align: left; } }
.btn-primary { background-origin: border-box; }

/* tighter home */
.keyfacts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.fact { border-top: 3px solid var(--pink); padding-top: 18px; }
.fact .big { font-family: var(--font-display); font-size: 44px; letter-spacing: 0.03em; line-height: 1; display: block; color: var(--fg); }
.fact p { margin-top: 10px; color: var(--muted); font-size: 15px; }
.found { margin-top: 22px; display: grid; grid-template-columns: auto repeat(3, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(90deg, rgba(91,30,140,.38), rgba(91,30,140,.12)); overflow: hidden; }
.found .lab { font-family: var(--font-display); font-size: 24px; letter-spacing: 0.06em; color: var(--pink-text); padding: 22px 28px; display: flex; align-items: center; white-space: nowrap; }
.found a { padding: 20px 24px; border-left: 1px solid var(--line); color: var(--fg); text-decoration: none; display: flex; flex-direction: column; gap: 4px; }
.found a strong { font-weight: 600; font-size: 15px; }
.found a span { color: var(--muted); font-size: 14px; }
.found a:hover strong { color: var(--pink-text); text-decoration: underline; text-underline-offset: 4px; }
.under { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: baseline; font-size: 15px; }
.under span { font-family: var(--font-display); font-size: 22px; letter-spacing: 0.06em; color: var(--pink-text); }
.under a { color: var(--fg); font-weight: 600; text-decoration: underline; text-decoration-color: var(--pink); text-underline-offset: 6px; }
details.take { margin-top: 10px; }
details.take summary { cursor: pointer; color: var(--pink-text); font-weight: 600; font-size: 14px; }
details.take p { margin-top: 8px; }
@media (max-width: 760px) { .keyfacts { grid-template-columns: minmax(0, 1fr); } .fact .big { font-size: 38px; } }

.cred { margin-top: 18px; margin-bottom: 4px; font-size: 16px; color: var(--lav); max-width: 600px; }
.cred strong { color: var(--fg); font-weight: 600; }

/* services dropdown */
.dd{position:relative;display:flex;align-items:center}
.dd>a{display:inline-flex;align-items:center;gap:7px}
.caret{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);display:inline-block}
.dd-menu{position:absolute;top:100%;left:-16px;min-width:300px;padding:10px 0 8px;display:none;z-index:50}
.dd-menu::before{content:"";position:absolute;inset:10px 0 0 0;background:var(--surface);border:1px solid rgba(216,194,245,.18);border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.45);z-index:-1}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:block}
nav .dd-menu a{display:block;padding:11px 24px;font-size:14px;color:var(--lav);white-space:nowrap}
nav .dd-menu a:hover{color:var(--pink-text);background:rgba(233,30,140,.08)}
@media (max-width:900px){.dd{display:none}}

.recog-table td:first-child{white-space:normal;width:52%;color:var(--fg)}
.recog-table td:first-child strong{display:block;color:var(--pink-text);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.recog-table td:first-child a{color:inherit;text-decoration-color:var(--pink);text-underline-offset:3px}
.recog-table td:last-child{color:var(--muted)}
@media (max-width:760px){.recog-table td:first-child{width:100%}}

/* keep recognition as two columns on every width */
@media (max-width:760px){
  .recog-table thead{display:table-header-group}
  .recog-table{display:table;width:100%}
  .recog-table tbody{display:table-row-group}
  .recog-table tr{display:table-row;padding:0}
  .recog-table th,.recog-table td{display:table-cell;border-bottom:1px solid var(--line);padding:12px 8px;font-size:14px}
  .recog-table td:first-child{width:50%}
}

/* footer grid */
.foot-grid{display:grid;grid-template-columns:1.3fr 1.2fr .8fr 1.2fr;gap:36px;padding-bottom:30px;border-bottom:1px solid var(--line)}
.foot-grid h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 14px;font-weight:600}
.foot-grid a{display:block;text-decoration:none;color:var(--lav);font-size:14px;padding:5px 0;overflow-wrap:anywhere}
.foot-grid a:hover{color:var(--pink-text)}
.foot-brand img{display:block;margin-bottom:12px}
.foot-brand strong{color:var(--fg);font-size:15px}
.foot-brand p{margin:10px 0 0;font-size:14px;line-height:1.6;max-width:30ch}
.foot-base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}

/* self-hosted fonts (no third-party requests) */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/montserrat-400-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/montserrat-500-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/montserrat-600-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:400;font-display:swap;src:url(assets/fonts/montserrat-400-italic.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:500;font-display:swap;src:url(assets/fonts/montserrat-500-italic.woff2) format("woff2")}
@font-face{font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/bebas-neue-400.woff2) format("woff2")}
.legal p,.legal li{max-width:70ch}.legal h2{font-size:32px;margin:40px 0 12px}.legal ul{padding-left:20px}
.foot-base{flex-wrap:wrap;gap:8px 24px}.foot-base a{text-decoration:underline;text-underline-offset:3px}
.legal ul{list-style:disc}.legal li{margin-bottom:14px}.legal ul+p{margin-top:18px}

/* review only: CV data points. Remove the .dp colour when decisions are made */
.dp{color:#f5b84b;font-weight:600}
.dpline{font-size:15px;color:var(--muted);max-width:70ch;margin:18px 0 0}

/* talk accordion */
.talks-acc{margin-top:24px;border-top:1px solid var(--line)}
.hint{color:var(--muted);font-size:15px;margin-top:10px}
details.talk{border-bottom:1px solid var(--line)}
details.talk summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0}
details.talk summary::-webkit-details-marker{display:none}
details.talk summary h3{font-size:clamp(28px,3.2vw,40px);transition:color .2s}
details.talk summary:hover h3{color:var(--pink-text)}
details.talk summary::after{content:"+";flex:none;width:40px;height:40px;border:1px solid var(--pink);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--pink-text);font-size:26px;line-height:1;transition:transform .2s}
details.talk[open] summary::after{transform:rotate(45deg)}
details.talk summary:focus-visible{outline:2px solid var(--pink);outline-offset:4px}
.talk-body{padding:0 0 28px;max-width:68ch}
.talk-body p{color:var(--muted);font-size:16px;margin:0 0 12px}
.talk-body strong{display:block;color:var(--pink-text);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}

.foot-grid{grid-template-columns:1.6fr 1fr 1.2fr}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}

.mini{font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--pink-text);margin:0 0 14px;line-height:1.4}
.chips{list-style:none;padding:0;margin:0 0 34px;display:flex;flex-wrap:wrap;gap:10px}
.chips li{border:1px solid var(--line);border-radius:999px;padding:9px 18px;font-size:15px;font-weight:600;background:var(--surface)}
.spoke{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.spoke li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line)}
.spoke .tag{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.spoke a{color:var(--fg);font-weight:600;text-decoration:none;font-size:16px}
.spoke a:hover{color:var(--pink-text);text-decoration:underline;text-underline-offset:4px}
@media (max-width:640px){.spoke li{grid-template-columns:minmax(0,1fr);gap:4px}}

/* Type split: Bebas Neue for H1/H2 only; H3 in Montserrat semibold, sentence case */
h3 { font-family: var(--font-body); font-weight: 600; letter-spacing: 0; line-height: 1.3; font-size: 20px; }
.row h3 { font-size: clamp(18px, 1.8vw, 22px); }
.card h3, .cards.four h3 { font-size: 20px; }
.step h3 { font-size: 19px; }
.talks h3, .talks.compact h3 { font-size: clamp(18px, 1.9vw, 22px); }
.recog-card h3 { font-size: 20px; }
details.talk summary h3 { font-size: clamp(18px, 2vw, 24px); }

.split { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: 56px; align-items: center; }
.split-img { width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--line); display: block; }
@media (max-width: 900px) { .split { grid-template-columns: minmax(0, 1fr); gap: 28px; } }

.source{font-size:.85rem;color:var(--muted);margin-top:20px}.source a{text-decoration:underline;text-underline-offset:3px}

.found{grid-template-columns:auto repeat(2,minmax(0,1fr))}
@media (max-width:900px){.found{grid-template-columns:minmax(0,1fr)}}

.stakes{padding-block:64px}.stakes h2{max-width:34ch}.stat-cards{margin-top:32px}.stat-cards .card{gap:10px;padding:26px 28px}.stat-cards .num{font-size:72px}.stat-cards .card p{flex:1;color:var(--fg);font-size:16px}.stat-cards .src{font-size:12.5px;color:var(--muted)}.stat-cards .src a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}.stakes-lead{margin-top:28px;max-width:64ch}@media (max-width:900px){.stakes{padding-block:48px}.stat-cards .num{font-size:56px}}

.track{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 32px;border-top:1px solid var(--line)}.track li{padding:20px 0 4px;display:flex;flex-direction:column;gap:6px}.track b{font-weight:600;font-size:20px;color:var(--pink-text);letter-spacing:.01em}.track span{font-size:14px;color:var(--muted);line-height:1.55}@media (max-width:900px){.track{grid-template-columns:minmax(0,1fr)}.track li{border-bottom:1px solid var(--line);padding-bottom:16px}}

.cards.four .card .num{font-size:30px;line-height:1}
.hero-art .brandline{max-width:40ch;margin-inline:auto}@media (max-width:900px){.hero-art .brandline{margin-inline:0}}

.topq{margin:30px 0 0;max-width:60ch;border-left:3px solid var(--pink);padding-left:18px}.topq blockquote{margin:0;font-style:italic;font-size:17px}.topq figcaption{margin-top:8px;font-size:14px;color:var(--muted)}
.flag{display:inline-block;margin-top:2px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--pink-text)}
h3.theme{font-family:var(--font-body);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--pink-text);margin:44px 0 0}h3.theme:first-of-type{margin-top:28px}
.talks-acc{margin-top:12px}
.theme-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;align-items:start;margin-top:28px}
.theme-col h3.theme{margin:0 0 14px;min-height:2.6em}
.theme-col .talks-acc{margin-top:0}
.theme-col details.talk summary{padding:16px 0;gap:14px}
.theme-col details.talk summary h3{font-size:clamp(16px,1.35vw,19px);line-height:1.25}
.theme-col details.talk summary::after{width:30px;height:30px}
.theme-col .talk-body{font-size:15px}
.theme-col .flag{display:block;margin-top:6px}
@media (max-width:900px){.theme-cols{grid-template-columns:minmax(0,1fr);gap:32px}.theme-col h3.theme{min-height:0}}

/* final pass */
.btn-primary{background:linear-gradient(90deg,var(--purple),#b8146f) border-box;background-origin:border-box}
.mnav{display:none}
@media (max-width:900px){
  .mnav{display:block;position:relative}
  .mnav summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1.5px solid var(--lav);border-radius:999px;font-size:14px;font-weight:600;color:var(--fg)}
  .mnav summary::-webkit-details-marker{display:none}
  .mnav[open] summary{border-color:var(--pink-text);color:var(--pink-text)}
  .mnav-panel{position:absolute;right:0;top:calc(100% + 12px);width:min(86vw,340px);background:var(--surface);border:1px solid rgba(216,194,245,.18);border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.5);padding:8px 0 16px;display:flex;flex-direction:column;z-index:60}
  .mnav-panel a:not(.btn){display:flex;align-items:center;min-height:44px;padding:0 22px;font-size:15px;color:var(--lav);text-decoration:none}
  .mnav-panel a.top{border-top:1px solid var(--line);color:var(--fg);font-weight:600}
  .mnav-panel a.top:first-of-type{margin-top:6px}
  .mnav-panel a:not(.btn):hover{color:var(--pink-text);background:rgba(233,30,140,.08)}
  .mnav-panel .btn{margin:14px 22px 0;justify-content:center}
  .head-in nav{display:none}
}
@media (max-width:640px){ .strip-top{display:none} .brand span{font-size:18px} }
/* readable small text */
footer,.source,.stat-cards .src,.track span,.foot-base,.hint,.talk-body,.spoke a{font-size:14px}
.eyebrow,.mini,.flag,.talk-body strong,.foot-grid h4,.spoke .tag,.recog-table th,.recog-table td:first-child strong,h3.theme,.crumb{font-size:13px}
.foot-grid a{display:flex;align-items:center;min-height:44px}
.card a.more,.crumb{display:inline-flex;align-items:center;min-height:44px}
nav .btn{min-height:44px}
/* keyhole art on service heroes */
.page-hero.art::after{content:"";position:absolute;right:5%;top:50%;transform:translateY(-50%);width:min(300px,26vw);aspect-ratio:369/560;background:url(assets/keyhole.webp) center/contain no-repeat;opacity:.16;pointer-events:none}
@media (max-width:900px){.page-hero.art::after{display:none}}
@media (max-width:640px){.hero-art{order:1;margin-top:8px}.hero-art img{width:120px}}
.hero h1 em,.page-hero h1 em{background:linear-gradient(90deg,#ff9bd6,#e0208a);-webkit-background-clip:text;background-clip:text;-webkit-box-decoration-break:clone;box-decoration-break:clone;display:inline-block}

.chips li a{color:inherit;text-decoration:none}.chips li:has(a){padding:0}.chips li a{display:block;padding:9px 18px}.chips li:has(a):hover{border-color:var(--pink-text)}.chips li a:hover{color:var(--pink-text)}
.talk-body .talk-link{margin:14px 0 0}.talk-body .talk-link a{color:var(--pink-text);font-weight:600;text-underline-offset:3px}

.page-hero.hero-split{padding-block:56px 44px}.page-hero.hero-split .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:end}.page-hero.hero-split h1{max-width:none}.page-hero.hero-split .lead{margin:0;max-width:46ch;padding-bottom:6px}
@media (max-width:900px){.page-hero.hero-split{padding-block:48px 36px}.page-hero.hero-split .wrap{grid-template-columns:1fr;gap:20px}}

/* photo additions */
.photos.four{grid-auto-rows:clamp(220px,30vw,400px)}
.photos.four img{min-height:0;height:100%}
.photos .pos-top{object-position:50% 40%}
@media (max-width:900px){.photos.four{grid-auto-rows:auto}.photos.four img{height:auto;aspect-ratio:3/2}}
.wide-photo{display:block;width:100%;height:clamp(220px,32vw,420px);object-fit:cover;border-radius:14px;border:1px solid var(--line)}
.about.flip{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
.about.flip .headshot{aspect-ratio:2/3;max-width:360px}
.stack-imgs{display:grid;gap:16px}
@media (max-width:900px){.about.flip{grid-template-columns:minmax(0,1fr)}}

.fw-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
.fw-split .lead{margin-top:12px}
@media (max-width:900px){.fw-split{grid-template-columns:minmax(0,1fr);gap:24px}}