.templates-main{width:calc(100% - 64px);max-width:1320px;margin:34px auto 12px;box-sizing:border-box}
.templates-hero{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:40px;align-items:center;padding:40px 44px;border:1px solid #dfe8f5;border-radius:16px;background:linear-gradient(135deg,#fbfdff 0%,#f4f8ff 100%);box-sizing:border-box}
.templates-hero>*{min-width:0}
.templates-eyebrow{margin:0 0 10px;color:#2563eb;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.templates-hero h1,.template-group-head h2{margin:0;color:#0f1c38;font-weight:800;letter-spacing:0}
.templates-hero h1{max-width:700px;font-size:clamp(30px,4vw,52px);line-height:1.04;white-space:normal;overflow-wrap:anywhere}
.templates-hero p:not(.templates-eyebrow){max-width:650px;margin:18px 0 0;color:#52698c;font-size:17px;line-height:1.6;overflow-wrap:anywhere}
.templates-hero-stats{padding-left:28px;border-left:1px solid #d7e2f1}.templates-hero-stats strong,.templates-hero-stats span,.templates-hero-stats small{display:block}.templates-hero-stats strong{color:#2563eb;font-size:44px;line-height:1}.templates-hero-stats span{margin-top:8px;color:#0f1c38;font-size:15px;font-weight:700}.templates-hero-stats small{margin-top:12px;color:#7184a2;font-size:12px}
.templates-jump{display:flex;gap:8px;margin:30px 0 8px}.templates-jump a{padding:9px 15px;border:1px solid #dce6f3;border-radius:999px;color:#52698c;font-size:13px;font-weight:700;text-decoration:none}.templates-jump a:hover,.templates-jump a.is-active{border-color:#a9c8ff;background:#edf4ff;color:#2563eb}
.template-group{margin:38px 0 56px;scroll-margin-top:24px}.template-group-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}.template-group-head h2{font-size:28px;line-height:1.15}.template-group-head>span{color:#7488a7;font-size:13px;font-weight:700}
.templates-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}.templates-grid-single{grid-template-columns:minmax(0,260px)}
.template-browse-card{min-width:0;overflow:hidden;border:1px solid #dfe8f5;border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(27,64,116,.05);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.template-browse-card:hover{border-color:#b7d0f7;box-shadow:0 14px 30px rgba(27,64,116,.11);transform:translateY(-3px)}.template-browse-card>a{display:block;height:100%;color:inherit;text-decoration:none}
.template-browse-media{display:grid;height:188px;padding:12px;place-items:center;overflow:hidden;background-color:#fbfdff;background-image:linear-gradient(#eaf1fa 1px,transparent 1px),linear-gradient(90deg,#eaf1fa 1px,transparent 1px);background-size:24px 24px;box-sizing:border-box}.template-browse-media svg{display:block;width:100%;height:100%;max-width:100%;max-height:100%}
.template-browse-copy{position:relative;min-height:166px;padding:17px 18px 20px}.template-browse-kind{display:block;margin-bottom:7px;color:#2563eb;font-size:11px;font-weight:700;text-transform:uppercase}.template-browse-copy h3{margin:0 34px 8px 0;color:#0f1c38;font-size:19px;font-weight:800}.template-browse-copy p{margin:0;color:#607596;font-size:13px;line-height:1.55}.template-browse-arrow{position:absolute;right:17px;bottom:17px;display:grid;width:30px;height:30px;place-items:center;border-radius:50%;background:#f0f5fb;color:#2563eb;font-size:18px;line-height:1}
@media(max-width:1200px){.templates-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.templates-main{width:calc(100% - 32px);max-width:720px}.templates-hero{grid-template-columns:1fr;padding:32px}.templates-hero-stats{padding:18px 0 0;border-top:1px solid #d7e2f1;border-left:0}.templates-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){.templates-main{width:calc(100% - 24px);max-width:520px;margin-top:22px}.templates-hero{gap:24px;padding:26px 22px}.templates-hero h1{font-size:34px}.templates-hero p:not(.templates-eyebrow){font-size:15px}.templates-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.template-browse-media{height:145px;padding:8px}.template-browse-copy{min-height:166px;padding:14px}.template-browse-copy h3{font-size:17px}}
@media(max-width:440px){.templates-grid,.templates-grid-single{grid-template-columns:1fr}.template-browse-media{height:190px}.template-browse-copy{min-height:140px}}