/* Eric Tu — bespoke academic portfolio | 2026 */
:root{--ink:#14242a;--ink-2:#314147;--navy:#12242a;--navy-deep:#101d23;--paper:#f6f4ef;--white:#fffefa;--muted:#687577;--border:#d9dcd7;--accent:#d6826d;--accent-dark:#b95e4d;--sage:#c8d4c6;--pale:#eaece4;--serif:Georgia,'Times New Roman',serif;--sans:Inter,'Aptos',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--wide:1260px}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}img,svg{max-width:100%}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}::selection{background:#ebbbad;color:#152b2f}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.container{width:min(var(--wide),calc(100% - 88px));margin:0 auto}.skip-link{position:absolute;top:-100px;left:15px;padding:12px 20px;background:white;color:black;z-index:200}.skip-link:focus{top:10px}.site-header{position:relative;z-index:20;background:rgba(248,247,243,.97);border-bottom:1px solid #e5e6e1}.header-inner{height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{display:inline-flex;gap:12px;align-items:center;flex-shrink:0}.logo-mark{height:38px;width:38px;border:1.3px solid var(--ink);border-radius:50%;display:grid;place-items:center;color:var(--accent-dark);font-family:var(--serif);font-size:23px;font-style:italic;font-weight:700;letter-spacing:-3px;padding-right:3px}.logo-type{font-size:13px;line-height:1.27;letter-spacing:.15em;font-weight:750}.logo-type small{display:block;letter-spacing:.12em;font-size:9px;font-weight:650;color:#6e7a7b;margin-top:4px}.nav{display:flex;align-items:center;gap:27px}.nav a{font-size:12px;font-weight:620;letter-spacing:.055em;color:#566365;position:relative;transition:color .2s}.nav a:hover,.nav a[aria-current='page']{color:#0f2428}.nav a[aria-current='page']::after{content:'';position:absolute;bottom:-32px;left:0;right:0;height:2px;background:var(--accent)}.nav .nav-cv{margin-left:9px;border:1px solid var(--ink);padding:11px 15px;color:var(--ink);white-space:nowrap}.nav .nav-cv::after{display:none}.nav .nav-cv:hover{background:var(--ink);color:var(--white)}.mobile-toggle{display:none;border:0;background:transparent;align-items:center;justify-content:center;width:40px;height:40px}.mobile-toggle span,.mobile-toggle span::before,.mobile-toggle span::after{content:'';display:block;width:22px;height:2px;background:var(--ink);position:relative;transition:transform .2s}.mobile-toggle span::before{top:-7px}.mobile-toggle span::after{top:5px}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.23em;font-weight:800;color:var(--accent-dark)}.eyebrow.light{color:#e9a48e}.eyebrow.dark{color:#a3b4b3}.eyebrow-dot::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:10px;vertical-align:2px}.display{font-family:var(--serif);font-weight:400;letter-spacing:-.052em}.display em{color:var(--accent);font-weight:400}.button{display:inline-flex;align-items:center;justify-content:center;gap:15px;min-height:48px;padding:14px 21px;background:var(--accent);border:1px solid var(--accent);color:#122127;font-size:12px;letter-spacing:.025em;font-weight:770;transition:all .2s}.button:hover{background:#efaa95;transform:translateY(-2px)}.button.outline{background:transparent;color:var(--white);border-color:#809194}.button.outline:hover{border-color:#eeb29c;color:#ffd6c7}.button.dark{background:var(--ink);border-color:var(--ink);color:white}.button.ghost{background:transparent;border-color:var(--border);color:var(--ink)}.button.ghost:hover{background:white}.arrow{font-size:19px;line-height:0}.inline-link{font-size:12px;font-weight:780;letter-spacing:.02em;display:inline-flex;align-items:center;gap:12px;border-bottom:1px solid currentColor;padding-bottom:8px}.inline-link:hover{color:var(--accent-dark)}
/* Homepage hero */
.hero{background:var(--navy-deep);color:#f9f6f0;overflow:hidden}.hero-layout{display:grid;grid-template-columns:50% 50%;min-height:638px}.hero-copy{padding:105px 20px 82px 0;position:relative;z-index:2}.hero h1{font-family:var(--serif);font-size:clamp(65px,6.15vw,103px);font-weight:400;letter-spacing:-.065em;line-height:.98;margin:26px 0 28px;max-width:685px}.hero h1 em{color:#e8a18d;font-style:italic}.hero p{font-size:16px;line-height:1.8;color:#c4cdcc;max-width:515px;margin:0 0 37px}.hero-cta{display:flex;gap:13px;flex-wrap:wrap}.hero-meta{display:flex;align-items:center;gap:15px;font-size:11px;color:#a6b7b6;text-transform:uppercase;letter-spacing:.11em;margin-top:79px}.hero-meta .line{height:1px;width:40px;background:#76898a}.hero-art{min-width:0;position:relative;display:flex;align-items:center;justify-content:center}.hero-art::before{content:'';position:absolute;inset:-8% -60% -10% -25%;background:radial-gradient(ellipse at 52% 46%,rgba(174,111,100,.28),transparent 51%),radial-gradient(ellipse at 73% 80%,rgba(131,151,143,.18),transparent 55%)}.connection-svg{position:relative;width:114%;max-width:none;transform:translateX(6%);filter:drop-shadow(0 0 30px rgba(235,176,154,.06))}.art-caption{position:absolute;bottom:51px;right:0;color:#bec9c5;font-size:10px;letter-spacing:.16em;text-transform:uppercase}.art-caption::before{content:'✧';color:var(--accent);font-size:20px;margin-right:9px}.hero-art .floating-word{position:absolute;color:#b8c1be;font-family:var(--serif);font-size:15px;font-style:italic;letter-spacing:.015em}.floating-word.one{top:24%;left:6%}.floating-word.two{top:34%;right:1%}.floating-word.three{bottom:26%;left:2%}
/* sections */
.section{padding:105px 0}.section-tight{padding:80px 0}.section-label{font-size:11px;letter-spacing:.18em;font-weight:850;text-transform:uppercase;color:#a75e4e}.section-head{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:48px}.section-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(39px,4.4vw,67px);letter-spacing:-.056em;line-height:1.07;margin:14px 0 0}.section-head p{max-width:410px;color:var(--muted);font-size:14px;line-height:1.75;margin:0 0 8px}.intro-grid{display:grid;grid-template-columns:32% 1fr;gap:8%;align-items:start}.intro-grid h2{font-size:clamp(43px,4vw,65px);margin:13px 0 0;line-height:1.06}.intro-body>p{font-size:clamp(20px,2.3vw,29px);line-height:1.5;letter-spacing:-.024em;color:#37474b;font-family:var(--serif);margin:0 0 41px}.question-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.question-item{border-top:1px solid #c5cec9;padding-top:18px}.question-item .num{font-family:var(--serif);font-size:17px;color:var(--accent-dark)}.question-item h3{font-size:16px;letter-spacing:-.02em;font-weight:730;margin:16px 0 8px}.question-item p{font-size:12px;line-height:1.75;color:var(--muted);margin:0}.research-section{background:#e9ece6}.research-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.research-card{display:flex;flex-direction:column;min-height:410px;position:relative;background:#fffdf8;border:1px solid #d8deda;overflow:hidden;transition:transform .23s,box-shadow .23s}.research-card:hover{transform:translateY(-5px);box-shadow:0 18px 30px #1b2d2b11}.research-card .visual{height:171px;position:relative;overflow:hidden;background:#deded7;display:grid;place-items:center}.research-card .visual img{height:100%;width:100%;object-fit:cover}.visual.visual-one{background:#d5dfd9}.visual.visual-two{background:#d9cbc2}.visual.visual-three{background:#253c43}.research-card-body{padding:26px 27px 30px;display:flex;flex:1;flex-direction:column}.research-card .card-num{font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:#ac6d5d;font-weight:800}.research-card h3{font-family:var(--serif);font-size:29px;font-weight:400;letter-spacing:-.04em;line-height:1.2;margin:14px 0 11px}.research-card p{font-size:13px;line-height:1.75;color:#647273;margin:0 0 24px}.research-card .card-link{margin-top:auto;font-size:12px;font-weight:750;color:#b56553;display:inline-flex;gap:12px;align-items:center}.research-card .card-link span{font-size:20px}.spotlight{background:var(--navy);color:#f7f5ee}.spotlight-inner{display:grid;grid-template-columns:.82fr 1fr;gap:12%;align-items:center}.spotlight h2{font-family:var(--serif);font-size:clamp(41px,4.4vw,72px);letter-spacing:-.05em;font-weight:400;line-height:1.07;margin:18px 0 24px}.spotlight p{font-size:14px;line-height:1.75;color:#b3c1c0;margin:0 0 29px;max-width:530px}.small-caption{color:#899e9f;font-size:10px;text-transform:uppercase;letter-spacing:.17em}.dimensions{display:grid;grid-template-columns:1fr 1fr;gap:11px;position:relative}.dimension{padding:24px;border:1px solid #587076;background:#1a3239;min-height:126px}.dimension:nth-child(2){background:#234047}.dimension:nth-child(3){background:#233e42}.dimension:nth-child(4){background:#1b3338}.dimension:nth-child(5){grid-column:1 / -1;background:#304449}.dimension small{font-family:var(--serif);font-size:27px;color:#e6a28b;display:block;margin-bottom:8px}.dimension strong{display:block;font-size:13px;letter-spacing:.025em;font-weight:550}.publication-list{border-top:1px solid var(--border)}.pub-row{display:grid;grid-template-columns:110px 1fr 135px;gap:30px;padding:27px 0;border-bottom:1px solid var(--border);align-items:start}.pub-year{font-family:var(--serif);font-size:21px;color:#a76555}.pub-title{font-family:var(--serif);font-size:22px;line-height:1.27;letter-spacing:-.027em;margin:0 0 8px}.pub-authors{color:#526367;font-size:12px;line-height:1.75;margin:0 0 6px}.pub-journal{color:#788486;font-size:11px;line-height:1.6;margin:0}.pub-type{display:inline-block;font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding:6px 8px;background:#e9e9e2;color:#566264;border-radius:2px;font-weight:750;margin-top:6px}.pub-type.preprint{background:#f2ded5;color:#a15445}.pub-actions{display:flex;justify-content:flex-end;gap:14px;align-items:center}.pub-actions a{font-size:11px;font-weight:730;color:#b45c4c;white-space:nowrap}.pub-actions a:hover{text-decoration:underline}.pub-actions a::after{content:'↗';margin-left:7px;font-size:15px}.cta-banner{background:#d9e1d9;border-top:1px solid #c7d3ce}.cta-inner{padding:61px 0;display:flex;justify-content:space-between;align-items:center;gap:30px}.cta-inner h2{font-family:var(--serif);font-size:clamp(35px,4.1vw,59px);line-height:1.11;letter-spacing:-.04em;font-weight:400;margin:7px 0}.cta-inner p{font-size:13px;color:#657477;max-width:470px;line-height:1.65;margin:15px 0 0}
/* Interior pages */
.page-hero{background:#eff0e9;padding:105px 0 92px;border-bottom:1px solid #dde0d7}.page-hero.dark{background:var(--navy-deep);color:#f6f5ed;border-color:#233a41}.page-hero-inner{display:grid;grid-template-columns:55% 1fr;gap:12%;align-items:end}.page-hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(58px,6.9vw,104px);line-height:.99;letter-spacing:-.065em;margin:22px 0 0}.page-hero h1 em{color:#d58b77}.page-hero .lede{font-size:16px;line-height:1.83;max-width:455px;color:#5e6d6e;margin:0}.page-hero.dark .lede{color:#c6d0cd}.editorial-row{display:grid;grid-template-columns:43% 1fr;gap:11%;padding:63px 0;border-bottom:1px solid var(--border)}.editorial-row h2{font-family:var(--serif);font-size:clamp(32px,3.4vw,53px);font-weight:400;letter-spacing:-.055em;line-height:1.17;margin:12px 0}.editorial-row p{font-size:14px;color:#5c6c70;line-height:1.85;margin:0 0 20px}.editorial-row .kicker{font-size:10px;font-weight:850;letter-spacing:.19em;color:#b26655;text-transform:uppercase}.editorial-row ul{padding-left:20px;color:#59676b;font-size:13px;line-height:1.95}.method-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.method-card{background:#fffefa;border:1px solid var(--border);padding:24px;min-height:180px}.method-card .method-number{font-family:var(--serif);color:#c17864;font-size:24px}.method-card h3{font-size:15px;margin:28px 0 8px}.method-card p{font-size:11px;color:var(--muted);line-height:1.7;margin:0}.callout-quote{margin:0;background:#e7e6dc;padding:52px 55px;border-left:3px solid var(--accent);font-family:var(--serif);font-size:clamp(25px,3vw,42px);line-height:1.35;letter-spacing:-.035em}.research-metrics{display:flex;gap:48px;flex-wrap:wrap;margin-top:36px}.research-metrics strong{font-family:var(--serif);font-size:43px;display:block;font-weight:400;letter-spacing:-.04em}.research-metrics span{font-size:11px;color:#627274}.toolbar{display:flex;align-items:center;gap:16px;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap}.filter-buttons{display:flex;flex-wrap:wrap;gap:8px}.filter{background:transparent;border:1px solid #cbd1cd;padding:10px 14px;color:#5e6b6c;font-size:11px;font-weight:680}.filter.active,.filter:hover{background:var(--ink);color:white;border-color:var(--ink)}.search-box{min-width:265px;background:#fffefa;border:1px solid #ccd1ce;color:#24363a;padding:10px 14px;font-size:12px}.publication-count{color:#758282;font-size:12px;margin:18px 0 24px}.publication-item[hidden]{display:none!important}.publication-item{display:grid;grid-template-columns:90px 1fr 120px;gap:32px;padding:25px 0;border-bottom:1px solid var(--border)}.publication-item .publication-title{font-family:var(--serif);font-size:22px;margin:0 0 9px;line-height:1.3;letter-spacing:-.03em}.publication-item .abstract{color:#768386;font-size:12px;line-height:1.7;margin:8px 0 10px}.publication-item .pub-actions{justify-content:end}.pub-year.mono{font-size:19px}.pub-group-title{font-size:11px;text-transform:uppercase;letter-spacing:.17em;font-weight:800;color:#a35a4b;margin:0 0 13px}.teaching-feature{background:#e4eae4;padding:42px;display:grid;grid-template-columns:1.1fr .9fr;gap:10%;align-items:center}.teaching-feature h2{font-family:var(--serif);font-weight:400;letter-spacing:-.045em;font-size:clamp(30px,3.2vw,49px);line-height:1.15;margin:12px 0 17px}.teaching-feature p{font-size:14px;line-height:1.8;color:#5d6c6d}.teaching-tag{font-size:11px;border:1px solid #b6c4bd;padding:10px 13px;display:inline-block;margin:4px;color:#344c4d}.teaching-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.teaching-step{border-top:1px solid #b8c3be;padding-top:20px}.teaching-step span{font-family:var(--serif);color:var(--accent-dark);font-size:24px}.teaching-step h3{font-size:17px;margin:20px 0 10px}.teaching-step p{font-size:13px;color:#687777;line-height:1.8}.timeline{border-left:1px solid #c8d2cb;padding-left:30px}.timeline-item{position:relative;margin-bottom:36px}.timeline-item::before{content:'';width:9px;height:9px;border:2px solid var(--accent-dark);background:var(--paper);position:absolute;left:-35px;top:4px;border-radius:50%}.timeline-item small{font-size:10px;letter-spacing:.1em;color:#a25f53;text-transform:uppercase;font-weight:800}.timeline-item h3{font-size:17px;font-weight:650;margin:7px 0 4px}.timeline-item p{font-size:13px;line-height:1.7;color:#708080;margin:0}.bio-statement{font-family:var(--serif);font-size:clamp(26px,3.3vw,49px);line-height:1.34;letter-spacing:-.035em;max-width:1040px}.award-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.award-card{background:#fffefa;padding:26px 25px;min-height:172px;border:1px solid var(--border)}.award-card .award-year{font-family:var(--serif);font-size:27px;color:#c07560}.award-card h3{font-size:14px;line-height:1.5;margin:15px 0 4px}.award-card p{font-size:11px;color:#687576;line-height:1.6;margin:0}.contact-block{background:var(--navy);color:var(--white);padding:75px;display:grid;grid-template-columns:1.2fr .8fr;gap:10%;align-items:center}.contact-block h2{font-family:var(--serif);font-size:clamp(39px,5vw,75px);letter-spacing:-.056em;font-weight:400;line-height:1.05;margin:15px 0 21px}.contact-block p{font-size:14px;line-height:1.8;color:#c1cdcb}.contact-email{font-family:var(--serif);font-size:clamp(24px,3vw,42px);letter-spacing:-.035em;border-bottom:1px solid #6f8382;display:inline-block;padding-bottom:9px;overflow-wrap:anywhere}.contact-email:hover{color:#f2a58b}.contact-list{border-top:1px solid #415558;margin-top:22px}.contact-list a,.contact-list span{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid #415558;color:#cad4d1;font-size:12px}.contact-list a:hover{color:#f1b099}.copy-email{color:#d59a85;border:1px solid #677f7e;background:transparent;padding:11px 13px;margin-top:19px;font-size:11px}.copy-email:hover{border-color:#eeb59b}.cv-panel{background:#e6ebe4;padding:38px 44px;display:flex;justify-content:space-between;align-items:center;gap:30px}.cv-panel h2{font-family:var(--serif);font-size:32px;letter-spacing:-.04em;font-weight:400;margin:7px 0}.cv-panel p{font-size:12px;color:#6b7878;line-height:1.7;margin:6px 0 0}
/* Footer */
.site-footer{background:#112228;color:#c6d2cf}.footer-top{display:grid;grid-template-columns:1.3fr .7fr .8fr;gap:40px;padding:70px 0 55px}.footer-name{font-family:var(--serif);font-size:40px;color:#f7f3ec;letter-spacing:-.06em}.footer-strap{font-size:12px;line-height:1.8;color:#91a5a3;max-width:310px;margin-top:13px}.footer-column h4{font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:#d7a38f;margin:7px 0 20px}.footer-column a,.footer-column p{display:block;color:#b2c2be;font-size:12px;margin:0 0 13px}.footer-column a:hover{color:white}.footer-bottom{padding:20px 0 25px;border-top:1px solid #2e444a;display:flex;justify-content:space-between;gap:15px;color:#788e90;font-size:10px}.footer-bottom a{color:#aebdbc}.reveal{opacity:1;transform:none}body.anim-ready .reveal{opacity:0;transform:translateY(18px);transition:opacity .65s,transform .65s}body.anim-ready .reveal.is-visible{opacity:1;transform:none}
@media(max-width:1020px){.container{width:min(var(--wide),calc(100% - 54px))}.nav{gap:15px}.nav a{font-size:11px}.hero-layout{min-height:560px}.hero-copy{padding-top:84px}.hero h1{font-size:clamp(62px,7vw,88px)}.hero-meta{margin-top:60px}.research-card h3{font-size:25px}.spotlight-inner{gap:5%}.floating-word{display:none}.pub-row{grid-template-columns:70px 1fr 100px;gap:18px}}
@media(max-width:760px){.container{width:calc(100% - 38px)}.header-inner{height:70px}.site-header{position:sticky;top:0}.mobile-toggle{display:flex}.nav{display:none;position:absolute;top:70px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:10px 19px 20px;background:var(--paper);border-bottom:1px solid #d4d8d2;box-shadow:0 20px 25px #14242a18}.nav.is-open{display:flex}.nav a{display:block;font-size:13px;padding:13px 10px}.nav a[aria-current='page']::after{display:none}.nav .nav-cv{margin:8px 0 0;width:max-content}.hero-layout{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:70px 0 32px}.hero h1{font-size:clamp(60px,11vw,90px);max-width:660px}.hero p{font-size:15px}.hero-meta{margin-top:44px}.hero-art{height:310px}.connection-svg{width:620px;max-width:none;transform:none}.art-caption{bottom:16px;right:15px}.section{padding:68px 0}.section-tight{padding:60px 0}.intro-grid,.spotlight-inner,.page-hero-inner,.editorial-row,.contact-block{grid-template-columns:1fr;gap:26px}.intro-body>p{font-size:26px}.question-grid,.research-grid,.teaching-steps,.award-list{grid-template-columns:1fr}.research-card{min-height:auto}.research-card .visual{height:190px}.research-card-body{min-height:230px}.section-head{align-items:start;flex-direction:column;gap:22px}.section-head h2{font-size:51px}.spotlight h2{font-size:54px}.spotlight .dimensions{margin-top:20px}.pub-row,.publication-item{grid-template-columns:50px 1fr;gap:15px}.pub-actions{grid-column:2;justify-content:flex-start!important}.page-hero{padding:70px 0}.page-hero h1{font-size:clamp(58px,11vw,88px)}.method-cards{grid-template-columns:repeat(2,1fr)}.teaching-feature{grid-template-columns:1fr;padding:28px;gap:18px}.contact-block{padding:34px 26px}.contact-block h2{font-size:48px}.cta-inner,.cv-panel{flex-direction:column;align-items:flex-start}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-top>div:first-child{grid-column:1/-1}.footer-bottom{flex-direction:column}.floating-word{display:none}}
@media(max-width:420px){.hero h1{font-size:56px}.hero-copy{padding-top:56px}.hero-art{height:250px}.hero-cta{gap:9px}.button{font-size:11px;padding:12px 14px}.dimensions{grid-template-columns:1fr}.dimension:nth-child(5){grid-column:auto}.section-head h2{font-size:43px}.method-cards{grid-template-columns:1fr}.pub-row,.publication-item{grid-template-columns:1fr}.pub-actions{grid-column:1}.search-box{min-width:100%;width:100%}.footer-top{grid-template-columns:1fr}.footer-top>div:first-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}body.anim-ready .reveal{opacity:1;transform:none}}
