@charset "UTF-8";:root{--color-main-bg:white;--color-alt-bg:#F1F1F9;--color-main-text:#484848;--color-header-bg:rgba(241,241,249,0.9);--color-section-bg:transparent;--color-primary:#DF5646;--color-accent:#252956}:target{scroll-margin-top:3.33rem}*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box}body,html{margin:0}html{font-family:"Poppins",sans-serif;font-size:100%;scroll-behavior:smooth}body{font-weight:300;background-color:var(--color-main-bg,white);color:var(--color-main-text,#484848);min-height:100vh}section{background-color:var(--color-section-bg,transparent);padding:2rem 0}footer{background:var(--color-header-bg,rgba(241,241,249,0.9));padding-bottom:1rem;padding-top:1rem;text-align:center}footer p{margin-bottom:0}h1{color:var(--color-accent,#252956);font-family:"Playfair Display",serif;font-weight:600;margin:0 0 2rem}h1 em{font-style:normal;color:var(--color-primary,#DF5646)}h1 small{color:var(--color-accent,#252956);display:block;font-family:"Poppins",sans-serif;font-size:0.33em;font-weight:500;margin-top:0.67em}h2{color:var(--color-primary,#DF5646);display:inline-block;font-size:0.875rem;font-weight:500;isolation:isolate;margin:2rem 0 4rem 3rem;padding:0 0.5rem;position:relative}h2:after,h2:before{content:"";position:absolute;z-index:-1}h2:before{background-color:var(--color-primary,#DF5646);inset:0;opacity:0.15}h2:after{border-bottom:1px solid var(--color-main-text,#484848);height:0;left:-3rem;top:50%;width:2rem}h3,h4,h5,h6{color:var(--color-accent,#252956);display:block;font-family:"Poppins",sans-serif;font-weight:500;margin:0 0 2rem}h1{font-size:calc(1.25rem + 1.75vmin + 1.75vmax)}h3{font-size:1.5rem}h4{font-size:1.5rem}h5{font-size:1rem}h6{font-size:0.85rem}p{margin:0 0 1em}strong{font-weight:500}a{color:var(--color-accent,#252956)}a:visited{color:var(--color-accent,#252956)}img{height:auto}.container{margin:0 auto;max-width:90rem;padding:0 1rem;width:100%}@media (min-width:768px){.container{padding:0 2rem}}@font-face{font-family:"jipijopo-icons";src:url("fonts/jipijopo-icons.woff2?bnt852") format("woff2"),url("fonts/jipijopo-icons.woff?bnt852") format("woff");font-weight:normal;font-style:normal;font-display:block}[class*=" icon-"],[class^=icon-]{font-family:"jipijopo-icons"!important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-file-pdf:before{content:""}.icon-external:before{content:""}.bubble{-webkit-filter:drop-shadow(2px 4px 6px rgba(0,0,0,0.05));filter:drop-shadow(2px 4px 6px rgba(0,0,0,0.05));isolation:isolate;position:relative;-webkit-transition:-webkit-filter 0.25s ease-in-out;transition:-webkit-filter 0.25s ease-in-out;transition:filter 0.25s ease-in-out;transition:filter 0.25s ease-in-out,-webkit-filter 0.25s ease-in-out}.bubble:after,.bubble:before{content:"";background:white;position:absolute;z-index:-1}.bubble:before{inset:-0.25em;border-radius:50%}.bubble:after{left:0;top:0;width:100%;height:100%;-webkit-transform:rotate3d(1,1,0,80deg) translate(50%);transform:rotate3d(1,1,0,80deg) translate(50%)}@media (min-width:1024px){.bubble:after{-webkit-transform:rotate3d(-1,1,0.5,90deg) translate(-150%,-30%);transform:rotate3d(-1,1,0.5,90deg) translate(-150%,-30%)}}.button{background-color:var(--color-primary,#DF5646);-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px solid var(--color-primary,#DF5646);border-radius:5px;color:white;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-size:1rem;font-weight:500;gap:1em;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:0.375em 2em;position:relative;text-align:center;text-decoration:none;-webkit-transition:all 0.2s linear;transition:all 0.2s linear;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;-ms-touch-action:manipulation;touch-action:manipulation}@media (max-width:1023px){.button{display:block}}@media (hover:hover){.button:hover{-webkit-filter:brightness(1.15);filter:brightness(1.15)}}@-moz-document url-prefix(){.button:hover{filter:brightness(1.15)}}.button:active,.button:focus{-webkit-filter:brightness(1.15);filter:brightness(1.15)}.button.accent{background-color:var(--color-accent,#252956)}.button>*{color:inherit;display:inline-block;vertical-align:baseline}.button [class*=" icon-"],.button [class^=icon-]{-webkit-transform:scale(1.25);transform:scale(1.25);-webkit-transform-origin:bottom;transform-origin:bottom}.button-list{-ms-flex-line-pack:stretch;align-content:stretch;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;list-style-type:none;margin:0;padding:0;text-align:center}.button-list__item{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.button-list__item:not(:last-child){margin-right:0.5em}.button-list__item .button,.button-list__item .button.button--link{width:100%}@media (max-width:767px){.button-list__item .button,.button-list__item .button.button--link{padding-left:0.5em;padding-right:0.5em}}.button-list__item img{max-width:100%;height:auto}.button-list__item--icon .button{width:2.3333em}.button-list--single-line .button-list__item{min-width:0}@media (max-width:767px){.button-list--mobile-block{display:block}.button-list--mobile-block .button-list__hint{position:static}.button-list--mobile-block .button-list__item{display:block;margin-bottom:0.5em}.button-list--mobile-block .button-list__item:not(:last-child){margin-right:0}}.header--main{background:var(--color-header-bg,rgba(241,241,249,0.9));position:sticky;top:0;z-index:7000}.header--main nav{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (min-width:768px){.header--main nav{gap:2rem}}.header--main nav a{font-size:0.875rem;font-weight:500;line-height:1.5;text-decoration:none;padding:1rem 0.5rem;position:relative}.header--main nav a:before{background-color:var(--color-accent,#252956);bottom:0;content:"";height:2px;left:50%;position:absolute;-webkit-transition:all 0.25s ease-out;transition:all 0.25s ease-out;width:0}@media (hover:hover){.header--main nav a:hover:before{left:0;width:100%}}@-moz-document url-prefix(){.header--main nav a:hover:before{left:0;width:100%}}.header--main nav a:active:before,.header--main nav a:focus:before{left:0;width:100%}.about-me{--color-section-bg:var(--color-alt-bg,$color-alt-bg);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:calc(67vh - 3.33rem)}@media (max-width:1023px){.about-me__grid :not(p){text-align:center}}@media (min-width:1024px){.about-me__grid{display:-ms-grid;display:grid;grid-gap:0 4rem;-ms-grid-rows:auto 0 auto 0 auto;grid-template-areas:"image title" "image text" "image cta";-ms-grid-columns:1fr 4rem 2fr;grid-template-columns:1fr 2fr;justify-items:start}}.about-me__image{grid-area:image;-ms-grid-column-align:end;justify-self:end;margin:0 auto;max-width:50vw}@media (min-width:1024px){.about-me__image{margin:0}}.about-me h1{grid-area:title}.about-me p{grid-area:text;margin-bottom:2rem;max-width:68ch}.about-me .button{grid-area:cta;margin-bottom:2rem}.skills__grid{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:2rem}.skills__grid>*{-webkit-box-flex:1;-ms-flex:1 0 100%;flex:1 0 100%}@media (min-width:1024px){.skills__grid{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.skills__grid>*{-webkit-box-flex:1;-ms-flex:1;flex:1}}@media (min-width:1540px){.skills__grid{gap:4rem}}.skills article{font-size:0.875rem;margin-bottom:2rem}.skills article .title{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;border-radius:0.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;gap:1rem;margin-bottom:2rem}.skills article .title img{-webkit-box-flex:0;-ms-flex:0 0 8rem;flex:0 0 8rem;min-width:0}.skills article .title h3{margin-bottom:0;max-width:14ch}@media (min-width:1024px){.skills article p{text-align:justify}}@media (min-width:768px){.portfolio__grid{display:-ms-grid;display:grid;-ms-grid-columns:1fr 2rem 1fr;grid-template-columns:repeat(2,1fr);gap:2rem}.portfolio__grid>:first-child{grid-column:1/-1}}@media (min-width:1540px){.portfolio__grid{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}}@media (min-width:1024px){.portfolio__article:first-of-type{display:-ms-grid;display:grid;gap:0 2rem;grid-template-areas:"image title" "image info" "image description";-ms-grid-columns:1fr 2rem 1fr;grid-template-columns:repeat(2,1fr);-ms-grid-rows:min-content 0 min-content 0 1fr;grid-template-rows:-webkit-min-content -webkit-min-content 1fr;grid-template-rows:min-content min-content 1fr}.portfolio__article:first-of-type>.about-me__image{-ms-grid-row:1;-ms-grid-row-span:5;-ms-grid-column:1}.portfolio__article:first-of-type>h1{-ms-grid-row:1;-ms-grid-column:3}}.portfolio__article:not(:first-of-type){border-top:2px solid var(--color-alt-bg,#F1F1F9);margin-top:2rem;padding-top:4rem}@media (min-width:1024px){.portfolio__article:not(:first-of-type){margin-top:3rem}}.portfolio__article:not(:first-of-type) .portfolio__description{text-align:justify}.portfolio__article>*{margin:0 0 2rem}@media (min-width:1024px){.portfolio__article>*{margin-bottom:1rem}}.portfolio__image{border-radius:10px;-webkit-box-shadow:1px 2px 6px rgba(0,0,0,0.15);box-shadow:1px 2px 6px rgba(0,0,0,0.15);display:block;grid-area:image;max-width:100%}.portfolio__title{grid-area:title}.portfolio__info{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;font-size:0.875rem;font-weight:500;gap:0.5em;grid-area:info}.portfolio__info span{background-color:var(--color-alt-bg,#F1F1F9);border-radius:5px;padding:0 1em;white-space:nowrap}.portfolio__description{font-size:0.875rem;grid-area:description}@media (min-width:1024px){.about-me__image{-ms-grid-row:1;-ms-grid-row-span:5;-ms-grid-column:1}.about-me h1{-ms-grid-row:1;-ms-grid-column:3}.about-me p{-ms-grid-row:3;-ms-grid-column:3}.about-me .button{-ms-grid-row:5;-ms-grid-column:3}.portfolio__image{-ms-grid-row:1;-ms-grid-row-span:5;-ms-grid-column:1}.portfolio__article:first-of-type>.portfolio__image{-ms-grid-row:1;-ms-grid-row-span:5;-ms-grid-column:1}.portfolio__title{-ms-grid-row:1;-ms-grid-column:3}.portfolio__article:first-of-type>.portfolio__title{-ms-grid-row:1;-ms-grid-column:3}.portfolio__info{-ms-grid-row:3;-ms-grid-column:3}.portfolio__description{-ms-grid-row:5;-ms-grid-column:3}}.character{--breath-amount:1%;--breath-rate:5s;width:100%}.character *{-webkit-transition:all 0.25s ease;transition:all 0.25s ease}.character .eyes,.character .eyes>*,.character .left-arm,.character .left-forearm,.character .mouth,.character .right-arm,.character .right-forearm{transform-box:fill-box}.character .left-arm{-webkit-transform-origin:150% 25%;transform-origin:150% 25%}.character .right-arm{-webkit-transform-origin:0 0;transform-origin:0 0}.character .head{--breath-amount:.67%}.character:not(:hover) .eyes{-webkit-transform-origin:center;transform-origin:center;-webkit-animation:blinking 8s infinite;animation:blinking 8s infinite}.character:not(:hover) .left-eye,.character:not(:hover) .right-eye{-webkit-animation:look 32s infinite;animation:look 32s infinite}.character:not(:hover) .head,.character:not(:hover) .upper{-webkit-animation:breathing var(--breath-rate) ease-out infinite normal;animation:breathing var(--breath-rate) ease-out infinite normal}.character:not(:hover) .mouth{-webkit-animation:breathing--mouth var(--breath-rate) ease-out infinite normal;animation:breathing--mouth var(--breath-rate) ease-out infinite normal}.character:hover .left-arm{-webkit-animation:hi--left-arm 0.5s ease-in-out infinite alternate;animation:hi--left-arm 0.5s ease-in-out infinite alternate}.character:hover .mouth{-webkit-animation:hi--mouth 0.5s 0.5s ease-in-out both;animation:hi--mouth 0.5s 0.5s ease-in-out both}.character:hover .eyes{-webkit-transform:translateY(-50%);transform:translateY(-50%)}@-webkit-keyframes breathing{0%,60%,to{-webkit-transform:translateY(var(--breath-amount));transform:translateY(var(--breath-amount))}25%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes breathing{0%,60%,to{-webkit-transform:translateY(var(--breath-amount));transform:translateY(var(--breath-amount))}25%{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes breathing--mouth{0%,60%,to{-webkit-transform:scaleY(1);transform:scaleY(1)}25%{-webkit-transform:scaleY(2);transform:scaleY(2)}}@keyframes breathing--mouth{0%,60%,to{-webkit-transform:scaleY(1);transform:scaleY(1)}25%{-webkit-transform:scaleY(2);transform:scaleY(2)}}@-webkit-keyframes breathing--arms{0%,60%,to{-webkit-transform:translateY(-5%);transform:translateY(-5%)}25%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes breathing--arms{0%,60%,to{-webkit-transform:translateY(-5%);transform:translateY(-5%)}25%{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes blinking{0%,10%,14%,50%,54%,70%,74%,to{-webkit-transform:scaleY(1);transform:scaleY(1)}12%,52%,72%{-webkit-transform:scaleY(0.05);transform:scaleY(0.05)}}@keyframes blinking{0%,10%,14%,50%,54%,70%,74%,to{-webkit-transform:scaleY(1);transform:scaleY(1)}12%,52%,72%{-webkit-transform:scaleY(0.05);transform:scaleY(0.05)}}@-webkit-keyframes look{0%,10%,15%,30%,40%,60%,65%,to{-webkit-transform:translate(0,0);transform:translate(0,0)}11%,14%{-webkit-transform:translate(200%,0);transform:translate(200%,0)}31%,39%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}61%,64%{-webkit-transform:translate(-200%,0);transform:translate(-200%,0)}}@keyframes look{0%,10%,15%,30%,40%,60%,65%,to{-webkit-transform:translate(0,0);transform:translate(0,0)}11%,14%{-webkit-transform:translate(200%,0);transform:translate(200%,0)}31%,39%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}61%,64%{-webkit-transform:translate(-200%,0);transform:translate(-200%,0)}}@-webkit-keyframes hi--left-arm{0%{-webkit-transform:scale3d(-1.25,1.25,1) rotate(-160deg) translate(75%,10%);transform:scale3d(-1.25,1.25,1) rotate(-160deg) translate(75%,10%)}to{-webkit-transform:scale3d(-1.25,1.25,1) rotate(-150deg) translate(75%,10%);transform:scale3d(-1.25,1.25,1) rotate(-150deg) translate(75%,10%)}}@keyframes hi--left-arm{0%{-webkit-transform:scale3d(-1.25,1.25,1) rotate(-160deg) translate(75%,10%);transform:scale3d(-1.25,1.25,1) rotate(-160deg) translate(75%,10%)}to{-webkit-transform:scale3d(-1.25,1.25,1) rotate(-150deg) translate(75%,10%);transform:scale3d(-1.25,1.25,1) rotate(-150deg) translate(75%,10%)}}@-webkit-keyframes hi--mouth{0%,to{-webkit-transform:scaleY(1);transform:scaleY(1)}25%,75%{-webkit-transform:scaleY(10);transform:scaleY(10)}}@keyframes hi--mouth{0%,to{-webkit-transform:scaleY(1);transform:scaleY(1)}25%,75%{-webkit-transform:scaleY(10);transform:scaleY(10)}}.relative{position:relative}.typewriter{overflow:hidden;border-right:0.15em solid #DF5646;white-space:nowrap;margin:0 auto;letter-spacing:0.15em;-webkit-animation:typing 3.5s steps(40,end),blink-caret 0.75s step-end infinite;animation:typing 3.5s steps(40,end),blink-caret 0.75s step-end infinite}@-webkit-keyframes typing{0%{width:0}to{width:100%}}@keyframes typing{0%{width:0}to{width:100%}}@-webkit-keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:#DF5646}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:#DF5646}}