.template-page-head{display:flex;align-items:center;justify-content:space-between;margin:5px 0 28px}.template-page-head h1{margin:7px 0 0;font:900 30px "Archivo",sans-serif}.template-page-head p{margin:6px 0 0;color:#71849a;font-size:13px}.template-page-head>span{display:grid;place-items:center;width:56px;height:56px;border-radius:17px;background:#193b65;color:#6eb3ff}.template-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.template-card{overflow:hidden;border:1px solid #223047;border-radius:19px;background:#111a29}.template-preview-trigger{position:relative;display:block;width:100%;height:310px;padding:0;border:0;background:#09101a;overflow:hidden;cursor:pointer}.template-browser{display:flex;align-items:center;gap:5px;height:35px;padding:0 11px;background:#182337}.template-browser>i{width:6px;height:6px;border-radius:50%;background:#56677e}.template-browser>b{margin-left:5px;color:#778aa1;font-size:8px}.template-mini-page{display:flex;flex-direction:column;align-items:center;height:275px;padding:25px 28px;background:var(--mini-bg);color:var(--mini-text);text-align:center}.template-mini-logo{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:color-mix(in srgb,var(--mini-text) 13%,transparent);font-style:normal;font-weight:900}.template-mini-page>strong{margin-top:12px}.template-mini-page>small{margin:4px 0 13px;color:color-mix(in srgb,var(--mini-text) 65%,transparent);font-size:8px}.template-mini-page>em{display:flex;align-items:center;gap:7px;width:100%;margin-top:6px;padding:8px 10px;border-radius:8px;background:var(--mini-button);color:#fff;font-size:8px;font-style:normal;font-weight:800;text-align:left}.preview-hover{position:absolute;inset:35px 0 0;display:grid;place-items:center;align-content:center;gap:8px;background:rgba(4,10,18,.72);color:#fff;font-size:11px;font-weight:900;opacity:0;backdrop-filter:blur(4px);transition:opacity .2s}.preview-hover i{font-size:22px}.template-preview-trigger:hover .preview-hover{opacity:1}.template-card-copy{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:18px 18px 13px}.template-card-copy h2{margin:0;font-size:16px}.template-card-copy p{margin:4px 0 0;color:#71849a;font-size:10px}.template-card-actions{display:flex;gap:7px;padding:0 18px 18px}.template-preview-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;visibility:hidden;opacity:0;transition:.2s}.template-preview-modal.open{visibility:visible;opacity:1}.template-preview-backdrop{position:absolute;inset:0;background:rgba(2,6,12,.86);backdrop-filter:blur(8px)}.template-preview-modal>section{position:relative;display:flex;flex-direction:column;width:min(96vw,1450px);height:min(92vh,930px);border:1px solid #29374b;border-radius:21px;background:#0d1521;box-shadow:0 35px 100px rgba(0,0,0,.55);overflow:hidden}.template-preview-modal header{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:70px;padding:12px 18px;border-bottom:1px solid #253146}.template-preview-modal h2{margin:3px 0 0;font-size:16px}.device-switcher{display:flex;gap:4px;padding:4px;border-radius:11px;background:#080e17}.device-switcher button{display:grid;place-items:center;width:38px;height:34px;border:0;border-radius:8px;background:transparent;color:#71849a}.device-switcher button.active{background:#1c3f6a;color:#fff}.template-device{flex:1;display:grid;place-items:center;padding:20px;overflow:auto;background:#070c13}.template-device iframe{height:100%;border:0;border-radius:12px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.35);transition:width .25s}.template-device.desktop iframe{width:100%}.template-device.tablet iframe{width:768px;max-width:100%}.template-device.mobile iframe{width:390px;max-width:100%}
@media(max-width:1100px){.template-gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.template-gallery{grid-template-columns:1fr}.template-preview-modal{padding:0}.template-preview-modal>section{width:100%;height:100%;border-radius:0}.template-preview-modal header>div:first-child{display:none}.template-device{padding:10px}}
