.skill-pill{display:inline-flex;align-items:center;justify-content:center;background-color:var(--color-dark-gray);border:1px solid var(--color-cosmic-latte);color:var(--color-white);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;margin:.4rem;position:relative;cursor:default;transition:all .2s ease}.skill-pill:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.skill-pill[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);background-color:#212121f2;color:var(--color-white);text-align:center;padding:.75rem 1rem;border-radius:4px;font-size:.85rem;line-height:1.4;width:max-content;max-width:280px;box-shadow:0 4px 12px #0000004d;z-index:100;opacity:0;animation:fadeIn .3s forwards;border-left:3px solid var(--color-cosmic-latte);backdrop-filter:blur(2px)}.skill-pill[data-tooltip]:hover:before{content:"";position:absolute;bottom:calc(100% + 5px);left:50%;transform:translate(-50%);border-width:5px;border-style:solid;border-color:rgba(33,33,33,.95) transparent transparent transparent;z-index:100}@media (max-width: 768px){.skill-pill{position:relative}.skill-pill[data-tooltip]:hover:after{max-width:180px;font-size:.75rem;padding:.6rem .8rem;line-height:1.3;position:absolute;left:50%;transform:translate(-50%);width:max-content;max-width:min(180px,80vw)}.skill-pill[data-tooltip]:hover:before{position:absolute;left:50%;transform:translate(-50%)}}@media (max-width: 480px){.skill-pill[data-tooltip]:hover:after{max-width:min(160px,70vw);font-size:.7rem;padding:.5rem .7rem}}.skills-tech-section{margin:3rem 0}.skills-tech-container{display:flex;flex-direction:column;gap:2.5rem;padding-top:2rem;padding-bottom:2rem}.group-title{font-size:1.2rem;margin-bottom:1.5rem;color:var(--color-text-primary);font-weight:500}.pills-container{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-start}@media (max-width: 768px){.group-title{font-size:1.25rem}}:root{--color-dark-gray: #262626;--color-white: #ecd9d4;--color-cosmic-latte: #fff8e7;--color-cosmic-latte-10: rgba(255, 248, 231, .1);--color-cosmic-latte-20: rgba(255, 248, 231, .2);--color-gray-100: rgba(255, 255, 255, .1);--color-gray-200: rgba(255, 255, 255, .2);--color-gray-300: rgba(255, 255, 255, .3);--color-gray-400: rgba(255, 255, 255, .4);--color-gray-600: rgba(255, 255, 255, .6);--color-gray-700: rgba(255, 255, 255, .1);--color-gray-800: rgba(20, 20, 20, .4);--color-gray-900: rgba(15, 15, 15, .6);--color-black-hole-brown: #4B0F19;--color-black-hole-brown-10: rgba(75, 15, 25, .1);--color-black-hole-brown-20: rgba(75, 15, 25, .2);--container-max-width: 1200px;--container-narrow-max-width: 800px;--container-wide-max-width: 1200px;--color-bg-primary: var(--color-dark-gray);--color-text-primary: var(--color-white);--color-text-accent: var(--color-cosmic-latte);--color-accent-10: var(--color-cosmic-latte-10);--color-accent-20: var(--color-cosmic-latte-20);--font-family-base: "Poppins", sans-serif;--font-family-title: "Exo", sans-serif;--font-family-alt: "Exo", sans-serif;--font-family-mono: "Monaco", "Consolas", monospace;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-bold: 700;--font-size-xs: clamp(.75rem, .7rem + .25vw, .875rem);--font-size-sm: clamp(.875rem, .825rem + .25vw, 1rem);--font-size-base: clamp(1rem, .95rem + .25vw, 1.125rem);--font-size-lg: clamp(1.125rem, 1.05rem + .375vw, 1.25rem);--font-size-xl: clamp(1.5rem, 1.25rem + 1.25vw, 1.75rem);--font-size-2xl: clamp(2rem, 1.75rem + 1.25vw, 2.25rem);--font-size-3xl: clamp(2.5rem, 2rem + 2.5vw, 3rem);--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-loose: 1.8;--line-height-base: var(--line-height-normal);--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--transition-fast: .2s ease;--transition-base: .3s ease;--transition-slow: .5s ease;--border-radius-sm: 4px;--border-radius-md: 8px;--border-radius-lg: 12px;--border-radius-full: 9999px;--iframe-height-standard: 352px;--iframe-height-playlist: calc(var(--iframe-height-standard) * 1.5);--iframe-height-dj-set: 120px;@media (max-width: 768px){--iframe-height-standard: 300px;--iframe-height-playlist: 450px}@media (max-width: 480px){--iframe-height-standard: 250px;--iframe-height-playlist: 400px}}html:not(.dark-mode){--color-bg-primary: var(--color-white);--color-text-primary: var(--color-dark-gray);--color-text-accent: var(--color-black-hole-brown);--color-accent-10: var(--color-black-hole-brown-10);--color-accent-20: var(--color-black-hole-brown-20);--color-bg-hover: rgba(0, 0, 0, .05);--color-gray-100: rgba(0, 0, 0, .05);--color-gray-200: rgba(0, 0, 0, .07);--color-gray-300: rgba(0, 0, 0, .1);--color-gray-400: rgba(0, 0, 0, .3);--color-gray-600: rgba(0, 0, 0, .5);--color-gray-700: rgba(0, 0, 0, .05);--color-gray-800: rgba(0, 0, 0, .07);--color-gray-900: rgba(238, 238, 238, .9)}.dark-mode{--color-text-accent: var(--color-cosmic-latte);--color-accent-10: var(--color-cosmic-latte-10);--color-accent-20: var(--color-cosmic-latte-20);--color-bg-primary: #121212;--color-text-primary: #f5f5f5;--color-bg-hover: rgba(255, 255, 255, .05);--color-gray-100: rgba(255, 255, 255, .05);--color-gray-200: rgba(255, 255, 255, .07);--color-gray-300: rgba(255, 255, 255, .1);--color-gray-400: rgba(255, 255, 255, .12);--color-gray-600: rgba(255, 255, 255, .2);--color-gray-700: rgba(255, 255, 255, .05);--color-gray-800: rgba(255, 255, 255, .07);--color-gray-900: rgba(20, 20, 20, .8)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .5s ease-out}.container{width:100%;max-width:var(--container-max-width);margin:0 auto;padding:0 2rem;margin-top:2rem}.container--narrow{max-width:var(--container-narrow-max-width)}.container--wide{max-width:var(--container-wide-max-width)}.container--no-padding{padding:0}@media (max-width: 768px){.container{padding:0 1.5rem}}@media (max-width: 480px){.container{padding:0 1rem}}.mt-0{margin-top:0}.mt-1{margin-top:var(--spacing-xs)}.mt-2{margin-top:var(--spacing-sm)}.mt-4{margin-top:var(--spacing-md)}.mt-8{margin-top:var(--spacing-lg)}.mt-12{margin-top:var(--spacing-xl)}.mb-0{margin-bottom:0}.mb-1{margin-bottom:var(--spacing-xs)}.mb-2{margin-bottom:var(--spacing-sm)}.mb-4{margin-bottom:var(--spacing-md)}.mb-8{margin-bottom:var(--spacing-lg)}.mb-12{margin-bottom:var(--spacing-xl)}.error-message{text-align:center;padding:2rem;background-color:#ff00001a;border-radius:var(--border-radius-md);margin:2rem 0;color:var(--color-white)}.notice-message{text-align:center;padding:1rem;background-color:#ffc8001a;border-radius:var(--border-radius-md);margin:1rem 0 2rem;font-style:italic;color:var(--color-white)}.success-message{text-align:center;padding:1rem;background-color:#00ff001a;border-radius:var(--border-radius-md);margin:1rem 0 2rem;color:var(--color-white)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.highlight{color:var(--color-cosmic-latte)}.section-divider{height:1px;background:rgba(255,248,231,.1);margin:1.5rem 0;border:none}.img-full{display:block;max-width:100%;height:auto}.iframe-rounded{border-radius:var(--border-radius-md);border:none}.iframe-borderless{border:none}.carousel-base{display:flex;align-items:center;gap:1rem}.carousel-container,.sets-carousel,.playlists-carousel,.photos-carousel,.certifications-carousel{position:relative;width:100%;overflow:hidden;padding:0}.carousel-track,.sets-track,.playlists-track,.photos-track,.certifications-track{display:flex;transition:transform .5s ease;width:100%}.carousel-item,.sets-item,.playlist-item{flex:0 0 100%;width:100%;box-sizing:border-box;padding:0rem}.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;background-color:#00000080;color:#fff;border:none;border-radius:4px;width:24px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:all .2s;opacity:0}.carousel-container:hover .carousel-arrow,.sets-carousel:hover .carousel-arrow,.playlists-carousel:hover .carousel-arrow,.photos-carousel:hover .carousel-arrow,.certifications-carousel:hover .carousel-arrow{opacity:.7}.carousel-arrow:hover{background-color:#000000b3;opacity:1!important}.carousel-arrow.prev{left:0}.carousel-arrow.next{right:0}@media (max-width: 768px){.carousel-arrow{width:22px;height:50px;font-size:1rem;opacity:.4}}@media (max-width: 480px){.carousel-arrow{width:20px;height:44px;font-size:.8rem}}.iframe-container{position:relative;width:100%;background-color:var(--color-gray-900);border-radius:8px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.iframe-container:not(.loaded) .media-iframe,.iframe-container.error .media-iframe{opacity:0}.iframe-loading,.iframe-error{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:var(--color-gray-900);color:var(--color-white);font-size:.9rem}.iframe-container.loaded .iframe-loading,.iframe-container .iframe-error,.iframe-container.error .iframe-loading{display:none}.iframe-container.error .iframe-error{display:flex}.media-iframe{position:relative;z-index:1;opacity:1;transition:opacity .3s ease;border:none;display:block;width:100%}#playlists .media-iframe{height:var(--iframe-height-playlist)}#podcast .media-iframe{height:var(--iframe-height-standard)}#dj-sets .media-iframe{height:var(--iframe-height-dj-set)}.playlist-info{padding:1rem;background-color:var(--color-gray-900);border-radius:0 0 8px 8px;margin-top:-8px;text-align:center}.playlist-description{font-size:.9rem;padding-top:var(--spacing-md);margin:0 auto;color:var(--color-white);max-width:90%}.podcast-embed{position:relative;width:100%;margin:1rem 0;border-radius:12px;overflow:hidden}.certification-carousel-item{padding:0 var(--spacing-md);box-sizing:border-box;width:50%;max-width:50%;flex:0 0 50%}.certification-pill{display:flex;flex-direction:column;background-color:var(--color-bg-primary);border:1px solid var(--color-accent-20);color:var(--color-text-primary);padding:var(--spacing-lg);border-radius:var(--border-radius-md);margin:0;width:100%;text-decoration:none;transition:all var(--transition-fast);position:relative;height:100%;box-sizing:border-box;overflow-wrap:break-word;word-break:break-word}.certification-pill:hover{background-color:var(--color-bg-hover);transform:translateY(-2px);box-shadow:0 4px 8px #0003;color:var(--color-text-primary)}.certification-pill .external-link{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:18px;height:18px;opacity:.7;transition:opacity var(--transition-fast)}.certification-pill:hover .external-link{opacity:1}.cert-meta{display:flex;align-items:center;margin-bottom:var(--spacing-sm)}.cert-date{font-size:var(--font-size-xs);opacity:.7;margin-right:var(--spacing-sm)}.cert-status{font-size:var(--font-size-xs);color:var(--color-text-primary);display:block;margin-bottom:var(--spacing-sm)}.cert-name{font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);margin-bottom:var(--spacing-xs);word-break:break-word;overflow-wrap:break-word;max-width:calc(100% - 25px);display:block}.cert-issuer{font-size:var(--font-size-sm);margin-bottom:var(--spacing-sm);word-break:break-word;display:block}.cert-issuer-label{font-size:var(--font-size-xs);opacity:.7;margin-right:var(--spacing-xs)}.cert-description{font-size:var(--font-size-xs);line-height:var(--line-height-normal);opacity:.9;margin-bottom:var(--spacing-md);word-break:break-word;display:block;width:100%}.certification-pill[data-tooltip]:hover:after,.certification-pill[data-tooltip]:hover:before{display:none}@media (max-width: 768px){.certification-carousel-item{width:100%;max-width:100%;flex:0 0 100%}.cert-name{font-size:1rem;line-height:1.3;padding-right:24px}.cert-description{font-size:.8rem;line-height:1.4;margin-bottom:1.25rem}.cert-issuer{font-size:.85rem}}@media (max-width: 480px){.cert-name{font-size:.9rem}.cert-description{font-size:.75rem}}
