.template-hub{--template-blue:var(--blue);--template-navy:var(--navy);color:var(--ink);background:var(--soft)}
.template-hub [hidden]{display:none!important}
.template-hub .container{width:min(1200px,calc(100% - 48px));max-width:none}
.template-hub :is(a,button,input):focus-visible{outline:3px solid #2468e5;outline-offset:4px}
.template-hub h1,.template-hub h2,.template-hub h3{font-family:"DM Sans",sans-serif;color:var(--template-navy);letter-spacing:-.025em}
.template-hub-eyebrow{display:flex;align-items:center;gap:9px;color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.13em;line-height:1.6}
.template-hub-eyebrow>i{width:7px;height:7px;border-radius:50%;background:#0b5fff;box-shadow:0 0 0 5px #e0ebff}
.template-hub-hero{position:relative;overflow:hidden;isolation:isolate;padding:72px 0;border-bottom:1px solid #213563;background:radial-gradient(ellipse at 82% 18%,rgba(11,95,255,.26),transparent 55%),radial-gradient(ellipse at 5% 100%,rgba(0,184,217,.1),transparent 50%),linear-gradient(115deg,var(--navy),#07123b 60%,#102b60);color:#fff}
.template-hub-hero::before{content:"";position:absolute;z-index:-1;top:-290px;right:-180px;width:720px;height:720px;border:1px solid rgba(112,218,237,.13);border-radius:50%;pointer-events:none}
.template-hub-hero::after{content:"";position:absolute;z-index:-1;bottom:-290px;left:-180px;width:460px;height:460px;border:1px solid rgba(112,218,237,.09);border-radius:50%;pointer-events:none}
.template-hub-hero>.container{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center}
.template-hub-hero .template-hub-eyebrow{justify-content:center;color:#70daed}
.template-hub-hero .template-hub-eyebrow>i{background:var(--cyan);box-shadow:0 0 0 5px rgba(0,184,217,.16)}
.template-hub-hero a:focus-visible{outline-color:#70daed}
.template-hub-intro{width:100%;max-width:850px;min-width:0;text-align:center}
.template-hub-intro h1{margin:21px 0 22px;color:#fff;font-size:clamp(40px,4.4vw,60px);font-weight:800;line-height:1.08;letter-spacing:-.045em}
.template-hub-intro h1 span{color:#60d9ed}
.template-hub-intro>p{max-width:650px;margin:0 auto;color:#bdcce1;font-size:16px;line-height:1.8}
.template-hub-hero-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:15px 24px;margin-top:28px}
.template-hub-browse{min-height:50px;padding:13px 22px;border-color:var(--blue);background:var(--blue);color:#fff;white-space:normal;text-align:center;box-shadow:0 8px 24px rgba(11,95,255,.22)}
.template-hub-browse:hover{border-color:#094fd4;background:#094fd4}
.template-hub-hero-actions>a:last-child{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#e3ecfa;font-size:13px;font-weight:700}
.template-hub-hero-actions>a:last-child:hover{color:#70daed}
.template-hub-hero-actions>a:last-child svg{width:15px;height:15px}
.template-hub-benefits{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 18px;margin:24px 0 0;padding:0;list-style:none}
.template-hub-benefits li{display:flex;align-items:center;gap:6px;color:#c5d3e7;font-size:11px;font-weight:650}
.template-hub-benefits svg{flex:0 0 15px;width:15px;height:15px;color:#60d9ed}
.template-hub-library{padding:58px 0 44px;scroll-margin-top:100px}
.template-hub-library-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:26px}
.template-hub-library-head h2{margin:9px 0 10px;font-size:clamp(27px,3vw,35px);line-height:1.2}
.template-hub-library-head p{margin:0;color:#68788e;font-size:14px}
.template-hub-count{display:flex;align-items:center;gap:8px;flex:none;padding:9px 13px;border:1px solid #dbe5f2;border-radius:10px;background:#fff;color:#486185;font-size:12px;font-weight:700}
.template-hub-count svg{width:16px;height:16px;color:#3664ab}
.template-hub-tools{display:grid;gap:21px;margin-bottom:18px;padding:22px 24px;border:1px solid #dce5f2;border-radius:16px;background:#fff}
.template-hub-search{display:flex;align-items:center;gap:12px;width:min(100%,460px);min-height:48px;padding:0 13px;border:1px solid #d3dfef;border-radius:9px;background:#f8faff;color:#5a7190}
.template-hub-search:focus-within{border-color:#2468e5;box-shadow:0 0 0 3px #e6eeff}
.template-hub-search>svg{flex:0 0 19px;width:19px;height:19px}
.template-hub-search input{min-width:0;flex:1;width:100%;height:46px;padding:0;border:0;background:transparent;color:#14294a;font:inherit;font-size:14px;outline:none;box-shadow:none}
.template-hub-search input::placeholder{color:#637690}
.template-hub-search input::-webkit-search-cancel-button{display:none}
.template-hub-search button{display:grid;place-items:center;flex:0 0 38px;width:38px;min-height:40px;padding:8px;border:0;border-radius:6px;background:transparent;color:#476487;cursor:pointer}
.template-hub-search button:hover{background:#e8effa}
.template-hub-search button svg{width:17px;height:17px}
.template-hub-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.template-hub-filters{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
.template-hub-filters button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:9px 13px;border:1px solid #e0e7f1;border-radius:8px;background:#fff;color:#4a5c76;font-family:inherit;font-size:12px;font-weight:700;line-height:1.4;cursor:pointer}
.template-hub-filters button span{display:grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border-radius:5px;background:#edf1f7;color:#566b86;font-size:10px}
.template-hub-filters button:hover{border-color:#99baff;background:#f4f8ff;color:#164fa5}
.template-hub-filters button[aria-pressed="true"]{border-color:var(--navy);background:var(--navy);color:#fff}
.template-hub-filters button[aria-pressed="true"] span{background:#315895;color:#fff}
.template-hub-result-count{margin:0 0 17px;color:#66778e;font-size:12px}
.template-hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.template-hub-card{--card-accent:var(--blue);--card-soft:#edf4ff;display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 5px 18px rgba(10,38,80,.03);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.template-hub-card:hover,.template-hub-card:focus-within{border-color:#a5bee3;box-shadow:0 12px 28px rgba(10,38,80,.08);transform:translateY(-3px)}
.template-hub-card-top{position:relative;display:flex;align-items:center;gap:13px;min-height:108px;padding:24px;background:var(--card-soft);color:var(--card-accent);overflow:hidden}
.template-hub-icon{display:grid;place-items:center;flex:0 0 48px;height:48px;border:1px solid #ffffffc9;border-radius:13px;background:#fff;box-shadow:0 4px 8px #152b5010}
.template-hub-icon svg{width:24px;height:24px}
.template-hub-format{position:relative;z-index:1;font-size:9px;font-weight:800;line-height:1.6;letter-spacing:.08em}
.template-hub-mini-paper{position:absolute;right:18px;bottom:-19px;display:grid;align-content:start;gap:9px;width:66px;height:90px;padding:20px 12px;border:1px solid #ffffffb3;border-radius:7px;background:#ffffffb3;transform:rotate(12deg);opacity:.7}
.template-hub-mini-paper i{display:block;height:3px;border-radius:3px;background:currentColor;opacity:.22}
.template-hub-mini-paper i:last-child{width:60%}
.template-hub-card-body{display:flex;flex:1;flex-direction:column;min-width:0;padding:25px}
.template-hub-category{display:block;margin-bottom:10px;color:var(--card-accent);font-size:10px;font-weight:800;line-height:1.5;letter-spacing:.085em}
.template-hub-card h3{margin:0 0 13px;font-size:21px;line-height:1.32;font-weight:750}
.template-hub-card-body>p{margin:0 0 25px;color:#5e6e84;font-size:13px;line-height:1.8}
.template-hub-actions{display:grid;gap:8px;margin-top:auto;padding-top:18px;border-top:1px solid #e7edf5}
.template-hub-download{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:11px 12px;border:1px solid #d4dfef;border-radius:8px;background:#f7faff;color:#194e9d;font-size:13px;font-weight:750;line-height:1.5;text-align:center}
.template-hub-download:hover{border-color:#0b5fff;background:#0b5fff;color:#fff}
.template-hub-download svg{flex:0 0 17px;width:17px;height:17px}
.template-hub-guide{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;color:#556984;font-size:12px;font-weight:650;line-height:1.5;text-align:center}
.template-hub-guide svg{flex:0 0 15px;width:15px;height:15px}
.template-hub-guide:hover{color:#0b5fff;text-decoration:underline;text-underline-offset:4px}
.template-hub-empty{padding:44px 24px;border:1px dashed #c6d6ec;border-radius:16px;background:#fff;text-align:center}
.template-hub-empty>svg{width:32px;height:32px;margin:0 auto 15px;color:#6c8ab5}
.template-hub-empty h3{margin:0 0 10px;font-size:22px}
.template-hub-empty p{margin:0 0 19px;color:#63758d;font-size:14px}
.template-hub-empty button{min-height:44px;padding:10px 19px;border:1px solid #c5d7f1;border-radius:8px;background:#edf4ff;color:#1e52a1;font-family:inherit;font-weight:700;cursor:pointer}
.template-hub-how{margin-top:42px;padding:36px;border:1px solid #263a6b;border-radius:20px;background:linear-gradient(120deg,var(--navy),#10265f);color:#fff;scroll-margin-top:100px}
.template-hub-how .template-hub-eyebrow{color:#55d7ed}
.template-hub-how h2{margin:10px 0 28px;color:#fff;font-size:30px;line-height:1.25}
.template-hub-how ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none}
.template-hub-how li{display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;align-items:start;min-width:0;padding:22px 18px;border:1px solid #344674;border-radius:12px;background:rgba(255,255,255,.045)}
.template-hub-step-number{display:grid;grid-column:1;place-items:center;width:42px;height:42px;border:1px solid #4164a6;border-radius:10px;background:#183b79;color:#72def0;font-size:13px;font-weight:800}
.template-hub-step-copy{grid-column:2;min-width:0}
.template-hub-how h3{margin:0 0 10px;color:#fff;font-size:17px;line-height:1.4;letter-spacing:0}
.template-hub-how li p{margin:0;color:#c1d0e8;font-size:14px;line-height:1.75}
.template-hub-save-note{margin:26px 0 0;padding-top:19px;border-top:1px solid #344674;color:#b9cae5;font-size:12px;line-height:1.75}
.template-hub-note{display:flex;align-items:start;gap:16px;margin-top:22px;padding:23px 27px;border:1px solid #d6e7ed;border-radius:14px;background:#edf6f8}
.template-hub-note>svg{flex:0 0 23px;width:23px;height:23px;margin-top:2px;color:#39798b}
.template-hub-note h2{margin:0 0 7px;font-size:19px;line-height:1.35}
.template-hub-note p{margin:0;color:#506b7b;font-size:12px;line-height:1.8}
.template-hub-related{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:21px}
.template-hub-related a{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#315991;font-size:12px;font-weight:700}
.template-hub-related svg{width:15px;height:15px;flex:none}
.template-hub-related a:hover{text-decoration:underline;text-underline-offset:4px}
/* The banner defines the first grid row; its upper half shares the white page. */
body[data-route="/templates/"] .site-footer{--template-footer-top:32px;padding-top:var(--template-footer-top);overflow:hidden}
body[data-route="/templates/"] .site-footer>.container{display:grid;grid-template-columns:minmax(0,1fr);isolation:isolate}
body[data-route="/templates/"] .site-footer>.container:has(>.footer-callout)::before{content:"";grid-area:1/1;align-self:start;justify-self:center;width:100vw;height:calc(50% + var(--template-footer-top));transform:translateY(calc(-1 * var(--template-footer-top)));background:#fff;z-index:-1;pointer-events:none}
body[data-route="/templates/"] .footer-callout{grid-area:1/1;transform:none;margin:0}
body[data-route="/templates/"] .footer-capabilities{margin-top:28px}
@media(min-width:1101px){.template-hub-tools{grid-template-columns:1fr auto;align-items:center;gap:20px}.template-hub-filters{gap:7px}.template-hub-filters button{padding-inline:11px}}
@media(max-width:1000px){
 .template-hub-hero{padding-block:48px}
 .template-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .template-hub-how{padding:27px}
 .template-hub-how ol{gap:20px}
}
@media(max-width:900px){.template-hub-how ol{grid-template-columns:1fr;gap:14px}}
@media(max-width:700px){
 .template-hub .container{width:calc(100% - 32px)}
 .template-hub-hero{padding-block:38px}
 .template-hub-intro h1{font-size:clamp(38px,8.3vw,52px)}
 .template-hub-intro>p{font-size:15px}
 .template-hub-library{padding-block:38px;scroll-margin-top:88px}
 .template-hub-library-head{align-items:start;flex-direction:column;gap:17px;margin-bottom:22px}
 .template-hub-library-head h2{font-size:28px}
 .template-hub-tools{min-width:0;padding:16px;gap:16px}
 .template-hub-search{width:100%;max-width:none}
 .template-hub-filters{min-width:0;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding:4px 4px 9px;margin:-4px;scrollbar-width:thin}
 .template-hub-filters button{flex:0 0 auto}
 .template-hub-grid{grid-template-columns:1fr;gap:19px}
 .template-hub-card-body{padding:24px}
 .template-hub-how{margin-top:30px;padding:24px 21px;scroll-margin-top:88px}
 .template-hub-how h2{font-size:24px;margin-bottom:24px}
 .template-hub-how ol{grid-template-columns:1fr;gap:14px}
 .template-hub-how li{padding:18px 15px;gap:12px}
 .template-hub-note{padding:21px;gap:12px}
 .template-hub-related{align-items:flex-start;flex-direction:column;gap:2px;margin-top:19px}
 body[data-route="/templates/"] .site-footer{--template-footer-top:24px}
 body[data-route="/templates/"] .footer-capabilities{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){.template-hub-card{transition:none}.template-hub-card:hover,.template-hub-card:focus-within{transform:none}}
