@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700;750;800&display=swap');
:root{--paper:#f5f5f1;--ink:#20221f;--muted:#62665e;--line:#d4d6ce;--accent:#ff5c28}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #1263ba;outline-offset:6px}::selection{background:var(--accent);color:var(--ink)}.wrap{width:min(1240px,calc(100% - 112px));margin:auto}.skip{position:fixed;left:20px;top:-100px;padding:16px;background:var(--ink);color:white;z-index:5}.skip:focus{top:15px}.header{height:110px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{font-size:29px;font-weight:750;letter-spacing:-1.5px}.header nav{display:flex;gap:38px;align-items:center;font-size:16px}.header nav a:hover{text-decoration:underline;text-underline-offset:5px}.nav-contact{border-bottom:1px solid;padding-bottom:6px}.hero{padding-top:80px;padding-bottom:60px}.hero h1{font-size:clamp(48px,6.6vw,92px);line-height:1.12;letter-spacing:-.055em;font-weight:550;margin:0 0 42px}.hero h1>span{color:var(--accent)}.hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:35px}.hero-bottom p{font-size:19px;line-height:1.65;margin:0}.button{display:inline-flex;min-height:56px;align-items:center;justify-content:center;padding:17px 28px;font-size:16px;font-weight:500;transition:background .2s,transform .2s}.dark-button{background:var(--ink);color:var(--paper)}.dark-button:hover{background:#3e423a;transform:translateY(-2px)}.capabilities{display:grid;grid-template-columns:1fr 1fr;gap:70px;border-top:1px solid var(--line);margin-top:50px;padding-top:28px}.capabilities p{font-size:16px;line-height:1.75;margin:0}.capabilities .technologies{color:var(--muted);align-self:center}.projects{padding:34px 0 90px}.projects>h2{font-size:38px;letter-spacing:-.035em;font-weight:550;margin:0 0 30px}.featured{display:grid;grid-template-columns:44% 56%;background:#e9ebe3;min-height:360px}.project-copy{padding:44px;display:flex;flex-direction:column;align-items:start;justify-content:center}.project h3{font-size:44px;line-height:1.12;letter-spacing:-.04em;font-weight:550;margin:0 0 22px}.project-copy p{font-size:17px;line-height:1.7;max-width:360px;margin:0}.text-link{font-size:16px;font-weight:500;text-decoration:underline;text-underline-offset:5px;margin-top:30px}.text-link:hover{text-decoration-thickness:2px}.sepe-scene{background:#d5dccb;display:flex;align-items:center;justify-content:center;padding:45px;overflow:hidden}.app-preview{width:100%;max-width:490px;background:#fbfcfa;border-radius:8px;box-shadow:0 17px 25px #29391c16;transform:rotate(-3deg);color:#33412d}.app-top{display:flex;align-items:center;padding:18px 22px;border-bottom:1px solid #eceee8}.app-top strong{font-size:28px;letter-spacing:-1.6px}.app-top strong span{color:#83a76b}.app-body{display:grid;grid-template-columns:30% 70%;min-height:235px}.app-body aside{display:flex;flex-direction:column;padding:25px 16px;gap:22px;font-size:13px;background:#f5f7f1}.app-body aside b{background:#e5ebda;margin:-5px;padding:8px;border-radius:4px;font-weight:500}.app-content{padding:25px}.app-content h4{font-size:23px;font-weight:500;letter-spacing:-.5px;margin:0 0 17px}.time-card{border:1px solid #e3e7da;border-radius:5px;padding:15px;display:flex;flex-direction:column}.time-card>span{font-size:12px;color:#626e59}.time-card strong{font-size:38px;font-weight:500;letter-spacing:-1px;line-height:1.5}.time-progress{height:5px;background:#edf0e7}.time-progress i{display:block;background:#8aa26d;width:72%;height:100%}.app-row{font-size:13px;margin-top:18px}.preview-lines{display:grid;gap:6px;margin-top:10px}.preview-lines i{height:5px;background:#e5eadd;width:100%}.preview-lines i:last-child{width:65%}.ikarus-project{margin-top:24px;background:#ecece8}.ikarus-scene{background:#e2e3de;display:flex;align-items:center;justify-content:center;padding:30px;overflow:hidden}.ikarus-scene img{width:75%;max-width:320px;max-height:280px;height:auto;object-fit:contain;transition:transform .35s}.ikarus-scene:hover img{transform:scale(1.025)}.contact{background:var(--accent);padding:55px 0}.contact h2{font-size:42px;line-height:1.1;letter-spacing:-.045em;font-weight:550;margin:0 0 30px}.contact-bottom{display:flex;gap:24px;align-items:center;flex-wrap:wrap}.email{font-size:clamp(25px,3.4vw,44px);letter-spacing:-.04em;border-bottom:1px solid;padding-bottom:4px}.copy-button{padding:12px 16px;border:1px solid #20221f70;background:transparent;border-radius:0;font-size:14px;cursor:pointer;transition:background .2s,color .2s}.copy-button:hover{background:#20221f;color:var(--accent)}#copy-status{font-size:14px}.social-links{display:flex;gap:27px;margin-top:32px;font-size:16px}.social-links a:hover{text-decoration:underline;text-underline-offset:5px}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:110px}footer>span{font-size:14px}.ai-credit{color:var(--muted)}footer a:hover{opacity:.65}.reveal{opacity:1;transform:none}.reveal.is-pending{opacity:0;transform:translateY(18px)}.reveal.is-visible{opacity:1;transform:none;transition:opacity .65s ease,transform .65s ease}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.hero{padding-top:65px}.hero h1{font-size:7vw}.hero-bottom p{font-size:17px}.capabilities{gap:35px}.project-copy{padding:30px}.project h3{font-size:37px}.sepe-scene{padding:30px 22px}.app-body aside{padding:23px 10px;font-size:11px}.app-content{padding:20px}.time-card>span{font-size:11px}.app-content h4{font-size:21px}}
@media(max-width:640px){.wrap{width:calc(100% - 40px)}.header{height:85px}.brand{font-size:25px}.header nav{gap:22px;font-size:14px}.hero{padding:48px 0 30px}.hero h1{font-size:clamp(31px,7.3vw,47px);letter-spacing:-.045em;margin-bottom:25px}.hero-bottom{display:block}.hero-bottom p{font-size:17px}.desktop-break{display:none}.hero-bottom .button{margin-top:24px;min-height:52px}.capabilities{grid-template-columns:1fr;gap:18px;margin-top:34px;padding-top:23px}.capabilities p{font-size:16px}.projects{padding:25px 0 45px}.projects>h2{font-size:31px;margin-bottom:23px}.featured{grid-template-columns:1fr}.project-copy{padding:28px}.project h3{font-size:36px;margin-bottom:17px}.project-copy p{font-size:16px}.text-link{font-size:16px;margin-top:23px}.sepe-scene{padding:30px 25px}.app-body{grid-template-columns:30% 70%}.app-content{padding:18px}.app-content h4{font-size:21px}.time-card{padding:12px}.app-body aside{font-size:11px;padding:24px 10px}.app-row{font-size:12px}.ikarus-project{margin-top:18px}.ikarus-scene{min-height:240px}.ikarus-scene img{max-height:225px;width:65%}.contact{padding:35px 0}.contact h2{font-size:32px;margin-bottom:25px}.contact-bottom{gap:17px}.email{font-size:clamp(24px,6.5vw,32px)}.copy-button{padding:10px 13px}.social-links{font-size:15px;margin-top:26px}footer{padding-top:25px;padding-bottom:25px;display:grid;grid-template-columns:1fr 1fr;gap:20px}footer>span{font-size:12px}footer>span:nth-child(2){text-align:right}.ai-credit{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.reveal.is-pending{opacity:1;transform:none}}

/* Full-height introduction, distinct skill section and consistent contact controls. */
[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:root{--header-height:110px}.header{height:var(--header-height)}.header nav{align-items:center;gap:32px}.header nav a{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;line-height:1.2}.header nav a:last-child{box-shadow:inset 0 -1px var(--ink)}
.hero{min-height:calc(100svh - var(--header-height));display:flex;flex-direction:column;justify-content:center;padding-top:clamp(45px,7vh,100px);padding-bottom:clamp(45px,7vh,100px)}.hero h1{font-size:clamp(44px,6.3vw,88px)}.hero-bottom{width:100%}.capabilities{display:block;max-width:100%;margin-top:clamp(35px,6vh,65px)}.capabilities p{max-width:690px}
.skills{padding:80px 0}.skills h2{font-size:38px;letter-spacing:-.035em;font-weight:550;margin:0 0 30px}.skills table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:17px}.skills th,.skills td{border-bottom:1px solid var(--line);padding:19px 12px;text-align:center;font-weight:400}.skills th:first-child{text-align:left;width:52%;padding-left:0}.skills thead th{font-size:15px;color:var(--muted)}.skills tbody td{color:#aaaFA3}.skills td.skill-level{color:var(--accent)}.skill-level span{font-size:15px}.projects{padding-top:35px}
.project-link{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;margin-top:28px;border:1px solid #20221f60;border-radius:50%;transition:background .2s,color .2s,transform .2s}.project-link:hover{background:var(--ink);color:var(--paper);transform:translateY(-2px)}.ikarus-scene img{display:block;object-fit:contain;width:85%;max-width:330px;height:auto;max-height:none;aspect-ratio:1}
.email-reveal{border:0;border-bottom:1px solid var(--ink);padding:0 0 5px;background:transparent;color:var(--ink);font-size:clamp(25px,3.4vw,44px);letter-spacing:-.04em;cursor:pointer}.email-reveal:hover{opacity:.75}.social-links{gap:14px;flex-wrap:wrap}.social-links a{min-height:52px;display:inline-flex;gap:25px;align-items:center;justify-content:space-between;padding:14px 19px;font-size:17px;font-weight:500;background:var(--ink);color:var(--paper);transition:background .2s}.social-links a:hover{background:#3e423a;text-decoration:none}.social-links svg{width:19px;height:19px}
@media(max-width:1000px){.hero h1{font-size:6.2vw}.header nav{gap:24px}}
@media(max-width:640px){:root{--header-height:85px}.header nav{gap:16px;font-size:14px}.header nav a:first-child{display:none}.hero{padding-top:44px;padding-bottom:44px;min-height:calc(100svh - var(--header-height))}.hero h1{font-size:clamp(29px,7.4vw,47px);line-height:1.15}.hero-bottom{display:block}.hero-bottom .button{margin-top:26px}.capabilities{margin-top:38px}.skills{padding:48px 0 30px}.skills h2{font-size:31px;margin-bottom:24px}.skills th:first-child{width:44%}.skills th,.skills td{padding:17px 4px;font-size:16px}.skills thead th{font-size:14px}.projects{padding-top:32px}.ikarus-scene img{width:75%;max-width:270px}.project-link{width:48px;height:48px;margin-top:24px}.social-links a{min-width:140px;font-size:16px}.email-reveal{font-size:clamp(24px,6.5vw,32px)}}

/* Section-to-section scroll, using the browser's native scroll behavior. */
html{scroll-snap-type:y mandatory;scroll-padding-top:0;scroll-behavior:smooth}
.page-section{scroll-snap-align:start;scroll-snap-stop:normal;min-height:100svh}
.header{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:2}
.header .brand{display:inline-flex;align-items:center;gap:14px}
.hero{min-height:100svh;padding-top:calc(var(--header-height) + 40px);padding-bottom:70px;justify-content:center}
.projects{display:flex;flex-direction:column;justify-content:center;gap:24px;padding-top:55px;padding-bottom:55px}
.projects>h2{margin:0 0 6px}.projects .featured{flex-shrink:0}.projects .ikarus-project{margin-top:0}
.contact{min-height:100svh;padding:0;display:flex;flex-direction:column;scroll-snap-align:start}
.contact>.wrap:first-child{flex:1;display:flex;flex-direction:column;justify-content:center;padding-top:60px;padding-bottom:60px}
.contact footer{min-height:100px;border-top:1px solid #20221f45;margin-top:0}.contact footer .ai-credit{color:var(--ink)}
@media(max-width:640px){html{scroll-snap-type:y proximity}.header .brand{gap:8px}.header .brand{font-size:23px}.header nav a:first-child{display:inline-flex}.header nav{gap:14px}.hero{min-height:100svh;padding-top:calc(var(--header-height) + 30px);padding-bottom:50px}.projects{padding-top:40px;padding-bottom:40px;gap:20px}.projects>h2{margin-bottom:4px}.contact>.wrap:first-child{padding-top:45px;padding-bottom:45px}.contact footer{min-height:100px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:none}}

/* Language selection, section position and contact composition. */
.header{gap:30px}.header .brand{margin-right:auto;gap:0}.language-switch{display:flex;gap:4px;align-items:center}.language-switch a{display:flex;align-items:center;justify-content:center;min-width:38px;min-height:38px;font-size:14px;color:var(--muted)}.language-switch a[aria-current]{background:var(--ink);color:var(--paper)}
.section-indicator{position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;gap:3px}.section-indicator a{display:flex;width:32px;height:35px;align-items:center;justify-content:center}.section-indicator span{width:7px;height:7px;border-radius:50%;background:var(--ink);opacity:.3;transition:transform .2s,opacity .2s}.section-indicator a[aria-current] span{opacity:1;transform:scale(1.55)}.section-indicator a:hover span{opacity:.8}
.contact{display:grid;grid-template-rows:auto minmax(180px,1fr) auto;min-height:100svh;align-content:stretch}
.contact>.wrap:first-child{display:block;flex:none;padding-top:65px;padding-bottom:0;margin-top:0;margin-bottom:0}
.contact .contact-art{position:relative;min-height:180px;margin-top:0;margin-bottom:0;align-self:stretch;overflow:hidden}
.contact-art canvas{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.contact-base{align-self:end;padding-bottom:0;margin-top:0;margin-bottom:0}.contact-base .social-links{margin-top:0;margin-bottom:24px}
.contact .footer-row{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid #20221f45;min-height:100px;padding:20px 0;margin:0;width:100%}
html[lang="en"] .hero h1{font-size:clamp(40px,5.4vw,76px)}
@media(max-width:640px){.header{gap:12px}.header nav{gap:13px;font-size:13px}.header .brand{font-size:24px}.language-switch{gap:0}.language-switch a{min-width:31px;min-height:36px;font-size:12px}.section-indicator{right:1px}.section-indicator a{width:21px;height:32px}.section-indicator span{width:5px;height:5px}.contact>.wrap:first-child{padding-top:40px;padding-bottom:0}.contact .footer-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;min-height:100px}.contact-base .social-links{margin-bottom:22px}.contact-base{padding-bottom:0}.contact .contact-art{min-height:160px}html[lang="en"] .hero h1{font-size:clamp(29px,7.2vw,43px)}}
@media(max-width:380px){.header nav a:first-child{display:none}.header{gap:10px}.header .brand{font-size:23px}}
