@font-face{font-family:'Playfair';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/playfair-display-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Playfair';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/playfair-display-vietnamese-400-normal.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'Playfair';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/playfair-display-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Playfair';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/playfair-display-vietnamese-700-normal.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'Playfair';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/playfair-display-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Playfair';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/playfair-display-vietnamese-400-italic.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'SourceSerif';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'SourceSerif';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-vietnamese-400-normal.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'SourceSerif';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/source-serif-4-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'SourceSerif';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/source-serif-4-vietnamese-600-normal.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'SourceSerif';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'SourceSerif';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/source-serif-4-vietnamese-400-italic.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'BeVN';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/be-vietnam-pro-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'BeVN';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/be-vietnam-pro-vietnamese-400-normal.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:'BeVN';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/be-vietnam-pro-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'BeVN';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/be-vietnam-pro-vietnamese-600-normal.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}

:root{
  --paper:#faf6ee; --paper-2:#f3ede1; --ink:#17130f; --ink-2:#3d352c;
  --muted:#7a6e5f; --rule:#ded4c2; --accent:#8c2f24; --accent-2:#b98b56;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:'SourceSerif',Georgia,'Times New Roman',serif;
  font-size:19px;line-height:1.72;
  font-feature-settings:"onum" 1,"kern" 1;
  text-rendering:optimizeLegibility;}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.sans{font-family:'BeVN',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.eyebrow{font-family:'BeVN',sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}

/* ---------- COVER ---------- */
.cover{min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:56px 28px;position:relative;background:
   radial-gradient(120% 90% at 50% 0%, #fffdf8 0%, var(--paper) 55%, var(--paper-2) 100%);}
.cover-in{max-width:820px;width:100%;text-align:center;
  border:1px solid var(--rule);padding:60px 46px 52px;position:relative;background:rgba(255,253,248,.5)}
.cover-in:before{content:"";position:absolute;inset:9px;border:1px solid var(--rule);pointer-events:none}
.cv-kicker{letter-spacing:.34em;font-size:11px}
.cv-rule{width:52px;height:1px;background:var(--accent);margin:20px auto 26px}
.portrait{width:186px;margin:0 auto 26px;position:relative}
.portrait img{width:100%;filter:contrast(1.02);border:1px solid var(--rule)}
.portrait:after{content:"";position:absolute;inset:-9px;border:1px solid var(--rule)}
.cv-name{font-family:'Playfair',serif;font-weight:700;line-height:.94;
  font-size:clamp(46px,9vw,92px);letter-spacing:-.015em;margin:0 0 6px}
.cv-role{font-family:'Playfair',serif;font-style:italic;font-size:clamp(17px,2.4vw,23px);color:var(--ink-2);margin:0}
.cv-years{font-family:'BeVN',sans-serif;font-size:13px;letter-spacing:.26em;color:var(--accent);margin:16px 0 0}
.cv-title{margin:34px 0 0;font-family:'Playfair',serif;font-size:clamp(20px,3vw,27px);
  font-style:italic;color:var(--ink-2);line-height:1.4}
.cv-meta{margin-top:26px;padding-top:20px;border-top:1px solid var(--rule);
  display:flex;justify-content:center;gap:34px;flex-wrap:wrap}
.cv-meta div{text-align:center}
.cv-meta b{display:block;font-family:'Playfair',serif;font-size:26px;font-weight:700;line-height:1}
.cv-meta span{font-family:'BeVN',sans-serif;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted)}
.scroll-hint{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
  font-family:'BeVN',sans-serif;font-size:10px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(250,246,238,.94);
  backdrop-filter:saturate(1.4) blur(9px);border-bottom:1px solid var(--rule)}
.nav-in{display:flex;align-items:center;gap:18px;height:54px}
.nav-t{font-family:'Playfair',serif;font-weight:700;font-size:17px;white-space:nowrap}
.nav-t small{font-family:'BeVN',sans-serif;font-weight:400;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);display:block;line-height:1.2;margin-top:1px}
.nav-links{display:flex;gap:16px;margin-left:auto;font-family:'BeVN',sans-serif;font-size:12px}
.nav-links a{text-decoration:none;color:var(--ink-2);padding-bottom:2px;border-bottom:1px solid transparent}
.nav-links a:hover{border-color:var(--accent);color:var(--accent)}
#q{font-family:'BeVN',sans-serif;font-size:12.5px;padding:7px 12px;width:180px;
  border:1px solid var(--rule);background:#fffdf8;color:var(--ink);border-radius:2px;outline:none}
#q:focus{border-color:var(--accent)}
@media(max-width:860px){.nav-links{display:none}}

/* ---------- INTRO / BIO ---------- */
.intro{padding:74px 0 10px}
.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
@media(max-width:900px){.intro-grid{grid-template-columns:1fr;gap:34px}}
.intro h2{font-family:'Playfair',serif;font-size:clamp(28px,4.4vw,44px);line-height:1.14;
  margin:10px 0 20px;font-weight:700}
.intro p{color:var(--ink-2);margin:0 0 16px}
.intro p.first::first-letter{float:left;font-family:'Playfair',serif;font-size:66px;line-height:.82;
  padding:6px 10px 0 0;color:var(--accent);font-weight:700}
.bio{border:1px solid var(--rule);background:#fffdf8;padding:26px 26px 20px}
.bio h3{font-family:'BeVN',sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin:0 0 16px;font-weight:600}
.bio ul{list-style:none;margin:0;padding:0}
.bio li{display:grid;grid-template-columns:104px 1fr;gap:14px;padding:10px 0;border-top:1px solid var(--rule);
  font-size:15.5px;line-height:1.55}
.bio li:first-child{border-top:0}
.bio-d{font-family:'BeVN',sans-serif;font-size:10.5px;letter-spacing:.08em;color:var(--accent);
  padding-top:4px;font-weight:600}
.bio-t{color:var(--ink-2)}
.bio-portrait{width:200px;margin:0 auto 20px;border:1px solid var(--rule)}
.bio-cap{text-align:center;font-family:'BeVN',sans-serif;font-size:10.5px;color:var(--muted);margin:-10px 0 22px;letter-spacing:.04em}
.khoa-chips{margin-top:18px;display:flex;flex-wrap:wrap;gap:6px}
.khoa-chips span{font-family:'BeVN',sans-serif;font-size:10.5px;letter-spacing:.06em;
  border:1px solid var(--rule);padding:3px 8px;color:var(--muted)}

/* ---------- TOC ---------- */
.toc{padding:64px 0 30px;border-top:1px solid var(--rule);margin-top:56px}
.toc>.wrap>h2{font-family:'Playfair',serif;font-size:34px;margin:0 0 6px}
.toc-note{font-family:'BeVN',sans-serif;font-size:12.5px;color:var(--muted);margin:0 0 34px}
.toc-sec{margin-bottom:34px;break-inside:avoid}
.toc-sec h3{font-family:'BeVN',sans-serif;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink);font-weight:600;margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--ink)}
.toc-sec h3 i{color:var(--accent);font-style:normal}
.toc-l{list-style:none;margin:0;padding:0;columns:2;column-gap:46px}
@media(max-width:820px){.toc-l{columns:1}}
.toc-l li{break-inside:avoid;border-bottom:1px dotted var(--rule)}
.toc-l a{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:baseline;
  padding:8px 0;text-decoration:none}
.toc-l a:hover .tt{color:var(--accent)}
.tn{font-family:'BeVN',sans-serif;font-size:10.5px;color:var(--muted)}
.tt{font-size:16px;line-height:1.35}
.ta{font-family:'BeVN',sans-serif;font-size:10.5px;color:var(--muted);text-align:right;white-space:nowrap;
  max-width:150px;overflow:hidden;text-overflow:ellipsis}

/* ---------- SECTION ---------- */
.sec{padding-top:26px;scroll-margin-top:78px}
.intro,.toc{scroll-margin-top:70px}
.sec-h{text-align:center;padding:76px 0 46px;border-top:1px solid var(--ink);margin-top:54px}
.sec-n{font-family:'BeVN',sans-serif;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--accent);margin-bottom:14px}
.sec-h h2{font-family:'Playfair',serif;font-size:clamp(30px,5vw,50px);margin:0 0 12px;font-weight:700}
.sec-h p{max-width:560px;margin:0 auto;color:var(--muted);font-size:16.5px;font-style:italic}
.sec-c{font-family:'BeVN',sans-serif;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-top:16px}

