/* artemkarida.com — personal page layer (RU preview, 11 Oct 2026)
   Loaded after el-system.css, which is a verbatim copy of engineeringlegitimacy.com/styles.css.
   Only adds what the methodology site has no component for: the photograph beside the name,
   the experience strip, events, and a few spacing rules. All values reuse the system tokens.
   Scope: /ru/ only. Nothing here touches /insights/. */

/* ── Top bar: external link to the methodology site ── */
.nav .p-ext { color: var(--ink); font-weight: 560; text-decoration: underline; text-decoration-color: var(--bronze); text-underline-offset: 5px; }
.nav .p-ext:hover { text-decoration-thickness: 2px; }
.nav a { white-space: nowrap; }

/* ── Hero: name on the grade line, photograph standing on the same line ── */
.p-hero-above {
  display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 3fr);
  gap: clamp(24px, 5vw, 80px); align-items: end;
  padding-top: clamp(48px, 11vh, 132px);
}
.p-id { min-width: 0; }
.p-eyebrow { font-family: var(--display); font-size: 17px; font-weight: 500; color: var(--ink-soft); margin-bottom: clamp(16px, 2.4vw, 28px); }
.p-hero-above .title { max-width: 820px; }
.p-photo { margin: 0; align-self: end; position: relative; }
.p-photo img {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: 50% 18%;
  filter: grayscale(1) contrast(1.04);
}
/* The bronze top rule sits on the frame, not on the image, so the grayscale filter does not grey it out. */
.p-photo { border-top: 2px solid var(--bronze); }
.p-lead { color: #fff; max-width: 30ch; }
.p-intro { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.55; color: var(--verdigris-text); max-width: 34em; }

/* ── Experience strip: the professional grounds, shown early ── */
.p-exp { padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
.p-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); }
.p-stats li { padding-top: 16px; border-top: 2px solid var(--ink); }
.p-stat-num { font-family: var(--display); font-weight: 560; font-stretch: 84%; font-size: var(--fs-h3); line-height: 1.08; letter-spacing: -0.008em; margin-bottom: 8px; }
.p-stat-label { font-size: 18px; line-height: 1.5; color: var(--ink-soft); max-width: 20em; }
.p-inst { margin-top: clamp(28px, 3.5vw, 44px); padding-top: 18px; border-top: 1px solid var(--stone-2); font-family: var(--display); font-size: 18px; font-weight: 500; color: var(--ink); }
.p-inst span { color: var(--bronze); padding: 0 .4em; }

/* ── Work: two-part lede before the component list ── */
#work .lede + .lede { margin-top: 12px; }
.p-lede-strong { color: var(--ink); font-weight: 500; }

/* ── Formats (dark): paragraphs and a text action per column ── */
.p-formats > div { display: flex; flex-direction: column; }
.p-formats p + p { margin-top: 12px; }
.p-formats .p-act { margin-top: auto; padding-top: 0; align-self: flex-start; }
.p-formats p:last-of-type { margin-bottom: 24px; }
.p-act {
  display: inline-block; margin-top: 20px; font-family: var(--display); font-size: 16px; font-weight: 600;
  color: #fff; text-decoration: none; border-bottom: 1.5px solid var(--bronze-light); padding-bottom: 2px;
}
.p-act:hover { border-bottom-width: 2.5px; }

/* ── Events ── */
.p-events { margin-top: clamp(32px, 4vw, 48px); }
.p-events-past { margin-top: clamp(56px, 7vw, 88px); }
.p-event {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(20px, 5vw, 80px);
  margin-top: 20px; padding: 24px 0 32px; border-top: 2px solid var(--bronze-light); border-bottom: 1px solid rgba(139,179,189,.35);
}
.p-event-date { font-family: var(--display); font-weight: 560; font-stretch: 84%; font-size: var(--fs-h4); line-height: 1.15; color: #fff; }
.p-event-city { font-family: var(--display); font-size: 17px; color: var(--verdigris-text); margin-top: 6px; }
main .p-event-name { font-family: var(--display); font-weight: 560; font-size: var(--fs-h4); line-height: 1.2; color: #fff; margin-bottom: 10px; }
.p-event-place, .p-event-day { font-size: 18px; line-height: 1.5; color: var(--on-patina); }
.p-event-label { font-family: var(--display); font-size: 15px; color: var(--verdigris-text); margin-top: 20px; }
.p-event-topic { font-family: var(--text); font-style: italic; font-size: clamp(21px, 2vw, 26px); line-height: 1.35; color: #fff; margin-top: 4px; max-width: 30em; }
.p-event.is-past .p-event-date, .p-event.is-past .p-event-name { color: var(--verdigris-text); }

/* ── Methodology introduction (dark) ── */
.p-method > div + div { max-width: 46em; margin-top: 8px; }
.p-kicker { font-family: var(--display); font-size: 16px; font-weight: 500; color: var(--verdigris-text); margin-bottom: 12px; }
.p-definition { color: #fff; border-left-color: var(--bronze-light); margin: 28px 0 28px; font-size: clamp(20px, 1.9vw, 25px); }
.p-body { font-size: 19px; line-height: 1.6; color: var(--on-patina); max-width: 36em; }
.p-body + .p-body { margin-top: 1em; }
.p-btns { margin-top: 32px; }
.p-btns .btn { display: inline-block; }

/* ── Book (dark) ── */
.p-book-lede { margin: 20px 0 22px; color: #fff; }
.p-book-links { display: flex; flex-direction: column; gap: 12px; background: var(--d5); }

/* ── About and contact ── */
.p-contact { border-top: 1px solid rgba(139,179,189,.25); }
.author p { color: var(--on-patina); }
.p-email { font-family: var(--display); font-size: clamp(20px, 2vw, 26px); font-weight: 560; margin: 8px 0 22px; }
.p-email a { color: #fff; text-decoration-color: var(--bronze-light); text-underline-offset: 6px; }
.p-mail-list { border-top: 1px solid rgba(139,179,189,.45); max-width: 36em; }
.p-mail-list li { border-bottom: 1px solid rgba(139,179,189,.45); }
.p-mail-list a { display: block; padding: 13px 0; font-family: var(--display); font-size: 17px; font-weight: 500; color: var(--on-patina); text-decoration: none; }
.p-mail-list a::after { content: ' →'; color: var(--bronze-light); }
.p-mail-list a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--bronze-light); text-underline-offset: 4px; }

/* ── Responsive ── */
@media (max-width: 900px) {
  .p-stats { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .p-event { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}
@media (max-width: 600px) {
  .p-hero-above { grid-template-columns: minmax(0, 1fr) 112px; gap: 16px; }
  .p-eyebrow { font-size: 15px; }
}

/* ── Round 2 (12 Oct 2026): book block copied from the methodology site; talk title in Russian with the original below ── */
.p-book-news { background: var(--d5); }
.p-book-btn { margin-top: 20px; }
.p-book-btn .btn { display: inline-block; }
.p-event-orig { font-family: var(--text); font-style: italic; font-size: 16px; line-height: 1.45; color: var(--verdigris-text); margin-top: 6px; max-width: 36em; }