* {margin: 0;padding: 0;box-sizing: border-box;}html {scroll-behavior: smooth;}body {font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;background-color: #000000;color: #ffffff;overflow-x: hidden;line-height: 1.6;direction: ltr;}.container {width: 100%;max-width: 1000px;margin: 0 auto;padding: 0 1rem;box-sizing: border-box;}.background-grid {position: fixed;top: 0;left: 0;right: 0;bottom: 0;opacity: 0.2;pointer-events: none;background-image: linear-gradient(rgba(239, 68, 68, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 68, 68, 0.1) 1px, transparent 1px);background-size: 50px 50px;animation: grid-move 20s linear infinite;}.floating-particles {position: fixed;top: 0;left: 0;right: 0;bottom: 0;overflow: hidden;pointer-events: none;}.particle {position: absolute;width: 4px;height: 4px;background-color: #ef4444;border-radius: 50%;opacity: 0.3;animation: float 7s ease-in-out infinite;}.particle:nth-child(1) {left: 10%;top: 20%;animation-delay: 0s;}.particle:nth-child(2) {left: 20%;top: 80%;animation-delay: 0.5s;}.particle:nth-child(3) {left: 30%;top: 40%;animation-delay: 1s;}.particle:nth-child(4) {left: 40%;top: 70%;animation-delay: 1.5s;}.particle:nth-child(5) {left: 50%;top: 30%;animation-delay: 2s;}.particle:nth-child(6) {left: 60%;top: 90%;animation-delay: 0.3s;}.particle:nth-child(7) {left: 70%;top: 10%;animation-delay: 0.8s;}.particle:nth-child(8) {left: 80%;top: 60%;animation-delay: 1.3s;}.particle:nth-child(9) {left: 90%;top: 35%;animation-delay: 1.8s;}.particle:nth-child(10) {left: 15%;top: 55%;animation-delay: 0.2s;}.particle:nth-child(11) {left: 25%;top: 15%;animation-delay: 0.7s;}.particle:nth-child(12) {left: 35%;top: 85%;animation-delay: 1.2s;}.particle:nth-child(13) {left: 45%;top: 25%;animation-delay: 1.7s;}.particle:nth-child(14) {left: 55%;top: 75%;animation-delay: 0.1s;}.particle:nth-child(15) {left: 65%;top: 45%;animation-delay: 0.6s;}.particle:nth-child(16) {left: 75%;top: 95%;animation-delay: 1.1s;}.particle:nth-child(17) {left: 85%;top: 5%;animation-delay: 1.6s;}.particle:nth-child(18) {left: 95%;top: 65%;animation-delay: 0.4s;}.particle:nth-child(19) {left: 5%;top: 50%;animation-delay: 0.9s;}.particle:nth-child(20) {left: 12%;top: 88%;animation-delay: 1.4s;}.navbar {position: fixed;top: 0;left: 0;right: 0;z-index: 50;background-color: rgba(0, 0, 0, 0.8);backdrop-filter: blur(12px);border-bottom: 1px solid rgba(185, 28, 28, 0.3);}.nav-container {display: flex;justify-content: space-between;align-items: center;height: 64px;max-width: 1280px;margin: 0 auto;padding: 0 1.6rem;}.nav-brand {display: flex;align-items: center;gap: 0.5rem;}.icon {width: 32px;height: 32px;background: linear-gradient(to right, #dc2626, #ef4444);border-radius: 4px;display: flex;align-items: center;justify-content: center;color: white;font-size: 16px;}.logo {font-size: 1.25rem;font-weight: bold;background: linear-gradient(to right, #ef4444, #f87171);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;}.nav-menu {display: flex;align-items: center;gap: 2rem;}.nav-link {color: #d1d5db;text-decoration: none;position: relative;padding: 0.5rem 0;transition: color 0.3s ease;display: flex;align-items: center;gap: 0.5rem;}.nav-link:hover {color: #fca5a5;}.nav-link.active {color: #f87171;}.nav-underline {position: absolute;bottom: -4px;left: 0;height: 2px;background-color: #f87171;transition: width 0.3s ease;width: 0;}.nav-link:hover .nav-underline, .nav-link.active .nav-underline {width: 100%;}.mobile-menu-checkbox {display: none;}.mobile-menu-btn .close-icon {display: none;}.mobile-menu-checkbox:checked + .mobile-menu-btn .menu-icon {display: none;}.mobile-menu-checkbox:checked + .mobile-menu-btn .close-icon {display: block;position: relative;left: 9.5rem;}.mobile-menu {display: none;background-color: rgba(0, 0, 0, 0.95);backdrop-filter: blur(12px);border-bottom: 1px solid rgba(185, 28, 28, 0.3);position: relative;left: -13rem;bottom: 14px;z-index: -1;}.mobile-menu-checkbox:checked ~ .mobile-menu {display: block;}.mobile-menu-content {padding: 1rem;display: flex;flex-direction: column;gap: 2rem;position: relative;top: 12rem;right: -1rem;background-color: #000000;font-size: 15px;width: 26rem;}.mobile-menu-btn {display: none;}.mobile-nav-link {color: #d1d5db;text-decoration: none;padding: 0.5rem 1rem;border-radius: 0.5rem;transition: all 0.3s ease;display: flex;align-items: center;gap: 0.5rem;border-bottom: 1px solid #ef4444;padding-right: 2rem;}.mobile-nav-link:hover {color: #fca5a5;background-color: rgba(239, 68, 68, 0.05);}.section {min-height: 100vh;padding: 12rem 1rem;}.home-section {justify-content: center;text-align: center;}.hero-content {max-width: 64rem;margin: 0 auto;position: relative;bottom: 5rem;}.hero-heading {margin-bottom: 2rem;}.typing-text {font-size: 30px;font-weight: 600;min-width: 280px;}.typing-text span {position: relative;}.typing-text span::before {content: "Jr Penetration Tester";color: #ef4444;animation: words 5s infinite;}.typing-text span::after {content: "";position: absolute;height: 100%;animation: cursor 0.5s infinite;}@keyframes cursor {to {border-left: 5px solid #ef4444;margin-left: 10px;margin-top: 5px;}}@keyframes words {0%, 20% {content: "Bug Hunter";}21%, 40% {content: "CTF Player";}}.main-title {font-size: clamp(2.5rem, 8vw, 4.5rem);margin-bottom: 1rem;}.title-normal {color: #f3f4f6;}.title-highlight {background: linear-gradient(to right, #ef4444, #f87171);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;position: relative;}.hero-subtitle {margin-bottom: 3rem;}.text-normal {color: #e5e7eb;}.terminal-container {margin-bottom: 4rem;}.terminal {background-color: rgba(17, 24, 39, 0.5);backdrop-filter: blur(4px);border: 1px solid rgba(185, 28, 28, 0.3);border-radius: 0.5rem;padding: 1.5rem;max-width: 32rem;margin: 0 auto;}.terminal-header {display: flex;align-items: center;margin-bottom: 1rem;}.terminal-buttons {display: flex;gap: 0.5rem;}.terminal-btn {width: 12px;height: 12px;border-radius: 50%;}.terminal-btn.red {background-color: #ef4444;}.terminal-btn.yellow {background-color: #eab308;}.terminal-btn.green {background-color: #22c55e;}.terminal-title {margin-left: 1rem;color: #9ca3af;font-size: 0.875rem;display: flex;align-items: center;gap: 0.5rem;}.terminal-content {font-family: "Courier New", monospace;font-size: clamp(1rem, 2.5vw, 1.25rem);text-align: left;}.prompt {color: #f87171;}.terminal-text {color: #22c55e;}@keyframes slideText {0% {width: 0;opacity: 0;}10% {width: 100%;opacity: 1;}70% {width: 100%;opacity: 1;}100% {width: 0;opacity: 0;}}.typing {display: block;white-space: nowrap;animation: slideText 4s linear infinite;border-right: 3px solid #22c55e;}.social-links {display: flex;justify-content: center;gap: 1.5rem;}.social-btn {width: 64px;height: 64px;border-radius: 50%;border: 2px solid rgba(239, 68, 68, 0.3);background-color: rgba(239, 68, 68, 0.1);color: #f87171;text-decoration: none;transition: all 0.3s ease;display: flex;align-items: center;justify-content: center;font-size: 1.5rem;}.social-btn:hover {background-color: rgba(239, 68, 68, 0.2);color: #fca5a5;border-color: rgba(248, 113, 113, 0.5);transform: translateY(-2px);}.skills-section {padding: 5rem 1rem;}.section-header {text-align: center;margin-bottom: 4rem;}.section-badge {display: inline-flex;align-items: center;gap: 0.5rem;background-color: rgba(239, 68, 68, 0.1);color: #f87171;border: 1px solid rgba(239, 68, 68, 0.3);padding: 0.5rem 1rem;border-radius: 9999px;font-size: 0.875rem;margin-bottom: 1rem;position: relative;top: -2rem;}.section-title {font-size: clamp(2rem, 6vw, 3rem);font-weight: bold;color: white;margin-bottom: 1rem;}.section-description {font-size: 1.125rem;color: #9ca3af;max-width: 32rem;margin: 0 auto;}.skills-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));gap: 2rem;margin-bottom: 4rem;}.skill-card {background-color: rgba(17, 24, 39, 0.5);border: 1px solid rgba(185, 28, 28, 0.3);border-radius: 0.5rem;padding: 2rem;text-align: center;transition: all 0.3s ease;cursor: pointer;}.skill-card:hover {border-color: rgba(239, 68, 68, 0.5);transform: translateY(-4px);}.skill-icon {width: 64px;height: 64px;background: linear-gradient(to right, #dc2626, #ef4444);border-radius: 0.5rem;display: flex;align-items: center;justify-content: center;margin: 0 auto 1rem;color: white;transition: transform 0.3s ease;font-size: 2rem;}.skill-card:hover .skill-icon {transform: scale(1.1);}.skill-title {font-size: 1.25rem;color: white;margin-bottom: 0.5rem;}.skill-description {color: #9ca3af;}.experience-section {background-color: rgba(17, 24, 39, 0.2);padding: 5rem 1rem;}.experience-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));gap: 2rem;max-width: 96rem;margin: 0 auto;}.experience-card {background-color: rgba(17, 24, 39, 0.5);border: 1px solid rgba(185, 28, 28, 0.3);border-radius: 0.5rem;padding: 2rem;text-align: center;transition: all 0.3s ease;}.experience-card:hover {border-color: rgba(239, 68, 68, 0.5);transform: translateY(-4px);}.experience-icon {width: 64px;height: 64px;border-radius: 0.5rem;display: flex;align-items: center;justify-content: center;margin: 0 auto 1rem;color: white;transition: transform 0.3s ease;font-size: 2rem;}.experience-icon.github {background: linear-gradient(to right, #374151, #4b5563);}.experience-icon.hackerone {background: linear-gradient(to right, #059669, #10b981);}.experience-icon.cybertalents {background: linear-gradient(to right, #7c3aed, #8b5cf6);}.experience-card:hover .experience-icon {transform: scale(1.1);}.experience-title {font-size: 1.25rem;color: white;margin-bottom: 0.5rem;}.experience-description {color: #9ca3af;margin-bottom: 1rem;}.experience-btn {display: inline-flex;align-items: center;gap: 0.5rem;background: transparent;border: 1px solid rgba(239, 68, 68, 0.3);color: #f87171;padding: 0.5rem 1rem;border-radius: 0.25rem;text-decoration: none;transition: all 0.3s ease;}.experience-btn:hover {background-color: rgba(239, 68, 68, 0.1);}.contact-section {padding: 5rem 1rem;}.contact-form-container {max-width: 32rem;margin: 0 auto;}.contact-card {background-color: rgba(17, 24, 39, 0.5);border: 1px solid rgba(185, 28, 28, 0.3);border-radius: 0.5rem;padding: 2rem;}.contact-header {text-align: center;margin-bottom: 2rem;}.contact-title {font-size: 1.5rem;color: white;margin-bottom: 0.5rem;display: flex;align-items: center;justify-content: center;gap: 0.5rem;}.contact-subtitle {color: #9ca3af;}.contact-form {display: flex;flex-direction: column;gap: 1.5rem;}.form-row {display: grid;grid-template-columns: 1fr 1fr;gap: 1rem;}.form-group {display: flex;flex-direction: column;gap: 0.5rem;}.form-group label {font-size: 0.875rem;font-weight: 500;color: #d1d5db;display: flex;align-items: center;gap: 0.5rem;}.form-group input, .form-group textarea {width: 100%;padding: 0.75rem 1rem;background-color: rgba(31, 41, 55, 0.5);border: 1px solid rgba(185, 28, 28, 0.3);border-radius: 0.5rem;color: white;transition: border-color 0.3s ease;}.form-group input::placeholder, .form-group textarea::placeholder {color: #6b7280;}.form-group input:focus, .form-group textarea:focus {outline: none;border-color: rgba(239, 68, 68, 0.5);box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.5);}.form-group textarea {resize: none;}.submit-btn {width: 100%;background: linear-gradient(to right, #dc2626, #ef4444);color: white;border: none;padding: 0.75rem 1rem;border-radius: 0.5rem;font-size: 1.125rem;font-weight: 500;cursor: pointer;transition: all 0.3s ease;display: flex;align-items: center;justify-content: center;gap: 0.5rem;}.submit-btn:hover {background: linear-gradient(to right, #b91c1c, #dc2626);transform: translateY(-1px);}.footer {background-color: rgba(17, 24, 39, 0.5);border-top: 1px solid rgba(185, 28, 28, 0.3);padding: 2rem 1rem;}.footer-content {display: flex;flex-direction: column;align-items: center;gap: 1rem;max-width: 1280px;margin: 0 auto;}.footer-brand {display: flex;align-items: center;gap: 0.5rem;}.footer-text {color: #9ca3af;display: flex;align-items: center;gap: 0.5rem;}@media (max-width: 768px) {.nav-menu {display: none;}.mobile-menu-btn {display: block;}.form-row {grid-template-columns: 1fr;}#form-message {font-size: 20px;margin-top: 20px;margin-left: 2rem;}.footer-content {flex-direction: column;text-align: center;}.skills-grid {grid-template-columns: 1fr;}.experience-grid {grid-template-columns: 1fr;}.social-links {gap: 1rem;}.social-btn {width: 56px;height: 56px;font-size: 1.25rem;}.typing-text {font-size: 20px;font-weight: 600;min-width: 280px;}}@media (min-width: 768px) {.footer-content {flex-direction: row;justify-content: space-between;}}@media (max-width: 768px) {.mobile-menu-content {width: 25.8rem;}.section-header {margin-top: -6rem;}}@media (min-width: 768px) and (max-width: 1025px) {.hero-content {margin-top: 10rem;}.mobile-menu-content {width: 30rem;right: -14rem;}.mobile-menu-checkbox:checked + .mobile-menu-btn .menu-icon {position: relative;right: 2rem;}.mobile-menu-checkbox:checked + .mobile-menu-btn .close-icon {left: 30.2rem;}}@media (min-width: 412px) and (max-width: 914px) {.hero-content {margin-top: 13rem;}.mobile-menu-content {width: 25.8rem;}.section-header {margin-top: -2rem;}}.contact-form-container {max-width: 60rem;}}@media (min-width: 390px) and (max-width: 844px) {.mobile-menu-content {width: 25.3rem;}}@media (min-width: 375px) and (max-width: 812px) {.mobile-menu-content {width: 24.3rem;}}@media (min-width: 360px) and (max-width: 700px) {.mobile-menu-content {width: 23.5rem;}}
