.gear-container{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.gear{opacity:.12;width:100%;height:100%;animation:60s linear infinite gear-spin}.gear-svg{width:100%;height:100%;position:absolute;top:50%;left:50%;overflow:visible;transform:translate(-50%,-50%)}.gear-outline{fill:none;stroke:var(--color-teal);stroke-width:8px;stroke-linejoin:round;stroke-linecap:round}@keyframes gear-spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@media (prefers-reduced-motion:reduce){.gear{animation:none}}
.gear-background{z-index:1;aspect-ratio:1;pointer-events:none;width:min(72vw,70rem);position:fixed;top:50%;right:-8%;transform:translateY(-50%)}.gear-circle{-webkit-backdrop-filter:blur(var(--glass-blur));border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.gear-circle-back{background:var(--glass-05);width:100%;height:100%}.gear-circle-front{background:var(--glass-15);width:84%;height:84%}
.about{z-index:3;width:100%;padding-top:calc(var(--navbar-height) + clamp(3rem, 8vw, 7rem));position:relative}.about-label,.about h1{margin-left:clamp(2rem,6vw,6rem);margin-right:clamp(2rem,6vw,6rem)}.about-label{width:auto;color:var(--color-black);letter-spacing:.04em;justify-content:center;align-items:center;margin-bottom:clamp(2rem,4vw,3.5rem);font-size:clamp(.75rem,1.25vw,1.3rem);font-weight:700;display:flex}.about-label-text{white-space:nowrap;align-items:center;gap:clamp(.5rem,1vw,1rem);display:flex}.about-label-dot{color:var(--color-orange)}.about-label-line{background:linear-gradient(to right, transparent, var(--color-teal));border-radius:var(--radius-pill);flex:1;min-width:clamp(2rem,5vw,6rem);max-width:clamp(4rem,12vw,12rem);height:2px}.about-label-line:last-child{background:linear-gradient(to left, transparent, var(--color-teal))}.about h1{max-width:11ch;color:var(--color-black);letter-spacing:-.055em;margin-top:0;margin-bottom:0;font-size:clamp(3.5rem,7vw,7rem);font-weight:700;line-height:.92}.about h1 span{color:var(--color-orange)}.tools-crawler{border-top:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border);background:var(--glass-05);width:100%;margin-top:clamp(1.5rem,2vw,2rem);overflow:hidden}.tools-track{width:max-content;padding:1rem 0;animation:35s linear infinite tools-scroll;display:flex}.tools-item{color:var(--color-black);letter-spacing:.08em;white-space:nowrap;font-size:clamp(.75rem,1vw,1rem);font-weight:700}.tools-dot{color:var(--color-orange);margin:0 clamp(1.5rem,3vw,3rem)}@keyframes tools-scroll{to{transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.tools-track{animation:none}}@media (max-width:768px){.about{padding-top:calc(var(--navbar-height) + 1.5rem)}.about-label,.about h1{margin-left:1rem;margin-right:1rem}.about-label{margin-bottom:1.5rem;font-size:clamp(.6rem,2.1vw,.8rem)}.about-label-text{white-space:normal;text-align:center;gap:.35rem}.about-label-line{min-width:1.5rem;max-width:3rem}.about h1{max-width:none;font-size:clamp(3rem,13vw,5rem)}.tools-crawler{margin-top:1.5rem}}
.about-me{z-index:3;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:clamp(3rem,7vw,8rem);width:100%;padding:1rem clamp(2rem,6vw,6rem) clamp(2rem,4vw,4rem);display:grid;position:relative}.about-me-image{border-radius:var(--radius-lg);width:100%;max-width:36rem;overflow:hidden}.about-me-image img{object-fit:cover;width:100%;height:auto;display:block}.about-me-content{max-width:38rem}.about-me-label{color:var(--color-orange);letter-spacing:.12em;text-transform:uppercase;margin:clamp(2rem,6vw,6rem) 0 clamp(1rem,2vw,1.5rem);font-size:clamp(1.75rem,3vw,3rem);font-weight:700}.about-me-intro{color:var(--color-black);letter-spacing:-.02em;margin:0;font-size:clamp(1.3rem,2.2vw,2rem);font-weight:500;line-height:1.45}@media (max-width:768px){.about-me{grid-template-columns:1fr;align-items:start;gap:2rem;padding:0 1.5rem 3rem}.about-me-image,.about-me-content{max-width:100%}.about-me-intro{font-size:clamp(1.15rem,5vw,1.5rem)}}
.project-card{border:1px solid var(--glass-border);background:var(--glass-05);transition:transform var(--transition-normal), border-color var(--transition-normal);overflow:hidden}.project-card:hover{border-color:var(--glass-30);transform:translateY(-4px)}.project-image{aspect-ratio:16/10;background:#fff0;width:100%;position:relative;overflow:hidden}.project-image img{object-fit:cover;transition:transform .5s}.project-card:hover .project-image img{transform:scale(1.03)}.project-card-content{padding:var(--space-lg)}.project-meta{color:var(--color-teal);letter-spacing:.12em;margin-bottom:.75rem;font-size:.7rem;font-weight:700}.project-card h3{color:var(--color-text);margin:0;font-size:clamp(1.4rem,2.5vw,2rem);line-height:1}.project-card p{color:var(--color-text-muted);margin:1rem 0;line-height:1.6}.project-tools{color:var(--color-steel);font-size:.75rem;font-weight:600}.project-view{color:var(--color-orange);letter-spacing:.1em;margin-top:1.5rem;font-size:.7rem;font-weight:700;display:inline-block}.project-card[data-project=tech-fair] .project-image{background:#fff0}.project-card[data-project=tech-fair] .project-image img{object-fit:contain}@media (max-width:480px){.project-card-content{padding:var(--space-md)}}
.project-modal-overlay{z-index:99999;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);isolation:isolate;background:#071524c7;justify-content:center;align-items:center;width:100vw;height:100vh;padding:2rem;display:flex;position:fixed;inset:0}.project-modal{z-index:100000;border:1px solid var(--glass-border);border-radius:var(--radius-lg);background:var(--color-background);width:min(900px,100%);max-height:90vh;position:relative;overflow-y:auto}.project-modal-close{z-index:2;border:1px solid var(--glass-border);width:2.5rem;height:2.5rem;color:var(--color-text);background:var(--color-background);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;line-height:1;display:flex;position:absolute;top:1rem;right:1rem}.project-modal-content{padding:clamp(1.5rem,4vw,3rem)}.project-modal-header span{color:var(--color-teal);letter-spacing:.12em;font-size:.7rem;font-weight:700}.project-modal-header h2{color:var(--color-text);margin:.5rem 0 2rem;font-size:clamp(2rem,5vw,4rem);line-height:.95}.project-modal-content>p{color:var(--color-text-muted);margin:2rem 0 1rem;font-size:1rem;line-height:1.7}.project-modal-tools{color:var(--color-teal);font-size:.8rem;font-weight:700}body:has(.project-modal-overlay){overflow:hidden}@media (max-width:600px){.project-modal-overlay{padding:1rem}.project-modal-content{padding:1.25rem}.project-modal-close{top:.75rem;right:.75rem}}
.project-modal-image{border-radius:var(--radius-md);background:var(--color-dark);justify-content:center;align-items:center;width:100%;display:flex}.project-modal-image img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:65vh;display:block}.project-modal-video{border-radius:var(--radius-md);background:var(--color-dark);object-fit:contain;width:100%;max-width:100%;height:auto;max-height:65vh;margin:0 auto;display:block}.project-modal-media{flex-direction:column;align-items:center;gap:1.5rem;width:100%;display:flex}.project-modal-media-item{border-radius:var(--radius-md);background:var(--color-dark);justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.project-modal-media-video{object-fit:contain;width:100%;max-width:100%;height:auto;max-height:65vh;display:block}.project-modal-natural-image{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:65vh;display:block}.project-modal-gallery{flex-direction:column;align-items:center;gap:1.25rem;width:100%;display:flex}.project-modal-gallery-item{border:1px solid var(--glass-border);border-radius:var(--radius-md);background:var(--color-dark);justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.project-modal-gallery-item img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:65vh;display:block}
.projects{z-index:2;width:min(var(--container-width), calc(100% - 3rem));padding:var(--space-2xl) 0;margin:0 auto;position:relative}.projects-header{margin-bottom:var(--space-xl)}.projects-eyebrow{color:var(--color-teal);letter-spacing:.15em;align-items:center;gap:.75rem;margin-bottom:1.25rem;font-size:.7rem;font-weight:700;display:flex}.projects-eyebrow span{background:var(--color-teal);width:2rem;height:2px}.projects h2{color:var(--color-text);letter-spacing:-.06em;margin:0;font-size:clamp(4rem,9vw,8rem);line-height:.85}.projects h2 span{color:var(--color-orange)}.projects-filters{border-bottom:1px solid var(--glass-border);scrollbar-width:none;align-items:center;gap:.6rem;width:100%;margin-top:2.5rem;padding-bottom:1rem;display:flex;overflow-x:auto}.projects-filters::-webkit-scrollbar{display:none}.projects-filters button{border:1px solid var(--glass-border);border-radius:var(--radius-pill);color:var(--color-text-muted);font:inherit;letter-spacing:.08em;cursor:pointer;transition:color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);background:0 0;flex-shrink:0;padding:.65rem 1rem;font-size:.65rem;font-weight:700}.projects-filters button:hover{color:var(--color-text);border-color:var(--color-teal)}.projects-filters button.active{color:var(--color-white);background:var(--color-orange);border-color:var(--color-orange)}.projects-grid{gap:var(--space-lg);grid-template-columns:repeat(3,1fr);display:grid}@media (max-width:800px){.projects{width:calc(100% - 2rem)}.projects h2{font-size:clamp(3.5rem,16vw,6rem)}.projects-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.projects{width:calc(100% - 1.5rem)}.projects-filters{margin-top:2rem}.projects-grid{grid-template-columns:1fr}}
.skills{z-index:3;width:100%;padding:var(--space-2xl) clamp(1.5rem, 6vw, 6rem);position:relative}.skills-header{text-align:center;margin-bottom:clamp(2.5rem,5vw,4rem)}.skills-header h2{color:var(--color-deep-teal);letter-spacing:-.05em;margin:0;font-size:clamp(2.5rem,5vw,4.5rem);font-weight:700}.skills-header h2 span{color:var(--color-teal)}.skills-filters{flex-wrap:wrap;justify-content:center;gap:clamp(.25rem,1vw,.75rem);margin-top:2rem;display:flex}.skills-filters button{border-radius:var(--radius-pill);color:var(--color-charcoal);font:inherit;letter-spacing:.04em;cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:0;padding:.7rem 1.2rem;font-size:.8rem;font-weight:700}.skills-filters button:hover{color:var(--color-teal)}.skills-filters button.active{background:var(--color-orange);color:var(--color-white)}.skills-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;width:min(100%,105rem);margin:0 auto;display:grid}.skill-card{border:1px solid var(--glass-border);border-radius:var(--radius-md);min-height:7.5rem;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));transition:transform var(--transition-normal), border-color var(--transition-normal), box-shadow var(--transition-normal);background:#ffffffb8;padding:1.6rem 1.4rem 1.3rem;position:relative;box-shadow:0 8px 30px #305b7e0a}.skill-card:hover{border-color:var(--color-teal-light);transform:translateY(-3px);box-shadow:0 12px 35px #305b7e17}.skill-card h3{color:var(--color-charcoal);margin:0;font-size:clamp(.85rem,1vw,1rem);font-weight:700;line-height:1.3}.skill-progress{border-radius:var(--radius-pill);background:var(--glass-15);width:55%;height:6px;margin-top:1.2rem;overflow:hidden}.skill-progress span{border-radius:inherit;background:var(--color-teal);height:100%;display:block}.skill-level{color:var(--color-steel);font-size:.8rem;font-weight:600;position:absolute;bottom:1.2rem;right:1.4rem}@media (max-width:900px){.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:600px){.skills{padding:var(--space-xl) 1rem}.skills-header{margin-bottom:2rem}.skills-header h2{font-size:clamp(2.2rem,10vw,3rem)}.skills-filters{gap:.25rem;margin-top:1.5rem}.skills-filters button{padding:.6rem .9rem;font-size:.7rem}.skills-grid{grid-template-columns:1fr}}
.contact-page{z-index:3;width:100%;min-height:100vh;color:var(--color-black);background:var(--color-background);position:relative}.contact-hero{z-index:3;background:var(--gradient-ocean);width:100%;padding:clamp(5rem,9vw,8rem) clamp(1.5rem,7vw,7rem) clamp(4rem,7vw,6rem);position:relative}.contact-hero-inner{width:min(1100px,100%);margin:0 auto}.contact-eyebrow{color:var(--color-teal-light);letter-spacing:.15em;align-items:center;gap:.75rem;margin-bottom:clamp(1.5rem,3vw,2.5rem);font-size:.75rem;font-weight:700;display:flex}.contact-eyebrow span{background:var(--color-teal-light);width:2.5rem;height:2px}.contact-hero h1{color:var(--color-white);letter-spacing:-.06em;margin:0;font-size:clamp(4rem,10vw,9rem);font-weight:700;line-height:.88}.contact-hero h1 span{color:var(--color-peach)}.contact-hero p{color:#ffffffbf;width:min(42rem,100%);margin:clamp(2rem,4vw,3rem) 0 0;font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.6}.contact-content{z-index:3;width:min(1200px,100%);margin:0 auto;padding:clamp(4rem,8vw,8rem) clamp(1.5rem,5vw,4rem);position:relative}.contact-main{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:stretch;gap:clamp(3rem,8vw,8rem);display:grid}.contact-info{min-width:0}.contact-section-label{color:var(--color-teal);letter-spacing:.15em;align-items:center;gap:.75rem;margin-bottom:2rem;font-size:.75rem;font-weight:700;display:flex}.contact-section-label span{background:var(--color-teal);width:2rem;height:2px}.contact-details{flex-direction:column;display:flex}.contact-detail{border-bottom:1px solid var(--glass-border);color:inherit;align-items:center;gap:1rem;padding:1.4rem 0;text-decoration:none;display:flex}.contact-icon{border:1px solid var(--glass-border);border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:3rem;height:3rem;font-size:1rem;display:flex}.contact-icon-email{color:#ea4335}.contact-icon-linkedin{color:#0a66c2}.contact-icon-github{color:#181717}.contact-icon-whatsapp{color:#25d366}.contact-detail h3{color:var(--color-steel);letter-spacing:.12em;margin:0 0 .35rem;font-size:.7rem;font-weight:700}.contact-detail p{color:var(--color-charcoal);margin:0;font-size:.95rem;font-weight:600}.contact-note{border-top:1px solid var(--glass-border);margin-top:clamp(4rem,7vw,6rem);padding-top:clamp(1rem,1vw,1rem)}.contact-note h3{color:var(--color-orange);letter-spacing:.12em;margin:0 0 1.25rem;font-size:2.75rem;font-weight:700}.contact-note p{max-width:60rem;color:var(--color-steel);letter-spacing:-.025em;margin:0;font-size:clamp(1.5rem,2.8vw,2.4rem);font-weight:500;line-height:1.3}@media (max-width:800px){.contact-hero{padding-top:4rem;padding-bottom:4rem}.contact-hero h1{font-size:clamp(3.5rem,16vw,6rem)}.contact-main{grid-template-columns:1fr;gap:3rem}.contact-note{margin-top:3rem}.contact-note p{font-size:clamp(1.4rem,6vw,1.8rem)}}@media (max-width:480px){.contact-hero,.contact-content{padding-left:1rem;padding-right:1rem}}
.contact-form-wrapper{z-index:4;border:1px solid var(--glass-border);border-radius:var(--radius-lg);background:var(--glass-05);padding:clamp(1.5rem,4vw,3rem);position:relative}.contact-form-heading{align-items:center;gap:1rem;margin-bottom:2.5rem;display:flex}.contact-form-heading span{color:var(--color-orange);font-size:.75rem;font-weight:700}.contact-form-heading h2{color:var(--color-black);letter-spacing:-.03em;margin:0;font-size:clamp(1.3rem,2vw,2rem);font-weight:700}.contact-form{flex-direction:column;gap:1.5rem;display:flex}.form-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.contact-form label{color:var(--color-steel);letter-spacing:.1em;flex-direction:column;gap:.5rem;font-size:.7rem;font-weight:700;display:flex}.contact-form input,.contact-form textarea{border:1px solid var(--glass-border);border-radius:var(--radius-sm);width:100%;color:var(--color-black);background:var(--color-white);font:inherit;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:1rem;font-size:.9rem}.contact-form textarea{resize:vertical;min-height:10rem}.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--color-steel);opacity:.6}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--color-teal);box-shadow:0 0 0 3px var(--glass-05)}.contact-form button{border-radius:var(--radius-sm);color:var(--color-white);background:var(--color-primary-dark);font:inherit;letter-spacing:.1em;cursor:pointer;transition:background var(--transition-fast), transform var(--transition-fast);border:0;justify-content:center;align-items:center;gap:.75rem;padding:1rem 1.5rem;font-size:.75rem;font-weight:700;display:flex}.contact-form button:hover{background:var(--color-teal);transform:translateY(-2px)}.contact-form button span{color:var(--color-peach);font-size:1rem}@media (max-width:800px){.form-row{grid-template-columns:1fr}}@media (max-width:480px){.contact-form-wrapper{padding:1.25rem}}