.websiteTemplates{flex-direction:column;justify-content:center;align-items:center;gap:25px;width:100%;max-width:1024px;height:100%;margin:0 auto;padding:25px;display:flex}.templates-container{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);justify-content:center;align-items:center;gap:25px;width:100%;height:100%;padding:25px 0;display:grid}.page-preview{width:calc(100% - 40px);height:500px;margin:0 20px;position:relative;overflow:hidden}.template-item{cursor:pointer;background-position-y:0;background-repeat:no-repeat;background-size:100%;height:100%;transition:all 3s ease-in-out;position:relative;top:0}.template-item:hover{background-position-y:100%;height:100%}.template-item .overlay{opacity:0;background-color:#0000004d;width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.template-item:hover .overlay{opacity:1}.page-preview .template-info{color:#fff;text-align:center;background-color:#000000b3;flex-direction:column;align-items:center;width:100%;padding:10px;display:flex;position:sticky;bottom:0;left:0}.page-preview .action-buttons{gap:10px;display:flex;position:absolute;bottom:50%;left:50%;transform:translate(-50%)}.page-preview .action-buttons a{text-align:center;color:#000;cursor:pointer;background-color:#fff;border:none;border-radius:5px;width:150px;padding:15px 10px;font-size:16px;font-weight:500}.page-preview .action-buttons .btn-primary{color:#fff;background-color:#007bff}.page-preview .action-buttons .btn-primary:hover{background-color:#0056b3}.page-preview .action-buttons .btn-success{color:#fff;background-color:#28a745}.page-preview .action-buttons .btn-success:hover{background-color:#218838}.page-preview .action-buttons a:hover{background-color:#ccc}.page-preview .action-buttons a:active{background-color:#aaa}.template-name{margin-top:5px}.template-price{margin-top:5px;font-weight:700}.plan-tag{z-index:2;color:#fff;opacity:0;pointer-events:none;border-radius:16px;padding:6px 14px;font-size:.95rem;font-weight:600;transition:opacity .3s;position:absolute;top:12px;left:12px;box-shadow:0 2px 8px #0000001f}.plan-tag.basic{background:#007bff}.plan-tag.premium{background:#e67e22!important}.template-item:hover .plan-tag{opacity:1;pointer-events:auto}.template-item .plan-tag{background:#007bff}@media screen and (max-width:1024px){.websiteTemplates{gap:25px;width:100%;max-width:768px;height:100%;margin:0 auto;padding:25px}.websiteTemplates h2{font-size:1.5rem}.templates-container{padding:25px 0}.page-preview{width:calc(100% - 40px);height:300px;margin:0 20px}.page-preview .action-buttons a{color:#000;cursor:pointer;background-color:#fff;border:none;border-radius:5px;width:120px;padding:10px 8px;font-size:14px;font-weight:500}}@media screen and (max-width:768px){.websiteTemplates{text-align:center;gap:25px;width:100%;max-width:100%;height:100%;margin:0 auto;padding:25px 0}.websiteTemplates h2{width:100%;font-size:1rem}.templates-container{grid-template-columns:repeat(1,1fr);padding:25px 0}.page-preview{width:calc(100% - 40px);height:250px;margin:0 20px;position:relative;overflow:hidden}.page-preview .action-buttons a{color:#000;cursor:pointer;background-color:#fff;border:none;border-radius:5px;width:100px;padding:8px 6px;font-size:12px;font-weight:500}.plan-tag{pointer-events:auto;opacity:1!important}}