@charset "UTF-8";
:root{font-family:Inter,"SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;color:#24352f;background:#edf0e9;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 10% 0%,#f9faf5 0,transparent 55%),#edf0e9}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:3px solid #20765a;outline-offset:5px}
[hidden]{display:none!important}
.page{width:min(1060px,calc(100% - 80px));margin:0 auto;padding:48px 0 30px}
.masthead{display:flex;align-items:center;justify-content:space-between;margin-bottom:42px;gap:24px}
.wordmark{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600;letter-spacing:1.5px}
.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid #cbd3c9;border-radius:13px;background:#f8faf5;color:#345444}
.brand-mark svg{width:28px;height:28px}
.wordmark-en{display:block;font-size:8px;letter-spacing:2px;font-weight:500;color:#65766a;margin-top:5px}
.share-button{display:inline-flex;gap:8px;align-items:center;padding:11px 16px;min-height:44px;border:1px solid #cdd5ca;border-radius:100px;background:transparent;color:#3e5547;font-size:12px;cursor:pointer;transition:background .2s,border-color .2s}
.share-button:hover{background:#fff;border-color:#a8b7a5}
.share-button svg{width:16px;height:16px}
.contact-card{display:grid;grid-template-columns:.95fr 1.05fr;overflow:hidden;border-radius:28px;background:#fff;box-shadow:0 22px 70px -35px #263b3b40,0 0 0 1px #dce2d7}
.identity{position:relative;display:flex;flex-direction:column;min-width:0;padding:36px 42px 26px;background:#203e34;color:#f5f8f0;overflow:hidden}
.identity:after{content:"";position:absolute;width:330px;height:330px;border:1px solid #ffffff0a;border-radius:50%;right:-230px;bottom:60px;pointer-events:none}
.identity-top,.identity-bottom,.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.eyebrow{font-size:10px;letter-spacing:2.4px;font-weight:500;line-height:1.5}
.identity-top .eyebrow{color:#c4d2c4}
.spark{width:20px;height:20px;color:#bdd0a8}
.avatar-wrap{position:relative;width:142px;height:142px;display:grid;place-items:center;margin:42px 0 32px}
.avatar-ring{position:absolute;inset:0;border:1px solid #b3c7a239;border-radius:50%}
.avatar-ring:before{content:"";position:absolute;inset:8px;border:1px dashed #bed1ad35;border-radius:50%}
.avatar{width:110px;height:110px;border-radius:50%;display:grid;place-items:center;background:#d4e0c7;color:#2b4838;font-size:57px;font-weight:400;line-height:1;font-family:Georgia,"Songti SC",serif}
.hello-tag{position:absolute;bottom:2px;right:-17px;transform:rotate(-9deg);background:#f3ede0;border:4px solid #203e34;border-radius:9px;padding:5px 12px 8px;color:#304c3a;font-family:Georgia,serif;font-size:25px;font-style:italic;line-height:1}
.greeting{font-size:17px;font-weight:400;letter-spacing:1px;color:#d7e2d1;margin:0 0 10px}
h1{font-size:clamp(36px,5.1vw,62px);line-height:1.13;letter-spacing:-2px;font-weight:600;overflow-wrap:anywhere;margin:0}
.name-dot{color:#b5ce9c}
.bio{font-size:14px;line-height:1.9;color:#c4d0c4;font-weight:400;margin:21px 0 30px;max-width:310px;white-space:pre-line}
.identity-bottom{border-top:1px solid #ffffff1c;color:#b5c5b4;font-size:10px;letter-spacing:1px;padding-top:19px;margin-top:auto}
.tiny-cross{font-size:20px;line-height:1;font-weight:200}
.contacts{padding:38px 44px 28px;min-width:0}
.section-heading{color:#708170}
.small-orbit{width:12px;height:12px;border:1px solid #92a68a;border-radius:50%;position:relative}
.small-orbit:after{content:"";position:absolute;width:4px;height:4px;top:3px;left:3px;background:#92a68a;border-radius:50%}
h2{font-size:35px;letter-spacing:-1px;font-weight:500;line-height:1.4;margin:24px 0 11px}
.section-description{font-size:12px;letter-spacing:.3px;color:#7c877d;margin:0 0 27px}
.social-list{border-top:1px solid #e8ece6}
.social-link{display:flex;align-items:center;gap:16px;min-height:83px;padding:15px 4px;border-bottom:1px solid #e8ece6;position:relative;transition:background .2s,padding .2s}
.social-link:hover{padding-left:12px;background:#f8faf5}
.platform-icon{width:43px;height:43px;flex:none;display:grid;place-items:center;border-radius:13px;color:#fff}
.platform-icon svg{height:23px;width:23px;fill:currentColor}
.platform-x{background:#242b28}
.platform-facebook{background:#edf4ff;color:#1877f2}
.platform-facebook svg{width:26px;height:26px}
.platform-zalo{background:#edf5ff;color:#0068ff}
.platform-zalo svg{width:32px;height:32px}
.platform-line{background:#eefaed;color:#06c755}
.platform-line svg{width:27px;height:27px}
.platform-copy{flex:1;min-width:0}
.platform-name{display:block;font-size:16px;line-height:1.5;font-weight:550;color:#25382d;letter-spacing:.1px}
.platform-detail{display:block;font-size:11px;line-height:1.6;color:#7b897f;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:240px}
.link-arrow{height:20px;width:20px;color:#8a9b87;flex:none;transition:transform .2s,color .2s}
.social-link:hover .link-arrow{transform:translate(2px,-2px);color:#335a40}
.social-link[aria-disabled=true]{cursor:default;opacity:.55}
.social-link[aria-disabled=true]:hover{padding-left:4px;background:transparent}
.unpublished{font-size:10px;color:#536852;letter-spacing:.3px;flex:none}
.link-note{display:flex;align-items:center;gap:6px;font-size:10px;color:#879181;margin:24px 0 0}
.link-note svg{width:16px;height:16px;flex:none}
.page-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:26px;color:#798571;font-size:10px;letter-spacing:.5px;line-height:1.7}
.footer-note{font-size:8px;letter-spacing:1.3px}
.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,10px);padding:11px 20px;background:#203e34;color:#f6f9f1;border-radius:100px;box-shadow:0 4px 20px #203e3422;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;font-size:13px;white-space:nowrap;z-index:5}
.toast.visible{opacity:1;transform:translate(-50%,0)}
.skip-link{position:fixed;z-index:10;top:10px;left:10px;padding:12px 16px;background:#fff;border-radius:6px;transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}
@media(min-width:1600px){.page{padding-top:9vh}}
@media(max-width:850px){.page{width:min(680px,calc(100% - 40px));padding-top:28px}.contact-card{grid-template-columns:1fr}.identity{padding:29px 32px 22px}.identity-top{margin-bottom:26px}.avatar-wrap{width:110px;height:110px;margin:0 0 22px}.avatar{width:84px;height:84px;font-size:43px}.hello-tag{font-size:20px;padding:5px 10px 7px;right:-23px;bottom:-4px}.greeting{font-size:14px;margin-bottom:7px}h1{font-size:46px;letter-spacing:-1.6px}.bio{max-width:460px;margin:16px 0 25px;font-size:13px}.identity-bottom{font-size:9px}.contacts{padding:28px 32px}.masthead{margin-bottom:25px}h2{font-size:30px;line-height:1.35;margin-top:20px}h2 br{display:none}.section-description{margin-bottom:22px}.social-link{min-height:80px}.platform-detail{max-width:420px}.page-footer{margin-top:23px}.footer-note{font-size:7px}}
@media(max-width:450px){.page{width:calc(100% - 32px);padding-top:23px}.contact-card{border-radius:22px}.wordmark{font-size:13px;gap:9px;letter-spacing:1px}.brand-mark{width:36px;height:36px;border-radius:11px}.brand-mark svg{width:24px;height:24px}.wordmark-en{font-size:7px;letter-spacing:1.7px}.share-button{padding:10px 12px;font-size:11px;gap:6px}.identity{padding:27px 26px 21px}.contacts{padding:27px 26px 25px}.eyebrow{font-size:9px;letter-spacing:2px}.avatar-wrap{margin-top:0;margin-bottom:22px}.identity-top{margin-bottom:28px}.bio{line-height:1.85;max-width:265px}.platform-detail{max-width:210px}.social-link{gap:13px}.page-footer{display:block;text-align:center;font-size:9px}.footer-note{display:block;margin-top:6px;font-size:7px}.link-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
