:root {
  --explore-bg: #20211e;
  --explore-text: #f3efe7;
  --card-one: #ebe4d8;
  --card-two: #a8bc9e;
  --card-three: #f5f0e8;
  --paper: #f3efe7;
  --paper-deep: #e7dfd2;
  --ink: #20211e;
  --muted: #6e6d65;
  --line: rgba(32, 33, 30, .18);
  --coral: #e35d3f;
  --sage: #9fb594;
  --sun: #f2c35b;
  --display: "Noto Serif SC", serif;
  --body: "Noto Sans SC", sans-serif;
}

/* Latin fonts keep apostrophes compact and support Romanian diacritics. */
html[lang="en"], html[lang="ro"] {
  --display: "Noto Serif", Georgia, "Times New Roman", serif;
  --body: "Noto Sans", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--body);
  line-height: 1.7;
  overflow-x: hidden;
  transition: color .35s, background .35s;
}
body.dark {
  --paper: #1d1e1b;
  --paper-deep: #292a25;
  --ink: #f0ede5;
  --muted: #aaa79d;
  --line: rgba(240, 237, 229, .16);
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.grain { position: fixed; inset: 0; pointer-events: none; z-index: 10; opacity: .05; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
.section-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }

.site-header { height: 84px; width: min(1240px, calc(100% - 48px)); margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 11px; font-weight: 600; letter-spacing: .08em; }
.brand-mark, .footer-mark { display: grid; place-items: center; width: 36px; height: 36px; color: var(--paper); background: var(--ink); border-radius: 50%; font-family: var(--display); }
nav { display: flex; gap: 36px; font-size: 14px; }
nav a { position: relative; color: var(--muted); }
nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -5px; height: 1px; background: var(--coral); transition: right .25s; }
nav a:hover::after { right: 0; }
.theme-toggle { justify-self: end; border: 1px solid var(--line); background: transparent; color: var(--ink); width: 38px; height: 38px; border-radius: 50%; cursor: pointer; }
.header-controls { justify-self: end; display: flex; align-items: center; gap: 12px; }
.language-switch { font: 12px var(--body); color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 4px; padding: 9px 8px; max-width: 125px; cursor: pointer; }
.language-switch:focus-visible, .theme-toggle:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }
html:not([lang="zh-CN"]) h1 { font-size: clamp(40px, 4.6vw, 64px); letter-spacing: -.04em; }
html:not([lang="zh-CN"]) h1 span { white-space: normal; }
html:not([lang="zh-CN"]) .content-card h3 { font-size: 24px; }
@media (max-width: 600px) { .brand { font-size: 12px; gap: 6px; } .brand-mark { width: 30px; height: 30px; flex-shrink: 0; } .header-controls { gap: 7px; } .language-switch { max-width: 100px; } }

