endpoints.path: /
endpoints.endpoint_type: HTTP
endpoints.scan_time: 2025-10-07T16:12:08.945410
endpoints.uri: http://itzar.org/
endpoints.protocol: HTTP/1.1
endpoints.status_reason: OK
endpoints.key: Nel
endpoints.headers: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
endpoints.key: Report-To
endpoints.headers: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=XwxyDiU%2BqxO7UGjFm6lic0yMkesy2xiuV4MndDFIPORSxMZslR5wzxUdFCBzXGin7vYN0JiV8923DCb5U5bUrD5YZwODL1wVVA%3D%3D"}]}
endpoints.key: Age
endpoints.headers: 3375388
endpoints.key: alt-svc
endpoints.headers: h3=":443"; ma=86400
endpoints.key: Content-Encoding
endpoints.headers: gzip
endpoints.key: Connection
endpoints.headers: keep-alive
endpoints.key: Server
endpoints.headers: cloudflare
endpoints.key: Cache-Control
endpoints.headers: public, max-age=0, must-revalidate
endpoints.key: Content-Type
endpoints.headers: text/html; charset=UTF-8
endpoints.key: Vary
endpoints.headers: Accept-Encoding
endpoints.key: Surge-Cache
endpoints.headers: HIT
endpoints.key: Date
endpoints.headers: <REDACTED>
endpoints.key: Surge-Stamp
endpoints.headers: 538::1756478061920-177404f5eaf8a146963698246af2a375
endpoints.key: Response-Time
endpoints.headers: 4ms
endpoints.key: cf-cache-status
endpoints.headers: DYNAMIC
endpoints.key: Transfer-Encoding
endpoints.headers: chunked
endpoints.key: CF-RAY
endpoints.headers: 98aeadac4a929d52-ORD
endpoints.html_tags: <title>Kaydon Kilgore - Creative Developer</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
endpoints.body: <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Kaydon Kilgore - Creative Developer</title>
      <style>
          * {
              margin: 0;
              padding: 0;
              box-sizing: border-box;
          }
  
          html {
              height: 100%;
          }
  
          body {
              font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
              background: linear-gradient(135deg, #0a0a0a 0%, #1a0a2e 25%, #16213e 50%, #0f3460 75%, #0a0a0a 100%);
              background-attachment: fixed;
              background-repeat: no-repeat;
              background-size: cover;
              min-height: 100vh;
              color: white;
              overflow-x: hidden;
              position: relative;
          }
          
          /* Mobile background fix */
          @media (max-width: 768px) {
              body {
                  background: #0a0a0a;
                  background-image: linear-gradient(135deg, #0a0a0a 0%, #1a0a2e 25%, #16213e 50%, #0f3460 75%, #0a0a0a 100%);
                  background-attachment: scroll;
                  background-repeat: no-repeat;
                  background-size: 100% 100vh;
                  background-position: center top;
              }
              
              body::before {
                  content: '';
                  position: fixed;
                  top: 0;
                  left: 0;
                  width: 100%;
                  height: 100%;
                  background: linear-gradient(135deg, #0a0a0a 0%, #1a0a2e 25%, #16213e 50%, #0f3460 75%, #0a0a0a 100%);
                  z-index: -10;
                  pointer-events: none;
              }
          }
  
          /* Animated background elements */
          .bg-animation {
              position: fixed;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              z-index: -1;
              overflow: hidden;
          }
  
          .floating-shapes {
              position: absolute;
              width: 100%;
              height: 100%;
          }
  
          .shape {
              position: absolute;
              opacity: 0.1;
              animation: float 20s infinite linear;
          }
  
          .shape:nth-child(1) {
              top: 20%;
              left: 10%;
              width: 60px;
              height: 60px;
              background: linear-gradient(45deg, #e91e63, #9c27b0);
              border-radius: 50%;
              animation-delay: 0s;
          }
  
          .shape:nth-child(2) {
              top: 60%;
              right: 15%;
              width: 40px;
              height: 40px;
              background: linear-gradient(45deg, #9c27b0, #3f51b5);
              transform: rotate(45deg);
              animation-delay: -7s;
          }
  
          .shape:nth-child(3) {
              bottom: 30%;
              left: 20%;
              width: 80px;
              height: 80px;
              background: linear-gradient(45deg, #00bcd4, #e91e63);
              border-radius: 20px;
              animation-delay: -14s;
          }
  
          @keyframes float {
              0% { transform: translateY(0px) rotate(0deg); }
              50% { transform: translateY(-20px) rotate(180deg); }
              100% { transform: translateY(0px) rotate(360deg); }
          }
  
          /* Header */
          header {
              position: fixed;
              top: 0;
              width: 100%;
              padding: 1rem 2rem;
              background: rgba(0, 0, 0, 0.1);
              backdrop-filter: blur(20px);
              border-bottom: 1px solid rgba(255, 255, 255, 0.1);
              z-index: 1000;
          }
  
          nav {
              display: flex;
              justify-content: space-between;
              align-items: center;
              max-width: 1200px;
              margin: 0 auto;
          }
  
          .logo {
              font-size: 1.8rem;
              font-weight: 700;
              background: linear-gradient(45deg, #e91e63, #9c27b0, #00bcd4);
              background-clip: text;
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
              background-size: 200% 200%;
              animation: gradient-shift 3s ease infinite;
          }
  
          @keyframes gradient-shift {
              0%, 100% { background-position: 0% 50%; }
              50% { background-position: 100% 50%; }
          }
  
          .nav-links {
              display: flex;
              gap: 2rem;
              list-style: none;
          }
  
          .nav-links a {
              color: rgba(255, 255, 255, 0.8);
              text-decoration: none;
              transition: all 0.3s ease;
              position: relative;
          }
  
          .nav-links a:hover {
              color: #e91e63;
              transform: translateY(-2px);
          }
  
          .nav-links a::after {
              content: '';
              position: absolute;
              bottom: -5px;
              left: 0;
              width: 0;
              height: 2px;
              background: linear-gradient(45deg, #e91e63, #9c27b0);
              transition: width 0.3s ease;
          }
  
          .nav-links a:hover::after {
              width: 100%;
          }
  
          /* Main Content */
          main {
              padding-top: 100px;
          }
  
          .hero {
              text-align: center;
              padding: 4rem 2rem;
              max-width: 1200px;
              margin: 0 auto;
          }
  
          .profile-image {
              width: 150px;
              height: 150px;
              border-radius: 50%;
              margin: 0 auto 2rem auto;
              border: 3px solid rgba(255, 255, 255, 0.2);
              object-fit: cover;
              animation: gradient-shift 3s ease infinite;
              box-shadow: 0 0 30px rgba(233, 30, 99, 0.3);
          }
  
          .hero h1 {
              font-size: clamp(2.5rem, 8vw, 4rem);
              font-weight: 800;
              margin-bottom: 0.5rem;
              background: linear-gradient(135deg, #ffffff 0%, #e91e63 50%, #9c27b0 100%);
              background-clip: text;
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
              line-height: 1.2;
          }
  
          .hero .subtitle {
              font-size: 1.4rem;
              color: #00bcd4;
              margin-bottom: 1rem;
              font-weight: 500;
          }
  
          .hero p {
              font-size: 1.1rem;
              color: rgba(255, 255, 255, 0.8);
              max-width: 600px;
              margin: 0 auto 2rem auto;
              line-height: 1.6;
          }
  
          .social-links {
              display: flex;
              justify-content: center;
              gap: 1rem;
              margin-bottom: 3rem;
          }
  
          .social-links a {
              width: 50px;
              height: 50px;
              background: rgba(255, 255, 255, 0.1);
              backdrop-filter: blur(20px);
              border: 1px solid rgba(255, 255, 255, 0.2);
              border-radius: 15px;
              display: flex;
              align-items: center;
              justify-content: center;
              color: white;
              text-decoration: none;
              font-size: 1.2rem;
              transition: all 0.3s ease;
          }
  
          .social-links a:hover {
              transform: translateY(-5px);
              background: linear-gradient(45deg, #e91e63, #9c27b0);
              border-color: transparent;
          }
  
          /* Projects Section */
          .projects {
              padding: 4rem 2rem;
              max-width: 1200px;
              margin: 0 auto;
          }
  
          .projects h2 {
              text-align: center;
              font-size: 2.5rem;
              margin-bottom: 3rem;
              background: linear-gradient(45deg, #00bcd4, #e91e63);
              background-clip: text;
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
          }
  
          .project-grid {
              display: grid;
              grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
              gap: 2rem;
          }
  
          .project-card {
              background: rgba(255, 255, 255, 0.05);
              backdrop-filter: blur(20px);
              border-radius: 20px;
              padding: 0;
              border: 1px solid rgba(255, 255, 255, 0.1);
              transition: all 0.3s ease;
              position: relative;
              overflow: hidden;
              cursor: pointer;
          }
  
          .project-card::before {
              content: '';
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              background: linear-gradient(135deg, rgba(233, 30, 99, 0.1), rgba(156, 39, 176, 0.1));
              opacity: 0;
              transition: opacity 0.3s ease;
          }
  
          .project-card:hover {
              transform: translateY(-10px);
              border-color: rgba(233, 30, 99, 0.5);
          }
  
          .project-card:hover::before {
              opacity: 1;
          }
  
          .project-image {
              width: 100%;
              height: 200px;
              background: linear-gradient(135deg, #1a0a2e, #16213e);
              display: flex;
              align-items: center;
              justify-content: center;
              font-size: 3rem;
              border-radius: 20px 20px 0 0;
              position: relative;
              z-index: 1;
          }
  
          .project-content {
              padding: 1.5rem;
              position: relative;
              z-index: 1;
          }
  
          .project-title {
              font-size: 1.3rem;
              margin-bottom: 0.5rem;
              color: white;
          }
  
          .project-tech {
              font-size: 0.9rem;
              color: #00bcd4;
              margin-bottom: 1rem;
          }
  
          .project-description {
              color: rgba(255, 255, 255, 0.8);
              line-height: 1.6;
              margin-bottom: 1rem;
          }
  
          .project-links {
              display: flex;
              gap: 1rem;
          }
  
          .project-link {
              padding: 0.5rem 1rem;
              background: rgba(255, 255, 255, 0.1);
              color: white;
              text-decoration: none;
              border-radius: 25px;
              font-size: 0.9rem;
              transition: all 0.3s ease;
              border: 1px solid rgba(255, 255, 255, 0.2);
          }
  
          .project-link:hover {
              background: linear-gradient(45deg, #e91e63, #9c27b0);
              border-color: transparent;
          }
  
          /* Skills Section */
          .skills {
              padding: 4rem 2rem;
              max-width: 1200px;
              margin: 0 auto;
          }
  
          .skills h2 {
              text-align: center;
              font-size: 2.5rem;
              margin-bottom: 3rem;
              background: linear-gradient(45deg, #9c27b0, #00bcd4);
              background-clip: text;
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
          }
  
          .skill-categories {
              display: grid;
              grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
              gap: 2rem;
          }
  
          .skill-category {
              background: rgba(255, 255, 255, 0.05);
              backdrop-filter: blur(20px);
              border-radius: 20px;
              padding: 2rem;
              border: 1px solid rgba(255, 255, 255, 0.1);
          }
  
          .skill-category h3 {
              font-size: 1.3rem;
              margin-bottom: 1rem;
              color: #e91e63;
          }
  
          .skill-tags {
              display: flex;
              flex-wrap: wrap;
              gap: 0.5rem;
          }
  
          .skill-tag {
              padding: 0.5rem 1rem;
              background: rgba(255, 255, 255, 0.1);
              border-radius: 25px;
              font-size: 0.9rem;
              color: rgba(255, 255, 255, 0.9);
              border: 1px solid rgba(255, 255, 255, 0.2);
          }
  
          /* Footer */
          footer {
              margin-top: 4rem;
              padding: 3rem 2rem;
              text-align: center;
              background: rgba(0, 0, 0, 0.3);
              backdrop-filter: blur(20px);
              border-top: 1px solid rgba(255, 255, 255, 0.1);
          }
  
          .footer-content h3 {
              font-size: 1.5rem;
              margin-bottom: 1rem;
              background: linear-gradient(45deg, #e91e63, #9c27b0);
              background-clip: text;
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
          }
  
          .footer-content p {
              color: rgba(255, 255, 255, 0.8);
              margin-bottom: 1rem;
          }
  
          .contact-email {
              color: #00bcd4;
              text-decoration: none;
              font-weight: 500;
          }
  
          .contact-email:hover {
              color: #e91e63;
          }
  
          /* Mobile Menu */
          .mobile-menu-toggle {
              display: none;
              background: none;
              border: none;
              color: white;
              font-size: 1.5rem;
              cursor: pointer;
              padding: 0.75rem;
              min-width: 44px;
              min-height: 44px;
              border-radius: 8px;
              transition: all 0.3s ease;
          }
  
          .mobile-menu-toggle:hover {
              background: rgba(255, 255, 255, 0.1);
          }
  
          /* Mobile optimizations */
          @media (max-width: 768px) {
              .mobile-menu-toggle {
                  display: block;
              }
  
              .nav-links {
                  position: fixed;
                  top: 80px;
                  right: -100%;
                  width: 100vw;
                  max-width: 300px;
                  height: calc(100vh - 80px);
                  background: rgba(0, 0, 0, 0.98);
                  backdrop-filter: blur(20px);
                  flex-direction: column;
                  justify-content: flex-start;
                  align-items: center;
                  padding: 2rem 1rem;
                  transition: right 0.3s ease;
                  border-left: 1px solid rgba(255, 255, 255, 0.1);
              }
  
              .nav-links.active {
                  right: 0;
              }
  
              .nav-links li {
                  margin: 1rem 0;
              }
  
              .nav-links a {
                  font-size: 1.2rem;
              }
              
              .hero {
                  padding: 3rem 1.5rem;
                  margin-top: 1rem;
              }
  
              .hero h1 {
                  font-size: clamp(2.2rem, 8vw, 3.5rem);
                  margin-bottom: 1rem;
              }
  
              .hero .subtitle {
                  font-size: clamp(1.2rem, 4vw, 1.4rem);
                  margin-bottom: 1.5rem;
              }
  
              .hero p {
                  font-size: clamp(1rem, 3vw, 1.1rem);
                  margin-bottom: 2rem;
                  line-height: 1.7;
              }
  
              .profile-image {
                  width: 120px;
                  height: 120px;
                  margin-bottom: 1.5rem;
              }
              
              .projects, .skills {
                  padding: 2rem 1rem;
              }
  
              .projects h2, .skills h2 {
                  font-size: 2rem;
                  margin-bottom: 2rem;
              }
  
              .project-grid {
                  grid-template-columns: 1fr;
                  gap: 1.5rem;
              }
  
              .project-card {
                  margin: 0 auto;
                  max-width: 100%;
              }
  
              .project-content {
                  padding: 1.25rem;
              }
  
              .project-links {
                  flex-wrap: wrap;
                  gap: 0.75rem;
              }
  
              .project-link {
                  text-align: center;
                  padding: 0.75rem 1.5rem;
                  flex: 1;
                  min-width: 120px;
              }
  
              .social-links {
                  flex-wrap: wrap;
                  gap: 1rem;
                  margin-bottom: 3rem;
                  justify-content: center;
              }
  
              .social-links a {
                  width: 50px;
                  height: 50px;
                  font-size: 1.2rem;
                  border-radius: 20px;
              }
  
              .skill-categories {
                  grid-template-columns: 1fr;
                  gap: 1.5rem;
              }
  
              .skill-category {
                  padding: 1.5rem;
              }
  
              .skill-tags {
                  gap: 0.4rem;
              }
  
              .skill-tag {
                  padding: 0.4rem 0.8rem;
                  font-size: 0.85rem;
              }
  
              footer {
                  padding: 2rem 1rem;
              }
  
              .footer-content h3 {
                  font-size: 1.3rem;
              }
  
              .footer-content p {
                  font-size: 0.95rem;
              }
          }
  
          @media (max-width: 480px) {
              header {
                  padding: 1rem 1.5rem;
              }
  
              .logo {
                  font-size: 1.6rem;
              }
  
              .hero {
                  padding: 2rem 1rem;
              }
  
              .hero h1 {
                  font-size: clamp(2rem, 10vw, 2.8rem);
                  margin-bottom: 1rem;
              }
  
              .hero .subtitle {
                  font-size: clamp(1.1rem, 4vw, 1.3rem);
                  margin-bottom: 1.5rem;
              }
  
              .profile-image {
                  width: 110px;
                  height: 110px;
                  margin-bottom: 2rem;
              }
  
              .projects, .skills {
                  padding: 2rem 1rem;
              }
  
              .project-image {
                  height: 160px;
                  font-size: 2.8rem;
              }
  
              .project-title {
                  font-size: 1.25rem;
              }
  
              .project-tech {
                  font-size: 0.9rem;
              }
  
              .project-description {
                  font-size: 0.95rem;
                  line-height: 1.6;
              }
  
              .social-links a {
                  width: 48px;
                  height: 48px;
                  font-size: 1.1rem;
              }
  
              .nav-links {
                  width: 100vw;
                  max-width: 280px;
              }
  
              .project-links {
                  flex-direction: column;
                  gap: 0.75rem;
              }
  
              .project-link {
                  padding: 1rem 1.5rem;
                  font-size: 1rem;
              }
          }
  
          /* Very small screens optimization */
          @media (max-width: 350px) {
              header {
                  padding: 0.75rem 1rem;
              }
  
              .logo {
                  font-size: 1.4rem;
              }
  
              .hero {
                  padding: 1.5rem 1rem;
              }
  
              .hero h1 {
                  font-size: clamp(1.8rem, 12vw, 2.2rem);
              }
  
              .projects, .skills {
                  padding: 1.5rem 1rem;
              }
  
              .project-card {
                  border-radius: 15px;
              }
  
              .project-image {
                  height: 140px;
                  font-size: 2.2rem;
                  border-radius: 15px 15px 0 0;
              }
  
              .project-content {
                  padding: 1.25rem;
              }
  
              .skill-category {
                  padding: 1.25rem;
              }
  
              .social-links {
                  justify-content: center;
                  gap: 0.75rem;
              }
  
              .social-links a {
                  width: 44px;
                  height: 44px;
                  font-size: 1rem;
              }
  
              .nav-links {
                  width: 100vw;
                  max-width: 260px;
                  padding: 2rem 1.5rem;
              }
  
              .project-link {
                  padding: 0.875rem 1.25rem;
                  font-size: 0.95rem;
              }
          }
  
          /* Scroll indicator */
          .scroll-indicator {
              position: fixed;
              top: 0;
              left: 0;
              width: 100%;
              height: 3px;
              background: rgba(255, 255, 255, 0.1);
              z-index: 1001;
          }
  
          .scroll-progress {
              height: 100%;
              background: linear-gradient(45deg, #e91e63, #9c27b0, #00bcd4);
              width: 0%;
              transition: width 0.1s ease;
          }
      </style>
  </head>
  <body>
      <div class="scroll-indicator">
          <div class="scroll-progress" id="scrollProgress"></div>
      </div>
  
      <div class="bg-animation">
          <div class="floating-shapes">
              <div class="shape"></div>
              <div class="shape"></div>
              <div class="shape"></div>
          </div>
      </div>
  
      <header>
          <nav>
              <div class="logo">KK</div>
              <ul class="nav-links">
                  <li><a href="#home">Home</a></li>
                  <li><a href="#projects">Projects</a></li>
                  <li><a href="#skills">Skills</a></li>
                  <li><a href="#contact">Contact</a></li>
              </ul>
              <button class="mobile-menu-toggle" aria-label="Toggle mobile menu">☰</button>
          </nav>
      </header>
  
      <main>
          <section class="hero" id="home">
              <img src="profile.png" alt="Kaydon Kilgore" class="profile-image">
              <h1>Kaydon "Itzar" Kilgore</h1>
              <p class="subtitle">Creative Developer & Designer</p>
              
              <div class="social-links">
                  <!-- Social links will be loaded dynamically -->
              </div>
          </section>
  
          <section class="projects" id="projects">
              <h2>Featured Projects</h2>
              <div class="project-grid">
                  <!-- Projects will be loaded dynamically -->
              </div>
          </section>
  
          <section class="skills" id="skills">
              <h2>Skills & Technologies</h2>
              <div class="skill-categories">
                  <!-- Skills will be loaded dynamically -->
              </div>
          </section>
      </main>
  
      <footer id="contact">
          <div class="footer-content">
              <h3>Let's Work Together</h3>
              <p>I'm always open to discussing new opportunities and interesting projects.</p>
              <p>Feel free to reach out if you'd like to collaborate!</p>
              <a href="/cdn-cgi/l/email-protection#b8d1ccc2c0ca96caddd9d4f8dfd5d9d1d496dbd7d5" class="contact-email"><span class="__cf_email__" data-cfemail="0168757b79732f7364606d41666c60686d2f626e6c">[email&#160;protected]</span></a>
              <p style="margin-top: 2rem; color: rgba(255, 255, 255, 0.5);">&copy; 2025 Kaydon Kilgore. All rights reserved.</p>
          </div>
      </footer>
  
      <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script>
          const portfolioConfig = {
              "personal": {
                  "name": "Kaydon \"Itzar\" Kilgore",
                  "title": "Creative Developer & Designer",
                  "description": "I'm a passionate full-stack developer who loves creating beautiful, functional digital experiences. I specialize in modern web technologies and have a keen eye for design.",
                  "email": "itzxr.real@gmail.com",
                  "profileImage": "profile.png",
                  "socialLinks": [
                      {
                          "name": "Email",
                          "icon": "✉️",
                          "url": "mailto:itzxr.real@gmail.com"
                      }
                  ]
              },
  "projects": [
      {
          "title": "Discord Web Link (Under Construction)",
          "emoji": "🔗",
          "tech": "Node.js • Firebase",
          "description": "A web-based chat bridge that allows messages to be sent to and from Discord through a middleman server, bypassing network restrictions. Built with Firebase and a Discord bot.",
          "buttons": [
              {
                  "text": "Link 1",
                  "url": "https://itzar-discord.surge.sh",
                  "primary": true
              },
              {
                  "text": "Link 2",
                  "url": "https://dizzy.itzar.org",
                  "primary": false
              }
          ]
      },
      {
          "title": "Eaglercraft",
          "emoji": "🌐",
          "tech": "HTML • CSS • JavaScript",
          "description": "A browser-hosted version of Eaglercraft, bringing Minecraft gameplay directly to the web with smooth performance and easy access.",
          "buttons": [
              {
                  "text": "Play Now",
                  "url": "https://minecraft.itzar.org",
                  "primary": true
              }
          ]
      },
      {
          "title": "Limbo Keys Shuffle",
          "emoji": "🔑",
          "tech": "HTML • CSS • JavaScript",
          "description": "A website I made when I was around 12. It shuffles 8 keys around and you have to click the right one to win. Based on the Geometry Dash level \"Limbo\" by Mindcap and more.",
          "buttons": [
              {
                  "text": "Try It",
                  "url": "https://limbo.itzar.org",
                  "primary": true
              }
          ]
      }
  ],
  "skills": [
      {
          "category": "Frontend Development",
          "tags": ["HTML", "CSS", "JavaScript"]
      },
      {
          "category": "Backend Development", 
          "tags": ["Node.js", "Firebase", "SQL"]
      }
  ]
          }
  
          // Load portfolio content from config
          function loadPortfolioContent() {
              const { personal, projects, skills } = portfolioConfig;
  
              // Update personal info
              document.querySelector('.profile-image').src = personal.profileImage || 'profile.png';
              document.querySelector('.hero h1').textContent = personal.name;
              document.querySelector('.hero .subtitle').textContent = personal.title;
              document.querySelector('.hero p').textContent = personal.description;
              document.querySelector('.contact-email').textContent = personal.email;
              document.querySelector('.contact-email').href = `mailto:${personal.email}`;
              document.title = `${personal.name} - ${personal.title}`;
  
              // Update social links
              const socialLinksContainer = document.querySelector('.social-links');
              socialLinksContainer.innerHTML = '';
              personal.socialLinks.forEach(link => {
                  const a = document.createElement('a');
                  a.href = link.url;
                  a.title = link.name;
                  a.textContent = link.icon;
                  if (link.url.startsWith('http')) {
                      a.target = '_blank';
                      a.rel = 'noopener noreferrer';
                  }
                  socialLinksContainer.appendChild(a);
              });
  
              // Update projects
              const projectGrid = document.querySelector('.project-grid');
              projectGrid.innerHTML = '';
              projects.forEach(project => {
                  const projectCard = document.createElement('div');
                  projectCard.className = 'project-card';
                  
                  const buttonsHTML = project.buttons.map(button => 
                      `<a href="${button.url}" class="project-link${button.primary ? ' primary' : ''}" target="_blank" rel="noopener noreferrer">${button.text}</a>`
                  ).join('');
  
                  projectCard.innerHTML = `
                      <div class="project-image">${project.emoji}</div>
                      <div class="project-content">
                          <h3 class="project-title">${project.title}</h3>
                          <p class="project-tech">${project.tech}</p>
                          <p class="project-description">${project.description}</p>
                          <div class="project-links">
                              ${buttonsHTML}
                          </div>
                      </div>
                  `;
                  projectGrid.appendChild(projectCard);
              });
  
              // Update skills
              const skillCategories = document.querySelector('.skill-categories');
              skillCategories.innerHTML = '';
              skills.forEach(skillGroup => {
                  const categoryDiv = document.createElement('div');
                  categoryDiv.className = 'skill-category';
                  
                  const tagsHTML = skillGroup.tags.map(tag => 
                      `<span class="skill-tag">${tag}</span>`
                  ).join('');
  
                  categoryDiv.innerHTML = `
                      <h3>${skillGroup.category}</h3>
                      <div class="skill-tags">
                          ${tagsHTML}
                      </div>
                  `;
                  skillCategories.appendChild(categoryDiv);
              });
  
              // Reinitialize event listeners for new elements
              initializeEventListeners();
          }
  
          // Initialize event listeners
          function initializeEventListeners() {
              // Mobile menu toggle
              const mobileMenuToggle = document.querySelector('.mobile-menu-toggle');
              const navLinks = document.querySelector('.nav-links');
              
              if (mobileMenuToggle && navLinks) {
                  mobileMenuToggle.addEventListener('click', function() {
                      navLinks.classList.toggle('active');
                      this.textContent = navLinks.classList.contains('active') ? '✕' : '☰';
                  });
  
                  // Close mobile menu when clicking on a link
                  document.querySelectorAll('.nav-links a').forEach(link => {
                      link.addEventListener('click', function() {
                          navLinks.classList.remove('active');
                          mobileMenuToggle.textContent = '☰';
                      });
                  });
  
                  // Close mobile menu when clicking outside
                  document.addEventListener('click', function(event) {
                      if (!event.target.closest('nav')) {
                          navLinks.classList.remove('active');
                          mobileMenuToggle.textContent = '☰';
                      }
                  });
              }
  
              // Add hover effects to project cards
              document.querySelectorAll('.project-card').forEach(card => {
                  card.addEventListener('mouseenter', function() {
                      this.style.transform = 'translateY(-10px) scale(1.02)';
                  });
                  
                  card.addEventListener('mouseleave', function() {
                      this.style.transform = 'translateY(0) scale(1)';
                  });
              });
  
              // Smooth scrolling for anchor links
              document.querySelectorAll('a[href^="#"]').forEach(anchor => {
                  anchor.addEventListener('click', function (e) {
                      e.preventDefault();
                      const target = document.querySelector(this.getAttribute('href'));
                      if (target) {
                          target.scrollIntoView({
                              behavior: 'smooth',
                              block: 'start'
                          });
                      }
                  });
              });
          }
  
          // Scroll progress indicator
          window.addEventListener('scroll', () => {
              const scrollTop = document.documentElement.scrollTop;
              const scrollHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
              const scrollProgress = (scrollTop / scrollHeight) * 100;
              document.getElementById('scrollProgress').style.width = scrollProgress + '%';
          });
  
          // Add parallax effect to floating shapes
          window.addEventListener('scroll', () => {
              const scrolled = window.pageYOffset;
              const shapes = document.querySelectorAll('.shape');
              shapes.forEach((shape, index) => {
                  const speed = 0.5 + (index * 0.1);
                  shape.style.transform = `translateY(${scrolled * speed}px) rotate(${scrolled * 0.1}deg)`;
              });
          });
  
          // Load content when page loads
          document.addEventListener('DOMContentLoaded', loadPortfolioContent);
      </script>
  </body>
  </html>
endpoints.name: http://itzar.org/favicon.ico
endpoints.html_title: Kaydon Kilgore - Creative Developer
endpoints.supported_versions: HTTP/1.1
endpoints.banner: HTTP/1.1 200 OK
  Date:  <REDACTED>
  Content-Type: text/html; charset=UTF-8
  Transfer-Encoding: chunked
  Connection: keep-alive
  Server: cloudflare
  Surge-Cache: HIT
  Surge-Stamp: 538::1756478061920-177404f5eaf8a146963698246af2a375
  Age: 3375388
  Cache-Control: public, max-age=0, must-revalidate
  Response-Time: 4ms
  Vary: Accept-Encoding
  Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=XwxyDiU%2BqxO7UGjFm6lic0yMkesy2xiuV4MndDFIPORSxMZslR5wzxUdFCBzXGin7vYN0JiV8923DCb5U5bUrD5YZwODL1wVVA%3D%3D"}]}
  Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
  cf-cache-status: DYNAMIC
  Content-Encoding: gzip
  CF-RAY: 98aeadac4a929d52-ORD
  alt-svc: h3=":443"; ma=86400
  
endpoints.ip: 172.67.206.46
[binary data, 6 values, 167 bytes]