:root{--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-white:#fff;--color-primary:#578e7e;--color-primary-hover:#437063;--color-primary-soft:#eef5f3;--color-secondary:#8fb5a5;--color-background-light:#f5f5f0;--color-surface-light:#fafaf9;--color-surface-muted:#f5f5f4;--color-text-light-primary:#44403c;--color-text-light-secondary:#78716c;--color-text-light-tertiary:#a8a29e;--color-border-light:#e7e5e4;--color-focus-ring:#578e7e66;--bg-app:var(--color-background-light);--bg-paper:var(--color-surface-light);--text-primary:var(--color-text-light-primary);--text-secondary:var(--color-text-light-secondary);--text-tertiary:var(--color-text-light-tertiary);--primary-color:var(--color-primary);--primary-hover:var(--color-primary-hover);--primary-light:var(--color-primary-soft);--secondary-color:var(--color-surface-muted);--border-color:var(--color-border-light);--focus-ring:var(--color-focus-ring);--white:var(--color-white);--bg-white:var(--color-white);--text-dark:#111;--primary:var(--color-primary);--border:var(--color-border-light);--shadow-md:0 4px 6px -1px #44403c14, 0 2px 4px -1px #44403c0a;--shadow-lg:0 10px 15px -3px #44403c14, 0 4px 6px -2px #44403c0a;--shadow-xl:0 20px 25px -5px #44403c1a, 0 10px 10px -5px #44403c0a;--radius-md:12px;--radius-lg:20px;--transition-fast:.15s ease-out;--transition-normal:.25s ease-out}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body.shop-page{background:var(--bg-app);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-family:Pretendard Variable,Pretendard,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;line-height:1.6}.shop-main{max-width:1200px;margin:0 auto;padding:80px 24px}.hero-section{text-align:center;padding:60px 0 80px}.hero-title{color:var(--text-primary);letter-spacing:-.02em;margin-bottom:20px;font-size:clamp(32px,5vw,48px);font-weight:800;line-height:1.3}.products-section{padding:20px 0 60px}.products-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));align-items:stretch;gap:24px;display:grid}.product-card{background:var(--bg-white);border-radius:var(--radius-lg);border:2px solid var(--border);flex-direction:column;height:100%;padding:28px;display:flex}.product-card.featured{border-color:var(--primary)}.product-card.inactive{opacity:.72;border-style:dashed}.product-card.inactive .featured-badge{background:linear-gradient(135deg,#a8a29e,#78716c);box-shadow:0 2px 8px #78716c40}.product-card[data-purchase-card=true]{cursor:pointer}.product-card[data-purchase-card=true]:focus-visible{outline:3px solid color-mix(in srgb, var(--primary) 55%, transparent);outline-offset:4px}.product-card[data-purchase-card=true]:hover .purchase-btn.primary,.product-card[data-purchase-card=true]:focus-visible .purchase-btn.primary{transform:translate(4px);box-shadow:0 6px 20px #578e7e73}.product-header{justify-content:flex-end;align-items:flex-start;height:64px;margin-bottom:20px;display:flex}.product-header.spacer{visibility:hidden}.featured-badge{background:linear-gradient(135deg, var(--primary), var(--primary-hover));color:#fff;border-radius:50px;align-items:center;gap:4px;padding:6px 12px;font-size:11px;font-weight:700;display:flex;box-shadow:0 2px 8px #578e7e59}.product-content{flex-direction:column;flex:1;display:flex}.product-title{color:var(--text-dark);margin-bottom:8px;font-size:28px;font-weight:800;line-height:1.3}.product-description{color:var(--text-dark);height:60px;margin-bottom:20px;font-size:16px;font-weight:600;line-height:1.85}.product-features{flex-direction:column;gap:10px;min-height:64px;margin-bottom:24px;display:flex}.feature-item{color:var(--text-dark);align-items:center;gap:10px;font-size:14px;font-weight:700;display:flex}.feature-item svg{flex-shrink:0}.feature-item.unavailable{color:var(--text-secondary);font-weight:500}.product-footer{border-top:1px solid var(--border);justify-content:space-between;align-items:flex-end;min-height:70px;margin-top:auto;padding-top:20px;display:flex}.product-price{flex-wrap:wrap;align-content:flex-end;align-items:baseline;gap:2px;height:56px;display:flex}.price-value{color:var(--text-primary);letter-spacing:-.02em;font-size:28px;font-weight:800;line-height:1}.price-unit{color:var(--text-primary);font-size:16px;font-weight:600;line-height:1}.price-period{color:var(--text-tertiary);margin-left:2px;font-size:13px;line-height:1}.purchase-btn{color:var(--primary);background:var(--primary-light);border-radius:var(--radius-md);transition:all var(--transition-normal);border:none;align-items:center;gap:8px;padding:12px 20px;font-size:14px;font-weight:600;display:inline-flex}.purchase-btn:not(:disabled):hover{background:var(--primary);color:#fff;transform:translate(4px);box-shadow:0 4px 12px #578e7e4d}.purchase-btn:disabled{background:var(--bg-paper);color:var(--text-tertiary);cursor:default;box-shadow:none}.purchase-btn:disabled:hover{background:var(--bg-paper);color:var(--text-tertiary);box-shadow:none;transform:none}.purchase-btn:active{transform:translate(2px)scale(.98)}.purchase-btn.primary{background:linear-gradient(135deg, var(--primary), var(--primary-hover));color:#fff;box-shadow:0 4px 14px #578e7e59}.purchase-btn.primary:hover{transform:translate(4px);box-shadow:0 6px 20px #578e7e73}.products-empty{border:1px dashed var(--border);border-radius:var(--radius-lg);color:var(--text-secondary);text-align:center;background:var(--bg-white);grid-column:1/-1;padding:32px}.benefits-section{padding:60px 0}.section-title{text-align:center;color:var(--text-primary);margin-bottom:40px;font-size:28px;font-weight:800}.benefits-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;display:grid}.benefit-item{text-align:center;background:var(--bg-white);border-radius:var(--radius-lg);border:1px solid var(--border);transition:all var(--transition-normal);padding:32px 24px}.benefit-item:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.benefit-icon{background:var(--primary-light);width:56px;height:56px;color:var(--primary);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 16px;display:flex}.benefit-item h4{color:var(--text-primary);margin-bottom:8px;font-size:16px;font-weight:700}.benefit-item p{color:var(--text-secondary);font-size:13px;line-height:1.5}.faq-section{padding:60px 0}.faq-list{flex-direction:column;gap:12px;max-width:700px;margin:0 auto;display:flex}.faq-item{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-normal);overflow:hidden}.faq-item:hover{border-color:var(--primary-light)}.faq-item[open]{border-color:var(--primary);box-shadow:var(--shadow-md)}.faq-item summary{color:var(--text-primary);cursor:pointer;transition:background var(--transition-fast);justify-content:space-between;align-items:center;padding:18px 20px;font-size:15px;font-weight:600;list-style:none;display:flex}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:hover{background:var(--bg-paper)}.faq-item summary svg{color:var(--text-tertiary);transition:transform var(--transition-normal);flex-shrink:0}.faq-item[open] summary svg{color:var(--primary);transform:rotate(180deg)}.faq-item p{color:var(--text-secondary);animation:fadeIn var(--transition-normal);padding:0 20px 20px;font-size:14px;line-height:1.7}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.modal-backdrop{opacity:0;pointer-events:none;transition:opacity var(--transition-normal);z-index:10000;background:#0f172a40;justify-content:center;align-items:flex-start;padding:80px 16px 16px;display:flex;position:fixed;inset:0}.modal-backdrop.is-open{opacity:1;pointer-events:auto}.modal-card{background:var(--bg-white);border-radius:var(--radius-lg);border:1px solid var(--border);width:60vw;height:60vh;box-shadow:var(--shadow-xl);transition:transform var(--transition-normal);flex-direction:column;padding:20px;display:flex;overflow:hidden;transform:translateY(-8px)}.modal-backdrop.is-open .modal-card{transform:translateY(0)}.modal-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.modal-header h3{color:var(--text-dark);font-size:18px;font-weight:800}.modal-close{background:var(--bg-paper);color:var(--text-secondary);cursor:pointer;width:32px;height:32px;transition:background var(--transition-fast), color var(--transition-fast);border:none;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.modal-close:hover{background:var(--primary-light);color:var(--primary)}.modal-body{flex-direction:column;flex:1;gap:24px;display:flex;overflow:auto}.payment-grid{flex:1;grid-template-columns:1fr 1fr;gap:24px;min-height:0;margin-top:16px;display:grid}.payment-left{border-right:1px solid var(--border);flex-direction:column;gap:16px;padding-right:24px;display:flex}.summary-lines{flex-direction:column;gap:10px;display:flex}.summary-line{color:var(--text-secondary);border-top:1px solid var(--border);justify-content:space-between;align-items:center;padding:8px 0;font-size:13px;display:flex}.summary-header .summary-line{border-top:none;padding-top:0}.summary-line.total{color:var(--text-dark);font-size:14px;font-weight:700}.payment-right{flex-direction:column;gap:14px;padding-left:24px;display:flex}.payment-section-title{color:var(--text-dark);font-size:13px;font-weight:700}.payment-divider{border:none;border-top:1px solid var(--border);margin:6px 0 2px}.payment-block{border:1px solid var(--border);background:var(--bg-paper);border-radius:12px;padding:8px 10px}.payment-block.input-block{background:#fbfbfa;border-color:#0f172a14}.input-row{color:var(--text-dark);align-items:center;gap:10px;font-size:13px;display:flex}.input-label{color:var(--text-secondary);min-width:52px}.input-value{color:var(--text-dark);flex:1;font-weight:600}.input-field{min-width:0;color:var(--text-dark);background:0 0;border:none;outline:none;flex:1;height:18px;padding-left:1ch;font-size:13px;font-weight:600;line-height:18px}.input-field::placeholder{color:var(--text-tertiary);font-weight:500}.check-row{color:var(--text-dark);justify-content:space-between;align-items:center;gap:10px;font-size:12px;line-height:1.5;display:flex}.check-label{align-items:flex-start;gap:10px;display:inline-flex}.check-row input{margin-top:2px}.policy-detail-link{color:var(--primary);cursor:pointer;text-underline-offset:3px;background:0 0;border:none;padding:0;font-size:12px;font-weight:600;text-decoration:underline}.policy-detail-link:hover{color:var(--primary-hover)}.policy-note{color:var(--text-secondary);margin-top:-6px;font-size:12px;line-height:1.6}.payment-submit{background:var(--primary);color:#fff;cursor:pointer;transition:background var(--transition-fast);border:none;border-radius:12px;margin-top:6px;padding:12px 16px;font-size:14px;font-weight:700}.payment-submit:hover{background:var(--primary-hover)}.payment-submit:disabled{cursor:not-allowed;background:#d6d3d1}.animate-in{opacity:1!important;transform:translateY(0)!important}@media (width<=768px){.shop-main{padding:88px 16px 60px}.hero-section{padding:40px 0 60px}.hero-title{font-size:28px}.products-grid{grid-template-columns:1fr;gap:16px}.product-card{padding:24px}.product-features{min-height:0}.product-footer{flex-direction:column;align-items:flex-start;gap:16px}.purchase-btn{justify-content:center;width:100%}.benefits-grid{grid-template-columns:1fr;gap:16px}.benefit-item{padding:24px 20px}.modal-backdrop{padding:60px 12px 12px}.modal-card{width:90vw;height:auto;max-height:85vh}.payment-grid{grid-template-columns:1fr}.payment-left{border-right:none;border-bottom:1px solid var(--border);padding-bottom:16px;padding-right:0}.payment-right{padding-left:0}}@media (width<=640px){.modal-backdrop{padding:48px 8px 8px}.modal-card{border-radius:var(--radius-md);width:100%;max-height:90vh;padding:16px}.modal-header h3{font-size:16px}.payment-grid{gap:16px;margin-top:12px}.summary-line{font-size:12px}.summary-line.total{font-size:13px}.payment-section-title,.input-row,.input-field{font-size:12px}.input-label{min-width:44px}.check-row,.policy-note{font-size:11px}.payment-submit{padding:10px 14px;font-size:13px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}::selection{background:var(--primary-light);color:var(--primary-hover)}