.hero { min-height: 690px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 20px; padding: 72px 0 82px; }
.eyebrow, .section-label { text-transform: uppercase; color: var(--muted); font-size: 12px; font-weight: 600; letter-spacing: .22em; }
.eyebrow { display: flex; align-items: center; gap: 11px; }
.eyebrow span { width: 26px; height: 2px; background: var(--coral); }
h1, h2, h3 { font-family: var(--display); margin: 0; font-weight: 600; line-height: 1.2; }
h1 { font-size: clamp(49px, 6.1vw, 83px); letter-spacing: -.055em; margin: 28px 0; }
h1 span { color: var(--coral); font-style: italic; white-space: nowrap; }
.hero-lede { max-width: 560px; color: var(--muted); font-size: 17px; }
.hero-actions { display: flex; align-items: center; gap: 30px; margin-top: 42px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 28px; min-height: 50px; padding: 0 24px; border-radius: 3px; font-size: 14px; font-weight: 600; }
.button.primary { color: #f8f4eb; background: var(--ink); }
body.dark .button.primary { color: #1d1e1b; }
.button span, .text-link span { transition: transform .2s; }
.button:hover span, .text-link:hover span { transform: translate(3px, -2px); }
.text-link { font-size: 14px; border-bottom: 1px solid var(--line); padding: 8px 0; }

.hero-art { height: 520px; position: relative; border-radius: 48% 48% 6% 48%; background: var(--paper-deep); overflow: hidden; }
.hero-art svg { position: absolute; inset: 5%; width: 90%; height: 90%; fill: var(--ink); }
.hero-art path { fill: none; stroke: var(--ink); stroke-width: 2; stroke-dasharray: 5 8; opacity: .6; }
.orbit { position: absolute; border: 1px solid var(--line); border-radius: 50%; }
.orbit-one { width: 350px; height: 350px; top: 70px; left: 85px; }
.orbit-two { width: 470px; height: 470px; top: 8px; left: 20px; }
.sun { position: absolute; z-index: 2; top: 94px; right: 64px; width: 118px; height: 118px; border-radius: 50%; background: var(--sun); color: #20211e; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; box-shadow: 0 16px 50px rgba(32,33,30,.08); }
.sun span { font-size: 11px; letter-spacing: .18em; }
.sun strong { font-family: var(--display); font-size: 42px; }
.note { position: absolute; z-index: 3; padding: 8px 13px; color: #20211e; background: #fffaf0; border: 1px solid rgba(32,33,30,.15); box-shadow: 0 7px 20px rgba(32,33,30,.09); font-family: var(--display); font-size: 13px; transform: rotate(-6deg); }
.note-one { bottom: 92px; left: 42px; }
.note-two { bottom: 57px; right: 41px; transform: rotate(7deg); }

.marquee { border-block: 1px solid var(--line); overflow: hidden; background: var(--paper-deep); }
.marquee-track { display: flex; align-items: center; gap: 30px; width: max-content; padding: 16px 0; animation: scroll 24s linear infinite; font-family: var(--display); font-size: 13px; letter-spacing: .13em; }
.marquee-track i { color: var(--coral); }
@keyframes scroll { to { transform: translateX(-50%); } }

.about { padding: 125px 0; }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; margin-top: 42px; }
.about h2, .section-head h2, .now h2, .contact h2 { font-size: clamp(36px, 4.2vw, 58px); letter-spacing: -.035em; }
.about-copy { max-width: 530px; color: var(--muted); font-size: 16px; }
.about-copy strong { color: var(--ink); }
.signature { color: var(--ink); margin-top: 35px; font-family: var(--display); font-size: 22px; }
.signature span { display: block; margin-top: 2px; color: var(--muted); font: 11px var(--body); letter-spacing: .08em; }

.explore { padding: 115px 0 130px; background: var(--ink); color: var(--paper); }
.explore .section-label { color: rgba(243,239,231,.58); }
.section-head { display: flex; justify-content: space-between; gap: 40px; align-items: flex-end; }
.section-head h2 { margin-top: 24px; }
.section-head > p { width: 350px; color: rgba(243,239,231,.63); font-size: 14px; }
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 58px; }
.content-card { min-height: 390px; padding: 25px; display: flex; flex-direction: column; color: #1e201c; transition: transform .3s, border-radius .3s; outline: none; }
.content-card:hover, .content-card:focus-visible { transform: translateY(-8px); border-radius: 22px 22px 3px 3px; }
.card-ink { background: #ebe4d8; }
.card-coral { background: #df6549; }
.card-sage { background: #a8bc9e; }
.card-paper { background: #f5f0e8; }
.card-top { display: flex; justify-content: space-between; font-size: 11px; }
.card-icon { margin: 60px 0 22px; font: 52px/1 var(--display); }
.content-card h3 { font-size: 27px; }
.content-card p { font-size: 14px; opacity: .74; }
.card-meta { margin-top: auto; padding-top: 20px; border-top: 1px solid rgba(30,32,28,.18); font-size: 10px; letter-spacing: .14em; }

.now { padding: 120px 0; }
.now-panel { margin-top: 36px; padding: 58px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; background: var(--paper-deep); }
.now-intro > p { color: var(--muted); font-size: 11px; letter-spacing: .12em; }
.live-dot { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 5px rgba(227,93,63,.12); }
.now-intro h2 { margin-top: 46px; }
.now-list div { padding: 20px 0; border-bottom: 1px solid var(--line); }
.now-list span { display: block; color: var(--muted); font-size: 11px; letter-spacing: .13em; margin-bottom: 7px; }
.now-list strong { font-family: var(--display); font-size: 18px; font-weight: 500; }

.contact { padding: 120px 0 145px; text-align: center; border-top: 1px solid var(--line); }
.contact > p { color: var(--coral); font-size: 13px; letter-spacing: .15em; }
.contact h2 { margin: 20px 0 42px; }
.contact small { display: block; margin-top: 13px; color: var(--muted); font-size: 10px; }
footer { width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: 36px 0; display: flex; align-items: center; gap: 18px; border-top: 1px solid var(--line); font-size: 11px; letter-spacing: .06em; }
footer p { color: var(--ink); line-height: 1.6; }
footer p span { color: var(--muted); }
footer > a { margin-left: auto; color: var(--muted); }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* Palette choices share the same layout, with consistent contrast. */
body[data-theme="forest"] { --paper:#edf2e9; --paper-deep:#d7e3d3; --ink:#20362b; --muted:#57695b; --line:rgba(32,54,43,.2); --coral:#50775d; --sun:#dacb82; --explore-bg:#20362b; --card-one:#e4ead8; --card-two:#aec5aa; --card-three:#f1f3e9; }
body[data-theme="ocean"] { --paper:#edf3f6; --paper-deep:#d5e3ed; --ink:#193347; --muted:#536d7c; --line:rgba(25,51,71,.2); --coral:#367ba2; --sun:#e7cc84; --explore-bg:#193347; --card-one:#e1edf3; --card-two:#a8c7d4; --card-three:#f3f4ed; }
body[data-theme="rose"] { --paper:#f7eeee; --paper-deep:#ecdadf; --ink:#482d36; --muted:#80646e; --line:rgba(72,45,54,.2); --coral:#aa546e; --sun:#e8c18a; --explore-bg:#482d36; --card-one:#f0dde1; --card-two:#d3b4be; --card-three:#f7efea; }
body[data-theme="lavender"] { --paper:#f1eef7; --paper-deep:#e0d9ec; --ink:#352e49; --muted:#716781; --line:rgba(53,46,73,.2); --coral:#8361a1; --sun:#e8d29a; --explore-bg:#352e49; --card-one:#e8e0f0; --card-two:#bfb1d4; --card-three:#f6f1ed; }
body[data-theme="dark"] { --explore-bg:#151612; --card-one:#d9d2c7; --card-two:#9caf91; --card-three:#ebe6dc; }
.explore { background:var(--explore-bg); color:var(--explore-text); }
.card-ink { background:var(--card-one); }
.card-sage { background:var(--card-two); }
.card-paper { background:var(--card-three); }
.site-header { grid-template-columns:1fr auto auto; column-gap:32px; height:auto; min-height:94px; padding-block:15px; }
.language-control { display:flex; flex-direction:column; align-items:flex-start; gap:5px; }
.language-hint { display:flex; align-items:center; gap:5px; font-size:10px; white-space:nowrap; color:var(--muted); letter-spacing:.025em; }
.language-hint svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.5; }
.language-switch { max-width:none; width:100%; min-height:38px; }
.theme-picker { position:relative; }
.theme-picker summary { list-style:none; display:grid; place-items:center; width:42px; height:42px; }
.theme-picker summary::-webkit-details-marker { display:none; }
.theme-menu { position:absolute; z-index:20; right:0; top:54px; width:210px; padding:15px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink); box-shadow:0 12px 35px rgba(0,0,0,.15); }
.theme-menu-title { margin:0 0 10px; font-size:12px; color:var(--muted); }
.theme-menu button { display:flex; align-items:center; gap:10px; width:100%; border:0; border-radius:6px; padding:9px 8px; color:var(--ink); background:transparent; font-size:13px; cursor:pointer; text-align:left; }
.theme-menu button:hover, .theme-menu button[aria-pressed="true"] { background:var(--paper-deep); }
.theme-menu button[aria-pressed="true"]::after { content:'✓'; margin-left:auto; }
.theme-menu i { width:17px; height:17px; border:1px solid rgba(0,0,0,.2); border-radius:50%; flex-shrink:0; }
.theme-menu button:focus-visible { outline:2px solid var(--coral); }
.about-grid { gap:70px; grid-template-columns:.85fr 1.15fr; }
.signature { padding-top:26px; border-top:1px solid var(--line); font:11px var(--body); letter-spacing:.12em; color:var(--muted); }
.signature span { margin-top:12px; color:var(--coral); font:22px/1.7 var(--display); letter-spacing:normal; }
.profile-facts dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:28px 0 36px; }
.profile-facts dt { font-size:11px; color:var(--muted); }
.profile-facts dd { margin:3px 0 0; color:var(--ink); font-size:18px; font-weight:500; }
.education h3 { font-size:21px; color:var(--ink); }
.education-list { list-style:none; padding:0 0 0 20px; margin:25px 0 0 4px; border-left:1px solid var(--line); }
.education-list li { position:relative; padding:0 0 23px 7px; }
.education-list li:last-child { padding-bottom:0; }
.education-list li::before { content:''; position:absolute; width:7px; height:7px; left:-24px; top:7px; border-radius:50%; background:var(--coral); }
.education-list span { display:block; font-size:11px; margin-bottom:4px; }
.education-list strong { display:block; color:var(--ink); font-size:15px; font-weight:500; }
.now-panel { display:block; }
.now-intro h2 { max-width:900px; margin-top:28px; }
@media (max-width:900px) { .site-header { grid-template-columns:1fr auto; column-gap:15px; } .about-grid { grid-template-columns:1fr; gap:40px; } .card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .content-card { padding:20px; } }
@media (max-width:650px) { .site-header { grid-template-columns:1fr; gap:16px; } .header-controls { justify-self:stretch; justify-content:space-between; } .language-control { flex-direction:row; align-items:center; gap:10px; } .language-switch { width:auto; min-width:106px; } .card-grid { grid-template-columns:1fr; } .profile-facts dl { grid-template-columns:repeat(2,minmax(0,1fr)); } .theme-menu { top:48px; } }

@media (max-width: 900px) {
  nav { display: none; }
  .site-header { grid-template-columns: 1fr auto; }
  .hero { grid-template-columns: 1fr; padding-top: 70px; }
  .hero-art { height: 430px; }
  .about-grid, .now-panel { grid-template-columns: 1fr; gap: 42px; }
  .card-grid { grid-template-columns: 1fr 1fr; }
  .section-head { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 600px) {
  .section-shell, .site-header, footer { width: min(100% - 30px, 1180px); }
  .hero { min-height: auto; padding: 58px 0; }
  h1 { font-size: 46px; }
  .hero-art { height: 350px; border-radius: 46% 46% 5% 46%; }
  .sun { width: 90px; height: 90px; right: 30px; top: 55px; }
  .sun strong { font-size: 32px; }
  .about, .now { padding: 85px 0; }
  .explore { padding: 85px 0 95px; }
  .card-grid { grid-template-columns: 1fr; }
  .content-card { min-height: 330px; }
  .section-head > p { width: auto; }
  .now-panel { padding: 32px 24px; }
  .contact { padding: 85px 0 100px; }
  footer { align-items: flex-start; flex-wrap: wrap; }
  footer > a { width: 100%; margin: 12px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
