:root{--white: #EEEEEE;--blue: #468A9A;--light-brown: #965200;--brown: #874225;--dark-brown: #541212;--black: #0f0e0e;--titles: "Roboto", "Helvetica Neue", Helvetica;--text: "Space Mono", "IBM Plex Mono";min-height:100vh;height:100%;background:none;border:none}html,body{margin:0;padding:0;background:none;border:none;min-height:100vh;width:100vw;box-sizing:border-box}.home{--scalableText: clamp(6px, 1vw, 14px);--gap-text-wordmark: clamp(4px, 1.2vw, 10px);--gap-text-wordmark-mobile: clamp(1px, .2vw, 3px);height:100svh;margin:0 auto;padding:var(--scalableText);display:grid;overflow:hidden;grid-template-columns:1.1fr .9fr;grid-template-rows:auto auto .92fr auto var(--gap-text-wordmark) auto;grid-template-areas:"top-text ." "middle-text ." ".           ." "lower-text ." ".           ." "wordmark image";column-gap:clamp(6px,1vw,14px);padding-block:clamp(2px,.6vh,4px);row-gap:0;color:var(--black);background:var(--white);align-content:start}.title_primary{grid-area:top-text}.title_secondary{grid-area:middle-text}.text{grid-area:lower-text}.title_terciary{grid-area:wordmark}.title_primary,.title_secondary,.title_terciary,.text{margin:0;padding-left:clamp(8px,1.6vw,14px)}.title_secondary{margin:12px 0 0;font-family:var(--titles);font-weight:600;font-size:clamp(20px,3.1vw,36px);line-height:1.05;letter-spacing:.01em;color:var(--black);opacity:0;transform:translateY(-16px);animation:dropIn .6s ease-out .12s forwards}@keyframes dropIn{to{opacity:1;transform:translateY(0)}}.text{margin:clamp(2px,.4vw,8px) 0 0;max-width:58ch;font-family:var(--text);font-size:clamp(14px,1.2vw,16px);line-height:1.35;color:var(--black)}.title_terciary{margin:clamp(6px,1.4vw,10px) 0 0;font-family:var(--titles);font-weight:800;font-size:clamp(48px,10vw,120px);line-height:.95;letter-spacing:.005em;color:var(--black);text-transform:uppercase;align-self:end;opacity:0;transform:translateY(16px);animation:riseIn .6s ease-out .12s forwards}@keyframes riseIn{to{opacity:1;transform:translateY(0)}}.home img{margin:0;margin-inline-end:var(--scalableText);margin-block-end:var(--scalableText);grid-area:image;margin-bottom:var(--scalableText);width:clamp(140px,19vw,250px);aspect-ratio:3/4;object-fit:cover;justify-self:end;align-self:end;display:block;border-radius:2px}@media (max-width: 1024px){.home{grid-template-columns:1fr .9fr}.home img{grid-area:image;justify-self:end}.title_secondary{max-width:28ch}}@media (max-width: 480px){.home{padding:clamp(14px,4vw,20px);gap:clamp(18px,5vw,28px);min-height:100svh;box-sizing:border-box;width:100%;align-content:center;grid-template-rows:auto auto auto auto var(--gap-text-wordmark-mobile) auto;grid-template-areas:"top-text" "middle-text" "image" "lower-text" "." "wordmark";row-gap:0;align-content:start}.title_secondary,.title_terciary{letter-spacing:0}.home img{width:clamp(17rem,85vw,25rem);max-height:48dvh;justify-self:start;align-self:start}.title_terciary{font-size:clamp(40px,14vw,88px);align-self:end}.title_primary,.title_secondary,.title_terciary,.text{margin:5px}.title_secondary{padding-top:clamp(30px,6vh,60px)}.text{max-width:60ch}}.profile{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"photo text";gap:clamp(24px,4vw,72px);width:100%;margin:0 auto;padding:clamp(16px,4vw,48px);align-items:start;background:var(--white);padding-top:clamp(84px,13vh,144px);min-height:100svh;box-sizing:border-box}.profile img{grid-area:photo;width:60%;height:65vh;object-fit:cover;opacity:.9;border-radius:4px;margin-top:90px;margin-left:80px;box-shadow:0 10px 30px #00000014;transform-origin:center center;animation:photoShrink .8s ease-out .3s forwards}@keyframes photoShrink{0%{transform:scale(1)}to{transform:scale(.95)}}.textProfile{grid-area:text;max-width:62ch;font-weight:400;line-height:1.75;font-size:clamp(10px,.7vw + 7px,15.5px);font-family:var(--text);color:var(--black);margin:60px 80px 0 0;opacity:0;transform:translateY(16px);animation:textRise .6s ease-out forwards}.textProfile p:nth-child(1){animation-delay:.18s}.textProfile p:nth-child(2){animation-delay:.32s}@keyframes textRise{to{opacity:1;transform:translateY(0)}}@media (max-width: 1024px){.profile{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"photo textProfile";align-items:start;padding:clamp(80px,10vw,120px);gap:clamp(16px,4vw,32px);box-sizing:border-box}.profile img{grid-area:photo;width:100%;height:auto;object-fit:cover;margin-top:250px;margin-left:0}.textProfile{grid-area:textProfile;min-width:0;margin-top:250px;margin-right:0}@media (max-width: 480px){.profile{display:grid;grid-template-columns:1fr;grid-template-areas:"photo" "textProfile";padding:clamp(7px,2vw,15px);gap:clamp(10px,2vw,16px);box-sizing:border-box}.profile img{grid-area:photo;display:block;height:50svh;width:80%;object-fit:cover;margin-top:90px;justify-self:center}.textProfile{grid-area:textProfile;min-width:0;font-size:14px;margin:10px}}}.background{background:var(--white);min-height:100svh}.projects-container{max-width:768px;margin:0 auto;padding:30px;padding-top:clamp(40px,10vh,120px)}.projects-header{margin-bottom:24px}.projects-title{font-size:36px;line-height:1.3;margin:0;font-family:var(--titles);text-align:center;transition:transform .35s ease;transform-origin:center center}.projects-title:hover{transform:scale(1.1)}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:60px;align-items:start}@media (max-width: 1024px){.projects-grid{grid-template-columns:repeat(2,1fr);gap:30px}}@media (max-width: 640px){.projects-grid{grid-template-columns:1fr;gap:20px}}.card-link{display:flex;flex-direction:column;width:100%;gap:10px;text-decoration:none;color:inherit}.card{margin-top:25px;position:relative;width:100%;aspect-ratio:1/1;border:1px solid var(--white);border-radius:12px;overflow:hidden;background:color-mix(in srgb,var(--black) 3%,transparent)}.card-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;padding:25px;box-sizing:border-box;transition:transform .35s ease;transform-origin:center center}.card-title{position:static;margin:0;text-align:center;left:0;right:0;bottom:0;padding:12px;font-family:var(--titles);font-size:20px;font-weight:600}.card:hover .card-image{transform:scale(1.1)}.field{display:block;width:100%}.field_label{display:block;font-family:var(--titles);font-size:clamp(16px,1.4vw,22px);letter-spacing:.28em;color:var(--black);text-transform:uppercase;margin-bottom:8px}.field_input{width:100%;background:var(--white);border:none;border-bottom:.5px solid var(--connect-line);color:var(--black);padding:6px 10px 10px;font-family:var(--text);line-height:1.6;box-shadow:0 1px var(--connect-line);box-sizing:border-box}.field_input::placeholder{color:color-mix(in srgb,var(--black) 50%,transparent);font-size:16px}:root{--connect-side-pad: clamp(16px, 6vw, 80px);--connect-top-pad: clamp(94px, 14vh, 150px);--connect-field-gap: clamp(28px, 5vh, 56px);--connect-line: color-mix(in srgb, var(--black) 20%, transparent)}.connect_background{background:var(--white);min-height:100dvh;display:flex;justify-content:center}.connect_container{width:100%;max-width:1200px;padding:var(--connect-top-pad) var(--connect-side-pad)}.connect-text-h4{font-family:var(--text);letter-spacing:.02em;margin:0 0 clamp(36px,8vh,72px);padding-top:40px;font-size:18px;font-weight:400;text-align:center}.connect-text-h2{font-family:var(--titles);letter-spacing:.0005em;font-weight:500;margin:0 0 clamp(36px,8vh,72px);font-size:36px;text-align:center}.connect_form{justify-items:start;width:100%;max-width:580px;margin-inline:auto;display:grid;gap:var(--connect-field-gap)}.field_textarea_container,.field_textarea{width:100%;border:none;background:var(--white);outline:none;caret-color:var(--black)}.field_textarea{resize:vertical;width:100%;background:var(--white);border:none;border-bottom:.5px solid var(--connect-line);padding:6px 0 10px;box-shadow:0 1px var(--connect-line);min-height:120px;line-height:1.6}.field_textarea::placeholder{color:color-mix(in srgb,var(--black) 50%,transparent);font-family:var(--text);font-size:16px}.general_button{display:inline-flex;justify-content:center;justify-self:center;align-items:center;font-family:var(--text);font-size:18px;color:var(--black);border:none;background:var(--white);cursor:pointer;padding:5px 8px;border-radius:6px}.general_button:hover,.general_button:active{background:var(--black);color:var(--white);padding:5px 8px}.text-type{display:inline-block;white-space:pre-wrap}.text-type__cursor{margin-left:.25rem;display:inline-block;opacity:1}.text-type__cursor--hidden{display:none}.detail-container{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto min-content 1fr;grid-template-areas:"title video" "tablet techs" "tablet description" "tablet button";gap:20px;min-height:100dvh;height:100vh;padding:32px;box-sizing:border-box;overflow:hidden;background:var(--white)}.detail-title{margin-top:50px;grid-area:title;align-self:start;justify-self:start;font-family:var(--titles);font-size:38px;max-width:400ch;transition:transform .25s ease}.detail-title:hover{transform:scale(1.05)}.video{grid-area:video;align-self:start;justify-self:end;width:100%;max-width:750px;max-height:550px;display:flex;justify-content:center;align-items:center}.video-element{margin-top:50px;width:100%;max-width:750px;max-height:550px;height:auto;display:block;background:none;border:none}.stack{grid-area:tablet;align-self:stretch;justify-self:start;display:flex;flex-direction:column;justify-content:flex-end;min-height:0}.detail-image{max-width:400px;max-height:400px;width:100%;height:auto;transition:transform .25s ease}.detail-image:hover{transform:scale(1.06)}.techs{grid-area:techs;align-self:end;justify-self:end}.tech-list{display:flex;gap:10px;margin:0;padding:0;list-style:none;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap}.detail-description{grid-area:description;align-self:end;justify-self:end;font-family:var(--text);font-size:14px;text-align:right;margin:0;display:flex;flex-direction:column;align-items:flex-end;gap:20px;max-width:600px;max-height:300px;overflow:auto;padding-bottom:8px}.button-return-projects{grid-area:button;align-self:end;justify-self:end}.tech-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;border:var(--white);background:var(--white);transition:transform .2s ease,color .2s ease;font-family:var(--text)}.tech-chip[data-tech=react]:hover{background:#61dafb;color:#000}.tech-chip[data-tech=javascript]:hover{background:#f7df1e;color:#000}.tech-chip[data-tech=typescript]:hover{background:#3178c6;color:#fff}.tech-chip[data-tech=css]:hover{background:#264de4;color:#fff}.tech-chip[data-tech=html]:hover,.tech-chip[data-tech=html5]:hover{background:#e34c26;color:#fff}.tech-chip[data-tech=redux]:hover{background:#764abc;color:#fff}.tech-chip[data-tech=node]:hover,.tech-chip[data-tech="node.js"]:hover{background:#3c873a;color:#fff}.tech-chip[data-tech=express]:hover{background:#000;color:#fff}.tech-chip[data-tech=mongodb]:hover{background:#47a248;color:#fff}.tech-chip[data-tech=postman]:hover{background:#ff6c37;color:#fff}.tech-chip[data-tech=swagger]:hover{background:#85ea2d;color:#000}.tech-chip[data-tech=unsplash]:hover,.tech-chip[data-tech="unsplash api"]:hover{background:#000;color:#fff}@media (min-width: 700px) and (max-width: 1024px){html,body{background:var(--white);overflow-x:hidden}.detail-container{margin-inline:auto;max-width:min(980px,100%);padding-inline:clamp(13px,2.5vw,22px);height:auto;overflow:visible;background:var(--white)}.video{max-width:100%;justify-self:end}.video-element{width:100%;max-width:min(750px,100%);aspect-ratio:16/9;height:auto;max-height:none;display:block}.techs,.detail-description,.button-return-projects{max-width:100%}.detail-description{word-break:break-word}.tech-list{max-width:100%;overflow-x:auto}}@media (max-width: 600px){html,body{background:var(--white);overflow-x:hidden}.detail-title{text-align:center}.detail-description{text-align:center;align-items:center;justify-self:center;margin-left:auto;margin-right:auto;max-width:clamp(300px,360px,420px)}.detail-container{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto auto;grid-template-areas:"title" "description" "tablet" "video" "techs" "button";width:clamp(300px,360px,404px);margin-inline:auto;gap:24px;padding:40px 16px;height:auto;background:var(--white);box-sizing:border-box;padding-left:max(1px,calc(env(safe-area-inset-left) + 1px));padding-right:max(1px,calc(env(safe-area-inset-right) + 1px))}.stack{grid-area:tablet;justify-self:center}.detail-image{display:block;width:clamp(220px,240px,260px);height:auto;max-width:none;max-height:none;margin:0 auto}.detail-title,.detail-description,.stack,.video,.techs,.button-return-projects{margin-left:auto;margin-right:auto}.video{grid-area:video;justify-self:center}.video-element{display:block;width:clamp(280px,340px,380px);height:calc(.5625*clamp(280px,340px,380px));aspect-ratio:16 / 9;object-fit:contain;margin:0 auto;background:#000}.techs{grid-area:techs;width:clamp(300px,360px,420px);margin:0 auto;text-align:center}.tech-list{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;margin:0;padding:4px 0;max-width:clamp(300px,360px,420px);overflow-x:hidden;white-space:normal}.tech-chip{font-size:12px;padding:6px 8px;line-height:1.2;flex:0 1 auto;overflow-wrap:anywhere}.button-return-projects{grid-area:button;width:clamp(220px,260px,300px);margin:4px auto 0;justify-self:center}}.navbar{position:fixed;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));display:flex;gap:clamp(6px,1.6vw,14px);z-index:1000}@media (max-width: 600px){.navbar{top:max(6px,env(safe-area-inset-top));left:max(6px,env(safe-area-inset-left));right:max(6px,env(safe-area-inset-right));justify-content:center;flex-wrap:nowrap;gap:clamp(4px,1.6vw,11px)}.nav_button{white-space:nowrap;font-size:clamp(16px,4vw,18px)}}