/*!
Theme Name: Portfolio
Theme URI:
Author:
Author URI:
Description: Personal brand portfolio theme
Version: 1.0
*/:root{--col_black: #080808;--col_gray_dark: #2b2b2b;--col_gray: #b3b3b3;--col_gray_light: #e5e5e5;--col_white: #ffffff;--col_accent: var(--col_white)}*{box-sizing:border-box}html{font-size:20px;scroll-behavior:smooth}body{margin:0;padding:0;font-family:"Zen Kaku Gothic New",sans-serif;font-size:1rem;line-height:1.8;color:var(--col_white);background-color:var(--col_black);user-select:none;-webkit-user-select:none}img{width:100%;height:auto;display:block}h1,h2{font-family:"Space Grotesk","Zen Kaku Gothic New",sans-serif;font-weight:700;letter-spacing:.02em}h2::before{content:"";display:block;width:2.5rem;height:.15rem;margin-bottom:.75rem;background-color:var(--col_accent)}.container{width:92%;max-width:90rem;margin-inline:auto}.header{position:fixed;top:0;left:0;width:15rem;height:100vh;display:flex;flex-direction:column;justify-content:space-between;padding:2rem 1.5rem;background-color:var(--col_black);border-right:1px solid var(--col_gray_dark);z-index:10}.header .header_logo{display:block;width:100%;max-width:6rem}.header .header_logo img{width:100%;display:block}.header .header_nav ul{display:flex;flex-direction:column;gap:1rem;margin:0;padding:0;list-style:none}.header .header_nav ul li a{position:relative;display:inline-block;color:var(--col_gray_light);text-decoration:none;font-family:"Space Grotesk","Zen Kaku Gothic New",sans-serif;font-size:.8rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;transition:color .3s ease}.header .header_nav ul li a::after{content:"";position:absolute;left:0;bottom:-0.25rem;width:100%;height:1px;background-color:var(--col_accent);transform:scaleX(0);transform-origin:right;transition:transform .3s ease}.header .header_nav ul li a:hover{color:var(--col_accent)}.header .header_nav ul li a:hover::after{transform:scaleX(1);transform-origin:left}@media(max-width: 48rem){.header{position:static;width:auto;height:auto;flex-direction:row;align-items:center;padding:1rem 1.5rem;border-right:none}.header .header_nav ul{flex-direction:row;gap:1rem;flex-wrap:wrap}}main{padding-left:15rem}@media(max-width: 48rem){main{padding-left:0}}.hero{padding-block:6rem}.hero .container{max-width:48rem}.hero .container h1{margin:0 0 1.5rem;font-size:3rem;line-height:1.5;letter-spacing:-0.02em;color:var(--col_white)}.hero .container p{margin:0;font-size:1rem;line-height:1.8;color:var(--col_gray)}.skills{padding-block:3rem}.skills .container h2{margin:0 0 2rem;font-size:1.5rem;color:var(--col_white)}.skills .container .skills_list{display:grid;grid-template-columns:repeat(3, 1fr);gap:2rem;margin:0;padding:0;list-style:none}.skills .container .skills_list .skills_item{padding-top:1rem}.skills .container .skills_list .skills_item .skills_title{margin:0 0 .5rem;font-size:1rem;font-weight:700;color:var(--col_white)}.skills .container .skills_list .skills_item .skills_desc{margin:0;font-size:.875rem;line-height:1.6;color:var(--col_gray)}@media(max-width: 1280px){.skills .container .skills_list{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 48rem){.skills .container .skills_list{grid-template-columns:1fr 1fr}}@media(max-width: 600px){.skills .container .skills_list{grid-template-columns:1fr}}.works{padding-block:3rem}.works .container h2{margin:0 0 2rem;font-size:1.5rem;color:var(--col_white)}.works .container .works_list{display:grid;grid-template-columns:repeat(3, 1fr);gap:2rem;margin:0;padding:0;list-style:none}.works .container .works_list .works_item a{display:block;color:inherit;text-decoration:none}.works .container .works_list .works_item .works_thumb{margin:0;overflow:hidden;aspect-ratio:16/9;background-color:var(--col_gray_dark)}.works .container .works_list .works_item .works_thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.works .container .works_list .works_item .works_title{margin:1rem 0 0;font-size:1rem;color:var(--col_white)}.works .container .works_list .works_item .works_tag{margin:0;font-size:.875rem;color:var(--col_gray)}.works .container .works_list .works_item a:hover .works_thumb img{transform:scale(1.08)}.works .container .works_list .works_item a:hover .works_title{color:var(--col_accent)}.works .container .works_note{margin:1.5rem 0 0;font-size:.75rem;color:var(--col_gray)}@media(max-width: 1280px){.works .container .works_list{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 48rem){.works .container .works_list{grid-template-columns:1fr}}.work_detail{padding-block:3rem}.work_detail .container{max-width:64rem}.work_detail .container .work_detail_back{display:inline-block;margin:0 0 2rem;color:var(--col_gray);text-decoration:none;font-size:.875rem}.work_detail .container .work_detail_back:hover{color:var(--col_accent)}.work_detail .container .work_detail_title{margin:0 0 .5rem;font-size:2rem;color:var(--col_white)}.work_detail .container .work_detail_period{margin:0 0 .5rem;font-size:.875rem;color:var(--col_gray)}.work_detail .container .work_detail_tag{margin:0 0 2rem;font-size:.875rem;color:var(--col_gray)}.work_detail .container .work_detail_thumb{margin:0 0 2rem}.work_detail .container .work_detail_thumb img{width:100%}.work_detail .container .work_detail_thumb_small{max-width:24rem;margin-inline:0}.work_detail .container .work_detail_body{font-size:1rem;line-height:1.9;color:var(--col_gray_light)}.work_detail .container .work_detail_body p{margin:0 0 1.5rem}.personal{padding-block:3rem;background-color:var(--col_gray_dark)}.personal .container h2{margin:0 0 2rem;font-size:1.5rem;color:var(--col_white)}.personal .container .personal_list{display:grid;grid-template-columns:repeat(auto-fill, minmax(12rem, 1fr));gap:1rem;margin:0;padding:0;list-style:none}.personal .container .personal_list .personal_item a{display:block}.personal .container .personal_list .personal_item .personal_thumb{margin:0;overflow:hidden;aspect-ratio:1/1;background-color:var(--col_black)}.personal .container .personal_list .personal_item .personal_thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.personal .container .personal_list .personal_item a:hover .personal_thumb img{transform:scale(1.08)}.personal .container .personal_note{margin:1.5rem 0 0;font-size:.875rem;color:var(--col_gray)}.profile{padding-block:3rem}.profile .container{max-width:48rem}.profile .container h2{margin:0 0 1.5rem;font-size:1.5rem;color:var(--col_white)}.profile .container .profile_text{margin:0;font-size:1rem;line-height:1.8;color:var(--col_gray_light)}.contact{padding-block:3rem;text-align:center}.contact .container h2{margin:0 0 1rem;font-size:1.5rem;color:var(--col_white)}.contact .container h2::before{display:none}.contact .container p{margin:0 0 2rem;color:var(--col_gray)}.contact .container .contact_button{display:inline-block;padding:1rem 2rem;border:1px solid var(--col_white);border-radius:999px;color:var(--col_white);text-decoration:none;font-size:.875rem}.contact .container .contact_button:hover{background-color:var(--col_white);color:var(--col_black)}.footer{padding-block:1.5rem;padding-left:15rem}.footer .container p{margin:0;font-size:.875rem;color:var(--col_gray);text-align:center}@media(max-width: 48rem){.footer{padding-left:0}}