:root { --ink:#17221f; --muted:#65716c; --paper:#f7f2ec; --warm:#e8dfd2; --terracotta:#c96b52; --rust:#a84f3f; --green:#244b41; --line:rgba(23,34,31,.16); --serif:"Playfair Display", Georgia, serif; --sans:"DM Sans", Arial, sans-serif; --mono:"DM Mono", monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:88px; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); font-size:16px; line-height:1.55; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; }
.grain { position:fixed; inset:0; z-index:20; pointer-events:none; opacity:.055; 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='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.topbar { height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,5vw,84px); position:fixed; inset:0 0 auto; z-index:10; background:rgba(247,242,236,.8); backdrop-filter:blur(16px); border-bottom:1px solid transparent; transition:.3s; }
.topbar.scrolled { border-color:var(--line); height:70px; }
.wordmark { width:49px; height:49px; display:flex; align-items:center; justify-content:center; position:relative; letter-spacing:-.08em; font-weight:700; font-size:14px; }
.wordmark:before { content:""; position:absolute; inset:0; border:1px solid var(--ink); border-radius:50%; transform:rotate(-15deg); }.wordmark i { position:absolute; width:35px; height:1px; background:var(--terracotta); transform:rotate(-15deg); }
.main-nav { display:flex; gap:29px; font-size:13px; font-weight:600; letter-spacing:.02em; }.main-nav a { position:relative; }.main-nav a:after { content:""; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:var(--terracotta); transition:.25s; }.main-nav a:hover:after { right:0; }
.header-right { display:flex; align-items:center; gap:20px; }.language-switch { display:flex; padding:3px; gap:2px; background:rgba(23,34,31,.07); border-radius:100px; }.lang { border:0; cursor:pointer; background:transparent; border-radius:100px; padding:4px 8px; font-size:10px; letter-spacing:.08em; font-family:var(--mono); transition:.25s; }.lang.active { background:var(--ink); color:#fff; }
.menu-toggle { display:none; padding:0; width:30px; height:24px; border:0; background:transparent; cursor:pointer; }.menu-toggle span { display:block; width:24px; height:1px; margin:6px 0; background:var(--ink); transition:.25s; }
.hero { min-height:100svh; padding:139px clamp(24px,10.5vw,180px) 78px; display:grid; grid-template-columns:minmax(360px,1fr) minmax(340px,.92fr); gap:clamp(50px,8vw,150px); align-items:center; position:relative; overflow:hidden; }.hero:after { content:""; width:48vw; height:48vw; max-width:720px; max-height:720px; border-radius:50%; background:#ebe3d7; position:absolute; top:18%; right:-12vw; z-index:-1; }
.hero-copy { max-width:625px; }.eyebrow { margin:0 0 22px; display:flex; align-items:center; gap:10px; font:500 10px/1.2 var(--mono); letter-spacing:.13em; }.eyebrow > span:first-child { display:block; width:20px; height:1px; background:var(--terracotta); }.hero h1 { font:500 clamp(52px,7.3vw,108px)/.88 var(--serif); letter-spacing:-.065em; margin:0; }.hero h1 em { color:var(--terracotta); font-weight:500; }.hero-role { margin:27px 0 0; font-size:14px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }.hero-intro { max-width:400px; margin:10px 0 0; color:var(--muted); font-size:17px; }.hero-actions { margin-top:35px; display:flex; align-items:center; gap:27px; }.button { min-height:50px; display:inline-flex; align-items:center; justify-content:space-between; gap:27px; padding:0 19px; font-size:13px; font-weight:600; transition:transform .25s, background .25s, color .25s; }.button b { font-size:18px; font-weight:400; }.button:hover { transform:translateY(-3px); }.button-dark { background:var(--ink); color:#fff; }.button-dark:hover { background:var(--terracotta); }.text-link { display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:14px; border-bottom:1px solid var(--ink); padding-bottom:4px; }.text-link b { color:var(--terracotta); font-size:18px; font-weight:400; }.hero-availability { display:flex; align-items:center; gap:8px; margin-top:43px; font:500 10px/1.1 var(--mono); letter-spacing:.09em; text-transform:uppercase; }.hero-availability i { width:8px; height:8px; border-radius:50%; background:#79a380; box-shadow:0 0 0 5px rgba(121,163,128,.17); }
.hero-visual { justify-self:center; width:min(100%,500px); position:relative; }.hero-abstract { height:550px; overflow:hidden; background:linear-gradient(145deg,#e7ded1 0%,#f5f0e9 62%,#dde6df 100%); border:1px solid rgba(23,34,31,.14); border-radius:2px 2px 72px 2px; box-shadow:23px 25px 49px rgba(54,42,31,.13); }.abstract-orb { position:absolute; display:block; border-radius:50%; }.abstract-orb-one { width:425px; height:425px; right:-126px; top:-92px; background:rgba(36,75,65,.18); }.abstract-orb-two { width:215px; height:215px; left:34px; bottom:-99px; border:1px solid rgba(168,79,63,.6); }.abstract-grid { position:absolute; display:block; width:300px; height:300px; right:-90px; bottom:0; opacity:.48; background-image:linear-gradient(rgba(168,79,63,.32) 1px,transparent 1px),linear-gradient(90deg,rgba(168,79,63,.32) 1px,transparent 1px); background-size:19px 19px; transform:rotate(-10deg); }.abstract-monogram { position:absolute; left:35px; top:34px; margin:0; color:var(--green); font:500 clamp(88px,13vw,154px)/.75 var(--serif); letter-spacing:-.11em; }.abstract-index { position:absolute; right:25px; bottom:30px; margin:0; color:var(--rust); font:500 9px var(--mono); letter-spacing:.14em; }.abstract-words { position:absolute; left:37px; bottom:43px; z-index:2; margin:0; color:var(--ink); font:600 10px/1.65 var(--mono); letter-spacing:.15em; }.abstract-words em { color:var(--terracotta); font-style:normal; }.hero-number { position:absolute; right:clamp(24px,4vw,72px); bottom:35px; color:rgba(23,34,31,.27); font:500 11px var(--mono); }.scroll-cue { position:absolute; left:clamp(24px,5vw,84px); bottom:31px; display:flex; gap:11px; align-items:center; font:500 9px var(--mono); letter-spacing:.1em; }.scroll-cue i { display:block; width:25px; height:1px; background:var(--ink); position:relative; }.scroll-cue i:after { content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid var(--ink); border-right:1px solid var(--ink); transform:rotate(45deg); }
.section-pad { padding-left:clamp(24px,10.5vw,180px); padding-right:clamp(24px,10.5vw,180px); }.section-label { display:flex; align-items:center; gap:13px; font:500 10px var(--mono); letter-spacing:.13em; }.section-label span { color:var(--terracotta); }.section-label p { margin:0; }.intro-section { padding-top:130px; padding-bottom:151px; display:grid; grid-template-columns:180px 1fr; gap:4vw; }.intro-content { max-width:890px; }.large-statement { max-width:800px; margin:0; font:500 clamp(34px,4.6vw,65px)/1.07 var(--serif); letter-spacing:-.055em; }.intro-grid { margin-top:58px; display:grid; grid-template-columns:minmax(260px,1.1fr) minmax(235px,.75fr); gap:clamp(40px,8vw,125px); }.intro-grid > p { margin:0; font-size:16px; color:#35433e; }.intro-side { border-left:1px solid var(--terracotta); padding-left:22px; }.intro-side p:not(.side-kicker) { margin:11px 0 20px; font:500 20px/1.27 var(--serif); letter-spacing:-.02em; }.side-kicker { margin:0; color:var(--terracotta); font:500 9px var(--mono); letter-spacing:.12em; }.underlined-link { display:inline-block; font-size:13px; font-weight:600; border-bottom:1px solid var(--ink); padding-bottom:4px; }.underlined-link b { color:var(--terracotta); font-size:17px; font-weight:400; margin-left:8px; }
.strengths { background:var(--green); color:#f7f2ec; padding-top:115px; padding-bottom:125px; position:relative; overflow:hidden; }.strengths:after { content:"✽"; position:absolute; right:-20px; bottom:-121px; color:rgba(247,242,236,.055); font:360px var(--serif); }.strengths .section-label span { color:#e6a18d; }.strengths-header { margin:57px 0 65px 14.5vw; max-width:790px; display:flex; align-items:end; gap:6vw; }.strengths-header h2 { margin:0; flex:1; font:500 clamp(38px,4.8vw,65px)/1 var(--serif); letter-spacing:-.055em; }.strengths-header h2 em { color:#e9aa96; }.strengths-header > p { width:220px; margin:0 0 5px; color:#c4d0c9; font-size:14px; }.strengths-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(247,242,236,.3); }.strength { padding:28px 22px 7px 0; min-height:190px; border-right:1px solid rgba(247,242,236,.3); margin-right:22px; }.strength:last-child { border:0; }.strength-number { color:#e9aa96; font:500 10px var(--mono); }.strength h3 { margin:33px 0 0; font:500 21px/1.15 var(--serif); letter-spacing:-.025em; }.strength p { margin:10px 0 0; color:#c4d0c9; font-size:13px; line-height:1.5; }
.experience { padding-top:126px; padding-bottom:139px; }.experience-top { display:grid; grid-template-columns:1fr minmax(280px,370px); gap:50px; align-items:start; }.section-note { margin:0; color:var(--muted); font-size:15px; }.timeline { margin-top:56px; border-top:1px solid var(--line); }.timeline-item { display:grid; grid-template-columns:145px minmax(220px,.78fr) minmax(280px,1.2fr) 35px; gap:28px; padding:30px 0 34px; border-bottom:1px solid var(--line); transition:padding .35s; }.timeline-item:hover { padding-left:12px; }.timeline-period { color:var(--terracotta); font:500 10px/1.45 var(--mono); letter-spacing:.03em; }.timeline-role { margin:0; font:500 23px/1.1 var(--serif); letter-spacing:-.025em; }.timeline-company { margin:8px 0 0; font-size:12px; color:var(--muted); }.timeline-desc { margin:0; font-size:14px; color:#35433e; }.timeline-arrow { align-self:center; width:31px; height:31px; border:1px solid var(--ink); border-radius:50%; text-align:center; line-height:28px; font-size:16px; transition:.25s; }.timeline-item:hover .timeline-arrow { background:var(--terracotta); border-color:var(--terracotta); color:#fff; }
.education { padding-top:116px; padding-bottom:123px; background:#eae3d8; }.education-top { display:grid; grid-template-columns:1fr minmax(320px,.8fr); gap:50px; }.education h2 { margin:0; font:500 clamp(38px,4.8vw,66px)/1 var(--serif); letter-spacing:-.055em; }.education h2 em { color:var(--terracotta); }.education-list { margin:72px 0 0 14.5vw; max-width:790px; }.education-item { display:grid; grid-template-columns:100px 1fr; gap:24px; padding:22px 0 27px; border-top:1px solid rgba(23,34,31,.22); }.education-item:last-child { border-bottom:1px solid rgba(23,34,31,.22); }.education-period { font:500 10px/1.5 var(--mono); color:var(--terracotta); }.education h3 { margin:0; font:500 23px/1.1 var(--serif); letter-spacing:-.025em; }.education-school { margin:7px 0 0; color:var(--muted); font-size:13px; }.education-detail { margin:13px 0 0; max-width:590px; color:#35433e; font-size:13px; }
.details { padding-top:105px; padding-bottom:126px; }.details-grid { margin:56px 0 0 14.5vw; display:grid; grid-template-columns:repeat(3,1fr); max-width:800px; gap:40px; }.detail { border-top:2px solid var(--terracotta); padding-top:14px; }.detail p { margin:0; color:var(--muted); font:500 9px var(--mono); letter-spacing:.12em; }.detail h3 { margin:9px 0 0; font:500 20px/1.2 var(--serif); letter-spacing:-.02em; }
.contact { min-height:475px; background:var(--rust); color:#fff; padding-top:110px; padding-bottom:90px; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:center; }.contact:before { content:""; position:absolute; left:47%; top:-45%; width:700px; height:700px; border:1px solid rgba(255,255,255,.13); border-radius:50%; }.contact-decoration { position:absolute; right:8vw; top:80px; font:145px var(--serif); color:rgba(255,255,255,.17); }.contact-inner { position:relative; max-width:710px; margin-left:14.5vw; }.eyebrow.light { color:#f9ded6; }.eyebrow.light > span:first-child { background:#f9ded6; }.contact h2 { margin:0; font:500 clamp(49px,6.2vw,85px)/.98 var(--serif); letter-spacing:-.06em; }.contact h2 em { color:#f9cec0; }.contact-inner > p:not(.eyebrow) { max-width:450px; margin:26px 0 0; color:#ffece5; font-size:15px; }
footer { min-height:77px; padding:0 clamp(24px,5vw,84px); display:flex; gap:25px; align-items:center; justify-content:space-between; font:500 10px var(--mono); color:var(--muted); letter-spacing:.03em; } footer p { margin:0; } footer a { font-size:20px; color:var(--ink); }
.reveal { opacity:0; transform:translateY(20px); transition:opacity .65s ease, transform .65s ease; }.reveal.visible { opacity:1; transform:none; }
@media (max-width: 820px) { .topbar { height:69px; padding:0 22px; }.main-nav { position:fixed; top:69px; left:0; right:0; display:flex; justify-content:flex-start; gap:0; overflow-x:auto; white-space:nowrap; padding:0 14px; background:rgba(247,242,236,.98); border-top:1px solid rgba(23,34,31,.08); border-bottom:1px solid var(--line); box-shadow:0 10px 18px rgba(23,34,31,.07); }.main-nav a { flex:0 0 auto; padding:11px 13px; font-size:11px; }.main-nav a:after { display:none; }.menu-toggle { display:none; }.hero { grid-template-columns:1fr; gap:38px; min-height:auto; padding:151px 26px 92px; }.hero-copy { order:2; }.hero-visual { order:1; width:min(86vw,430px); justify-self:center; }.hero-abstract { height:470px; }.hero h1 { font-size:clamp(56px,14vw,85px); }.hero-number { top:135px; bottom:auto; }.scroll-cue { bottom:25px; left:26px; }.intro-section { padding-top:88px; padding-bottom:95px; gap:40px; }.intro-grid { margin-top:38px; gap:39px; }.strengths { padding-top:83px; padding-bottom:88px; }.strengths-header { margin:41px 0 48px; display:block; }.strengths-header > p { margin-top:20px; }.strengths-grid { grid-template-columns:repeat(2,1fr); }.experience, .education, .details { padding-top:85px; padding-bottom:89px; }.experience-top, .education-top { grid-template-columns:1fr; gap:39px; }.timeline { margin-top:38px; }.timeline-item { grid-template-columns:115px 1fr 29px; gap:16px; }.timeline-desc { grid-column:2 / 4; margin-top:-7px; }.education-list,.details-grid { margin-left:0; }.education-list { margin-top:47px; }.contact { min-height:440px; padding:84px 26px; }.contact-inner { margin-left:0; }.contact-decoration { right:-7px; top:12px; }.section-pad { padding-left:26px; padding-right:26px; } }
@media (max-width: 540px) { .main-nav { padding:0 10px; }.main-nav a { padding:10px 10px; font-size:10px; }.header-right { gap:8px; }.hero { padding-left:24px; padding-right:24px; }.hero-role { font-size:11px; }.hero-intro { font-size:15px; }.hero-actions { gap:18px; }.button { padding:0 14px; gap:14px; min-height:47px; font-size:12px; }.hero-visual { width:100%; }.hero-abstract { height:420px; }.abstract-monogram { left:25px; top:31px; }.abstract-words { left:26px; bottom:32px; }.intro-grid { grid-template-columns:1fr; }.large-statement { font-size:36px; }.strengths-grid { grid-template-columns:1fr; }.strength { min-height:0; padding:23px 0 24px; margin-right:0; border-right:0; border-bottom:1px solid rgba(247,242,236,.3); }.strength:last-child { border-bottom:0; }.strength:nth-child(2) { border-bottom:1px solid rgba(247,242,236,.3); }.strength:nth-child(n+3) { border-top:0; }.timeline-item { grid-template-columns:83px 1fr 26px; gap:12px; padding-top:25px; }.timeline-role { font-size:20px; }.timeline-company,.timeline-desc { font-size:12px; }.education-item { grid-template-columns:74px 1fr; gap:15px; }.education h3 { font-size:20px; }.details-grid { grid-template-columns:1fr; gap:27px; margin-top:39px; }.contact h2 { font-size:54px; } footer { padding:19px 24px; min-height:70px; } footer p:nth-child(2) { display:none; } }