.develop-faster-container{padding:80px 0;background:var(--Surface-Grey)}
.develop-faster-container .content-container{align-items:flex-start;gap:24px}
.develop-faster-container .header h2{padding-bottom:4px}
.cubemx-web h2{color:var(--Text-Title,#03234b);font-family:var(--Font-Family-Helvetica,"Helvetica Now Display");font-size:var(--Font-Size-H2,24px);font-style:normal;font-weight:800;line-height:var(--Line-Height-H2,32px);letter-spacing:var(--Letter-Spacing-H2,0.24px)}
.develop-faster-container .header p{font-family:var(--Font-Family-Helvetica);color:var(--Text-Title);font-size:var(--Font-Size-Body-M);font-style:normal;font-weight:500;line-height:var(--Line-Height-Body-M);letter-spacing:var(--Letter-Spacing-Body-M);padding-bottom:0}
.develop-faster-container .header b{color:var(--Text-Title)}
.develop-faster-container .category-grid{display:grid;grid-template-columns:16fr 16fr 35fr 16fr 16fr;gap:24px;width:100%;max-width:1200px}
.develop-faster-container .d-mobile-icon{display:none}
.develop-faster-container .category-title,.develop-faster-container .documentation-title{font-family:var(--Font-Family-Helvetica);color:var(--Text-Title);font-size:var(--Font-Size-Body-S);font-style:normal;font-weight:800;line-height:var(--Line-Height-Body-S);letter-spacing:var(--Letter-Spacing-Body-S);margin-bottom:11px;text-align:center}
.develop-faster-container .category-title::before,.develop-faster-container .documentation-title::before,.develop-faster-container .docs-support-grid::after{content:'';display:block;position:relative;background-color:var(--Surface-Contrast);width:100%;height:15px;margin-bottom:11px}
.develop-faster-container .docs-support-grid::after{margin-top:15px;margin-bottom:0}
.develop-faster-container .category-container{background:var(--Surface-Main);height:367px;min-height:367px;display:flex;flex-wrap:wrap;justify-content:center;gap:40px;padding-top:63px;padding-bottom:33px}
.develop-faster-container .feature-icon-container{display:flex;flex-direction:column;align-items:center;text-align:center;max-height:fit-content}
.develop-faster-container .feature-tile,.develop-faster-container .documentation-tile{position:relative;pointer-events:none}
.develop-faster-container .feature-icon,.develop-faster-container .documentation-icon{pointer-events:none}
.develop-faster-container .feature-icon img,.develop-faster-container .documentation-icon img{width:94px;height:92px;object-fit:contain;pointer-events:none}
.develop-faster-container .feature-name,.develop-faster-container .documentation-name{font-family:var(--Font-Family-Helvetica);color:var(--Text-Action);font-size:var(--Font-Size-Body-S);font-style:normal;font-weight:700;line-height:var(--Line-Height-Body-S);letter-spacing:var(--Letter-Spacing-Body-S);padding-bottom:0}
.develop-faster-container .feature-icon-container:hover,.develop-faster-container .documentation-icon-container:hover{text-decoration:underline;text-decoration-color:var(--Text-Action)}
.develop-faster-container .docs-support-grid{width:100%}
.develop-faster-container .documentation-container{background:var(--Surface-Main);height:149px;min-height:149px;display:flex;flex-wrap:wrap;justify-content:flex-start;gap:82px;align-items:center;padding:30px 25px 27px}
.develop-faster-container .documentation-icon-container{display:flex;align-items:center;text-align:center;max-height:fit-content;gap:21px}
.develop-faster-container .blue-spot{position:absolute;top:-16px;right:-16px;pointer-events:none}
.develop-faster-container .blue-spot-pulse{position:absolute;top:-6px;right:-6px;width:20px;transition:all 1s ease;pointer-events:none}
.develop-faster-container .blue-spot-pulse,.develop-faster-container .blue-spot-pulse::before,.develop-faster-container .blue-spot-pulse::after{display:grid;grid-area:1/1;aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 0 #0047ab1d;animation:pulsing 1s ease-in-out infinite}
.develop-faster-container .stdTempl-video-main-container{display:none}
.develop-faster-container .hidden{display:none}
@keyframes pulsing{0{box-shadow:0 0 0 0 rgba(0,71,171,0.114)}
50%{box-shadow:0 0 0 .4rem rgba(0,71,171,0.114)}
70%,100%{box-shadow:0 0 0 .4em rgba(0,71,171,0)}
}
@media only screen and (min-width:1001px) and (max-width:1200px){.develop-faster-container .feature-icon-container{position:relative;max-width:max-content;width:120px}
}
@media(max-width:1280px){.develop-faster-container{padding:56px 0}
.develop-faster-container .documentation-container{flex-wrap:nowrap}
.develop-faster-container .header h2{font-size:.952rem;line-height:24px;letter-spacing:.2px}
.develop-faster-container .header p{font-size:.762rem;line-height:26px}
.develop-faster-container .category-grid{grid-template-columns:16fr 16fr 34.5fr 16fr 16fr}
.develop-faster-container .feature-icon img,.develop-faster-container .documentation-icon img{width:91px;height:92px}
.develop-faster-container .category-title,.develop-faster-container .documentation-title{letter-spacing:normal}
.develop-faster-container .feature-icon-container{position:relative;max-width:max-content;width:120px}
}
@media only screen and (min-width:641px) and (max-width:1000px){.develop-faster-container .category-container{background:var(--Surface-Main);height:inherit;min-height:inherit;display:flex;flex-wrap:wrap;justify-content:center;gap:20px;align-items:center;padding:30px 25px 27px}
.develop-faster-container .documentation-container{height:inherit;min-height:inherit;gap:20px}
.develop-faster-container .category-title,.develop-faster-container .documentation-title{text-align:center}
}
@media(max-width:1280px) and (min-width:998px){.develop-faster-container .category-grid{align-items:stretch;grid-auto-rows:1fr}
.develop-faster-container .category-item{display:flex;flex-direction:column;min-height:0}
.develop-faster-container .category-container{height:auto;min-height:367px;flex:1 1 auto}
}
@media only screen and (min-width:641px) and (max-width:998px){.develop-faster-container .category-grid{grid-template-columns:16fr 16fr 16fr}
}
@media(max-width:640px){.develop-faster-container{padding:24px 0}
.develop-faster-container .content-container{max-width:382px;gap:20px}
.develop-faster-container .header h2{font-size:1.143rem;line-height:32px;letter-spacing:.24px}
.develop-faster-container .header p{font-size:.667rem;line-height:24px}
.develop-faster-container .category-grid{grid-template-columns:1fr}
.develop-faster-container .docs-support-grid{display:grid;grid-template-columns:1fr;gap:24px;max-width:1200px}
.develop-faster-container .category-title,.develop-faster-container .documentation-title{font-size:.952rem;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;margin-bottom:8px;text-align:left}
.develop-faster-container .category-title::before,.develop-faster-container .documentation-title::before,.develop-faster-container .docs-support-grid::after{content:none}
.develop-faster-container .category,.develop-faster-container .documentation{text-align:left}
.develop-faster-container .feature-name,.develop-faster-container .documentation-name{flex-grow:1}
.develop-faster-container .category-container,.develop-faster-container .documentation-container{display:flex;flex-wrap:wrap;justify-content:start;flex-direction:column;gap:4px;padding:0;height:inherit;min-height:inherit;background:0;align-items:unset}
.develop-faster-container .d-mobile-icon{display:block}
.develop-faster-container .feature-icon-container,.develop-faster-container .documentation-icon-container{display:flex;flex-direction:row;align-items:center;text-align:left;max-height:fit-content;gap:15px;background:var(--Surface-Main);flex-grow:1;padding-right:15px;max-width:unset;width:unset}
.develop-faster-container .feature-tile,.develop-faster-container .documentation-tile{width:inherit;height:inherit;min-width:55px}
.develop-faster-container .feature-icon img,.develop-faster-container .documentation-icon img{width:inherit;height:inherit}
.develop-faster-container .blue-spot,.develop-faster-container .blue-spot-pulse{display:none}
}
.df-modal{left:0;position:absolute;top:0;transform:translateY(-50%);transition:opacity .5s;z-index:100;overflow:hidden;width:100%;max-width:549px;background:#fff;border-radius:12px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:17px 14px 20px;gap:17px;box-shadow:0 8px 24px 0 rgba(3,35,75,0.10)}
.df-modal .df-video-wrapper,.df-modal .df-video-wrapper video{width:100%}
.df-modal .df-video-wrapper{background:#f7f8fa;display:flex;align-items:center;cursor:pointer}
.df-modal .df-video-wrapper video{border-radius:6px}
.df-modal .df-button{font-family:var(--Font-Family-Helvetica);color:var(--Text-Action);font-size:var(--Font-Size-Body-S);font-style:normal;font-weight:700;line-height:var(--Line-Height-Body-S);letter-spacing:var(--Letter-Spacing-Body-S);text-align:center;display:flex;height:36px;padding:8px}
.df-modal.is-hiding{animation:dialog-disappear .5s forwards}
.df-modal.is-hidden{opacity:0}
.df-modal.is-showing{animation:dialog-appear .5s forwards}
.df-modal h4{font-family:Helvetica,Arial,sans-serif;color:#03234b;font-size:.667rem;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.42px;margin-bottom:11px;text-align:center;padding:0;margin:0}
.df-modal p{font-family:Helvetica,Arial,sans-serif;color:#525a63;font-size:.667rem;font-style:normal;font-weight:500;line-height:24px;letter-spacing:.42px;padding-bottom:10px}
.df-modal .df-content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:100%}
.df-modal .link-wrapper{margin-top:auto;display:flex;justify-content:flex-end;width:100%;margin-right:4px}
.df-modal a{margin-top:auto}
.df-modal .stdTempl-video-container{display:block}
@media(min-width:1025px){.df-modal button{display:none}
}
@media(min-width:641px){.df-modal a{white-space:nowrap}
}
@media(max-width:640px){.df-modal{bottom:0;height:100%;left:0 !important;position:fixed;top:auto !important;transform:translate(0);width:100vw}
.df-modal .df-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.25)}
.df-modal.is-hiding .df-content{animation:dialog-content-showing .5s reverse forwards}
.df-modal.is-showing .df-content{animation:dialog-content-showing .5s forwards}
.df-modal .df-content{border-radius:6px 6px 0 0;box-shadow:0 2px 6px rgba(0,0,0,0.5);left:0;max-height:calc(100% - 140px);overflow-y:auto;position:absolute;bottom:0;transition:all .5s;width:100%;z-index:1}
}