:root{
  --sans:"IBM Plex Sans Thai",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
  --display:"Manrope","IBM Plex Sans Thai",system-ui,sans-serif;
  --deep:#071d12;--deep2:#0b2b1b;--paper:#f7f1e5;--ink:#13261a;
  --accent:#d8b66c;--accent2:#77ddb1;--line:rgba(255,255,255,.14);
  --shadow:0 30px 90px -48px rgba(0,0,0,.82);--ease:cubic-bezier(.22,.8,.26,1)
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);font-size:19px;line-height:1.78;color:#fff;background:var(--deep);overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background .55s var(--ease),color .55s var(--ease)}
body.lifestyle-mode{--deep:#171e2a;--deep2:#263d50;--paper:#fff4e8;--ink:#29303c;--accent:#ff8a67;--accent2:#8bd8eb;--line:rgba(255,255,255,.17)}
a{color:inherit;text-decoration:none}button{font:inherit}.wrap{width:min(1160px,calc(100% - 32px));margin:auto}.section{padding:clamp(70px,9vw,118px) 0}.title{font-family:var(--display);font-size:clamp(2.05rem,4.7vw,4rem);line-height:1.08;letter-spacing:-.04em}.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--accent);font-family:var(--display);font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.eyebrow::before{content:"";width:30px;height:1px;background:currentColor}.sub{max-width:68ch;color:rgba(255,255,255,.72);font-size:1.04rem}.light{background:var(--paper);color:var(--ink)}.light .sub{color:#68736c}.light .eyebrow{color:#9a6b1d}body.lifestyle-mode .light .eyebrow{color:#b64d33}:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:10px}[hidden]{display:none!important}
.nav{position:sticky;top:0;z-index:100;background:rgba(7,29,18,.91);backdrop-filter:blur(18px);border-bottom:1px solid rgba(216,182,108,.18);transition:background .5s,border-color .5s}
body.lifestyle-mode .nav{background:rgba(23,30,42,.92);border-color:rgba(139,216,235,.22)}
.navin{min-height:72px;display:flex;align-items:center;gap:15px}.brand{font-family:var(--display);font-weight:800;white-space:nowrap}.brand b{color:var(--accent)}.navright{margin-left:auto;display:flex;align-items:center;gap:9px}.version-link{padding:8px 11px;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:rgba(255,255,255,.72);font-size:.74rem;font-weight:700;white-space:nowrap}
.mode-switch{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.06);isolation:isolate}.mode-indicator{position:absolute;z-index:-1;inset:4px auto 4px 4px;width:calc(50% - 4px);border-radius:999px;background:var(--accent);box-shadow:0 10px 28px -16px rgba(0,0,0,.9);transition:transform .48s var(--ease),background .45s}.lifestyle-mode .mode-indicator{transform:translateX(100%)}.switch-btn{min-width:92px;border:0;border-radius:999px;padding:9px 14px;background:transparent;color:rgba(255,255,255,.58);font-family:var(--display);font-size:.7rem;font-weight:800;cursor:pointer;transition:color .3s}.switch-btn[aria-pressed="true"]{color:#172016}.lifestyle-mode .switch-btn[aria-pressed="true"]{color:#222a34}
.lang{display:flex;padding:4px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.06)}.lang button{min-width:42px;border:0;padding:9px 11px;border-radius:999px;background:transparent;color:rgba(255,255,255,.58);font-family:var(--display);font-size:.7rem;font-weight:800;cursor:pointer;transition:background .25s,color .25s}.lang button.active{background:var(--paper);color:var(--deep)}
.switch-wipe{position:fixed;z-index:999;inset:0;pointer-events:none;overflow:hidden;visibility:hidden}.switch-wipe::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#0b2b1b,#d8b66c 52%,#171e2a);transform:translateX(-105%)}.switch-wipe span{position:absolute;left:50%;top:50%;width:74px;height:74px;border-radius:24px;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.12);backdrop-filter:blur(12px);transform:translate(-50%,-50%) scale(.5);opacity:0}.switching .switch-wipe{visibility:visible}.switching .switch-wipe::before{animation:worldWipe .72s var(--ease) both}.switching.to-career .switch-wipe::before{background:linear-gradient(120deg,#263d50,#8bd8eb 48%,#0b2b1b)}.switching .switch-wipe span{animation:switchMark .72s var(--ease) both}.mode-enter .world:not([hidden]){animation:worldEnter .72s var(--ease) both}.mode-enter .world:not([hidden]) .hero-media{animation:mediaEnter .85s var(--ease) both}
@keyframes worldWipe{0%{transform:translateX(-105%)}46%{transform:translateX(0)}58%{transform:translateX(0)}100%{transform:translateX(105%)}}
@keyframes switchMark{0%,24%{opacity:0;transform:translate(-50%,-50%) scale(.5) rotate(-12deg)}48%,62%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.25) rotate(12deg)}}
@keyframes worldEnter{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:none}}
@keyframes mediaEnter{0%{opacity:0;transform:translateX(32px) rotate(1.5deg)}100%{opacity:1;transform:none}}
.world{min-height:100vh}.hero{position:relative;min-height:calc(100svh - 72px);display:flex;align-items:center;padding:clamp(52px,7vw,92px) 0 78px;overflow:hidden;background:radial-gradient(760px 520px at 7% 10%,rgba(31,138,90,.42),transparent 68%),radial-gradient(720px 520px at 90% 12%,rgba(216,182,108,.17),transparent 68%),linear-gradient(145deg,#06180f,#0b2c1c 64%,#13281d)}
.career-view .hero::before{content:"";position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 78%)}
.lifestyle-view .hero{background:radial-gradient(700px 500px at 6% 10%,rgba(139,216,235,.25),transparent 70%),radial-gradient(720px 520px at 90% 8%,rgba(255,138,103,.23),transparent 66%),linear-gradient(145deg,#151c28,#263d50 62%,#3e414d)}.lifestyle-view .hero::before{content:"";position:absolute;inset:-10%;opacity:.16;background:radial-gradient(circle at 15% 25%,#fff 0 2px,transparent 3px),radial-gradient(circle at 82% 18%,#fff 0 1px,transparent 2px),radial-gradient(circle at 72% 74%,#fff 0 2px,transparent 3px);background-size:120px 120px,90px 90px,150px 150px;transform:rotate(-6deg)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);gap:clamp(38px,6vw,78px);align-items:center}.hero h1{font-family:var(--display);font-size:clamp(2.65rem,6.6vw,5.9rem);line-height:.98;letter-spacing:-.055em;margin:16px 0 22px}.hero h1 span,.hero h1 em{display:block;font-style:normal}.hero h1 em{color:var(--accent)}.hero-lead{max-width:730px;font-size:clamp(1.12rem,2vw,1.34rem);color:rgba(255,255,255,.84)}.hero-lead b{color:var(--accent2)}.hero-note{max-width:720px;margin-top:18px;padding-left:18px;border-left:3px solid var(--accent);color:rgba(255,255,255,.69);font-size:.94rem}.hero-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 20px;border:1px solid rgba(255,255,255,.22);border-radius:13px;font-size:.88rem;font-weight:800;transition:.22s var(--ease)}.btn:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.5)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#172016}.lifestyle-mode .btn.primary{color:#222a34}.socials{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:19px}.socials>span{color:rgba(255,255,255,.52);font-size:.78rem;margin-right:4px}.social{padding:8px 12px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(255,255,255,.07);font-size:.78rem;font-weight:800}.social:hover{background:rgba(255,255,255,.13)}
.hero-media{position:relative;min-height:620px}.hero-photo{position:absolute;inset:0;overflow:hidden;border-radius:32px;border:1px solid rgba(255,255,255,.21);background:#10241a;box-shadow:0 45px 110px -52px #000;transform:rotate(1deg)}.lifestyle-view .hero-photo{transform:rotate(-1.3deg);border-radius:42px 24px 42px 24px}.hero-photo img{width:100%;height:100%;object-fit:cover}.career-view .hero-photo img{object-position:57% center}.lifestyle-view .hero-photo img{object-position:63% center}.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(3,15,9,.9) 100%)}.lifestyle-view .hero-photo::after{background:linear-gradient(180deg,transparent 50%,rgba(19,24,35,.91) 100%)}.hero-caption{position:absolute;z-index:3;left:20px;right:20px;bottom:20px;padding:17px 18px;border:1px solid rgba(255,255,255,.19);border-radius:18px;background:rgba(7,29,18,.8);backdrop-filter:blur(15px)}.lifestyle-view .hero-caption{background:rgba(27,34,48,.82)}.hero-caption b{display:block;font-size:1.03rem}.hero-caption p{margin-top:4px;color:rgba(255,255,255,.73);font-size:.83rem;line-height:1.58}.float-badge{position:absolute;z-index:4;top:28px;right:-18px;padding:11px 15px;border-radius:14px;background:#fffaf0;color:#182419;font-family:var(--display);font-size:.72rem;font-weight:800;box-shadow:var(--shadow);transform:rotate(4deg)}.lifestyle-view .float-badge{background:#fff0e8;color:#28313e;transform:rotate(-3deg)}
.stats{position:relative;z-index:3;margin-top:-36px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:rgba(6,24,15,.88);backdrop-filter:blur(15px);box-shadow:var(--shadow)}.lifestyle-view .stats-grid{background:rgba(28,36,50,.9)}.stat{padding:23px 20px;border-right:1px solid rgba(255,255,255,.1)}.stat:last-child{border:0}.stat strong{display:block;color:var(--accent);font-family:var(--display);font-size:1.45rem;line-height:1.15}.stat span{display:block;margin-top:5px;color:rgba(255,255,255,.62);font-size:.76rem;font-weight:700}
.section-head{display:flex;justify-content:space-between;gap:30px;margin-bottom:34px}.section-head .copy{max-width:860px}.section-head .title{margin-top:10px}.section-head .sub{margin-top:14px}.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.value{padding:25px;border:1px solid var(--line);border-radius:19px;background:rgba(255,255,255,.055)}.value .icon{font-size:29px}.value h3{font-family:var(--display);font-size:1.14rem;margin:13px 0 7px}.value p{color:rgba(255,255,255,.7);font-size:.93rem}.value small{display:block;margin-top:15px;color:var(--accent);font-family:var(--display);font-size:.65rem;font-weight:800;letter-spacing:.1em}
.proof-split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.proof-photo{position:relative;min-height:460px;overflow:hidden;border-radius:25px;background:#111;box-shadow:0 26px 60px -42px rgba(0,0,0,.55)}.proof-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.proof-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(8,17,12,.91) 100%)}.proof-copy{position:absolute;z-index:2;left:22px;right:22px;bottom:22px;color:#fff}.proof-copy span{color:var(--accent);font-family:var(--display);font-size:.68rem;font-weight:800;letter-spacing:.1em}.proof-copy h3{font-family:var(--display);font-size:1.35rem;margin:5px 0}.proof-copy p{color:rgba(255,255,255,.75);font-size:.88rem}
.timeline{display:grid;gap:12px}.job{display:grid;grid-template-columns:170px 1fr;gap:24px;padding:22px 24px;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:rgba(255,255,255,.045)}.job-time{color:var(--accent);font-family:var(--display);font-size:.72rem;font-weight:800;letter-spacing:.07em}.job h3{font-family:var(--display);font-size:1.04rem}.job p{margin-top:5px;color:rgba(255,255,255,.68);font-size:.92rem}.current-note{margin-top:17px;padding:19px 22px;border-left:4px solid var(--accent);border-radius:0 15px 15px 0;background:rgba(255,255,255,.06);color:rgba(255,255,255,.75);font-size:.92rem}.current-note b{color:#fff}
.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.project{position:relative;display:grid;grid-template-columns:86px 1fr;gap:18px;align-items:center;min-height:190px;padding:23px;border:1px solid rgba(19,38,26,.12);border-radius:22px;background:#fff;box-shadow:0 25px 50px -40px rgba(16,37,26,.45);transition:transform .22s,border-color .22s}.project:hover{transform:translateY(-5px);border-color:var(--accent)}.project-icon{display:grid;place-items:center;width:76px;height:76px;border-radius:24px;background:linear-gradient(145deg,#102b1c,#244b35);font-size:34px;box-shadow:0 18px 32px -22px rgba(0,0,0,.7)}.p-class .project-icon{background:linear-gradient(145deg,#6c4317,#d7a13f)}.p-core .project-icon{background:linear-gradient(145deg,#18223d,#535fc6)}.p-house .project-icon{background:linear-gradient(145deg,#183224,#348861)}.project-tag{color:#7c725f;font-family:var(--display);font-size:.64rem;font-weight:800;letter-spacing:.08em}.project h3{font-family:var(--display);font-size:1.13rem;margin:6px 0}.project p{color:#647168;font-size:.88rem}.project-go{display:block;margin-top:10px;color:#8d641f;font-size:.78rem;font-weight:800}
.language-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.language-card{padding:26px;border:1px solid rgba(19,38,26,.12);border-radius:22px;background:#fff;box-shadow:0 24px 54px -44px rgba(16,37,26,.45)}.language-card h3{font-family:var(--display);font-size:1.3rem}.language-card>p{margin-top:7px;color:#6b756e;font-size:.88rem}.ratings{margin-top:20px;display:grid;gap:11px}.rating{display:grid;grid-template-columns:1fr auto 36px;gap:12px;align-items:center;padding-bottom:10px;border-bottom:1px solid rgba(19,38,26,.1)}.rating b{font-size:.9rem}.stars{color:#d29a30;letter-spacing:.06em}.stars .off{color:#d5d8d5}.rating small{color:#818b84}.education-list{margin-top:18px;display:grid;gap:13px}.edu{padding-bottom:13px;border-bottom:1px solid rgba(19,38,26,.1)}.edu b{display:block}.edu span{display:block;color:#69736d;font-size:.88rem;margin-top:3px}
.life-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.life-card{position:relative;min-height:500px;overflow:hidden;border-radius:34px 18px 34px 18px;background:#111;box-shadow:0 30px 70px -46px rgba(0,0,0,.85);transform:rotate(-.45deg);transition:transform .3s}.life-card:nth-child(even){transform:rotate(.55deg)}.life-card:hover{transform:translateY(-5px) rotate(0)}.life-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.life-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(19,24,35,.94) 100%)}.life-card-copy{position:absolute;z-index:2;left:23px;right:23px;bottom:23px}.life-card-copy span{color:var(--accent2);font-family:var(--display);font-size:.68rem;font-weight:800;letter-spacing:.11em}.life-card-copy h3{font-family:var(--display);font-size:1.35rem;margin:6px 0}.life-card-copy p{color:rgba(255,255,255,.74);font-size:.9rem}.lesson-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.life-lesson{padding:24px;border:1px solid rgba(41,48,60,.12);border-radius:22px;background:#fff;box-shadow:0 24px 50px -42px rgba(41,48,60,.5)}.life-lesson .n{color:#bd5438;font-family:var(--display);font-size:.68rem;font-weight:800;letter-spacing:.09em}.life-lesson h3{font-family:var(--display);font-size:1.16rem;margin:8px 0 5px}.life-lesson p{color:#69707b;font-size:.9rem}.loadout{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}.chip{padding:9px 13px;border-radius:999px;background:#293342;color:#fff;font-size:.77rem;font-weight:700}.chip:nth-child(3n+2){background:#b9543a}.chip:nth-child(3n){background:#307788}
.contact{background:linear-gradient(145deg,#06180f,#0b2a1b);transition:background .5s}.lifestyle-mode .contact{background:linear-gradient(145deg,#151c28,#263d50)}.contact .title{margin-top:12px;max-width:930px}.contact .sub{margin-top:15px}.contact .sub b{color:var(--accent)}.contact-life{display:none}.lifestyle-mode .contact-career{display:none}.lifestyle-mode .contact-life{display:inline}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:28px}.contact-card{padding:20px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:rgba(255,255,255,.055);transition:transform .2s,border-color .2s}.contact-card:hover{transform:translateY(-4px);border-color:var(--accent)}.contact-card b{display:block;font-family:var(--display)}.contact-card span{display:block;margin-top:4px;color:rgba(255,255,255,.65);font-size:.82rem}.first-link{display:inline-flex;margin-top:27px;color:var(--accent);font-size:.82rem;font-weight:800}footer{padding:27px 0 42px;text-align:center;background:#04120b;color:rgba(255,255,255,.45);font-size:.76rem}.lifestyle-mode footer{background:#111722}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}.reveal.show{opacity:1;transform:none}
@media(max-width:980px){.navin{align-items:flex-start;padding:10px 0}.navright{flex-wrap:wrap;justify-content:flex-end}.hero-grid{grid-template-columns:1fr}.hero{min-height:auto}.hero-media{min-height:700px}.float-badge{right:12px}.value-grid{grid-template-columns:1fr}.stats{margin-top:-22px}.project-grid{grid-template-columns:1fr}}
@media(max-width:720px){body{font-size:18px}.wrap{width:min(100% - 24px,1160px)}.navin{min-height:0;display:grid;grid-template-columns:auto 1fr;gap:8px;padding:9px 0}.brand{padding-top:8px}.navright{display:grid;grid-template-columns:1fr auto;gap:7px}.mode-switch{grid-column:1 / -1}.switch-btn{min-width:0}.version-link{display:none}.lang button{min-width:39px}.hero{padding:48px 0 62px}.hero-grid{gap:30px}.hero h1{font-size:clamp(2.5rem,13vw,4.25rem)}.hero-media{min-height:530px}.hero-photo{border-radius:24px}.float-badge{top:14px;right:8px;font-size:.63rem}.stats-grid{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.1)}.proof-split,.language-grid,.life-gallery,.lesson-grid,.contact-grid{grid-template-columns:1fr}.proof-photo{min-height:430px}.job{grid-template-columns:1fr;gap:7px;padding:19px}.project{grid-template-columns:64px 1fr;padding:18px}.project-icon{width:60px;height:60px;border-radius:18px;font-size:28px}.life-card{min-height:470px}.section{padding:68px 0}.switch-wipe span{width:60px;height:60px}}
@media(max-width:420px){.hero-media{min-height:470px}.hero-caption{left:12px;right:12px;bottom:12px;padding:14px}.stats-grid{border-radius:15px}.stat{padding:18px 15px}.project{grid-template-columns:1fr}.project-icon{width:56px;height:56px}.contact-grid{gap:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.switching .switch-wipe::before,.switching .switch-wipe span,.mode-enter .world:not([hidden]),.mode-enter .world:not([hidden]) .hero-media{animation:none}.mode-indicator,.btn,.project,.life-card{transition:none}}