:root {
    --bg: #FCFCFC;
    --panel: #F5F7FA;
    --ink: #111827;
    --ink-soft: #EEF1F4;
    --slate: #5B6472;
    --slate-soft: #9CA6B0;
    --line: #E5E7EB;
    --secondary: #4B6D98;
    --secondary-soft: #F0F4FA;
    --tertiary: #5F7267;
    --tertiary-soft: #F0F4F1;
    --quaternary: #A85830;
    --quaternary-deep: #8B4726;
    --quaternary-soft: #F5EBE3;
    --accent: #B7591A;
    --accent-soft: #FDF2E4;
    --white: #FFFFFF;
  }
  * { box-sizing: border-box; }
  body {
    margin: 0;
    font-family: 'Inter', sans-serif;
    background-color: var(--bg);
    color: var(--ink);
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  h1, h2, h3, h4 { font-family: 'Manrope', sans-serif; margin: 0; }
  p { margin: 0; }
  a { text-decoration: none; }
  .icon { display: inline-block; vertical-align: middle; }

  .print-container { background-color: var(--ink-soft); min-height: 100vh; display: flex; flex-direction: column; }

  .topnav {
    position: sticky; top: 0;
    background-color: rgba(255,255,255,0.85);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line);
    padding: 16px 32px;
    display: flex; justify-content: space-between; align-items: center;
    z-index: 50;
  }
  .topnav-left { display: flex; align-items: center; gap: 12px; }
  .topnav-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
  .topnav-name { font-family: 'Manrope', sans-serif; font-weight: 600; font-size: 15px; color: var(--ink); }
  .topnav-back { display: flex; align-items: center; gap: 6px; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 12.5px; color: var(--slate); text-decoration: none; padding-right: 14px; margin-right: 14px; border-right: 1px solid var(--line); transition: color 0.15s; }
  .topnav-back:hover { color: var(--ink); }
  .download-btn {
    font-family: 'Manrope', sans-serif; font-weight: 600; font-size: 13px;
    background-color: var(--ink); color: var(--white);
    padding: 10px 16px; border-radius: 6px; cursor: pointer; border: none;
    display: flex; align-items: center; gap: 6px;
    transition: opacity 0.2s;
  }
  .download-btn:hover { opacity: 0.9; }

  main { flex: 1; padding: 48px 24px; }
  .document-card {
    max-width: 960px; margin: 0 auto;
    background-color: var(--bg);
    padding: 64px 48px;
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.04), 0 1px 4px rgba(0,0,0,0.02);
  }

  .eyebrow {
    font-family: 'Manrope', sans-serif; font-weight: 500; font-size: 11px;
    letter-spacing: 0.08em; text-transform: uppercase; color: var(--secondary);
    margin-bottom: 12px; display: flex; align-items: center; gap: 8px;
  }
  .eyebrow::before { content: ''; display: inline-block; width: 14px; height: 2px; background-color: var(--secondary); flex-shrink: 0; }
  .side-section { margin-bottom: 34px; }
  .divider { border-top: 1px solid var(--line); margin-bottom: 34px; }

  .cv-grid { display: grid; grid-template-columns: 1fr 280px; gap: 48px; align-items: stretch; }

  /* Header */
  .cv-name { font-family: 'Manrope', sans-serif; font-weight: 600; font-size: 40px; line-height: 1.1; color: var(--ink); margin-bottom: 10px; }
  .cv-title { font-family: 'Manrope', sans-serif; font-weight: 500; font-size: 17px; color: var(--ink); margin-bottom: 12px; }
  .cv-category {
    font-family: 'Inter', sans-serif; font-weight: 600; font-size: 11px;
    letter-spacing: 0.08em; color: var(--secondary); margin-bottom: 24px;
  }
  .cv-summary { font-family: 'Inter', sans-serif; font-size: 14.5px; line-height: 1.65; color: var(--slate); max-width: 640px; }
  .entry-context-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 16px; }
  .entry-context-label { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink); margin-bottom: 2px; }
  .entry-context-value { font-family: 'Inter', sans-serif; font-size: 13px; color: var(--slate); line-height: 1.4; }

  /* Executive Impact — editorial labels in Source Serif, smaller than the Leadership
     Snapshot's "Global"/"Executive" treatment and set in ink rather than blue, so each
     item reads like a chapter opener rather than a headline. */
  .highlight-item { margin-bottom: 36px; }
  .highlight-item:last-child { margin-bottom: 0; }
  .highlight-theme { font-family: 'Source Serif 4', serif; font-weight: 400; font-size: 18px; line-height: 1.2; color: var(--ink); margin-bottom: 8px; }
  .highlight-text { font-family: 'Inter', sans-serif; font-weight: 400; font-size: 13.5px; line-height: 1.55; color: var(--slate); margin: 0; max-width: 580px; }

  /* Experience */
  .experience-entry { display: flex; gap: 16px; padding-bottom: 48px; }
  .experience-entry.last { padding-bottom: 0; }
  .timeline-col { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; }
  .timeline-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 4px; flex-shrink: 0; }
  .timeline-dot.filled { width: 10px; height: 10px; background-color: var(--secondary); box-shadow: 0 0 0 3px var(--secondary-soft); }
  .timeline-dot.hollow { background-color: var(--line); border: 1.5px solid var(--slate-soft); }
  .timeline-line { width: 1px; flex: 1; background-color: var(--line); margin-top: 4px; }
  .entry-meta { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 10px; letter-spacing: 0.07em; color: var(--slate); margin-bottom: 3px; }
  .entry-headrow { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
  .entry-role { font-family: 'Manrope', sans-serif; font-weight: 500; font-size: 16px; color: var(--ink); }
  .entry-period { font-family: 'Inter', sans-serif; font-size: 12px; color: var(--slate); flex-shrink: 0; margin-left: 12px; }
  .entry-desc { font-family: 'Inter', sans-serif; font-size: 13.5px; font-style: italic; color: var(--slate); line-height: 1.55; margin-bottom: 16px; }
  .entry-achieve-label { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 10px; letter-spacing: 0.07em; color: var(--secondary); margin-bottom: 10px; }
  .entry-achieve-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
  .entry-achieve-list li { display: flex; gap: 10px; align-items: flex-start; }
  .achieve-dot { width: 4px; height: 4px; border-radius: 50%; background-color: var(--secondary); flex-shrink: 0; margin-top: 8px; }
  .achieve-text { font-family: 'Inter', sans-serif; font-size: 13.5px; line-height: 1.6; color: var(--ink); }

  /* Impact snapshot */
  .impact-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 22px; row-gap: 0; }
  .impact-item { padding: 16px 0; }
  .impact-item:nth-child(n+3) { border-top: 1px solid var(--line); }
  .impact-value { font-family: 'Source Serif 4', serif; font-weight: 400; font-size: 28px; line-height: 1; color: var(--secondary); margin-bottom: 8px; }
  .impact-value.impact-word { font-size: 24px; }
  .impact-label { font-family: 'Inter', sans-serif; font-weight: 400; font-size: 10.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--slate); line-height: 1.5; }

  /* Sidebar */
  .sidebar { background-color: var(--ink-soft); padding: 36px 26px; border-radius: 16px; display: flex; flex-direction: column; }
  .contact-list { display: flex; flex-direction: column; gap: 12px; }
  .contact-item { display: flex; gap: 10px; align-items: flex-start; }
  .contact-text, .contact-link { font-family: 'Inter', sans-serif; font-size: 13px; color: var(--slate); line-height: 1.45; word-break: break-all; }
  .contact-link { transition: color 0.15s; }
  .contact-link:hover { color: var(--ink); }

  .expertise-group { display: flex; gap: 14px; padding: 14px 0; border-top: 1px solid var(--line); }
  .expertise-group:first-child { border-top: none; padding-top: 0; }
  .expertise-group:last-child { padding-bottom: 0; }
  .expertise-index { font-family: 'Manrope', sans-serif; font-weight: 500; font-size: 18px; color: var(--slate); line-height: 1.3; flex-shrink: 0; width: 20px; }
  .expertise-theme { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 10px; letter-spacing: 0.07em; text-transform: uppercase; color: var(--ink); margin-bottom: 5px; }
  .expertise-list { font-family: 'Inter', sans-serif; font-size: 12.5px; color: var(--slate); line-height: 1.65; }

  .edu-list { display: flex; flex-direction: column; gap: 14px; }
  .edu-title { font-family: 'Manrope', sans-serif; font-weight: 500; font-size: 13px; color: var(--ink); margin-bottom: 2px; }
  .edu-sub { font-family: 'Inter', sans-serif; font-size: 12px; color: var(--slate); }

  .lang-list { display: flex; flex-direction: column; gap: 10px; }
  .lang-title { font-family: 'Manrope', sans-serif; font-weight: 500; font-size: 13px; color: var(--ink); margin-bottom: 1px; }
  .lang-sub { font-family: 'Inter', sans-serif; font-size: 12px; color: var(--slate); }

  .earlier-text { font-family: 'Inter', sans-serif; font-size: 13px; line-height: 1.6; color: var(--slate); }

  @media screen and (max-width: 860px) {
    .topnav { padding: 14px 20px; }
    main { padding: 32px 16px; }
    .document-card { padding: 40px 28px; }
    .cv-grid { grid-template-columns: 1fr; gap: 32px; }
    .cv-name { font-size: 32px; }
  }

  @media screen and (max-width: 600px) {
    .topnav { flex-wrap: wrap; row-gap: 10px; padding: 12px 16px; }
    .topnav-left { flex-wrap: wrap; row-gap: 6px; }
    .topnav-back { padding-right: 10px; margin-right: 10px; font-size: 11.5px; }
    .download-btn { font-size: 12px; padding: 8px 12px; }
    main { padding: 20px 10px; }
    .document-card { padding: 28px 18px; border-radius: 8px; }
    .cv-name { font-size: 27px; }
    .cv-grid { gap: 28px; }
    .entry-headrow { flex-wrap: wrap; row-gap: 4px; }
    .entry-period { margin-left: 0; }
    .sidebar { padding: 24px 18px; }
    .impact-grid { column-gap: 10px; }
  }

  @media print {
    body { background-color: var(--bg); }
    .no-print { display: none !important; }
    .print-container { padding: 0 !important; background-color: transparent !important; }
    .document-card { padding: 0 !important; margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; max-width: none !important; }
    /* CSS Grid does not paginate reliably across printed pages: browsers tend to print
       one column's full content before starting the next, instead of interleaving them
       page by page. Floats fragment correctly across pages, so the sidebar keeps running
       alongside the main column here instead of appearing as a separate block afterward. */
    .cv-grid { display: block; }
    .cv-grid::after { content: ""; display: table; clear: both; }
    .cv-grid > div:first-child { float: left; width: 66%; }
    .sidebar { float: right; width: 30%; margin-top: 0; }
    /* A filled, rounded background box cannot reliably continue itself across a page
       break: browsers paint the fill only on whichever fragment the box starts on, so
       content on the next page appears to float free of any container. The fix isn't to
       drop the tint, it's to move it onto each individual card instead of the whole
       column: paired with break-inside: avoid below, every card is now guaranteed to
       render whole on a single page, so its own background can never be cut off. */
    .sidebar { background-color: transparent; border-radius: 0; padding: 0; }
    .sidebar .divider { display: none; }
    .sidebar .side-section { background-color: var(--ink-soft); border-radius: 12px; padding: 20px 22px; margin-bottom: 14px; }
    .sidebar .side-section:last-child { margin-bottom: 0; }
    .impact-grid { column-gap: 20px; }
    .impact-item:nth-child(n+3) { border-top: 1px solid var(--line); }
    /* Keep each stat, card, entry and row intact rather than letting a page break fall
       in the middle of one, so nothing gets visually cut in half between pages. */
    .impact-item, .expertise-group, .entry-context-grid > div, .side-section,
    .experience-entry, .highlight-item, .contact-item, .edu-list > div, .lang-list > div {
      break-inside: avoid; page-break-inside: avoid;
    }
    p, li { orphans: 3; widows: 3; }
    @page { margin: 1cm; }
  }