.spectra-layout-guide.components-modal__frame.components-guide{max-height:800px}.spectra-layout-guide .components-guide__container{gap:10px}.spectra-layout-guide .components-button:hover svg{fill:var(--wp-components-color-accent,var(--wp-admin-theme-color,#3858e9))!important}.spectra-layout-guide .components-guide__page-image{align-items:center;background:#f8f9fa;border-radius:8px;display:flex;justify-content:center;margin-bottom:1rem}.spectra-layout-guide__page{margin:0 auto;max-width:600px;padding:2rem}.spectra-layout-guide__page h2{color:#1e1e1e;font-size:1.5rem;font-weight:600;line-height:1.2;margin:1rem 0}.spectra-layout-guide__page p{color:#757575;font-size:1rem;font-style:normal;font-weight:400;line-height:1.6;line-height:24px;margin:1rem 0}.spectra-layout-guide__icon{margin-bottom:1rem}.spectra-layout-guide__icon .dashicon,.spectra-layout-guide__icon svg{color:var(--wp-components-color-accent,var(--wp-admin-theme-color,#3858e9))}.spectra-layout-guide__features{background:#f0f6ff;border-left:4px solid var(--wp-components-color-accent,var(--wp-admin-theme-color,#3858e9));border-radius:6px;margin:1.5rem 0;padding:1rem;text-align:left}.spectra-layout-guide__features strong{color:#1e1e1e;display:block;font-weight:600;margin-bottom:.5rem}.spectra-layout-guide__features ul{margin:0;padding-left:1.25rem}.spectra-layout-guide__features ul li{color:#555;line-height:1.4;margin:.25rem 0}.spectra-layout-guide__tip{background:#fff8e1;border-left:4px solid #ffc107;border-radius:6px;margin:1.5rem 0;padding:1rem;text-align:left}.spectra-layout-guide__tip strong{color:#1e1e1e;display:block;font-weight:600;margin-bottom:.5rem}.spectra-layout-guide__tip p{color:#666;line-height:1.5;margin:0}@media(max-width:768px){.spectra-layout-guide__page{padding:1.5rem}.spectra-layout-guide__layout-demo{margin:1.5rem 0;padding:1rem}.spectra-layout-guide__layout-demo.flex-demo{flex-direction:column;gap:.5rem}.spectra-layout-guide__layout-demo.grid-demo{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr)}}
.wp-block-spectra-container{box-sizing:border-box;max-width:100%;padding:10px;position:relative}.wp-block-spectra-container .wp-block-spectra-container{--spectra-overlay-opacity:initial}.wp-block-spectra-container>*{position:relative;z-index:0}.wp-block-spectra-container:after,.wp-block-spectra-container:before{border-radius:inherit}.wp-block-spectra-container:not(.alignfull){width:100%}.wp-block-spectra-container.has-image-background[style*=border-radius],.wp-block-spectra-container.has-video-background[style*=border-radius],.wp-block-spectra-container.spectra-background-image[style*=border-radius]{overflow:hidden;overflow:clip!important}.wp-block-spectra-container.wp-block-spectra-container-is-layout-flex{flex-wrap:nowrap}.wp-block-spectra-container[class*=wp-block].spectra-text-color{color:var(--spectra-text-color)}.wp-block-spectra-container[class*=wp-block].spectra-text-color *{color:inherit}.wp-block-spectra-container[class*=wp-block].spectra-background-color:not(.spectra-background-image){isolation:isolate}.wp-block-spectra-container[class*=wp-block].spectra-background-color:not(.spectra-background-image):before{background:var(--spectra-background-color);bottom:0;content:"";left:0;opacity:var(--spectra-overlay-opacity,1);pointer-events:none;position:absolute;right:0;top:0}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient:not(.spectra-background-image){isolation:isolate}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient:not(.spectra-background-image):before{background:var(--spectra-background-gradient);bottom:0;content:"";left:0;opacity:var(--spectra-overlay-opacity,1);pointer-events:none;position:absolute;right:0;top:0}.wp-block-spectra-container[class*=wp-block].spectra-background-color.spectra-background-image{isolation:isolate;position:relative}.wp-block-spectra-container[class*=wp-block].spectra-background-color.spectra-background-image:before{background:var(--spectra-background-color);bottom:0;content:"";left:0;opacity:var(--spectra-overlay-opacity,1);pointer-events:none;position:absolute;right:0;top:0;z-index:0}.wp-block-spectra-container[class*=wp-block].spectra-background-color.spectra-background-image>:not(.spectra-background-video__wrapper){position:relative;z-index:3}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient.spectra-background-image{isolation:isolate;position:relative}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient.spectra-background-image:before{background:var(--spectra-background-gradient);bottom:0;content:"";left:0;opacity:var(--spectra-overlay-opacity,1);pointer-events:none;position:absolute;right:0;top:0;z-index:0}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient.spectra-background-image>:not(.spectra-background-video__wrapper){position:relative;z-index:3}.wp-block-spectra-container[class*=wp-block].spectra-text-color-hover:hover{color:var(--spectra-text-color-hover)!important}.wp-block-spectra-container[class*=wp-block].spectra-text-color-hover:hover *{color:inherit!important}.wp-block-spectra-container[class*=wp-block].spectra-background-color-hover:not(.spectra-background-image):hover:before{background:var(--spectra-background-color-hover);opacity:var(--spectra-overlay-opacity,1)}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient-hover:not(.spectra-background-image):hover:before{background:var(--spectra-background-gradient-hover);opacity:var(--spectra-overlay-opacity,1)}.wp-block-spectra-container[class*=wp-block].spectra-background-color-hover.spectra-background-image:hover:before{background:var(--spectra-background-color-hover);opacity:var(--spectra-overlay-opacity,1)}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient-hover.spectra-background-image:hover:before{background:var(--spectra-background-gradient-hover);opacity:var(--spectra-overlay-opacity,1)}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient:not(.has-video-background){isolation:isolate}.wp-block-spectra-container[class*=wp-block].spectra-background-gradient:not(.has-video-background):before{background:var(--spectra-background-gradient,var(--spectra-background-color));content:"";inset:0;opacity:var(--spectra-overlay-opacity);position:absolute}.wp-block-spectra-container[class*=wp-block].has-container-overlay:not(.has-video-background){isolation:isolate;position:relative}.wp-block-spectra-container[class*=wp-block].has-container-overlay:not(.has-video-background):after{background-attachment:var(--spectra-overlay-attachment,scroll);background-blend-mode:var(--spectra-overlay-blend-mode,normal);background-image:var(--spectra-overlay-image,none);background-position:var(--spectra-overlay-position,center);background-repeat:var(--spectra-overlay-repeat,no-repeat);background-size:var(--spectra-overlay-size,cover);border-radius:inherit;bottom:0;content:"";left:0;mix-blend-mode:var(--spectra-overlay-blend-mode,normal);opacity:var(--spectra-overlay-opacity-value,0);pointer-events:none;position:absolute;right:0;top:0;z-index:1}.wp-block-spectra-container[class*=wp-block].has-container-overlay:not(.has-video-background)>*{position:relative;z-index:2}.wp-block-spectra-container[class*=wp-block].has-container-overlay:not(.has-video-background)[style*="--spectra-overlay-image: none"]:after{display:none}.wp-block-spectra-container[class*=wp-block].has-video-background .spectra-background-video__wrapper{border-radius:inherit;height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:-1}.wp-block-spectra-container[class*=wp-block].has-video-background .spectra-background-video__wrapper video{border-radius:inherit;height:100%;object-fit:cover;width:100%}.wp-block-spectra-container[class*=wp-block].has-video-background>*{position:relative;z-index:1}.wp-block-spectra-container[class*=wp-block].spectra-box-shadow{box-shadow:var(--spectra-box-shadow)}.wp-block-spectra-container[class*=wp-block].spectra-box-shadow:hover{box-shadow:var(--spectra-box-shadow-hover,var(--spectra-box-shadow))!important}.wp-block-spectra-container[class*=wp-block].spectra-box-shadow-hover:hover{box-shadow:var(--spectra-box-shadow-hover)!important}