/* ---------- ARTICLE ---------- */
.art{padding:44px 0;border-top:1px solid var(--rule);scroll-margin-top:78px;
  display:grid;grid-template-columns:1fr minmax(0,672px) 1fr;gap:0 34px}
.art>*{grid-column:2}
.art-h{margin-bottom:24px;position:relative}
.art-no{position:absolute;left:-74px;top:4px;font-family:'BeVN',sans-serif;font-size:11px;
  color:var(--muted);letter-spacing:.1em}
.art-no span{border-top:1px solid var(--accent);padding-top:6px;display:block}
@media(max-width:1080px){.art-no{position:static;margin-bottom:10px}
  .art-no span{border-top:0;padding:0;color:var(--accent)}}
.art-t{font-family:'Playfair',serif;font-weight:700;font-size:clamp(25px,3.4vw,36px);
  line-height:1.16;margin:0 0 12px;letter-spacing:-.01em}
.feature .art-t{font-size:clamp(30px,4.6vw,48px)}
.byline{font-family:'BeVN',sans-serif;font-size:12.5px;color:var(--ink-2);
  padding-top:10px;border-top:1px solid var(--rule)}
.bn-name{font-weight:600}
.bn-meta{color:var(--muted);font-size:11.5px}
.bn-meta:before{content:" · "}
.art-b p{margin:0 0 17px;text-align:justify;hyphens:auto}
.art-b p.lead::first-letter{float:left;font-family:'Playfair',serif;font-size:60px;line-height:.82;
  padding:5px 9px 0 0;color:var(--accent);font-weight:700}
