.detail-intro{padding-top:32px;padding-bottom:40px}.template-breadcrumb{flex-wrap:wrap;gap:10px;font-size:11px}.detail-hero{padding-top:44px}.detail-heading{max-width:740px}.detail-heading h1{font-size:clamp(38px,4.4vw,60px);line-height:1.06;letter-spacing:-.045em;margin:18px 0}.detail-heading h1 span{color:#0033ff}.detail-heading>p{max-width:610px;font-size:14px;line-height:1.85;color:#626b7a;margin:0}.detail-meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:24px;color:#727987;font-size:11px}.detail-meta span+span{border-left:1px solid #dde1e9;padding-left:22px}.detail-meta b{color:#273249;font-weight:500}
.detail-preview{border:1px solid #e1e5ed;border-radius:20px;overflow:hidden;box-shadow:0 12px 35px #233a7510}.preview-toolbar,.preview-toolbar>div{display:flex;align-items:center;gap:13px}.preview-toolbar{justify-content:space-between;padding:20px 25px;background:#fff}.preview-toolbar h2{font-size:15px;letter-spacing:-.02em;margin:0}.preview-mark{color:#0033ff;font-size:24px}.preview-label{border-left:1px solid #dce2ec;padding-left:13px;color:#818999;font-size:10px}.preview-toolbar>a{font-size:11px;color:#0033ff}.workflow-canvas{padding:28px 32px 32px;background-color:#f5f7fd;background-image:radial-gradient(#d8dfef .8px,transparent .8px);background-size:17px 17px;border-block:1px solid #e4e8f2}.workflow-start,.workflow-finish{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#64718b}.workflow-start>span{color:#0033ff}.workflow-nodes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin:28px 0;position:relative}.workflow-node{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #dbe2f0;box-shadow:0 5px 12px #1b358509;border-radius:13px;padding:17px 18px;min-height:159px;transition:border-color .2s,box-shadow .2s}.workflow-node:hover{border-color:#6c89ff;box-shadow:0 5px 20px #1b358516}.workflow-node:not(:last-child)::after{content:'→';position:absolute;left:100%;width:28px;top:65px;text-align:center;color:#8ca1da}.node-top{display:flex;align-items:center;gap:8px}.node-number{display:grid;place-items:center;width:25px;height:25px;background:#eff3ff;border-radius:6px;font-size:10px;color:#0033ff}.node-kind{font-size:8px;letter-spacing:.1em;color:#7c879d}.node-top>span:last-child{margin-left:auto;color:#9aa5b8}.workflow-node h3{font-size:18px;line-height:1.2;letter-spacing:-.025em;margin:17px 0 20px}.node-bottom{display:flex;align-items:center;gap:6px;margin-top:auto;border-top:1px solid #edf0f5;padding-top:11px;color:#778297;font-size:9px}.node-bottom>span:last-child{margin-left:auto;color:#7a91ce}.node-dot{width:5px;height:5px;background:#bdc9e4;border-radius:50%}.workflow-finish>span{display:grid;place-items:center;width:21px;height:21px;background:#e1f2e8;color:#39845e;border-radius:50%}.preview-caption{display:flex;justify-content:space-between;gap:16px;padding:17px 25px;color:#7d8798;font-size:10px}.preview-caption>span:last-child{color:#455575}
.detail-overview{display:grid;grid-template-columns:.85fr 1.15fr;gap:95px;padding-top:88px;padding-bottom:75px;scroll-margin-top:110px}.inside-intro h2,.detail-section-heading h2{font-size:39px;line-height:1.1;letter-spacing:-.04em;margin:16px 0}.inside-intro>p{max-width:340px;color:#687286;font-size:13px;line-height:1.85}.customise-note{display:flex;gap:13px;max-width:350px;margin-top:30px;padding-top:23px;border-top:1px solid #e7eaf1}.customise-note>span{font-size:24px;color:#0033ff}.customise-note p{font-size:11px;line-height:1.8;color:#737d8f;margin:0}.customise-note strong{font-weight:500;color:#26334c}.stage-list{border-top:1px solid #e3e7ef}.stage-detail{border-bottom:1px solid #e3e7ef;scroll-margin-top:110px}.stage-detail summary{display:flex;align-items:center;gap:14px;list-style:none;cursor:pointer;padding:23px 0;font-family:'Bricolage Grotesque',sans-serif;font-size:19px;letter-spacing:-.025em}.stage-detail summary::-webkit-details-marker{display:none}.stage-index{font-family:Poppins,sans-serif;font-size:10px;color:#0033ff;background:#f0f3ff;border-radius:7px;display:grid;place-items:center;width:29px;height:29px;flex-shrink:0}.stage-detail small{font:10px Poppins,sans-serif;color:#8b94a4;margin-left:auto;white-space:nowrap}.expand{color:#6d7990;font:20px Poppins,sans-serif}.expand::after{content:'+'}.stage-detail[open] .expand::after{content:'−'}.stage-content{padding:0 0 23px 43px}.stage-content>p{font-size:11px;color:#7c8596;line-height:1.8;margin:0 0 17px}.stage-content ul{list-style:none;margin:0;padding:0}.stage-content li{display:flex;align-items:center;gap:9px;font-size:11px;line-height:1.6;padding:14px 12px;border:1px solid #e6eaf2;border-radius:8px;background:#fafbfe}.task-check{width:13px;height:13px;border:1px solid #cbd3e2;border-radius:3px;flex-shrink:0}.task-status{margin-left:auto;white-space:nowrap;background:#edf0f5;padding:3px 6px;border-radius:4px;font-size:8px;color:#7c8492}
.detail-how{border-top:1px solid #e7ebf2;padding-top:57px;padding-bottom:65px;text-align:center}.detail-section-heading h2{font-size:36px}.setup-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;list-style:none;margin:37px 0 30px;padding:0;text-align:left}.setup-steps li{padding:0 20px}.setup-steps li>span{font:22px 'Bricolage Grotesque',sans-serif;color:#0033ff}.setup-steps h3{font-size:21px;letter-spacing:-.025em;margin:13px 0 10px}.setup-steps p{font-size:12px;line-height:1.8;color:#747e91;max-width:300px}.detail-how>.btn{font-size:13px}.detail-related{padding-top:55px;border-top:1px solid #e7ebf2}.detail-related .template-section-head{margin-bottom:26px}.detail-related .template-section-head h2{font-size:31px}.detail-related .template-section-head>a{font-size:12px;color:#0033ff}
@media(max-width:1050px){.detail-overview{gap:40px}.workflow-nodes{gap:18px}.workflow-node{padding:14px}.workflow-node:not(:last-child)::after{width:18px}.workflow-node h3{font-size:16px}.setup-steps{gap:20px}}
@media(max-width:760px){.detail-intro{padding-top:24px}.detail-hero{padding-top:28px}.detail-heading h1{font-size:44px}.preview-toolbar{padding:15px}.preview-label{display:none}.workflow-canvas{padding:24px 20px}.workflow-nodes{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.workflow-node:not(:last-child)::after{display:none}.workflow-node h3{font-size:20px}.workflow-node{min-height:153px}.preview-caption{padding:15px;flex-direction:column;gap:6px}.detail-overview{grid-template-columns:1fr;gap:25px;padding-top:55px;padding-bottom:50px}.inside-intro h2{font-size:34px}.inside-intro h2 br{display:none}.inside-intro>p{max-width:100%}.customise-note{max-width:100%;margin-top:20px}.detail-how{padding-top:42px;padding-bottom:45px}.detail-section-heading h2{font-size:32px}.setup-steps{gap:20px}.setup-steps li{padding:0}.setup-steps h3{font-size:19px}.detail-related{padding-top:40px}.detail-related .template-section-head h2{font-size:26px}.detail-related .template-grid{grid-template-columns:1fr 1fr}.detail-related .template-card:last-child{display:none}}
@media(max-width:480px){.detail-heading h1{font-size:39px}.detail-meta{gap:12px;font-size:10px}.detail-meta span+span{padding-left:12px}.workflow-nodes{grid-template-columns:1fr}.workflow-node{min-height:130px}.workflow-node h3{margin:12px 0 16px}.preview-toolbar{gap:8px}.preview-toolbar>a{font-size:9px}.preview-toolbar>div{gap:8px}.stage-detail summary{font-size:17px;gap:10px}.stage-content{padding-left:0}.task-status{display:none}.setup-steps{grid-template-columns:1fr;text-align:left;margin:28px 0}.setup-steps li{position:relative;padding-left:43px}.setup-steps li>span{position:absolute;left:0;top:10px}.setup-steps p{max-width:none;margin-bottom:0}.detail-related .template-section-head{align-items:start;flex-direction:column;gap:14px}.detail-related .template-grid{grid-template-columns:1fr}.detail-related .template-card:last-child{display:flex}}
@media print{.detail-how>.btn{display:none}.detail-hero{display:block}.workflow-node{break-inside:avoid}}
