.portfolio-content{opacity:1;animation:1s ease-out fadeInContent}@keyframes fadeInContent{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}html{background-color:#000}*{color:#fff;font-family:Arial,Helvetica,sans-serif}.nav-tabs{transition:all .3s}@media (max-width:768px){.nav-tabs.collapsed{opacity:.7;pointer-events:none;transform:translateY(-100%)}}ul{gap:2rem;margin:0;padding:0;list-style:none;display:flex}@media (max-width:768px){ul{flex-wrap:wrap;justify-content:center;gap:1rem}}.button{color:#fff;text-align:center;cursor:pointer;background:gray;border:none;border-radius:.5rem;padding:.875rem 2rem;font-size:1.5rem;font-weight:500;text-decoration:none;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 4px 12px #0003}.button:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.button:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.button:hover:before{left:100%}.button.active{opacity:.5;transform:translateY(0)}@media (max-width:768px){.button{width:100%;max-width:100%;padding:.75rem 1rem;font-size:.9rem}}@media (max-width:480px){.button{word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;padding:.7rem .75rem;font-size:.85rem}}
