*{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Noto Sans,Liberation Sans,Arial,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji",sans-serif}body,html{height:100%;margin:0;padding:0}.app.dark{display:flex;flex-direction:column;min-height:100vh;background:linear-gradient(to right,#000,#2a2a2a,#000)}.main{flex-grow:1}.app.light{background:#f8f8f8;color:#222}.skip-link{position:absolute;top:-40px;left:0;background:#000;color:#fff;padding:.5rem 1rem;z-index:100;text-decoration:none;font-size:1rem}.skip-link:focus{top:0}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}.hamburger{position:fixed;top:1rem;right:1rem;background:linear-gradient(130deg,#ff7a18,#af002d 40%,#319197 60%);border:none;border-radius:50px;font-size:1rem;color:#fff;cursor:pointer;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center}.close-btn{background:none;border:none;font-size:2rem;color:#333;cursor:pointer;position:absolute;top:1rem;right:1rem}.myname{color:#319197}.myprofile{display:block;margin:auto;width:120px;height:120px;border-radius:50%;box-sizing:border-box;border:#ff7a18 solid 5px}.sidebar{box-sizing:border-box;position:fixed;top:0;bottom:0;left:-400px;width:300px;background-color:#040b14;color:#333;transition:right .3s ease;padding:1rem 0 0;box-shadow:-3px 0 10px #0003;z-index:100}.sidebar.open{left:0;transition:left .5s ease}.global-nav-list{box-sizing:border-box;padding:2rem 0 0;list-style:none;display:flex;flex-direction:column;gap:.5rem;align-items:center}.global-nav-list a{padding:.5rem}.global-nav-item{width:100%;display:flex;justify-content:flex-start;align-items:center;margin-left:3rem}.global-nav-item a{display:flex;align-items:center;gap:8px;margin:10px 0;padding:.5rem 1rem;width:100%;text-align:left;color:#cbc6c6;font-size:1rem;text-decoration:none}.global-nav-item a:hover{color:#f5f5f5;font-weight:700}.global-nav-item a:hover .material-icons{color:#ff7a18}@media (min-width: 768px){.hamburger{display:none}.sidebar{all:unset;display:flex;align-items:center;margin-left:auto}.global-nav-item{all:unset;display:flex;align-items:center;margin:0;padding:0}.global-nav-list{display:flex;flex-direction:row;justify-content:flex-end;margin:0;padding:0;list-style:none}.myprofile,.myname,.profile-links{display:none!important}}.header{display:flex;justify-content:space-between;align-items:center;color:#f97019}.header h1{margin-left:2rem;font-weight:lighter;display:flex;align-items:center}.header-container{margin-top:2rem;font-weight:lighter;display:flex;align-items:center;gap:.5rem;padding:0 1rem;width:100%}.header-nav{margin-right:2rem;display:flex;margin-left:auto;align-items:center}.ThemePanel{margin:0}.switch{position:relative;display:inline-block;width:40px;height:20px;margin-left:1rem;transform:scale(.8)}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#319197;transition:.4s;border-radius:26px}.slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:3px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#f97019}input:checked+.slider:before{transform:translate(24px)}h2{color:#f5f5f5}.light h2{color:#000}.light .latest-card h2{color:#f5f5f5}.light .carousel-slider{background:linear-gradient(to right,#fff,#e0e0e0);color:#121212}.light .global-nav-link,.light .global-nav-link:hover{color:#000}.light .global-nav-link:hover .material-icons{color:#ff7a18}@media (max-width: 768px){.light .sidebar{background-color:#fff;color:#000;box-shadow:-3px 0 10px #0003}}.light .skills-header p{color:#000}.light .modal{background-color:#f5f5f5;color:#000}.footer{background-color:#121212;color:#f5f5f5;padding:2rem 1rem;display:flex;justify-content:center;align-items:center}.footer-section{display:flex;flex-direction:column;gap:2rem;border:none;padding:2rem;border-radius:16px;background:#1e1e1e;box-shadow:0 4px 20px #0000004d;width:100%;max-width:900px}.footer-fieldset-left,.footer-fieldset-right{border:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1rem;align-items:center}.footer-fieldset-left ul{font-size:1.2rem;font-weight:lighter;color:#f97019;list-style:none;margin:0;padding:0;text-align:center}.footer-fieldset-right ul{font-size:.8rem;font-weight:lighter;color:#f5f5f5;list-style:none;margin:0;padding:0;text-align:center}.footer-list{font-size:1rem;color:#ddd;list-style:none;margin:.25rem 0;text-align:center}.footer button{margin-top:.5rem;padding:.6rem 1.2rem;background:#f97019;color:#fff;border:none;border-radius:8px;font-weight:lighter;cursor:pointer;transition:background .3s ease}.footer button:hover{background:#d35800}.footer p{margin-top:2rem;font-size:.9rem;color:#aaa;text-align:center}.footer a{color:#f97019;text-decoration:none}.footer-list a:hover{text-decoration:underline;color:#1e90ff;font-weight:700}@media (min-width: 768px){.footer-section{flex-direction:row;justify-content:center;align-items:stretch}.footer-fieldset-left{width:50%;align-items:center;text-align:left;padding:0 2rem}.footer-fieldset-right{width:50%;align-items:flex-start;text-align:left;padding:0 2rem}.footer-fieldset-left{border-right:1px solid #444}.footer-fieldset-left ul{text-align:center}.footer-fieldset-right ul,.footer-list{text-align:flex-start}.footer button{align-self:center}}.modal{display:flex;flex-direction:column;justify-content:center;align-items:stretch;padding:2rem;border:none;border-radius:15px;max-width:500px;width:95%;background-color:#000;box-shadow:0 10px 20px #0000004d;color:#fff;z-index:1}.modal:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;border-radius:15px;padding:5px;background:linear-gradient(130deg,#ff7a18,#af002d 40%,#319197 60%);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask-composite:destination-out}h3{margin-bottom:2rem;font-weight:lighter}dialog:not([open]){display:none}.form-group{display:flex;flex-direction:row;margin-bottom:.8rem;align-items:flex-start;gap:1.5rem}.modal label{margin-bottom:.3rem;min-width:80px;text-align:left;font-weight:lighter}.input-wrapper{display:flex;flex-direction:column;flex:1}.modal::backdrop{background:#319197;opacity:.5}.modal input{flex:1;padding:.5rem;border:1px solid #ccc;border-radius:4px}.error{color:red!important;display:flex;font-size:.9rem;margin-top:.2rem}.modal input.error-input{border:2px solid red}.modal button{padding:.5rem 1rem;background:linear-gradient(130deg,#ff7a18,#af002d 40%,#319197 60%);color:#fff;border:none;border-radius:4px;cursor:pointer;text-decoration:none;gap:1rem;margin-top:1.5rem}.modal-buttons{display:flex;justify-content:center;gap:1rem;margin-top:1.5rem}.modal button :hover{background-color:#cba09f;color:#000}body{height:100%}.intro-section{display:flex;align-items:center;justify-content:center;width:90%;position:relative;background:#fff;background-size:cover;background-position:center;background-repeat:no-repeat;margin:auto;border-radius:15px;box-shadow:0 4px 8px #319197;height:45vh}.intro-section img{width:100px;height:100px;border-radius:50%;margin-right:2rem}.intro-text{font-size:1.8rem;color:#000;font-weight:lighter;white-space:nowrap;overflow:hidden}.intro-text-animation{color:#000;font-weight:lighter;font-size:1.5rem;white-space:nowrap;overflow:hidden;animation:typing 3s steps(40,end) infinite alternate,blink .75s step-end infinite;text-decoration:underline;text-decoration-color:#ff7a18}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink{50%{border-color:transparent}}.carousel-section{display:flex;flex-direction:column;gap:1rem;align-items:center;justify-content:flex-start;padding:1rem;overflow-x:visible;height:auto;position:relative}.latest-card{font-weight:700;text-align:right;margin-right:2rem}.latest-card p{color:#319197;font-weight:lighter}.carousel-section:after{content:"";position:absolute;top:0;right:0;width:5px;height:100%;background:linear-gradient(130deg,#ff7a18,#af002d 40%,#319197 60%);z-index:5;border-radius:10px}.latest-card{width:90%;color:#fff;border-radius:16px;padding:1.5rem;position:relative;z-index:0;height:200px;background-color:#000;box-shadow:0 4px 8px #0003;overflow:hidden}.latest-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;border-radius:18px;padding:4px;background:linear-gradient(130deg,#ff7a18,#af002d 40%,#319197 60%);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask-composite:destination-out}.carousel-slider{width:90%;max-width:500px;height:50vh;padding:1rem;scroll-snap-align:center;border-radius:10px;overflow:hidden;background:#eee;box-shadow:0 4px 8px #0003}@media (min-width: 768px){.carousel-section{flex-direction:row;gap:2rem;align-items:stretch;justify-content:flex-start;padding:2rem;overflow-x:auto;height:300px}.latest-card{flex:0 0 180px;height:200px}.card{flex:0 0 180px}}.carousel-container{position:relative;overflow-x:auto;scroll-snap-type:x mandatory;height:auto}.carousel-item{display:flex;flex-direction:row}.carousel-item a{text-decoration:none}.carousel-link-text{color:#319197!important;font-size:1.2rem;font-weight:700}.carousel-link-text :hover{color:#f97019!important;text-decoration:underline}.carousel-slider{flex:0 0 100%;scroll-snap-align:center;border-radius:18px;background:linear-gradient(to right,#4a4a4a,#1a1a1a);overflow:hidden;box-shadow:0 10px 25px #0006;color:#fff;width:100%;padding:1.5rem;height:auto;max-width:500px;transition:transform .2s ease,box-shadow .2s ease;margin:0 auto;z-index:1}.carousel-slider h3{font-size:1.2rem;margin-bottom:.25rem}.carousel-slider p{font-size:.85rem;margin-top:0;white-space:nowrap;overflow:hidden;max-width:100%;cursor:pointer;color:#f97019}.carousel-slider:hover{transform:rotate(0) scale(1.03);z-index:10;text-decoration:underline;color:#f97019}.card-date{background-color:beige;padding:.3rem;border-radius:8px;display:inline-block;margin-bottom:0;font-weight:700}@media (min-width: 768px){.carousel-item{flex-direction:row;gap:2rem}.carousel-slider{flex:0 0 200px;height:200px;margin-left:-40px;width:auto}.carousel-slider:first-child{margin-left:0}}.card{margin:2rem auto;background-color:#f8f8f8;border-radius:15px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 4px 12px #319197;transition:transform .2s ease;width:100%;max-width:500px;min-height:550px}.card:hover{transform:translateY(-15px);opacity:1}.card-title{color:#000;margin:1rem;padding:0;text-align:center;font-size:1.2rem}.card__content{text-align:center;margin:0 auto;font-size:1rem;color:#333}.card-content button{display:flex;margin:0 auto;align-items:center;justify-content:center;margin-top:.8rem;padding:.5rem 1rem;background-color:#ffc8c8;color:#f5f5f5;font-weight:700;border:none;border-radius:5px;cursor:pointer}.card-content button:hover{background-color:#5c5959;color:#f5f5f5}.card-grid{display:grid;grid-template-columns:repeat(2,1fr)}.card-color-pink{background-color:#f8bbd0;opacity:.7}.card-color-blue{background-color:#bbdefb;opacity:.7}.card-color-green{background-color:#c8e6c9;opacity:.7}.card-color-yellow{background-color:#fff9c4;opacity:.7}.card-color-orange{background-color:#ffe0b2;opacity:.7}.card-color-purple{background-color:#e1bee7;opacity:.7}*{box-sizing:border-box}h2{color:#f5f5f5;margin-left:3rem;font-weight:lighter}.card-grid{display:grid;grid-template-columns:1fr;gap:1rem;padding:1rem}@media (min-width:768px){.card-grid{grid-template-columns:repeat(2,1fr);gap:2rem;padding:2rem}}.portfolio-page{padding:2rem;color:#f5f5f5;min-height:100vh}.card{background-color:#f8f8f8;min-height:550px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 4px 8px #0003}.card-image{border-radius:10px;width:100%;height:280px;object-fit:cover}.card-body{padding:1rem;display:flex;flex-direction:column;justify-content:space-between;flex-grow:1}.card-content{color:#000;flex-grow:1}.skills-header{margin:2rem 0 1.5rem;display:flex;flex-direction:column;align-items:flex-start;font-weight:lighter}.skills-header h2{font-size:1.5rem;margin-left:1rem;margin-bottom:.5rem;color:#f97019}.skills-header p{color:#f5f5f5;margin-left:1rem;margin-bottom:1rem;max-width:600px;line-height:1.5;font-size:1rem}.skills-header button{align-self:flex-start;background-color:transparent;border:none;color:#f97019;font-size:1.5rem;cursor:pointer;padding:.2rem}.selected-skills{margin-bottom:1rem;margin-top:1rem;padding:.5rem 1rem;background:transparent;box-shadow:0 0 0 4px #f9701980;border-left:.5px solid #F97019;border-radius:8px}.selected-skills h4{margin:0 0 .5rem;font-weight:700;font-size:1rem;color:#f97019}.selected-skills>button{align-self:flex-end;background:none;border:1px solid #F97019;color:#f97019;padding:.3rem .6rem;font-size:.8rem;border-radius:6px;cursor:pointer;margin-bottom:.3rem}.selected-skill{display:inline-flex;align-items:center;background-color:salmon;color:#fff;padding:5px 10px;border-radius:20px;margin:.25rem;font-size:.85rem}.remove-skill{background:none;border:none;color:#fff;font-weight:700;margin-left:5px;cursor:pointer}.card-grid{display:grid;grid-template-columns:1fr;gap:2rem;margin-top:2rem}@media (min-width: 768px){.card-grid{grid-template-columns:repeat(2,1fr)}}.tag-container{margin-top:auto;padding-top:.3rem}.tag{background-color:#eee;border-radius:20px;padding:5px 10px;margin:5px 5px 0 0;font-size:12px;display:inline-block;color:#333;font-weight:500;transition:background-color .3s ease}.tag.selected{background-color:#f97019;color:#fff}.panel{display:flex;flex-direction:column;align-items:center;gap:1rem;margin:2rem 0;padding:1rem;text-align:center;background-color:#f5f5f5;border-radius:16px;box-shadow:0 4px 20px #0000004d}.panel img{width:100%;max-width:300px;height:200px;border-radius:10px;object-fit:contain;object-position:center;box-shadow:0 4px 12px #0003}.panel-content{width:100%;max-width:500px;display:flex;flex-direction:column;gap:.5rem;align-items:center;padding:0 1rem}.panel-content h3{font-size:1.5rem;color:#f97019}.panel-content p{font-size:1rem;color:#333;margin:0}@media (min-width: 768px){.panel{flex-direction:row;justify-content:center;align-items:center;text-align:left;padding:0 2rem;margin:2rem}.panel.reverse{flex-direction:row-reverse}.panel img{flex:1;width:100%;height:200px;margin:2rem}.panel-content{flex:1;display:flex;flex-direction:column;gap:.5rem;padding:1rem}}.moment-page{margin:2rem}.panel-page{padding:1rem}.panel-content h3{font-size:1.3rem;font-weight:lighter;color:#ff7a18}.panel-content p{font-size:1rem;color:#000;font-weight:lighter;opacity:.85}
