.page{min-height:100vh;padding-bottom:var(--space-8);background:var(--color-bg-gradient)}.container{max-width:900px;margin:0 auto;padding:0 var(--space-4)}.header{text-align:center;padding:var(--space-8) 0}.platform-badge{width:72px;height:72px;margin:0 auto var(--space-4);display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);border-radius:var(--radius-2xl);box-shadow:0 8px 24px #e1306c4d}.platform-badge svg{width:36px;height:36px;color:#fff}h1{font-size:var(--text-4xl);font-weight:800;color:var(--color-text);margin-bottom:var(--space-3)}.subtitle{font-size:var(--text-lg);color:var(--color-text-muted);margin-bottom:var(--space-4)}.breadcrumb{display:flex;align-items:center;justify-content:center;gap:var(--space-2);font-size:var(--text-sm)}.breadcrumb a{color:var(--color-primary);font-weight:500;transition:opacity .2s}.breadcrumb a:hover{opacity:.8}.breadcrumb .separator{color:var(--color-text-muted)}.breadcrumb .current{color:var(--color-text-muted);font-weight:500}.section-title{font-size:var(--text-xl);font-weight:700;color:var(--color-text);margin-bottom:var(--space-4)}.categories-section{margin-bottom:var(--space-8)}.categories-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3)}.category-card{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:#fff;border:2px solid var(--color-border);border-radius:var(--radius-xl);text-decoration:none;transition:all .3s ease}.category-card:hover{border-color:var(--cat-color);transform:translateY(-2px);box-shadow:0 8px 24px #0000001a}.category-icon{font-size:var(--text-2xl);width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-alt);border-radius:var(--radius-lg);flex-shrink:0}.category-info{flex:1;min-width:0}.category-name{font-size:var(--text-base);font-weight:700;color:var(--color-text);margin-bottom:2px}.category-desc{font-size:var(--text-sm);color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.category-arrow{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-alt);border-radius:50%;flex-shrink:0;transition:all .3s ease}.category-arrow svg{width:18px;height:18px;color:var(--color-text-muted)}.category-card:hover .category-arrow{background:var(--cat-color)}.category-card:hover .category-arrow svg{color:#fff}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8);text-align:center}.loading-state p,.error-state p{color:var(--color-text-muted);margin-top:var(--space-3)}.spinner{width:40px;height:40px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-icon{font-size:var(--text-3xl)}.retry-btn{margin-top:var(--space-4);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:600;color:var(--color-primary);background:#fff;border:1.5px solid var(--color-primary);border-radius:var(--radius-lg);cursor:pointer;transition:all .2s}.retry-btn:hover{background:var(--color-primary);color:#fff}.hidden{display:none!important}.packages-section{margin-bottom:var(--space-8)}.package-group{margin-bottom:var(--space-6)}.group-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border-light)}.group-icon{font-size:var(--text-lg)}.group-title{font-size:var(--text-lg);font-weight:700;color:var(--color-text);flex:1}.group-link{display:flex;align-items:center;gap:4px;font-size:var(--text-sm);font-weight:600;color:var(--color-primary);text-decoration:none;transition:opacity .2s}.group-link:hover{opacity:.8}.group-link svg{width:16px;height:16px}.packages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}.package-card{position:relative;display:flex;flex-direction:column;padding:var(--space-5);background:#fff;border:2px solid var(--color-border);border-radius:var(--radius-xl);transition:all .3s ease}.package-card:hover{border-color:var(--color-primary-light);box-shadow:0 8px 24px #0000001a}.package-card[data-option=premium]{border-color:var(--color-primary);background:linear-gradient(180deg,#faf5ff,#fff)}.package-badge{position:absolute;top:-10px;right:var(--space-4);padding:4px 12px;font-size:11px;font-weight:700;color:#fff;background:var(--gradient-brand);border-radius:var(--radius-full);box-shadow:0 2px 8px #7c3aed4d}.package-header{margin-bottom:var(--space-4)}.package-name{font-size:var(--text-base);font-weight:700;color:var(--color-text);margin-bottom:var(--space-1)}.package-desc{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.4}.package-price{margin-bottom:var(--space-4)}.price-amount{font-size:var(--text-2xl);font-weight:800;background:var(--gradient-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.package-btn{display:block;width:100%;padding:var(--space-3);font-size:var(--text-sm);font-weight:700;color:var(--color-primary);text-align:center;background:linear-gradient(135deg,#7c3aed1a,#ec48991a);border:1.5px solid var(--color-primary-light);border-radius:var(--radius-lg);text-decoration:none;transition:all .2s ease}.package-btn:hover{background:var(--gradient-brand);border-color:transparent;color:#fff}.features-section{margin-bottom:var(--space-8)}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3)}.feature-item{text-align:center;padding:var(--space-4);background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-xl)}.feature-icon{font-size:var(--text-2xl);display:block;margin-bottom:var(--space-2)}.feature-item h4{font-size:var(--text-sm);font-weight:700;color:var(--color-text);margin-bottom:4px}.feature-item p{font-size:12px;color:var(--color-text-muted)}.back-section{text-align:center}.back-link{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted);background:#fff;border:1.5px solid var(--color-border);border-radius:var(--radius-full);transition:all .2s ease}.back-link:hover{color:var(--color-text);border-color:var(--color-text-muted)}.back-link svg{width:18px;height:18px}@media(max-width:768px){.categories-grid,.packages-grid{grid-template-columns:1fr}.features-grid{grid-template-columns:repeat(2,1fr)}h1{font-size:var(--text-3xl)}.platform-badge{width:60px;height:60px}.platform-badge svg{width:30px;height:30px}}@media(max-width:480px){.features-grid{grid-template-columns:1fr}.category-desc{display:none}}