@import url("https://fonts.googleapis.com/css2?family=Pretendard:wght@300;400;500;600;700&display=swap");:root{--primary:#8b4513;--primary-light:sienna;--primary-dark:#654321;--secondary:#d2691e;--accent:peru;--text-primary:#111827;--text-secondary:#6b7280;--text-light:#9ca3af;--bg-primary:#fff;--bg-secondary:#fafafa;--bg-tertiary:#f5f1eb;--border:#e2e8f0;--shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);--gradient-primary:linear-gradient(135deg,#8b4513,sienna);--gradient-secondary:linear-gradient(135deg,#f5f1eb,#e8ddd4);--gradient-accent:linear-gradient(135deg,peru,#d2691e)}*{box-sizing:border-box;padding:0;margin:0}body,html{max-width:100vw;overflow-x:hidden;font-family:Pretendard,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-feature-settings:"cv01","cv02","cv03","cv04"}body{color:var(--text-primary);background:var(--bg-secondary);line-height:1.7;font-weight:400}a{color:inherit;text-decoration:none}.container{max-width:1200px;margin:0 auto;padding:0 20px}.header{background:hsla(0,0%,100%,.95);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(139,69,19,.1);position:-webkit-sticky;position:sticky;top:0;z-index:100;box-shadow:0 2px 20px rgba(0,0,0,.05);transition:all .3s ease}.header.scrolled{background:hsla(0,0%,100%,.98);box-shadow:0 4px 30px rgba(0,0,0,.08)}.header-content{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 0}.logo{font-size:2rem;font-weight:700;color:var(--primary);letter-spacing:-.02em}.nav{display:flex;gap:2.5rem}.nav a{color:var(--text-secondary);font-weight:500;font-size:.95rem;transition:all .3s cubic-bezier(.4,0,.2,1);padding:.5rem 0;position:relative}.nav a:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--primary);transition:width .3s cubic-bezier(.4,0,.2,1)}.nav a.active,.nav a:hover{color:var(--primary)}.nav a.active:after,.nav a:hover:after{width:100%}.main{min-height:calc(100vh - 80px);padding:2rem 0}.hero{text-align:center;padding:6rem 0;background:linear-gradient(135deg,#f5f1eb,#e8ddd4);margin-bottom:4rem;position:relative;overflow:hidden}.hero:before{top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 50%,rgba(139,69,19,.1) 0,transparent 50%),radial-gradient(circle at 80% 50%,rgba(205,133,63,.1) 0,transparent 50%),linear-gradient(135deg,var(--primary) 0,var(--primary-light) 100%);opacity:.15}.hero:after,.hero:before{content:"";position:absolute}.hero:after{top:-50%;left:-50%;width:200%;height:200%;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%238B4513' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;animation:heroPattern 30s linear infinite}@keyframes heroPattern{0%{transform:translate(0) rotate(0deg)}to{transform:translate(30px,30px) rotate(5deg)}}.hero .container{position:relative;z-index:2}.hero h1{font-size:4rem;color:var(--primary);margin-bottom:1.5rem;font-weight:700;letter-spacing:-.02em;animation:fadeInUp .8s ease-out;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 2px 20px rgba(139,69,19,.1)}.hero p{font-size:1.3rem;color:var(--text-secondary);max-width:640px;margin:0 auto 2rem;font-weight:400;animation:fadeInUp .8s ease-out .2s both;line-height:1.8}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.hero-cta{display:inline-flex;align-items:center;gap:.75rem;padding:1rem 2rem;background:var(--gradient-primary);color:#fff;border-radius:50px;font-weight:600;transition:all .3s ease;animation:fadeInUp .8s ease-out .4s both;box-shadow:0 4px 20px rgba(139,69,19,.2);cursor:pointer;border:none;font-size:1rem}.hero-cta:hover{transform:translateY(-2px);box-shadow:0 6px 30px rgba(139,69,19,.3)}.category-filter{gap:.75rem;display:flex;gap:1rem;margin-bottom:3rem;flex-wrap:wrap;justify-content:center;padding:1.5rem;background:hsla(36,33%,94%,.5);border-radius:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.category-btn{padding:.875rem 1.75rem;border:2px solid transparent;background:var(--bg-primary);color:var(--text-secondary);border-radius:50px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-weight:600;font-size:.95rem;box-shadow:0 2px 10px rgba(0,0,0,.05);position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:.05em}.category-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:var(--gradient-primary);transform:translate(-50%,-50%);transition:width .6s,height .6s}.category-btn:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-3px) scale(1.05);box-shadow:0 4px 20px rgba(139,69,19,.2)}.category-btn:hover:before{width:120%;height:120%;opacity:.1}.category-btn.active{background:var(--gradient-primary);color:#fff;border-color:transparent;transform:translateY(-3px) scale(1.05);box-shadow:0 4px 20px rgba(139,69,19,.3)}.category-btn.active:before{opacity:0}.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:2rem;gap:2rem;margin-top:2rem}.product-card{background:var(--bg-primary);border-radius:24px;overflow:hidden;box-shadow:0 2px 20px rgba(0,0,0,.08);transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;border:1px solid var(--border);transform-style:preserve-3d;perspective:1000px}.product-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at top right,rgba(205,133,63,.1) 0,transparent 50%),linear-gradient(135deg,transparent,rgba(139,69,19,.05));opacity:0;transition:opacity .3s ease;z-index:1}.product-card:after{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:var(--gradient-primary);border-radius:24px;opacity:0;z-index:-1;transition:opacity .4s ease}.product-card:hover{transform:translateY(-12px) scale(1.02);box-shadow:var(--shadow-xl);border-color:transparent}.product-card:hover:before{opacity:1}.product-card:hover:after{opacity:.1}.product-image-wrapper{position:relative;overflow:hidden;height:240px;background:var(--bg-tertiary)}.product-image{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.4,0,.2,1)}.product-card:hover .product-image{transform:scale(1.1) rotate(1deg)}.product-badge{position:absolute;top:1rem;right:1rem;padding:.5rem 1rem;background:hsla(0,0%,100%,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;font-size:.75rem;font-weight:600;color:var(--primary);box-shadow:0 2px 10px rgba(0,0,0,.1);opacity:0;transform:translateY(-10px);transition:all .3s ease .1s}.product-card:hover .product-badge{opacity:1;transform:translateY(0)}.product-info{padding:2rem;position:relative;z-index:2;background:linear-gradient(180deg,transparent 0,hsla(0,0%,100%,.5))}.product-category{font-size:.8rem;color:var(--primary);font-weight:600;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.1em;display:inline-block;padding:.25rem .75rem;background:rgba(139,69,19,.08);border-radius:20px;transition:all .3s ease}.product-card:hover .product-category{background:rgba(139,69,19,.15)}.product-name{font-size:1.3rem;font-weight:600;color:var(--text-primary);margin-bottom:.75rem;line-height:1.4;transition:color .3s ease}.product-card:hover .product-name{color:var(--primary)}.product-description{font-size:.95rem;color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-footer{justify-content:space-between}.product-footer,.product-price{display:flex;align-items:center}.product-price{font-size:1.4rem;font-weight:700;color:var(--primary);gap:.5rem}.product-action{width:40px;height:40px;border-radius:50%;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;opacity:0;transform:scale(.8);transition:all .3s ease;box-shadow:0 2px 10px rgba(139,69,19,.3)}.product-card:hover .product-action{opacity:1;transform:scale(1)}.product-action:hover{transform:scale(1.1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.product-grid{animation:fadeIn .6s ease-out}.product-card{animation:scaleIn .5s ease-out;animation-fill-mode:both}.product-card:first-child{animation-delay:.1s}.product-card:nth-child(2){animation-delay:.2s}.product-card:nth-child(3){animation-delay:.3s}.product-card:nth-child(4){animation-delay:.4s}.product-card:nth-child(5){animation-delay:.5s}.product-card:nth-child(6){animation-delay:.6s}.logo{transition:all .3s ease;position:relative;display:inline-block}.logo:after{content:"";position:absolute;bottom:-5px;left:50%;width:0;height:3px;background:var(--gradient-primary);border-radius:2px;transform:translateX(-50%);transition:width .3s ease}.logo:hover{transform:translateY(-2px)}.logo:hover:after{width:100%}@media (max-width:768px){.container{padding:0 15px}.nav{display:none}.hero{padding:3rem 0}.hero h1{font-size:2.5rem}.hero p{font-size:1.1rem}.product-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.category-filter{gap:.5rem;margin-bottom:2rem}.category-btn{padding:.6rem 1.2rem;font-size:.85rem}.product-card{border-radius:16px}.product-info{padding:1.5rem}.product-image{height:200px}}html{scroll-behavior:smooth}::selection{background:rgba(139,69,19,.2);color:var(--primary)}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--primary-light);border-radius:6px;border:3px solid var(--bg-secondary)}::-webkit-scrollbar-thumb:hover{background:var(--primary)}.main{position:relative}.main:after{content:"";position:fixed;bottom:0;left:0;right:0;height:300px;background:url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%238B4513' stroke-width='0.5' opacity='0.05'%3E%3Ccircle cx='50' cy='50' r='30'/%3E%3Ccircle cx='50' cy='50' r='20'/%3E%3Ccircle cx='50' cy='50' r='10'/%3E%3Cpath d='M50 20 L80 50 L50 80 L20 50 Z'/%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none;z-index:0;opacity:.5;mask-image:linear-gradient(0deg,rgba(0,0,0,.3) 0,transparent);-webkit-mask-image:linear-gradient(0deg,rgba(0,0,0,.3) 0,transparent)}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center}.loading-spinner{width:40px;height:40px;border-top:4px solid var(--bg-tertiary);border:4px solid var(--bg-tertiary);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--text-secondary)}.retry-btn{padding:.75rem 1.5rem;background:var(--primary);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:500;margin-top:1rem;transition:background .3s ease}.retry-btn:hover{background:var(--primary-dark)}.no-products{display:flex;justify-content:center;align-items:center;padding:3rem;text-align:center;color:var(--text-secondary);grid-column:1/-1}