:root{--bg-dark:#e0ded0;--bg-card:#eceae0;--accent-green:#2d5a34;--accent-green-light:#4b8151;--accent-green-dark:#1f4428;--text-primary:#2a2520;--text-secondary:#6b6560;--border-color:#ccc9bc}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-dark);color:var(--text-primary);font-family:Noto Sans JP,sans-serif;line-height:1.6;overflow-x:hidden}header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;border-bottom:1px solid var(--border-color);background:#e0ded0f2;width:100%;padding:2rem 5%;animation:.8s ease-out slideDown;position:fixed;top:0}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}nav{justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto;display:flex}.logo{letter-spacing:-1px;background:linear-gradient(135deg, var(--accent-green), var(--accent-green-light));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-family:Playfair Display,serif;font-size:1.8rem;font-weight:900}.nav-links{gap:3rem;list-style:none;display:flex}.nav-links a{color:var(--text-primary);letter-spacing:.5px;font-size:.95rem;font-weight:500;text-decoration:none;transition:all .3s;position:relative}.nav-links a:after{content:"";background:var(--accent-green);width:0;height:1px;transition:width .3s;position:absolute;bottom:-5px;left:0}.nav-links a:hover{color:var(--accent-green)}.nav-links a:hover:after{width:100%}.hero{background:#111;justify-content:center;align-items:center;height:100vh;display:flex;position:relative;overflow:hidden}.hero-video-wrapper{z-index:0;opacity:.85;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.mobile-slideshow{z-index:0;width:100%;height:100%;display:none;position:absolute;inset:0}.mobile-slideshow .slide{opacity:0;background-position:50%;background-size:cover;width:100%;height:100%;animation:40s infinite fadeSlide;position:absolute;inset:0}.mobile-slideshow .slide:first-child{animation-delay:0s}.mobile-slideshow .slide:nth-child(2){animation-delay:5s}.mobile-slideshow .slide:nth-child(3){animation-delay:10s}.mobile-slideshow .slide:nth-child(4){animation-delay:15s}.mobile-slideshow .slide:nth-child(5){animation-delay:20s}.mobile-slideshow .slide:nth-child(6){animation-delay:25s}.mobile-slideshow .slide:nth-child(7){animation-delay:30s}.mobile-slideshow .slide:nth-child(8){animation-delay:35s}@keyframes fadeSlide{0%{opacity:0;transform:scale(1.05)}2.5%{opacity:1;transform:scale(1.05)}12.5%{opacity:1;transform:scale(1)}15%{opacity:0;transform:scale(1)}to{opacity:0;transform:scale(1.05)}}.hero-video-wrapper iframe{pointer-events:none;width:100vw;height:100vh;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media (aspect-ratio>=16/9){.hero-video-wrapper iframe{height:56.25vw}}@media (aspect-ratio<=16/9){.hero-video-wrapper iframe{width:177.78vh}}.hero:after{content:"";z-index:1;background:linear-gradient(#2d5a3426 0%,#1f442899 100%);position:absolute;inset:0}.hero-content{text-align:center;z-index:2;color:#fff;max-width:900px;padding:0 2rem}.hero-title{letter-spacing:-.5px;color:#fff;text-shadow:0 4px 20px #0009;margin-bottom:1.5rem;font-family:Noto Sans JP,sans-serif;font-size:clamp(2.2rem,5vw,4.5rem);font-weight:700;line-height:1.4;animation:1s ease-out .2s both fadeInUp}.hero-subtitle{color:#ffffffe6;letter-spacing:4px;text-shadow:0 2px 10px #00000080;margin-bottom:3rem;font-size:clamp(1.2rem,2vw,1.5rem);font-weight:300;animation:1s ease-out .4s both fadeInUp}.cta-button{background:var(--accent-green-light);color:#fff;letter-spacing:1px;border:none;border-radius:50px;padding:1.2rem 3rem;font-weight:600;text-decoration:none;transition:all .4s;animation:1s ease-out .6s both fadeInUp;display:inline-block;position:relative;overflow:hidden}.cta-button:hover{color:var(--accent-green);background:#fff;transform:translateY(-2px);box-shadow:0 10px 30px #2d5a3480}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.portfolio-section{max-width:1400px;margin:0 auto;padding:8rem 5%}.section-title{text-align:center;letter-spacing:-1px;color:var(--text-primary);margin-bottom:3rem;font-family:Playfair Display,serif;font-size:clamp(2.5rem,5vw,4rem);font-weight:700}.category-filter{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:4rem;display:flex}.filter-btn{background:var(--bg-card);border:2px solid var(--border-color);color:var(--text-primary);cursor:pointer;border-radius:50px;padding:.8rem 2rem;font-family:Noto Sans JP,sans-serif;font-size:1rem;font-weight:500;transition:all .3s}.filter-btn:hover{border-color:var(--accent-green);background:#2d5a3414}.filter-btn.active{background:var(--accent-green);color:#fff;border-color:var(--accent-green)}.portfolio-grid{grid-template-columns:repeat(auto-fit,minmax(400px,1fr));align-items:start;gap:3rem;margin-bottom:6rem;display:grid}.portfolio-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;transition:all .5s cubic-bezier(.4,0,.2,1);animation:.8s ease-out both fadeIn;position:relative;overflow:hidden}.portfolio-item:first-child{animation-delay:.1s}.portfolio-item:nth-child(2){animation-delay:.2s}.portfolio-item:nth-child(3){animation-delay:.3s}.portfolio-item:nth-child(4){animation-delay:.4s}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.portfolio-item:hover{border-color:var(--accent-green);transform:translateY(-10px)scale(1.02);box-shadow:0 20px 40px #2d5a344d}.video-thumbnail{background:linear-gradient(135deg,#ccc9bc 0%,#e0ded0 100%);width:100%;padding-top:56.25%;position:relative;overflow:hidden}.video-thumbnail.vertical-thumbnail{max-height:none;padding-top:177.77%}.thumbnail-image{object-fit:cover;width:100%;height:100%;transition:transform .5s;position:absolute;inset:0}.portfolio-item:hover .thumbnail-image{transform:scale(1.05)}.youtube-embed{position:absolute;inset:0}.youtube-embed iframe{border:none;width:100%;height:100%}.video-info{padding:2rem}.video-title{color:var(--text-primary);margin-bottom:.8rem;font-family:Playfair Display,serif;font-size:1.5rem;font-weight:700}.video-description{color:var(--text-secondary);margin-bottom:1.2rem;font-size:.95rem;line-height:1.8}.video-tags{flex-wrap:wrap;gap:.5rem;display:flex}.tag{color:var(--accent-green-dark);background:#2d5a341f;border:1px solid #2d5a3459;border-radius:20px;padding:.4rem 1rem;font-size:.8rem}.gallery-btn{background:var(--accent-green);color:#fff;cursor:pointer;border:none;border-radius:30px;margin-top:1rem;padding:.6rem 1.5rem;font-size:.9rem;transition:background .3s;display:inline-block}.gallery-btn:hover{background:var(--accent-green-light)}.about-section{background:var(--bg-card);border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color);padding:8rem 5%}.about-content{grid-template-columns:1fr 1fr;align-items:center;gap:5rem;max-width:1000px;margin:0 auto;display:grid}.about-text h2{letter-spacing:-1px;margin-bottom:2rem;font-family:Playfair Display,serif;font-size:clamp(2rem,4vw,3rem);font-weight:700}.about-text p{color:var(--text-secondary);margin-bottom:1.5rem;font-size:1.1rem;line-height:2}.profile-item{color:var(--text-primary);margin-bottom:1rem;font-size:.95rem}.profile-item strong{color:var(--accent-green);margin-right:.5rem}.skills-list{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}.skill-item{border-left:3px solid var(--accent-green);color:var(--text-secondary);background:#2d5a3414;padding:1rem 1.5rem;font-size:.95rem}.contact-section{text-align:center;padding:8rem 5%}.contact-content{max-width:700px;margin:0 auto}.contact-content h2{letter-spacing:-1px;margin-bottom:2rem;font-family:Playfair Display,serif;font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:700}.contact-content p{color:var(--text-secondary);margin-bottom:3rem;font-size:1.2rem;line-height:1.8}.contact-links{flex-wrap:wrap;justify-content:center;gap:2rem;display:flex}.contact-link{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-primary);border-radius:50px;align-items:center;gap:.8rem;padding:1rem 2rem;text-decoration:none;transition:all .3s;display:inline-flex}.contact-link:hover{border-color:var(--accent-green);background:#2d5a341f;transform:translateY(-3px)}.modal{z-index:2000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#000000e6;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal.active{flex-direction:column;justify-content:center;align-items:center;display:flex}.modal-content{object-fit:contain;border-radius:8px;max-width:90%;max-height:80vh;animation:.3s zoomIn;box-shadow:0 10px 30px #00000080}@keyframes zoomIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.close-modal{color:#f1f1f1;cursor:pointer;font-size:40px;font-weight:700;transition:all .3s;position:absolute;top:30px;right:40px}.close-modal:hover{color:var(--accent-green-light)}.modal-nav{gap:2rem;margin-top:2rem;display:flex}.nav-btn{color:#fff;cursor:pointer;background:0 0;border:1px solid #fff;border-radius:30px;padding:.5rem 2rem;font-size:1rem;transition:all .3s}.nav-btn:hover{color:#000;background:#fff}.modal-indicator{color:#fff;letter-spacing:2px;margin-top:1rem;font-family:sans-serif}footer{text-align:center;border-top:1px solid var(--border-color);color:var(--text-secondary);padding:3rem 5%;font-size:.9rem}@media (width<=768px){.nav-links{display:none}.portfolio-grid{grid-template-columns:1fr}.about-content{grid-template-columns:1fr;gap:3rem}.hero-title{white-space:normal;font-size:clamp(1.9rem,7vw,3rem)}.hero-subtitle{letter-spacing:0;font-size:.95rem;line-height:1.8}#hero-youtube-player{display:none!important}.mobile-slideshow{display:block}.hero-video-wrapper{background-image:none}}