.page-hero{z-index:1;padding:24px 0 64px;position:relative}.page-hero .breadcrumb{color:var(--color-text-subtle);margin-bottom:32px;font-size:.85em}.page-hero .breadcrumb a{color:var(--color-accent)}.page-hero .breadcrumb span{color:var(--color-border-medium);margin:0 8px}.page-hero-title{text-align:center;margin-bottom:32px}.page-hero-title h1{margin:0;font-size:clamp(2em,3.5vw,10em);font-weight:600;line-height:1.15}.page-hero-inner{align-items:center;gap:0;display:flex}.page-hero-text{flex:5;padding-right:40px}.page-hero-text p{color:#363e4a;margin:0;font-size:18px;font-weight:300;line-height:1.7}[data-theme=dark] .page-hero-text p{color:var(--color-text-muted)}.page-hero-image{border-radius:16px;flex:7;overflow:hidden}.page-hero-image img{object-fit:cover;border-radius:16px;width:100%;height:380px;display:block}.template-section{z-index:1;border-top:1px solid var(--color-border);padding:80px 0;position:relative}.template-header{text-align:center;margin-bottom:16px}.template-header h2{margin:0;font-size:clamp(2em,3.5vw,10em);font-weight:200}.template-subtitle{text-align:center;color:var(--color-text-muted);max-width:700px;margin:0 auto 64px;font-size:1.05em;line-height:1.7}.template-content{grid-template-columns:1fr 1.4fr;align-items:start;gap:48px;display:grid}.template-text-col{flex-direction:column;gap:32px;display:flex}.template-block{border:1px solid var(--color-border);background:var(--color-blog-card-bg);border-radius:12px;padding:32px}.template-block h3{margin:0 0 10px;font-size:1.4em;font-weight:500}.template-block ol{color:var(--color-text-muted);margin:0;padding-left:20px;font-size:.92em;line-height:1.8}.template-block ol li{margin-bottom:8px}.template-block p{color:var(--color-text-muted);margin:0;font-size:.95em;line-height:1.7}.template-diagram{justify-content:center;align-items:center;display:flex}.template-diagram img{width:100%;height:auto;display:block}@media (max-width:1024px){.page-hero-title h1{font-size:clamp(2em,3.5vw,10em)}.page-hero-image img{height:340px}.template-header h2{font-size:clamp(2em,3.5vw,10em)}}@media (max-width:768px){.page-hero-inner{flex-direction:column;gap:32px}.page-hero-text{padding-right:0}.page-hero-title h1{font-size:clamp(2em,3.5vw,10em)}.page-hero-image img{max-width:100%;height:280px}.template-header h2{font-size:1.8em}.template-content{grid-template-columns:1fr}}@media (max-width:480px){.page-hero-title h1{font-size:1.6em}.page-hero-image img{height:220px}.template-header h2{font-size:1.5em}.template-block{padding:24px}.template-block h3{font-size:1.05em}}