@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&family=Pacifico&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css');
:root{--pink:#f7a8c4;--line:#f1e4ea;--ink:#2e2529;--gray:#9a8f94}
*{box-sizing:border-box}
body{

        cursor: url('https://cdn.cursors-4u.net/previews/cute-cat-kitty-playing-on-pink-yarn-3b5d4dc6-32.webp') 28 28, auto !important;
    -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
    margin:0;font-family:'Pretendard',sans-serif;color:var(--ink);background:#fff;line-height:1.7

    
}
img {
  -webkit-user-drag: none;
}
a{-webkit-user-drag: none; color:inherit;text-decoration:none}
/* 헤더 */
.hd{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1400px; /* 기존 1200px에서 1400px로 확장 */ margin:0 auto;padding:18px 48px;position:sticky;top:0;background:#fff;z-index:5}
.logo{font-family:'Pacifico',cursive;color:var(--pink);font-size:26px;width:80px}
.nav{display:flex;gap:36px;font-family:'Poppins',sans-serif;font-size:16px}
.nav a:hover,.nav a.on{color:var(--pink)}
.hd-r{width:80px;text-align:right;font-family:'Poppins'}
.hd-r a{color:var(--pink);font-size:14px}
main{max-width:1400px; /* 기존 1200px에서 1400px로 확장 */ margin:0 auto;padding:24px 48px 80px;min-height:70vh}
/* 홈 */
.home{display:flex;align-items:center;justify-content:center;min-height:62vh}
.home img{max-width:100%; /* 부모 요소를 넘지 않도록 설정 */ width:auto; /* 강제 확장을 막고 원본 비율 유지 */ max-height: 420px; /* 너무 커지는 것을 방지하기 위해 최대 높이 제한 (필요시 조정 가능) */}
/* 버튼 (흰색 톤) */
.btn{display:inline-block;margin:0 4px;padding:9px 26px;border:1px solid var(--line);color:var(--ink);border-radius:99px;font-size:14px;transition:.2s}
.btn:hover{border-color:var(--pink);color:var(--pink)}
/* 포트폴리오 */
.tabs{display:flex;gap:8px;margin:0 0 20px}
.tabs button{font:inherit;font-size:14px;padding:6px 18px;border:1px solid var(--line);background:#fff;border-radius:99px;cursor:pointer;color:var(--gray)}
.tabs button.on{border-color:var(--pink);color:var(--pink)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.grid figure{margin:0;position:relative;aspect-ratio:4/3;overflow:hidden;cursor:pointer;background:#faf6f8}
.grid img{width:100%;height:100%;object-fit:cover}
.grid figcaption{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 8px;color:#fff;font-size:13px;background:linear-gradient(transparent,#0006);opacity:0;transition:.2s}
.grid figure:hover figcaption{opacity:1}
.lb{position:fixed;inset:0;background:#000c;display:none;align-items:center;justify-content:center;z-index:9}
.lb.on{display:flex}.lb img{max-width:92vw;max-height:90vh}
/* 텍스트 페이지 */
h1{font-size:22px;font-weight:600;margin:8px 0 24px}
h2{font-size:15px;font-weight:600;margin:40px 0 8px}
.narrow{max-width:720px;margin:0 auto}
.note{border:1px solid var(--line);border-radius:12px;padding:16px 20px;font-size:14px;color:#5b5156}
.note p{margin:0}.note p+p{margin-top:6px}
.rows{border-top:1px solid var(--ink);font-size:15px}
.rows div{display:flex;justify-content:space-between;gap:16px;padding:11px 2px;border-bottom:1px solid var(--line)}
.rows span:last-child{white-space:nowrap}
.rows em{font-style:normal;color:var(--gray);font-size:13px;margin-left:8px}
.rows .off{color:var(--gray);text-decoration:line-through}
.rows .off em{text-decoration:none}
.sub{font-size:13px;color:var(--gray);margin:6px 0 0}
.ft{text-align:center;padding:40px 0 48px;font-size:12px;color:var(--gray)}
@media(max-width:760px){.hd{padding:14px 20px}.nav{gap:18px;font-size:14px}.hd-r{display:none}main{padding:16px 20px 60px}.grid{grid-template-columns:repeat(2,1fr)}}