/* V1.1: readable Gutenberg editing canvas for native Web Solutions patterns.
   Does not change front-end styles or Gutenberg block data. */
.editor-styles-wrapper .wsdl.wsdl-section{
  container:wsdl-edit / inline-size;
  max-width:100%!important;
  width:100%!important;
  padding:22px 24px!important;
  margin:0 0 15px!important;
  border:1px solid #dce7f4;
  border-radius:13px!important;
  box-shadow:none!important;
  background-clip:padding-box;
  overflow:visible;
}
.editor-styles-wrapper .wsdl-hero{
  background:linear-gradient(135deg,#071e3a,#0c3d6b)!important;
}
.editor-styles-wrapper .wsdl-cta{
  width:100%!important;
  margin:0 0 15px!important;
  border-radius:13px!important;
  padding:24px!important;
}
.editor-styles-wrapper .wsdl :is(h1,h2,h3){max-width:100%;letter-spacing:-.018em!important;line-height:1.22!important;margin-bottom:10px!important}
.editor-styles-wrapper .wsdl h1{font-size:34px!important}
.editor-styles-wrapper .wsdl h2{font-size:27px!important}
.editor-styles-wrapper .wsdl h3{font-size:18px!important}
.editor-styles-wrapper .wsdl p{font-size:15px!important;line-height:1.55!important;margin-bottom:9px!important}
.editor-styles-wrapper .wsdl p.wsdl-kicker{font-size:11px!important}
.editor-styles-wrapper .wsdl .wp-block-columns{display:flex;flex-wrap:wrap!important;gap:12px!important;margin-top:12px!important}
.editor-styles-wrapper .wsdl .wp-block-column{min-width:0!important;flex:1 1 calc(50% - 12px)!important;max-width:none!important}
.editor-styles-wrapper .wsdl .wsdl-service-card,
.editor-styles-wrapper .wsdl .wsdl-benefit-card,
.editor-styles-wrapper .wsdl .wsdl-step-card,
.editor-styles-wrapper .wsdl .wsdl-split-panel{padding:16px!important;box-shadow:none!important;border-radius:12px!important}
.editor-styles-wrapper .wsdl .wp-block-button__link{min-height:36px!important;padding:9px 14px!important;font-size:12px!important}
.editor-styles-wrapper .wsdl .wp-block-buttons{margin-top:9px!important}
.editor-styles-wrapper .wsdl .wsdl-service-card:before{width:36px;height:36px;background-size:21px;margin-bottom:12px}
@container wsdl-edit (max-width:650px){
  .editor-styles-wrapper .wsdl .wp-block-column{flex-basis:100%!important}
}
@media(max-width:760px){
  .editor-styles-wrapper .wsdl.wsdl-section{padding:17px!important}
  .editor-styles-wrapper .wsdl .wp-block-column{flex-basis:100%!important}
}

/* v1.2 editor: Gutenberg child widths share a visual axis. */
.editor-styles-wrapper .wsdl.wsdl-hero.wsdl-hero--premium > :is(.wp-block-heading,p,.wp-block-buttons){max-width:100%!important;}
.editor-styles-wrapper .wsdl.wsdl-hero.wsdl-hero--premium .wp-block-buttons{justify-content:center!important;}
.editor-styles-wrapper .wsdl.wsdl-hero.wsdl-hero--premium h1{font-size:30px!important;}

/* V1.3 Portofolio — editor Gutenberg remains readable in narrow editor canvas. */
.editor-styles-wrapper .wsdl.wsdl-portfolio-hero .wsdl-portfolio-hero-cols,
.editor-styles-wrapper .wsdl.wsdl-portfolio-featured .wsdl-portfolio-featured-grid,
.editor-styles-wrapper .wsdl.wsdl-portfolio-more .wsdl-portfolio-grid-two,
.editor-styles-wrapper .wsdl.wsdl-portfolio-approach .wsdl-portfolio-approach-cols{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.editor-styles-wrapper .wsdl.wsdl-portfolio-hero h1{font-size:31px!important}
.editor-styles-wrapper .wsdl .wsdl-showcase-card-content{padding:15px!important}
.editor-styles-wrapper .wsdl .wsdl-showcase-card h3{font-size:17px!important}
.editor-styles-wrapper .wsdl.wsdl-portfolio-cta{max-width:100%!important;width:100%!important;margin:0 0 15px!important}
@media(max-width:850px){
.editor-styles-wrapper .wsdl.wsdl-portfolio-hero .wsdl-portfolio-hero-cols,
.editor-styles-wrapper .wsdl.wsdl-portfolio-featured .wsdl-portfolio-featured-grid,
.editor-styles-wrapper .wsdl.wsdl-portfolio-more .wsdl-portfolio-grid-two,
.editor-styles-wrapper .wsdl.wsdl-portfolio-approach .wsdl-portfolio-approach-cols{grid-template-columns:1fr!important}
}


/* V1.4: compact about sections in Gutenberg, frontend remains unchanged. */
.editor-styles-wrapper .wsdl.wsdl-about-hero .wsdl-about-hero-cols,
.editor-styles-wrapper .wsdl.wsdl-about-identity .wsdl-about-identity-cols,
.editor-styles-wrapper .wsdl.wsdl-about-focus .wsdl-about-focus-grid,
.editor-styles-wrapper .wsdl.wsdl-about-process .wsdl-about-process-grid,
.editor-styles-wrapper .wsdl.wsdl-about-values .wsdl-about-values-grid,
.editor-styles-wrapper .wsdl.wsdl-about-faq .wsdl-about-faq-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.editor-styles-wrapper .wsdl.wsdl-about-hero h1{font-size:31px!important}
.editor-styles-wrapper .wsdl.wsdl-about-hero .wsdl-about-hero-visual{padding:8px!important;box-shadow:none!important}
.editor-styles-wrapper .wsdl .wsdl-about-solution-card,.editor-styles-wrapper .wsdl .wsdl-about-process-item,.editor-styles-wrapper .wsdl .wsdl-about-value-card,.editor-styles-wrapper .wsdl .wsdl-about-faq-card{padding:16px!important}
.editor-styles-wrapper .wsdl.wsdl-about-cta{width:100%!important;max-width:100%!important;margin:0 0 15px!important;padding:24px!important;border-radius:13px!important}
@media(max-width:850px){.editor-styles-wrapper .wsdl.wsdl-about-hero .wsdl-about-hero-cols,.editor-styles-wrapper .wsdl.wsdl-about-identity .wsdl-about-identity-cols,.editor-styles-wrapper .wsdl.wsdl-about-focus .wsdl-about-focus-grid,.editor-styles-wrapper .wsdl.wsdl-about-process .wsdl-about-process-grid,.editor-styles-wrapper .wsdl.wsdl-about-values .wsdl-about-values-grid,.editor-styles-wrapper .wsdl.wsdl-about-faq .wsdl-about-faq-grid{grid-template-columns:1fr!important}}


/* V1.5 contact editor: two columns remain usable with the narrow editing canvas. */
.editor-styles-wrapper .wsdl.wsdl-contact-hero .wsdl-contact-hero-cols,
.editor-styles-wrapper .wsdl.wsdl-contact-form-section .wsdl-contact-form-cols,
.editor-styles-wrapper .wsdl.wsdl-contact-services .wsdl-contact-service-grid,
.editor-styles-wrapper .wsdl.wsdl-contact-process .wsdl-contact-steps,
.editor-styles-wrapper .wsdl.wsdl-contact-faq .wsdl-contact-faq-grid {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.editor-styles-wrapper .wsdl.wsdl-contact-hero h1{font-size:31px!important}
.editor-styles-wrapper .wsdl.wsdl-contact-hero .wsdl-contact-mini,
.editor-styles-wrapper .wsdl.wsdl-contact-form-section .wsdl-contact-form-card,
.editor-styles-wrapper .wsdl.wsdl-contact-services .wsdl-contact-service-card,
.editor-styles-wrapper .wsdl.wsdl-contact-process .wsdl-contact-step-card,
.editor-styles-wrapper .wsdl.wsdl-contact-faq .wsdl-contact-faq-card{padding:16px!important;box-shadow:none!important}
.editor-styles-wrapper .wsdl.wsdl-contact-form-section .wsdl-contact-form-card h3{font-size:21px!important}
.editor-styles-wrapper .wsdl.wsdl-contact-cta{width:100%!important;max-width:100%!important;margin:0 0 15px!important;padding:25px!important}
@media(max-width:850px){
 .editor-styles-wrapper .wsdl.wsdl-contact-hero .wsdl-contact-hero-cols,
 .editor-styles-wrapper .wsdl.wsdl-contact-form-section .wsdl-contact-form-cols,
 .editor-styles-wrapper .wsdl.wsdl-contact-services .wsdl-contact-service-grid,
 .editor-styles-wrapper .wsdl.wsdl-contact-process .wsdl-contact-steps,
 .editor-styles-wrapper .wsdl.wsdl-contact-faq .wsdl-contact-faq-grid{grid-template-columns:1fr!important}
}

/* V1.6 editor: ruang kartu dan visual halaman aplikasi disesuaikan saat mengedit. */
.editor-styles-wrapper .wsdl-app-hero,.editor-styles-wrapper .wsdl-app-intro,.editor-styles-wrapper .wsdl-app-solutions,.editor-styles-wrapper .wsdl-app-features,.editor-styles-wrapper .wsdl-app-usecases,.editor-styles-wrapper .wsdl-app-process,.editor-styles-wrapper .wsdl-app-faq {overflow:visible!important}
.editor-styles-wrapper .wsdl-app-hero .wsdl-app-hero-visual img{height:auto}
.editor-styles-wrapper .wsdl-app-solutions .wsdl-app-solution-grid>.wp-block-column,.editor-styles-wrapper .wsdl-app-usecases .wsdl-app-usecase-grid>.wp-block-column,.editor-styles-wrapper .wsdl-app-process .wsdl-app-process-grid>.wp-block-column{min-width:0}

/* V1.7: editor preview remains compact and comfortably editable. */
.editor-styles-wrapper .wsdl.wsdl-backlink-hero .wsdl-backlink-hero-cols,
.editor-styles-wrapper .wsdl.wsdl-backlink-intro .wsdl-backlink-intro-cols,
.editor-styles-wrapper .wsdl.wsdl-backlink-services .wsdl-backlink-service-grid,
.editor-styles-wrapper .wsdl.wsdl-backlink-quality .wsdl-backlink-quality-cols,
.editor-styles-wrapper .wsdl.wsdl-backlink-process .wsdl-backlink-process-grid,
.editor-styles-wrapper .wsdl.wsdl-backlink-faq .wsdl-backlink-faq-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.editor-styles-wrapper .wsdl.wsdl-backlink-hero h1{font-size:31px!important}
.editor-styles-wrapper .wsdl.wsdl-backlink-hero .wsdl-backlink-hero-visual{padding:7px!important;box-shadow:none!important}
.editor-styles-wrapper .wsdl.wsdl-backlink-services .wsdl-backlink-service-card,.editor-styles-wrapper .wsdl.wsdl-backlink-process .wsdl-backlink-step-card,.editor-styles-wrapper .wsdl.wsdl-backlink-faq .wsdl-backlink-faq-card{padding:16px!important}
.editor-styles-wrapper .wsdl.wsdl-backlink-cta{width:100%!important;max-width:100%!important;margin:0 0 15px!important;padding:24px!important;border-radius:13px!important}
@media(max-width:850px){.editor-styles-wrapper .wsdl.wsdl-backlink-hero .wsdl-backlink-hero-cols,.editor-styles-wrapper .wsdl.wsdl-backlink-intro .wsdl-backlink-intro-cols,.editor-styles-wrapper .wsdl.wsdl-backlink-services .wsdl-backlink-service-grid,.editor-styles-wrapper .wsdl.wsdl-backlink-quality .wsdl-backlink-quality-cols,.editor-styles-wrapper .wsdl.wsdl-backlink-process .wsdl-backlink-process-grid,.editor-styles-wrapper .wsdl.wsdl-backlink-faq .wsdl-backlink-faq-grid{grid-template-columns:1fr!important}}