.verse{margin:22px 0 22px 8px;padding-left:20px;border-left:2px solid var(--rule);
  font-family:'Playfair',serif;font-style:italic;font-size:18px;line-height:1.85;color:var(--ink-2)}
blockquote{margin:22px 0;padding:0 0 0 22px;border-left:2px solid var(--accent);
  font-style:italic;color:var(--ink-2)}
.pull{margin:30px 0;padding:22px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
  font-family:'Playfair',serif;font-size:23px;line-height:1.42;font-style:italic;text-align:center;color:var(--ink)}
.src{margin-top:22px;font-family:'BeVN',sans-serif;font-size:11.5px;color:var(--muted)}
.src a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--rule)}
.art.hide{display:none}
@media(max-width:680px){.art-b p{text-align:left;hyphens:none}
.art{padding:34px 0}
.intro{padding:44px 0 6px}}


/* ---------- FIGURES ---------- */
.fig{margin:0 0 46px;grid-column:1/-1}
.fig img{width:100%;border:1px solid var(--rule)}
.fig figcaption{font-family:'BeVN',sans-serif;font-size:12px;line-height:1.55;color:var(--muted);
  margin-top:10px;max-width:680px}
.cred{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:#a2947f;margin-top:3px}
.fig-open{margin:0 auto 26px;max-width:1080px;padding:0 0 34px;border-bottom:1px solid var(--rule)}
.fig-open figcaption{margin-left:auto;margin-right:auto;text-align:center;max-width:640px}
.fig-break{max-width:1080px;margin:0 auto 44px;padding:34px 0 0;border-top:1px solid var(--rule)}
.fig-break figcaption{margin-left:auto;margin-right:auto;text-align:center;max-width:640px}
.gallery .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:14px 0 10px}
@media(max-width:900px){.gallery .grid{grid-template-columns:repeat(2,1fr);gap:26px 18px}}
@media(max-width:560px){.gallery .grid{grid-template-columns:1fr}}
.gcell{margin:0}
.bio-portrait{margin-bottom:26px}
.gcell img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--rule)}
.gcell figcaption{font-family:'BeVN',sans-serif;font-size:11.5px;color:var(--muted);margin-top:8px}

