:root{--bg-color:#111416;--bg-color-hover:#3e4143;--accent:#e0ff4f;--card-bg-color:#252b30;--radius:30px;--text-color:#dededf;--text-dim:#aaa}*{box-sizing:border-box;scroll-behavior:smooth;margin:0;padding:0}body{background-color:var(--bg-color)}*{font-family:Sen,sans-serif}.hero{grid-template:"large photo box1""large photo box2""about about about"/1fr 1fr 1fr;gap:1.25rem;width:100%;max-width:1300px;margin:0 auto;padding:2rem 2rem .8rem;display:grid}@media (width<=700px){.hero{grid-template-columns:1fr;grid-template-areas:"photo""box1""box2""large""about"}}.large-hero-box{background-color:var(--card-bg-color);grid-area:large}.picture-block{border-radius:var(--radius);aspect-ratio:3/4;grid-area:photo;position:relative;overflow:hidden}.headShotImage{object-fit:cover;z-index:0;width:100%;height:100%;position:absolute;inset:0}.hero-info{z-index:2;background:linear-gradient(#0000 0%,#0006 25%,#000000d9 100%);padding:1.5rem;position:absolute;bottom:0;left:0;right:0}.desc-hero-text{color:var(--text-color);font-size:clamp(1.1rem,1.25vw,2rem);display:block}.main-hero-text{color:var(--accent);overflow-wrap:break-word;font-size:clamp(1.6rem,2.5vw,2.25rem);font-weight:700;display:block}.large-hero-box{color:var(--text-color);flex-direction:column;justify-content:space-evenly;align-items:center;display:flex}.hero-socials-header{color:var(--text-color);text-align:center;justify-content:center;align-items:center;margin-bottom:.4rem;font-size:clamp(1.2rem,1.2vw,1.8rem);font-weight:600;display:flex}.hero-socials{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.social-pill{color:var(--text-color);border:1px solid #e0ff4f4d;border-radius:999px;align-items:center;gap:.4rem;padding:.4rem .8rem;font-size:.8rem;text-decoration:none;transition:border-color .25s,color .25s;display:inline-flex}.social-pill:hover{border-color:var(--accent);color:var(--accent)}@media (width<=700px){.social-pill{gap:.3rem;padding:.35rem .65rem;font-size:.75rem}.hero-socials{gap:.4rem}}.large-hero-line{background:#e0ff4f59;border:none;width:60%;height:2px;margin:.5rem 0}.hero-status{color:var(--text-color);font-size:clamp(1rem,1vw,1.5rem)}.status-subject{color:var(--accent);-webkit-text-decoration:underline var(--accent);text-decoration:underline var(--accent)}.hero-box-1{background-color:var(--card-bg-color);grid-area:box1}.hero-box-2{background-color:var(--card-bg-color);grid-area:box2}.hero-box-1,.hero-box-2{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;display:flex}.badge-icon{color:var(--accent)}.badge-title{color:var(--text-color);font-size:clamp(1.2rem,1.5vw,2rem);font-weight:600}.badge-sub{color:var(--text-color);font-size:clamp(1rem,1vw,1.5rem)}.about-bar{background-color:var(--card-bg-color);border-radius:var(--radius);width:100%;color:var(--text-color);grid-area:about;padding:1.5rem;transition:transform .3s,outline-color .3s}.about-title{margin-bottom:.6rem;font-size:clamp(1.5rem,1.5vw,2rem);font-weight:600;display:block}.about-text{color:var(--text-dim);font-size:clamp(1rem,1vw,1.4rem);display:block}.large-hero-box,.hero-box-1,.hero-box-2{border-radius:var(--radius);outline-offset:-2px;outline:2px solid #0000;padding:1.5rem;transition:transform .3s,outline-color .3s}.large-hero-box:hover,.hero-box-1:hover,.hero-box-2:hover{outline-color:var(--accent);transform:scale(1.04)}.projects{width:100%;max-width:1300px;margin:0 auto;padding:.8rem 2rem}.projects-header{color:var(--text-color);margin-bottom:.8rem;font-size:clamp(1.5rem,1.5vw,2rem);font-weight:600;display:block}.projects-grid{grid-template-columns:repeat(4,1fr);gap:1.5rem;display:grid}@media (width<=900px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.projects-grid{grid-template-columns:1fr}}.projects-grid-item.featured{outline-color:var(--accent);outline-offset:-2px;box-shadow:0 8px 24px #e0ff4f26}.projects-grid-item{background-color:var(--card-bg-color);border-radius:var(--radius);outline:2px solid #0000;grid-template-rows:auto auto auto auto 1fr;padding:1.4rem;transition:transform .3s,outline-color .3s;display:grid;position:relative;overflow:hidden}.projects-grid-item:hover{transform:scale(1.02)}.featured-badge{z-index:2;background:var(--accent);color:#111;text-transform:uppercase;letter-spacing:.05em;border-radius:999px;padding:.3rem .6rem;font-size:.7rem;font-weight:700;position:absolute;top:.75rem;left:.75rem}.projects-item-image{aspect-ratio:16/10;object-fit:cover;border-radius:var(--radius);width:100%;margin-bottom:.4rem}.projects-item-title{color:var(--text-color);margin-top:.15rem;margin-bottom:.35rem;font-weight:700}.project-item-status{color:#e0ff4f99;letter-spacing:.05em;margin-top:-.2rem;margin-bottom:.4rem;font-size:.7rem}.projects-item-description{-webkit-line-clamp:3;color:var(--text-dim);-webkit-box-orient:vertical;min-height:3.6em;line-height:1.2;display:-webkit-box;overflow:hidden}.projects-pills-section{scrollbar-color:var(--accent) var(--card-bg-color);scrollbar-width:thin;flex-wrap:nowrap;justify-content:flex-start;gap:.6rem;padding:.6rem 0;display:flex;overflow:auto hidden}.projects-item-pill{color:var(--text-color);white-space:nowrap;border:1px solid #e0ff4f4d;border-radius:999px;align-items:center;gap:.4rem;padding:.4rem .8rem;font-size:.8rem;text-decoration:none;transition:border-color .25s,color .25s;display:inline-flex}.projects-item-pill:hover{border-color:var(--accent);color:var(--accent)}.projects-links{gap:.75rem;margin-top:auto;padding-top:.4rem;display:flex}@media (width<=480px){.projects-links{flex-direction:column}}.projects-repo-link,.projects-live-link{text-align:center;border-radius:6px;flex:1;justify-content:center;align-items:center;padding:.5rem 1rem;font-size:.85rem;font-weight:600;text-decoration:none;transition:border .3s;display:flex}.projects-repo-link:hover{border-color:var(--accent);color:var(--accent)}.projects-repo-link{color:var(--text-color);border:1px solid #e0ff4f4d}.projects-live-link{background:var(--accent);color:#111}.skills{width:100%;max-width:1300px;margin:0 auto;padding:.8rem 2rem}.skills-section-header{color:var(--text-color);margin-bottom:.8rem;font-size:clamp(1.5rem,1.5vw,2rem);font-weight:600;display:block}.skills-header{color:var(--text-dim);margin-top:.4rem;margin-bottom:.4rem;font-size:clamp(1rem,.9vw,1.4rem)}.skills-pill{color:var(--text-color);white-space:nowrap;border:1px solid #e0ff4f4d;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;margin:.2rem;padding:.4rem .8rem;font-size:.8rem;text-decoration:none;transition:border-color .25s,color .25s;display:inline-flex}.skills-pill:hover{border-color:var(--accent);color:var(--accent)}.skills-icon{color:var(--text-color);justify-content:center;align-items:center;font-size:1rem;display:flex}.skills-icon svg{width:1em;height:1em}.contact{width:100%;max-width:1300px;margin:0 auto;padding:.8rem 2rem}.contact-card{background-color:var(--card-bg-color);border-radius:var(--radius);max-width:1300px;color:var(--text-color);text-align:center;flex-direction:column;align-items:center;gap:1.25rem;margin:0 auto;padding:2.5rem 2rem;display:flex}.contact-cta{margin:0;font-size:clamp(1.5rem,1.5vw,2rem);font-weight:600}.contact-text{color:var(--text-dim);max-width:42ch;margin-bottom:1rem;font-size:.95rem;line-height:1.5}.contact-button{text-align:center;background:var(--accent);color:#111;overflow-wrap:break-word;border-radius:999px;justify-content:center;align-items:center;padding:.7rem 1.4rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:transform .15s;display:inline-flex}@media (width<=350px){.contact-button{word-break:break-all}}.contact-button:hover{transform:scale(1.04)}.contact-socials{flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:.5rem;display:flex}.footer{width:100%;max-width:1300px;margin:0 auto;padding:.8rem 2rem 1.2rem}.footer-text{color:var(--text-dim);text-align:center;justify-content:center;font-size:.868687rem}.settings{z-index:999;margin:1rem;display:block;position:fixed;top:0;left:0}.settings-btn{border:1px solid var(--accent);color:var(--text-color);background-color:var(--bg-color);border-radius:999px;align-items:center;gap:.4rem;padding:.4rem .8rem;font-size:1rem;text-decoration:none;transition:border-color .25s,color .25s;display:inline-flex}.settings-btn:hover{color:var(--accent)}
