@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Libre+Caslon+Display&display=swap');
:root{--paper:#fffcfb;--ink:#332626;--muted:#695858;--accent:#cc9999;--accent-ink:#663333;--accent-mid:#996666;--line:#e4d1cf;--tint:#f8eeee;--white:#fff;--serif:'Libre Caslon Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:2rem}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent-ink);outline-offset:6px}.wrap{width:min(1248px,calc(100% - 112px));margin-inline:auto}.site-header{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-family:var(--serif);font-size:2.5rem;line-height:1;letter-spacing:-.1rem}.wordmark span{color:var(--accent-ink)}nav{display:flex;gap:2.5rem;font-size:.875rem;font-weight:500}nav a:hover,.text-link:hover,.social-links a:hover{color:var(--accent-ink);text-decoration:underline;text-underline-offset:5px}nav a:last-child{display:flex;gap:1.5rem}.hero{display:grid;grid-template-columns:1.18fr 1fr;gap:7%;padding-block:96px 104px;align-items:center}.eyebrow{font-size:.75rem;letter-spacing:.15em;font-weight:600;line-height:1.5;margin:0 0 28px;color:var(--accent-ink)}h1,h2,h3,p{margin-top:0}h1{font-family:var(--serif);font-size:clamp(4rem,6.8vw,6.5rem);font-weight:400;line-height:1.01;letter-spacing:-.038em;margin-bottom:30px}h1 span{color:var(--accent-ink)}.hero-footnote{font-size:.875rem;color:var(--muted);margin-bottom:0}.short-rule{display:block;width:42px;height:2px;background:var(--accent);margin-bottom:25px}.hero-intro h2{font-weight:500;font-size:clamp(1.4rem,2.1vw,1.85rem);line-height:1.4;letter-spacing:-.025em;margin-bottom:22px}.hero-intro h2 span{color:var(--accent-ink)}.hero-intro>p{color:var(--muted);max-width:490px;line-height:1.8;margin-bottom:28px}.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}.button{background:var(--accent);color:var(--ink);padding:13px 20px;display:inline-flex;align-items:center;gap:30px;font-size:.875rem;font-weight:500;min-height:48px;border:1px solid var(--accent);transition:background .2s}.button:hover{background:var(--accent-ink);color:var(--white)}.text-link{font-size:.875rem;font-weight:500;display:inline-flex;gap:12px;padding-block:12px}.social-links{display:flex;gap:26px;font-size:.875rem;color:var(--muted);margin-top:28px}.social-links a{display:flex;gap:10px}.glance{border-top:1px solid var(--line);padding-block:30px 48px}.glance>.eyebrow{color:var(--muted);margin-bottom:26px}.stats{display:grid;grid-template-columns:repeat(4,1fr)}.stat{padding-inline:30px;border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end}.stat:first-child{border-left:0;padding-left:0}.stat:last-child{padding-right:0}.stat strong{display:block;font-size:1.55rem;line-height:1.35;letter-spacing:-.03em;font-weight:500}.stat .stat-number{font-family:var(--serif);font-size:4.6rem;line-height:.98;font-weight:400}.stat-number span{color:var(--accent-ink)}.stat p{font-size:.875rem;color:var(--muted);margin:15px 0 0}.inline-arrow{color:var(--accent-ink)}.skip-link{position:fixed;left:12px;top:-80px;background:var(--accent-ink);color:white;padding:10px 18px;z-index:20}.skip-link:focus{top:12px}::selection{background:#ffcccc;color:var(--ink)}
@media(min-width:1600px){.hero{padding-block:115px 120px}}@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.hero{gap:6%;padding-block:72px 80px}.hero-actions{gap:12px}.stat{padding-inline:20px}.stat strong{font-size:1.25rem}}@media(max-width:700px){.wrap{width:calc(100% - 40px)}.site-header{height:86px}nav{gap:20px;font-size:.8125rem}nav a:last-child{gap:7px}.wordmark{font-size:2.15rem}.hero{grid-template-columns:1fr;padding-block:55px 60px;gap:38px}h1{font-size:clamp(3.8rem,14.5vw,5.4rem)}.hero .eyebrow{margin-bottom:22px}.hero-intro{border-top:1px solid var(--line);padding-top:30px}.short-rule{display:none}.hero-intro h2{font-size:1.55rem}.hero-intro>p{max-width:none}.hero-actions{gap:22px}.stats{grid-template-columns:1fr 1fr;row-gap:28px}.stat{padding-inline:18px}.stat:nth-child(3){border-left:0;padding-left:0;padding-top:23px;border-top:1px solid var(--line)}.stat:nth-child(4){padding-top:23px;border-top:1px solid var(--line)}.stat strong{font-size:1.22rem}.stat .stat-number{font-size:3.75rem}.glance{padding-bottom:35px}}
.section{padding-block:82px;border-top:1px solid var(--line)}.section-heading{margin-bottom:42px}.section-heading .eyebrow,.split-heading .eyebrow{margin-bottom:20px}.eyebrow span{color:#996666;margin-right:12px}h2{font-family:var(--serif);font-size:clamp(2.4rem,3.5vw,3.4rem);font-weight:400;line-height:1.13;letter-spacing:-.023em;margin-bottom:0}.hero-intro h2{font-family:var(--sans)}.expertise-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:72px}.expertise-item{display:flex;gap:23px;padding-block:26px 24px;border-top:1px solid var(--line)}.area-number{font-size:.8125rem;color:var(--accent-ink);padding-top:4px;font-variant-numeric:tabular-nums}.expertise-item h3{font-weight:500;font-size:1.22rem;line-height:1.45;letter-spacing:-.015em;margin-bottom:10px}.expertise-item p{color:var(--muted);margin:0;max-width:420px;font-size:1rem;line-height:1.7}.work-section{background:var(--tint);padding-block:80px 88px;border-block:1px solid var(--line)}.work-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}.section-note{font-size:.875rem;color:var(--muted);margin-bottom:3px;line-height:1.7}.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.case-card{background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.case-top{padding:28px 26px 24px;border-bottom:1px solid var(--line)}.case-top .eyebrow{font-size:.75rem;letter-spacing:.12em;margin-bottom:26px}.case-top h3{font-family:var(--serif);font-size:2.25rem;font-weight:400;letter-spacing:-.025em;line-height:1.12;margin-bottom:24px}.case-flow{display:flex;align-items:center;gap:5px;color:var(--accent-ink);font-size:.75rem;line-height:1.6;flex-wrap:wrap}.case-flow span[aria-hidden]{color:#996666}.case-details{padding:26px;margin:0;display:flex;flex-direction:column;gap:24px;flex:1}.case-details>div{margin:0}.case-details dt{font-size:.8125rem;font-weight:650;color:var(--ink);margin-bottom:7px}.case-details dd{margin:0;font-size:1rem;line-height:1.65;color:var(--muted)}.case-details .case-scope{border-top:1px solid var(--line);padding-top:22px;margin-top:auto}.case-scope dt{color:var(--accent-ink)}.case-scope dd{color:var(--ink)}.how{border-top:0;padding-block:84px 88px}.workflow{list-style:none;padding:0;margin:46px 0 0;display:grid;grid-template-columns:repeat(6,1fr)}.workflow li{position:relative;padding-right:12px}.workflow li:not(:last-child)::before{content:'';position:absolute;left:38px;right:10px;top:16px;height:1px;background:var(--line)}.workflow li:not(:last-child)::after{content:'→';position:absolute;right:10px;top:4px;color:#996666;background:var(--paper);padding-left:6px;font-size:.9375rem}.step-index{display:flex;align-items:center;justify-content:center;width:33px;height:33px;border:1px solid var(--line);font-size:.75rem;color:var(--accent-ink);border-radius:50%;margin-bottom:22px}.workflow h3{font-size:1.04rem;font-weight:550;margin-bottom:8px}.workflow p{font-size:.875rem;line-height:1.65;color:var(--muted);margin-bottom:0}.experience,.education{display:grid;grid-template-columns:.9fr 1.1fr;gap:9%}.experience-label{font-size:.75rem;letter-spacing:.12em;color:var(--accent-ink);font-weight:600;margin-bottom:15px}.experience-entry h3{font-size:1.6rem;line-height:1.4;font-weight:500;letter-spacing:-.025em;margin-bottom:20px}.experience-summary{color:var(--muted);margin-bottom:22px;line-height:1.75}.clean-list{margin:0;padding:0;list-style:none}.clean-list li{border-top:1px solid var(--line);padding:16px 0 16px 22px;position:relative;color:var(--muted);line-height:1.75}.clean-list li::before{content:'—';position:absolute;left:0;color:var(--accent-ink)}.education-record{border-bottom:1px solid var(--line);padding-bottom:27px;margin-bottom:30px}.education-record .eyebrow,.skills .eyebrow{margin-bottom:16px;color:var(--muted)}.education-record h3{font-family:var(--serif);font-size:2.25rem;font-weight:400;line-height:1.2;margin-bottom:9px}.education-record>p:last-child{color:var(--muted);margin:0;font-size:.9375rem}.skills ul{display:flex;flex-wrap:wrap;gap:9px;list-style:none;margin:0;padding:0}.skills li{padding:6px 12px;border:1px solid var(--line);font-size:.875rem;color:var(--ink);border-radius:2px}.contact-section{background:var(--accent);color:var(--ink);padding-block:75px 80px}.contact-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:13%;align-items:center}.contact-section .eyebrow{color:#442424;margin-bottom:26px}.contact-section .eyebrow span{color:#663333}.contact-section h2{font-size:clamp(2.8rem,4.4vw,4rem);line-height:1.08;margin-bottom:25px}.contact-statement{max-width:475px;margin-bottom:0;color:#442424;font-size:1rem;line-height:1.8}.contact-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #996666;gap:20px;padding-block:21px;font-size:1.05rem}.contact-row:first-of-type{border-top:1px solid #996666}.contact-row[href]:hover{color:#442424}.contact-row:focus-visible{outline-color:var(--accent-ink)}.contact-pending{font-size:.875rem;line-height:1.6;color:#442424;margin-bottom:22px}.pending-label{font-size:.75rem;color:#442424}.site-footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding-block:28px;font-size:.8125rem;color:var(--muted)}.site-footer p{margin:0}.site-footer p:first-child{color:var(--ink);font-weight:500}.site-footer a{display:flex;gap:18px}.site-footer a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:1100px){.case-grid{gap:14px}.case-top,.case-details{padding:22px 20px}.case-top h3{font-size:1.95rem}.case-flow{min-height:38px;align-content:center}.case-details dd{font-size:.9375rem}.expertise-grid{column-gap:42px}.workflow p{font-size:.8125rem}.workflow h3{font-size:.9375rem}.contact-layout{gap:8%}.section-note{max-width:260px}.experience,.education{gap:6%}}
@media(max-width:850px){.case-grid{grid-template-columns:1fr}.case-card{display:grid;grid-template-columns:.72fr 1.28fr}.case-top{border-bottom:0;border-right:1px solid var(--line);padding:28px}.case-top h3{font-size:2.1rem}.case-flow{display:block;font-size:.8125rem}.case-flow span{display:block}.case-flow span[aria-hidden]{transform:rotate(90deg);width:fit-content;margin:4px 0}.case-details{padding:28px;gap:20px}.case-details dd{font-size:1rem}.case-details .case-scope{margin-top:0}.workflow{grid-template-columns:repeat(3,1fr);gap:32px 0}.workflow li:nth-child(3)::before,.workflow li:nth-child(3)::after{display:none}.workflow h3{font-size:1rem}.workflow p{font-size:.875rem}.work-heading{align-items:flex-start;display:block}.section-note{max-width:none;margin:20px 0 0}.section-note br{display:none}.experience,.education{grid-template-columns:1fr;gap:35px}.experience-content,.education-content{max-width:680px}.contact-layout{grid-template-columns:1fr;gap:35px}.contact-links{max-width:600px;width:100%}.contact-section h2{font-size:3.2rem}.contact-statement{max-width:600px}}
@media(max-width:700px){.section{padding-block:55px}.section-heading{margin-bottom:30px}h2{font-size:2.55rem}.expertise-grid{grid-template-columns:1fr}.expertise-item{padding-block:22px;gap:20px}.expertise-item p{max-width:none}.desktop-break{display:none}.work-section{padding-block:52px 55px}.case-grid{gap:22px}.case-card{display:flex}.case-top{padding:26px;border-right:0;border-bottom:1px solid var(--line)}.case-top .eyebrow{margin-bottom:20px}.case-top h3{font-size:2.35rem;margin-bottom:20px}.case-flow{display:flex;gap:7px;min-height:0;font-size:.75rem}.case-flow span{display:inline}.case-flow span[aria-hidden]{transform:none;width:auto;margin:0}.case-details{padding:26px;gap:22px}.workflow{margin-top:32px;gap:30px 0}.workflow h3{font-size:.9375rem}.workflow p{font-size:.8125rem}.workflow li{padding-right:6px}.step-index{margin-bottom:16px}.contact-section{padding-block:50px}.contact-section h2{font-size:2.95rem}.contact-row{font-size:1rem}.site-footer{flex-wrap:wrap;gap:9px;align-items:flex-start;padding-block:23px}.site-footer p:first-child{flex-basis:100%}.site-footer p:nth-child(2){font-size:.75rem}.site-footer a{margin-left:auto;font-size:.75rem;gap:8px}}
@media(max-width:370px){nav{gap:12px}.hero-actions{gap:13px}.stat strong{font-size:1.09rem}.stat p{font-size:.8125rem}.case-top,.case-details{padding:22px}.workflow{grid-template-columns:1fr 1fr}.workflow li:nth-child(3)::before,.workflow li:nth-child(3)::after{display:block}.workflow li:nth-child(even)::before,.workflow li:nth-child(even)::after{display:none}.workflow h3{font-size:1rem}.workflow p{font-size:.875rem}.site-footer p:nth-child(2){flex-basis:100%}.site-footer a{margin-left:0}}
.role-focus{font-weight:400;font-size:1.12rem;color:var(--muted);letter-spacing:0}.employer{font-weight:500;color:var(--accent-ink);margin:-8px 0 20px}.volunteer-entry{margin-top:40px;padding-top:33px;border-top:1px solid var(--line)}.education-record .education-university{font-weight:500;color:var(--ink);margin:17px 0 7px}.education-record>p:not(.eyebrow){font-size:.9375rem;line-height:1.75;color:var(--muted)}.education-record .education-focus{margin:16px 0 0}.contact-label{display:block;font-size:.75rem;letter-spacing:.12em;color:#442424;margin-bottom:7px}.email-contact{font-size:clamp(.875rem,1.35vw,1.08rem)}.email-contact>span:first-child{overflow-wrap:anywhere}.file-type{font-size:.6875rem;border:1px solid #996666;padding:2px 5px;margin-left:10px;letter-spacing:.03em;vertical-align:middle}.hero-footnote{max-width:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

.language-note{margin:22px 0 0;font-size:.9375rem;line-height:1.75;color:var(--muted)}

/* Stronger hierarchy, with the rose palette reserved for surfaces and accents. */
h1,.section-heading h2,.split-heading h2,.case-top h3,.education-record h3,.contact-section h2{font-weight:600}
.hero-intro h2,.expertise-item h3,.experience-entry h3,.workflow h3{font-weight:600}
.eyebrow,.experience-label,.case-details dt{font-weight:700}
.stat strong,.stat .stat-number{font-weight:600}
.button,.text-link,.employer,.contact-row{font-weight:600}
nav{font-weight:550}
.contact-row[href]:hover{text-decoration:underline;text-underline-offset:5px}
.step-index{background:#ffcccc;border-color:var(--accent);font-weight:600}
.case-top{border-top:3px solid var(--accent)}

.case-grid{align-items:start}
.case-overview,.case-expanded{margin:0;display:grid;gap:22px}
.case-overview .case-scope{padding-top:20px}
.case-disclosure{margin-top:auto;border-top:1px solid var(--line)}
.case-disclosure summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 0 0;font-size:.875rem;font-weight:600;color:var(--accent-ink);list-style:none;min-height:48px}
.case-disclosure summary::-webkit-details-marker{display:none}
.case-disclosure summary:hover{text-decoration:underline;text-underline-offset:4px}
.disclosure-icon{font-size:1.5rem;font-weight:400;line-height:1;transition:transform .18s}
.disclosure-open{display:none}
.case-disclosure[open] .disclosure-closed{display:none}
.case-disclosure[open] .disclosure-open{display:inline}
.case-disclosure[open] .disclosure-icon{transform:rotate(45deg)}
.case-expanded{padding-top:22px}
@media(prefers-reduced-motion:reduce){.disclosure-icon{transition:none}}

/* Language preference: compact on desktop, its own row of navigation on mobile. */
.site-header{gap:24px}
.site-header nav{margin-left:auto}
.language-switch{display:flex;flex-shrink:0;border:1px solid var(--line);padding:3px;gap:2px;border-radius:6px}
.language-switch[hidden]{display:none}
.language-switch button{border:0;background:transparent;color:var(--muted);font-size:.875rem;font-weight:600;min-width:44px;min-height:44px;padding:8px;cursor:pointer;border-radius:3px}
.language-switch button[aria-pressed="true"]{background:var(--accent);color:var(--ink)}
.language-switch button:hover{color:var(--accent-ink);background:var(--tint)}
.language-switch button[aria-pressed="true"]:hover{background:var(--accent)}
html[lang="id"] .workflow h3{overflow-wrap:anywhere;font-size:.9375rem}
@media(max-width:850px){.site-header{height:auto;min-height:112px;display:grid;grid-template-columns:1fr auto;padding-block:20px;gap:18px}.site-header .wordmark{grid-area:1/1}.site-header .language-switch{grid-area:1/2}.site-header nav{grid-area:2/1/3/3;margin-left:0;justify-content:space-between;gap:14px;flex-wrap:wrap}.site-header nav a{padding-block:6px}}

/* Sticky rose navigation: translucent only when backdrop filtering is supported. */
html{scroll-padding-top:112px}
.header-shell{position:sticky;top:0;z-index:30;background:linear-gradient(115deg,#f7e8e7,#fffcfb);border-bottom:1px solid var(--line)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.header-shell{background:linear-gradient(115deg,rgba(248,230,229,.82),rgba(255,252,251,.72));backdrop-filter:blur(18px) saturate(115%);-webkit-backdrop-filter:blur(18px) saturate(115%)}}
.header-shell .site-header{display:flex;height:92px;min-height:0;gap:28px;border:0;padding-block:0;position:relative}
.wordmark{font-weight:600;letter-spacing:-.045em}
.site-header nav{margin-left:auto;gap:30px}
.site-header nav a{padding-block:12px}
.language-switch{border-color:#dac0bf;background:rgba(255,252,251,.5)}
.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--line);background:var(--paper);border-radius:5px;padding:12px;cursor:pointer;color:var(--ink);flex-shrink:0}
.menu-toggle span{height:1.5px;background:currentColor;display:block;width:18px;margin:5px 0;transition:transform .18s}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.25px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.25px) rotate(-45deg)}
[hidden]{display:none!important}
.hero{padding-block:64px 72px}
.area-icon{flex:0 0 42px;height:42px;display:grid;place-items:center;background:var(--tint);border:1px solid var(--line);border-radius:8px;color:var(--accent-ink)}
.area-icon svg{width:24px;height:24px}
.experience-content{display:grid;gap:16px;align-content:start;min-width:0}
.experience-card{border:1px solid var(--line);border-radius:8px;background:var(--paper);overflow:hidden}
.experience-card[open]{border-color:var(--accent)}
.experience-card summary{position:relative;list-style:none;cursor:pointer;padding:24px 54px 20px 24px;background:var(--tint)}
.experience-card summary::-webkit-details-marker{display:none}
.experience-card summary:hover{background:#f3e5e4}
.experience-card summary:focus-visible{outline-offset:-4px}
.experience-card .experience-label{font-size:.75rem;line-height:1.6;letter-spacing:.08em;margin-bottom:12px}
.experience-card h3{font-size:1.25rem;font-weight:600;line-height:1.4;margin-bottom:12px;letter-spacing:-.02em}
.experience-card .role-focus{font-size:1rem}
.experience-card .employer{margin:0 0 12px;font-size:.9375rem}
.experience-card .experience-summary{margin:0;font-size:.9375rem;line-height:1.7}
.job-toggle{position:absolute;right:22px;top:23px;color:var(--accent-ink);font-size:1.6rem;line-height:1;transition:transform .18s}
.experience-card[open] .job-toggle{transform:rotate(45deg)}
.job-action{display:block;margin-top:18px;color:var(--accent-ink);font-size:.875rem;font-weight:600}
.job-open,.less-label{display:none}
.experience-card[open] .job-open,.more-experience[aria-expanded="true"] .less-label{display:inline}
.experience-card[open] .job-closed,.more-experience[aria-expanded="true"] .more-label{display:none}
.job-body{padding:8px 24px 14px}
.job-body .clean-list li{font-size:.9375rem;padding-block:13px}
.job-body .clean-list li:first-child{border-top:0}
.more-experience{border:0;background:transparent;color:var(--accent-ink);cursor:pointer;justify-content:space-between;text-align:left;padding:12px}
.sample-document{margin-top:25px;padding:20px;border:1px solid var(--line);border-top:3px solid var(--accent);background:white;box-shadow:3px 4px 0 #f0dfdd}
.sample-badge{font-size:.6875rem;line-height:1.5;letter-spacing:.07em;color:var(--accent-ink);font-weight:700;margin-bottom:12px}
.sample-document h4{font-size:1rem;font-weight:600;line-height:1.5;margin:0 0 16px}
.sample-document ol{padding:0;margin:0;list-style:none}
.sample-document li{display:flex;gap:12px;padding-block:10px;border-top:1px solid var(--line);font-size:.875rem;line-height:1.5}
.sample-document li>span:first-child{font-size:.75rem;color:var(--accent-ink);padding-top:2px}
.sample-note{font-size:.75rem;line-height:1.6;color:var(--muted);margin:16px 0 0}
@media(max-width:1000px){
 .header-shell .site-header{height:76px;gap:12px}
 .site-header .language-switch{margin-left:auto;padding:2px;gap:0}
 .language-switch button{min-width:38px;padding:6px;font-size:.8125rem}
 .js-navigation .menu-toggle:not([hidden]){display:block}
 .js-navigation #main-navigation{display:none;position:absolute;top:calc(100% + 1px);left:-20px;right:-20px;background:#fff9f8;border:1px solid var(--line);box-shadow:0 12px 18px rgba(74,40,40,.07);padding:12px 20px 18px;flex-direction:column;gap:0;margin:0;border-radius:0 0 8px 8px}
 .js-navigation #main-navigation.is-open{display:flex}
 .site-header nav a{padding:15px 8px;border-bottom:1px solid var(--line);font-size:1rem}
 .site-header nav a:last-child{border-bottom:0;justify-content:space-between}
 html{scroll-padding-top:96px}
 .hero{grid-template-columns:1fr;padding-block:48px 58px;gap:34px;align-items:start}
 .hero-heading{position:relative;padding-right:210px;min-height:180px}
 .hero h1{font-size:clamp(4rem,8vw,5.4rem);margin-bottom:22px}
 .hero .eyebrow{margin-bottom:20px}
 .hero-intro{border-top:1px solid var(--line);padding-top:28px}
 .hero-intro>p{max-width:680px}
 .short-rule{display:none}
 .hero-intro h2{font-size:1.7rem}
 .hero-actions{gap:22px}
}
@media(max-width:600px){
 .hero-heading{padding-right:0;min-height:0}
 .hero h1{font-size:clamp(3.6rem,14vw,5rem);max-width:68%}
 .hero-footnote{max-width:100%}
 .header-shell .site-header{height:72px;gap:9px}
 .hero{padding-block:36px 45px;gap:26px}
 .experience-card summary{padding:21px 46px 20px 20px}
 .job-toggle{right:18px}.job-body{padding-inline:20px}
}
@media(prefers-reduced-transparency:reduce){.header-shell{background:#f8eeee;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(max-width:600px){
 .hero-heading{display:grid;grid-template-columns:minmax(0,1fr) clamp(72px,24vw,98px);column-gap:12px;row-gap:22px}
 .hero-heading>.eyebrow{grid-column:1/-1;margin:0}
 .hero h1{grid-column:1;grid-row:2;font-size:clamp(2.8rem,12vw,4.8rem);max-width:none;margin:0;align-self:center}
 .hero-footnote{grid-column:1/-1}
}

.experience-card{scroll-margin-top:16px}

/* Text-first hero, without the artwork placeholder. */
@media(max-width:1000px){.hero-heading{padding-right:0;min-height:0}}
@media(max-width:600px){.hero-heading{display:block}.hero-heading>.eyebrow{margin-bottom:20px}.hero h1{font-size:clamp(3.6rem,14vw,5rem);margin-bottom:22px;max-width:none}}

/* Keep the left editorial heading in view only while its two-column section continues. */
@media(min-width:851px) and (min-height:600px){
 .experience>.split-heading,.education>.split-heading{
  position:sticky;
  align-self:start;
  top:clamp(112px,calc(50vh - 120px),360px);
 }
}

/* Small cues, with no content hidden behind scroll-triggered animations. */
#main-navigation a{position:relative;transition:color .18s}
#main-navigation a::after{content:'';position:absolute;left:0;right:0;bottom:4px;height:2px;background:var(--accent-mid);transform:scaleX(0);transform-origin:left;transition:transform .2s}
#main-navigation a[aria-current="location"]{color:var(--accent-ink)}
#main-navigation a[aria-current="location"]::after{transform:scaleX(1)}
.button,.experience-card,.experience-card summary{transition:background-color .18s,border-color .18s,box-shadow .18s}
.experience-card:hover{border-color:var(--accent)}
.button>span,.text-link>span[aria-hidden],.contact-row>span[aria-hidden]{display:inline-block;transition:transform .2s}
.button:hover>span{transform:translate(2px,2px)}
.text-link:hover>span[aria-hidden],.contact-row:hover>span[aria-hidden]{transform:translateY(2px)}
.job-body strong{font-weight:650;color:var(--ink)}
@keyframes soft-open{from{opacity:.65;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.experience-card[open] .job-body,.case-disclosure[open] .case-expanded,.case-disclosure[open] .sample-document{animation:soft-open .22s ease-out}
#main-navigation.is-open{animation:soft-open .18s ease-out}
.welcome-screen{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:var(--paper);pointer-events:none;animation:welcome-away .7s ease-in-out both}
.welcome-mark{font:600 4.5rem/1 var(--serif);letter-spacing:-.045em;color:var(--ink)}
.welcome-mark span{color:var(--accent-ink);display:inline-block;animation:welcome-dot .48s ease-out both}
.welcome-rule{height:2px;width:42px;background:var(--accent);border-radius:2px;animation:welcome-line .5s ease-out both}
@keyframes welcome-away{0%,50%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes welcome-dot{0%{transform:translateY(-7px);opacity:0}65%{transform:translateY(1px);opacity:1}100%{transform:translateY(0);opacity:1}}
@keyframes welcome-line{from{transform:scaleX(.3);opacity:.3}to{transform:scaleX(1);opacity:1}}
@media(max-width:1000px){#main-navigation a::after{right:auto;width:26px;left:8px;bottom:7px}}
@media(prefers-reduced-motion:reduce){.welcome-screen{display:none!important}.job-body,.case-expanded,.sample-document,#main-navigation{animation:none!important}}

/* A more deliberate entrance and a consistent motion rhythm. */
:root{--ease-out:cubic-bezier(.22,1,.36,1)}
.welcome-screen{gap:28px;animation:welcome-away 2s var(--ease-out) both;background:radial-gradient(ellipse at 50% 45%,#f7e8e7 0%,var(--paper) 65%)}
.welcome-mark{font-size:clamp(7rem,17vw,13rem);animation:welcome-word 1.1s var(--ease-out) both}
.welcome-mark span{animation:welcome-dot .85s .1s var(--ease-out) both}
.welcome-rule{width:72px;animation:welcome-line .9s .2s var(--ease-out) both}
.welcome-caption{color:var(--muted);font-size:.875rem;letter-spacing:.02em;animation:welcome-caption .75s .15s var(--ease-out) both}
@keyframes welcome-away{0%,65%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes welcome-word{from{opacity:0;transform:translateY(18px) scale(.96);filter:blur(5px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes welcome-caption{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes hello-wave{0%,100%{transform:rotate(0)}25%{transform:rotate(16deg)}60%{transform:rotate(-9deg)}80%{transform:rotate(9deg)}}
.hero-kicker{display:flex;gap:10px;align-items:center}
.eyebrow .hello-emoji{font-size:1.2rem;letter-spacing:0;margin:0;transform-origin:70% 75%}
.hello-emoji:hover{animation:hello-wave .75s ease-in-out}
.eyebrow .work-emoji{display:inline-block;font-size:1.15rem;letter-spacing:0;margin:0 0 0 8px;transform:rotate(-12deg)}
#main-navigation a{display:flex;align-items:center;gap:10px;transition:color .25s}
.nav-arrow{font-size:1rem;transition:transform .35s var(--ease-out),opacity .25s;opacity:.65}
#main-navigation a:hover .nav-arrow,#main-navigation a:focus-visible .nav-arrow{transform:translate(3px,-3px);opacity:1}
.button{border-radius:4px;transition:background .25s,color .25s,transform .35s var(--ease-out),box-shadow .35s var(--ease-out)}
.button:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(102,51,51,.14)}
.button:active{transform:translateY(0);box-shadow:none}
.button>span{transition:transform .35s var(--ease-out)}
.button:hover>span{transform:translate(3px,-3px)}
.text-link{transition:color .25s}
.text-link:hover>span[aria-hidden],.contact-row:hover>span[aria-hidden]{transform:translateY(4px)}
.experience-card{transition:border-color .25s,box-shadow .35s var(--ease-out)}
.experience-card:hover{box-shadow:0 5px 18px rgba(102,51,51,.055)}
.job-toggle{transition:transform .4s var(--ease-out)}
.experience-card[open] .job-body{animation:soft-open .4s var(--ease-out)}
.case-disclosure[open] .case-expanded,.case-disclosure[open] .sample-document{animation:soft-open .4s var(--ease-out)}
@media(max-width:1000px){#main-navigation a{justify-content:space-between}#main-navigation.is-open{animation:menu-arrive .35s var(--ease-out)}#main-navigation.is-open a{animation:soft-open .4s var(--ease-out) both}#main-navigation.is-open a:nth-child(2){animation-delay:35ms}#main-navigation.is-open a:nth-child(3){animation-delay:70ms}}
@keyframes menu-arrive{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.welcome-screen{display:none!important}.button:hover,.nav-arrow,.button:hover>span,.text-link:hover>span[aria-hidden],.contact-row:hover>span[aria-hidden]{transform:none}.hello-emoji:hover{animation:none}}

/* Supporting metadata stays quiet beside the case title and actual work. */
.case-details dt{font-size:.8125rem;font-weight:500;color:var(--muted);margin-bottom:5px;line-height:1.4}
.case-scope dt{color:var(--muted)}
.case-overview,.case-expanded{gap:17px}
.case-overview .case-scope{padding-top:16px}
.sample-badge{font-size:.75rem;font-weight:500;letter-spacing:.04em;margin-bottom:9px;color:var(--muted)}
.sample-global-note{font-size:.8125rem;line-height:1.65;color:var(--muted);border-left:2px solid var(--line);padding-left:14px;max-width:820px;margin:-16px 0 30px}
.eyebrow .section-emoji{display:inline-block;font-size:1rem;letter-spacing:0;line-height:1;margin:0 0 0 6px;vertical-align:middle}
.hero-kicker{display:block}
.welcome-caption .section-emoji{font-size:1rem;margin-left:3px}
/* The loading layer leaves like a sheet, revealing a single coherent hero entrance. */
.welcome-screen{animation:none;will-change:transform;border-radius:0;box-shadow:0 12px 36px rgba(102,51,51,.08)}
.welcome-screen.is-leaving{animation:welcome-sheet .65s cubic-bezier(.65,0,.25,1) both}
.welcome-rule{width:68px;height:2px;animation:preparing-line 1.1s ease-in-out infinite;transform-origin:left}
@keyframes preparing-line{0%,100%{transform:scaleX(.42);opacity:.45}50%{transform:scaleX(1);opacity:1}}
@keyframes welcome-sheet{0%{transform:translateY(0);border-radius:0}100%{transform:translateY(-104%);border-radius:0 0 36px 36px}}
@keyframes hero-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
.hero-entering .hero .eyebrow{animation:hero-arrive .4s .15s var(--ease-out) both}
.hero-entering .hero h1{animation:hero-arrive .45s .19s var(--ease-out) both}
.hero-entering .hero-footnote,.hero-entering .hero-intro h2{animation:hero-arrive .45s .23s var(--ease-out) both}
.hero-entering .hero-intro>p{animation:hero-arrive .45s .27s var(--ease-out) both}
.hero-entering .hero-actions{animation:hero-arrive .45s .31s var(--ease-out) both}
@media(prefers-reduced-motion:reduce){.welcome-screen{display:none!important}.hero-entering .hero *{animation:none!important;opacity:1;transform:none}}

/* Balanced headings and tidy paragraph endings at every responsive size. */
main :is(p, dd, li) { text-wrap: pretty; }
main :is(h1, h2, h3) { text-wrap: balance; }

.sample-note { font-size: .75rem; line-height: 1.65; color: var(--muted); margin: 16px 0 0; }

/* A consistent icon, title and description rhythm for all four scope items. */
.stats { gap: 0; align-items: stretch; }
.stat { display: grid; grid-template-rows: 32px 4.2rem 1fr; align-content: start; justify-content: normal; row-gap: 16px; }
.stat-icon { width: 28px; height: 28px; color: var(--accent-ink); }
.stat strong { font-family: var(--sans); font-size: clamp(1.15rem, 1.65vw, 1.5rem); font-weight: 600; line-height: 1.4; letter-spacing: -.025em; align-self: start; text-wrap: balance; }
.stat p { margin: 0; font-size: .9375rem; line-height: 1.65; align-self: start; }
@media(max-width:700px) { .stat { grid-template-rows: 28px 3.2rem 1fr; row-gap: 12px; } .stat strong { font-size: 1.125rem; } .stat p { font-size: .875rem; } }

/* Sliding language control; text swaps as a brief, cohesive page transition. */
.language-switch { position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: 3px; }
.language-switch::before { content: ''; position: absolute; inset: 3px auto 3px 3px; width: calc((100% - 6px) / 2); background: var(--accent); border-radius: 3px; box-shadow: 0 1px 3px #66333315; transform: translateX(0); transition: transform 300ms cubic-bezier(.22,1,.36,1); z-index: -1; }
.language-switch[data-active="id"]::before { transform: translateX(100%); }
.language-switch button, .language-switch button[aria-pressed="true"], .language-switch button:hover, .language-switch button[aria-pressed="true"]:hover { background: transparent; transition: color 180ms ease; }
@media(max-width:850px) { .site-header .language-switch { padding: 3px; } }
@media(prefers-reduced-motion:reduce) { .language-switch::before { transition: none; } }

@media(max-width:700px) {
  .stats { row-gap: 0; }
  .stat:nth-child(-n+2) { padding-bottom: 28px; }
  .stat:nth-child(n+3) { padding-top: 28px; }
}

.case-disclosure summary { margin-top: 12px; padding: 12px 14px; border-radius: 5px; background: transparent; transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease; }
.case-disclosure summary:hover, .case-disclosure summary:focus-visible { text-decoration: none; background: #f3e5e4; color: #663333; box-shadow: inset 0 0 0 1px #cc999933; }
.case-disclosure summary:active { background: #ead3d2; }
.case-disclosure summary .disclosure-icon { transition: transform 220ms ease; }
.case-disclosure:not([open]) summary:hover .disclosure-icon { transform: rotate(90deg); }
@media(prefers-reduced-motion:reduce) { .case-disclosure summary, .case-disclosure summary .disclosure-icon { transition: none; } }

/* One clickable / swipeable switch, including native keyboard activation. */
button.language-switch { width: 96px; min-height: 50px; cursor: pointer; color: var(--muted); font: inherit; font-size: .875rem; font-weight: 600; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.language-switch > span { display: flex; align-items: center; justify-content: center; min-height: 42px; transition: color 180ms ease; }
.language-switch[data-active="en"] > span:first-child, .language-switch[data-active="id"] > span:last-child { color: var(--ink); }
button.language-switch:hover { border-color: var(--accent); }
@media(max-width:850px) { button.language-switch { width: 84px; font-size: .8125rem; } }

/* Quiet depth on interactive surfaces. */
.case-card { box-shadow: 0 4px 18px -12px #66333330; transition: box-shadow 220ms ease; }
.case-card:focus-within { box-shadow: 0 8px 24px -12px #66333338; }
.experience-card[open] { box-shadow: 0 6px 22px -14px #66333336; }
button.language-switch { box-shadow: 0 2px 10px -5px #66333328; }
.language-switch::before { box-shadow: 0 2px 5px #6633331a; }
@media(hover:hover) { .case-card:hover { box-shadow: 0 8px 26px -12px #66333338; } .experience-card:hover { box-shadow: 0 6px 20px -13px #66333332; } }
@media(prefers-reduced-motion:reduce) { .case-card { transition: none; } }

@media(min-width:851px) { .site-header nav a > span[aria-hidden="true"] { display: none; } }

.footer-links { display:flex; align-items:center; gap:14px; }
.footer-links > span { color:var(--line); }
@media(max-width:370px) { .site-footer .footer-links a { margin-left:0; } }

/* Let headings wrap naturally; never lock a multiword heading onto one line. */
.case-top, .case-details, .expertise-item > div, .experience-card summary > div { min-width: 0; }
main :is(h1,h2,h3,h4,p,dd,li) { overflow-wrap: anywhere; word-break: normal; }
main :is(h1,h2,h3,h4) { text-wrap: balance; }
main :is(p,dd,li) { text-wrap: pretty; }

.job-body .clean-list { counter-reset: responsibility; }
.job-body .clean-list li { counter-increment: responsibility; padding-left: 38px; }
.job-body .clean-list li::before { content: counter(responsibility, decimal-leading-zero); color: var(--accent-ink); font-size: .8125rem; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.75; top: 15px; }
/* Editorial motion pass: one timing family, bounded movement, native controls. */
:root { --polish-ease:cubic-bezier(.22,1,.36,1); --margin-drift:0px; }
.scroll-progress { position:fixed;left:0;top:0;width:100%;height:2px;background:#996666;transform-origin:left;z-index:120;pointer-events:none; }
#main-navigation a { transition:color 180ms ease; }
#main-navigation a:hover { text-decoration:none; }
#main-navigation a::after { height:1px;background:var(--accent-ink);transition:transform 240ms var(--polish-ease); }
#main-navigation a:hover::after,#main-navigation a:focus-visible::after { transform:scaleX(1); }
.motion-reveal { opacity:0;transform:translateY(7px);clip-path:inset(0 0 12% 0);transition:opacity 300ms var(--polish-ease),transform 300ms var(--polish-ease),clip-path 300ms var(--polish-ease);transition-delay:var(--reveal-delay,0ms); }
.motion-reveal.is-visible { opacity:1;transform:none;clip-path:inset(-8px); }
.case-card { transition:transform 240ms var(--polish-ease),border-color 240ms ease,box-shadow 240ms ease; }
.case-disclosure[open] .case-expanded,.case-disclosure[open] .sample-document { animation:none; }
.case-disclosure summary .disclosure-icon { transition:transform 220ms var(--polish-ease); }
.hero .button,.resume-link,.contact-row { position:relative;isolation:isolate;overflow:hidden; }
.hero .button::before,.resume-link::before,.contact-row::before { content:'';position:absolute;inset:0;background:#663333;transform:translateX(-101%);transition:transform 260ms var(--polish-ease);z-index:-1;pointer-events:none; }
.resume-link::before { background:#f3e5e4; }
.contact-row::before { background:#ffcccc55; }
.hero .button > span,.resume-link > span,.contact-row > span { transition:transform 240ms var(--polish-ease); }
.editorial-highlight { position:relative;width:fit-content;max-width:100%; }
.editorial-highlight::after { content:'';display:block;position:absolute;left:0;bottom:-5px;width:min(96px,55%);height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 420ms var(--polish-ease); }
.editorial-highlight.is-visible::after { transform:scaleX(1); }
.work-heading,.how { position:relative; }
.work-heading::after { content:'';position:absolute;right:2px;top:-18px;width:13px;height:13px;border:1px solid #cc999999;border-radius:50%;transform:translateY(var(--margin-drift));pointer-events:none; }
.how::after { content:'';position:absolute;right:3px;top:45px;width:20px;height:5px;border-top:1px solid #cc999999;border-bottom:1px solid #cc999999;transform:translateY(var(--margin-drift));pointer-events:none; }
.portfolio-cursor { position:fixed;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border:1px solid #99666688;border-radius:50%;background:#fffafaec;color:#663333;font-size:12px;pointer-events:none;z-index:110;opacity:0;transition:opacity 120ms ease; }
.portfolio-cursor.is-visible { opacity:1; }
.footer-identity { min-width:0; }
.site-footer .footer-note { font-size:.75rem;font-weight:400;color:var(--muted);margin-top:5px;--reveal-delay:80ms; }
@media(hover:hover) and (pointer:fine) {
 .case-card:hover { transform:translateY(-3px);border-color:#cc9999;box-shadow:0 8px 24px -16px #66333338; }
 .case-card:hover .disclosure-icon { translate:2px 0; }
 .hero .button:hover::before,.resume-link:hover::before,.contact-row:hover::before { transform:translateX(0); }
 .hero .button:hover { background:var(--accent); }
 .hero .button:hover > span { transform:translate(3px,3px); }
 .resume-link:hover > span { transform:translateY(3px); }
 .contact-row:hover > span:first-child { transform:translateX(4px); }
 .contact-row[target]:hover > span:last-child { transform:translate(3px,-3px); }
 .contact-row[download]:hover > span:last-child { transform:translateY(3px); }
}
@media(max-width:850px) { .work-heading::after,.how::after { display:none; } }
@media(prefers-reduced-motion:reduce) {
 .motion-reveal { opacity:1;transform:none;clip-path:none;transition:none; }
 .editorial-highlight::after { transform:scaleX(1);transition:none; }
 .portfolio-cursor { display:none; }
 .case-card,.case-card:hover { transform:none;transition:none; }
 .work-heading::after,.how::after { transform:none; }
 .hero .button::before,.resume-link::before,.contact-row::before,#main-navigation a::after { transition:none; }
 .hero .button > span,.resume-link > span,.contact-row > span { transition:none;transform:none!important; }
}

/* Softer link feedback, with breathing room for text and arrows. */
.resume-link::before,.contact-row::before { content:none; }
.resume-link { padding:10px 14px;border-radius:6px;transition:background-color 180ms ease,color 180ms ease; }
.contact-row { padding-inline:16px;transition:background-color 180ms ease,color 180ms ease; }
.resume-link:hover,.contact-row:hover { text-decoration:none; }
.contact-row:hover > span:first-child { transform:none; }
@media(hover:hover) and (pointer:fine) {
 .resume-link:hover { background:#f3e5e480; }
 .contact-row:hover { background:#fffafa18; }
}
.skills ul { position:relative; }
.skills li { display:flex;align-items:center;gap:8px;position:relative;background:var(--paper);transition:box-shadow 180ms ease,border-color 180ms ease; }
.skill-grip { flex:0 0 24px;width:24px;height:30px;margin:-4px 0 -4px -8px;border:0;padding:0;background:transparent;color:#996666;cursor:grab;font:20px/1 var(--sans);touch-action:none;border-radius:4px; }
.skill-grip:hover,.skill-grip:focus-visible { background:#f3e5e4; }
.skill-grip:focus-visible { outline:2px solid #996666;outline-offset:2px; }
.skills li.is-dragging { z-index:3;box-shadow:0 8px 20px #66333320;border-color:#996666;user-select:none; }
.is-dragging .skill-grip { cursor:grabbing; }
.skills li.drop-target { border-color:#996666;background:#f3e5e4; }
@media(prefers-reduced-motion:reduce) { .skills li,.resume-link,.contact-row { transition:none; } }