.templates-page{background:var(--gradient-hero-soft);min-height:100vh;padding:40px 0 80px}.page-title{color:#fff;font-size:2.5rem;font-weight:700;margin-bottom:10px;text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.categories{display:flex;flex-wrap:wrap;gap:15px;justify-content:center;margin-bottom:50px}.category-btn{backdrop-filter:blur(10px);background:hsla(35,36%,64%,.55);border:2px solid hsla(0,0%,100%,.7);border-radius:50px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:12px 24px;transition:all .3s ease}.category-btn:hover{background:hsla(0,0%,100%,.3);transform:translateY(-2px)}.category-btn.active{background:#fff;border-color:#fff;color:var(--primary)}.templates-grid{display:grid;gap:30px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));margin:0 auto;max-width:1200px;padding:0 20px}.template-card{background:#fff;border-radius:20px;box-shadow:0 10px 30px rgba(0,0,0,.2);cursor:pointer;overflow:hidden;position:relative;transition:all .3s ease}.template-card:hover{box-shadow:0 20px 40px rgba(0,0,0,.3);transform:translateY(-10px)}.template-preview{align-items:center;background-position:50%;background-size:cover;display:flex;justify-content:center;overflow:hidden;padding-bottom:141.4%;position:relative;width:100%}.template-image{object-fit:cover;object-position:center;transition:transform .3s ease}.placeholder-preview,.template-image{height:100%;left:0;position:absolute;top:0;width:100%}.placeholder-preview{align-items:center;background:inherit;color:#fff;display:flex;flex-direction:column;justify-content:center;text-align:center}.preview-icon{animation:fadeInUp .5s ease;font-size:64px;margin-bottom:15px}.preview-name{background:rgba(0,0,0,.3);border-radius:50px;display:inline-block;font-size:18px;font-weight:600;padding:5px 15px}.template-info{padding:20px;text-align:center}.template-info h3{color:var(--text-primary);font-size:1.2rem;margin:0 0 15px}.btn-select{background:var(--gradient-brand);border:none;border-radius:50px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:10px 25px;transition:all .3s ease;width:100%}.btn-select:hover{box-shadow:0 5px 15px var(--shadow-btn);transform:scale(1.05)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.template-card{animation:fadeInUp .5s ease}.loading-state{color:#fff;font-size:1.2rem;padding:60px;text-align:center}.loading-spinner{animation:spin 1s linear infinite;border:5px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#fff;height:50px;margin:0 auto 20px;width:50px}@keyframes spin{to{transform:rotate(1turn)}}.empty-state{background:hsla(0,0%,100%,.1);border-radius:20px;color:#fff;grid-column:1/-1;padding:60px;text-align:center}.empty-state-icon{font-size:64px;margin-bottom:20px}.empty-state-text{font-size:1.2rem;margin-bottom:20px}.template-card:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;pointer-events:none;position:absolute;top:0;transition:left .5s;width:100%}.template-card:hover:before{left:100%}.template-card:hover .template-image{transform:scale(1.05)}.template-card[data-category=wedding] .btn-select{background:linear-gradient(135deg,var(--c-23) 0,var(--c-25) 100%)}.template-card[data-category=birthday] .btn-select{background:linear-gradient(135deg,var(--c-24) 0,var(--c-16) 100%)}.template-card[data-category=corporate] .btn-select{background:linear-gradient(135deg,var(--c-07) 0,var(--c-26) 100%)}.template-card[data-category=wedding] .btn-select[data-id=wedding-1]{background:linear-gradient(135deg,#e8d5c4,#c9a882)}.template-card[data-category=wedding] .btn-select[data-id=wedding-2]{background:linear-gradient(135deg,#d4cbb8,#8b7355)}.template-card[data-category=wedding] .btn-select[data-id=wedding-3]{background:linear-gradient(135deg,#ede4d8,#6b5344)}.template-card[data-category=birthday] .btn-select[data-id=birthday-1]{background:linear-gradient(135deg,#f0dfc4,#d4a574)}.template-card[data-category=birthday] .btn-select[data-id=birthday-2]{background:linear-gradient(135deg,#e8c9b8,#b89b78)}.template-card[data-category=birthday] .btn-select[data-id=birthday-3]{background:linear-gradient(135deg,#f2e0b8,#a67c52)}.template-card[data-category=corporate] .btn-select[data-id=corporate-1]{background:linear-gradient(135deg,#f5f0e8,#7a6555)}.template-card[data-category=corporate] .btn-select[data-id=corporate-2]{background:linear-gradient(135deg,#c9b89a,#5c4330)}.template-card[data-category=corporate] .btn-select[data-id=corporate-3]{background:linear-gradient(135deg,#fff6e7,#8f7654)}.template-card[data-category=classic] .btn-select[data-id=classic-1]{background:linear-gradient(135deg,#c4b896,#5c4330)}.template-card[data-category=classic] .btn-select[data-id=classic-2]{background:linear-gradient(135deg,#e4e3cc,#8b7b68)}.template-card[data-category=classic] .btn-select[data-id=classic-3]{background:linear-gradient(135deg,#d4c5b2,#6b4a32)}@media (max-width:768px){.templates-page{padding:20px 0 40px}.page-title{font-size:1.8rem;margin-bottom:30px}.categories{gap:10px;margin-bottom:30px}.category-btn{font-size:.9rem;padding:8px 16px}.templates-grid{gap:20px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));padding:0 15px}.preview-icon{font-size:48px}.preview-name{font-size:14px}.template-info h3{font-size:1rem}.btn-select{font-size:.9rem;padding:8px 20px}}@media (max-width:480px){.templates-grid{grid-template-columns:1fr}.category-btn{font-size:.85rem;padding:6px 12px}}