/* ---------- FOOTER ---------- */
.foot{margin-top:70px;border-top:1px solid var(--ink);padding:54px 0 70px;text-align:center}
.foot .mark{font-family:'Playfair',serif;font-size:30px;color:var(--accent);margin-bottom:14px}
.foot p{color:var(--muted);font-size:14.5px;margin:0 auto 10px;max-width:620px;font-family:'BeVN',sans-serif}
.dl{display:inline-block;font-family:'BeVN',sans-serif;font-size:12.5px;letter-spacing:.06em;text-decoration:none;color:var(--accent);border:1px solid var(--rule);padding:10px 20px;border-radius:2px;transition:background .15s,border-color .15s}
.dl:hover{background:#fffdf8;border-color:var(--accent)}
@media print{.dl{display:none}}
.noresult{display:none;text-align:center;padding:60px 0;color:var(--muted);font-family:'BeVN',sans-serif}
.noresult.on{display:block}

/* ---------- PRINT ---------- */
@page{size:A4;margin:19mm 16mm 18mm}
@media print{
  html,body{background:#fff;font-size:10.2pt;line-height:1.52}
  .nav,.scroll-hint,#q,.noresult{display:none !important}
  .wrap{max-width:none;padding:0}
  .cover{min-height:auto;height:247mm;page-break-after:always;padding:0;background:#fff}
  .cover-in{border:1px solid #bbb;padding:18mm;height:100%;display:flex;flex-direction:column;justify-content:center}
  .cv-name{font-size:44pt}.cv-title{font-size:15pt}.portrait{width:38mm}
  .cv-meta b{font-size:16pt}
  .intro{padding:0}
  .intro-grid{display:block}
  .intro-text{max-width:132mm;margin:0 auto}
  .intro h2{font-size:24pt;margin-bottom:5mm}
  .intro p{font-size:9.8pt;text-align:justify}
  .bio{page-break-before:always;break-inside:avoid;border:1px solid #cfc5b2;padding:10mm}
  .bio-portrait{width:34mm}
  .bio li{font-size:9pt;grid-template-columns:88px 1fr;padding:2.4mm 0}
  .toc{page-break-before:always;border:0;margin:0;padding:0}
  .toc-sec{break-inside:auto}
  .toc-l{columns:2;font-size:9pt}
  .toc-l li{break-inside:avoid}
  .tt{font-size:9.4pt}
  .sec-h{page-break-before:always;padding:24mm 0 10mm;border-top:0}
  .sec-h h2{font-size:26pt}
  .art{display:block;page-break-before:always;padding:0;border:0}
  .art-h{margin-bottom:5mm}
  .art-no{position:static;margin-bottom:2mm}
  .art-t{font-size:19pt;line-height:1.1}
  .feature .art-t{font-size:23pt}
  .art-b{columns:auto;max-width:126mm;margin:0 auto;text-align:justify}
  .art-b p{margin:0 0 2.8mm;font-size:10.3pt;line-height:1.54;orphans:3;widows:3}
  .art-b p.lead::first-letter{font-size:34pt}
  .art-h{max-width:150mm;margin-left:auto;margin-right:auto}
  .pull{font-size:14pt;margin:6mm auto;padding:4mm 0;max-width:126mm}
  .verse{font-size:10.2pt;margin:4mm 0}
  .src{font-size:7.6pt;break-before:avoid;page-break-before:avoid;break-inside:avoid}
  .src a{border:0}
  a{text-decoration:none;color:inherit}

  .fig{page-break-inside:avoid}
  .fig-open{page-break-before:avoid;page-break-after:always;max-width:none;
    padding:0;margin:0;border:0}
  .fig-open img{max-height:132mm;width:auto;max-width:100%;margin:0 auto;object-fit:contain}
  .fig-break{page-break-before:always;max-width:none;padding-top:0;border:0;
    display:flex;flex-direction:column;justify-content:center;height:245mm}
  .fig-break img{max-height:200mm;object-fit:contain}
  .fig figcaption{font-size:8.4pt}
  .cred{font-size:7pt}
  .gallery .grid{display:block;columns:2;column-gap:8mm}
  .gcell{break-inside:avoid;margin-bottom:6mm}
  .gcell figcaption{font-size:7.6pt}
  .foot{page-break-before:always;margin:0;padding:60mm 0 0}
}
