/* Reference: design/refs/amie, matching the existing guide page. */
.template-page{max-width:1200px}
.template-page .lede,.template-page article>p,.template-page #use,.template-page #faq{max-width:720px}
.template-nav{display:flex;flex-wrap:wrap;gap:8px 24px;margin:24px 0}
.template-nav a{display:inline-flex;align-items:center;min-height:44px}
.template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.template-card{margin:0;min-width:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.template-card img{display:block;width:100%;height:auto;background-color:#e8ebef;background-image:conic-gradient(#fff 25%,transparent 0 50%,#fff 0 75%,transparent 0);background-size:20px 20px}
.template-card figcaption{padding:16px}
.template-card strong{display:block;font-size:15px;font-weight:600}
.template-card a{display:inline-flex;align-items:center;min-height:44px;font-size:16px}
.template-page a:focus-visible{outline:3px solid var(--brand);outline-offset:4px}
.template-page .cta:active{transform:scale(.98)}
@media(max-width:900px){.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.template-grid{grid-template-columns:1fr}.template-page{padding-left:20px;padding-right:20px}.template-page .cta{height:auto;min-height:48px;padding:12px 20px}}
@media(min-width:1600px){.template-page{max-width:1600px;padding-left:300px;position:relative}.template-nav{position:sticky;top:24px;float:left;width:240px;margin-left:-280px;flex-direction:column}.template-page article>p,.template-page #use,.template-page #faq{max-width:720px}}
