.elementor-508 .elementor-element.elementor-element-7d3a3cd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:10%;--padding-bottom:0%;--padding-left:4%;--padding-right:4%;}.elementor-508 .elementor-element.elementor-element-7d3a3cd:not(.elementor-motion-effects-element-type-background), .elementor-508 .elementor-element.elementor-element-7d3a3cd > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:radial-gradient(at center center, #D1D1F0 0%, #FFFFFF 100%);}.elementor-508 .elementor-element.elementor-element-47af331f{margin:4% 0% calc(var(--kit-widget-spacing, 0px) + 1%) 0%;text-align:start;}.elementor-508 .elementor-element.elementor-element-47af331f .elementor-heading-title{font-family:"Archivo", Sans-serif;font-size:50px;font-weight:600;text-transform:none;font-style:normal;text-decoration:none;line-height:1.2em;letter-spacing:0px;color:#000000;}.elementor-508 .elementor-element.elementor-element-3fbed418{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 5%) 0%;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-bottom:calc(28px/2);}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-top:calc(28px/2);}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-right:calc(28px/2);margin-left:calc(28px/2);}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items.elementor-inline-items{margin-right:calc(-28px/2);margin-left:calc(-28px/2);}body.rtl .elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{left:calc(-28px/2);}body:not(.rtl) .elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{right:calc(-28px/2);}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-item:not(:last-child):after{content:"";height:100%;border-color:#555555;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child):after{border-top-style:solid;border-top-width:1px;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:not(:last-child):after{border-left-style:solid;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-inline-items .elementor-icon-list-item:not(:last-child):after{border-left-width:1px;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-icon i{color:#002BFF;font-size:0px;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-icon svg{fill:#002BFF;--e-icon-list-icon-size:0px;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-icon{width:0px;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-text, .elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-text a{color:#555555;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-item{font-family:"Manrope", Sans-serif;font-size:16px;font-weight:600;text-transform:none;font-style:normal;text-decoration:none;line-height:1.5em;letter-spacing:0px;}.elementor-508 .elementor-element.elementor-element-2ac6275a{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 8%) 0%;}.elementor-508 .elementor-element.elementor-element-2ac6275a img{width:100%;height:530px;object-fit:cover;object-position:center center;filter:brightness( 105% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-508 .elementor-element.elementor-element-6edbd49c{margin:5% 0% calc(var(--kit-widget-spacing, 0px) + 05%) 0%;text-align:center;}.elementor-508 .elementor-element.elementor-element-6edbd49c .elementor-heading-title{font-family:"Archivo", Sans-serif;font-size:22px;font-weight:700;text-transform:capitalize;font-style:normal;text-decoration:none;line-height:1.2em;letter-spacing:0px;color:#000000;}.elementor-508 .elementor-element.elementor-element-3951de2{--grid-row-gap:24px;width:100%;max-width:100%;--grid-column-gap:50px;}.elementor-508 .elementor-element.elementor-element-3951de2 > .elementor-widget-container{margin:0% 0% 0% 0%;padding:0px 0px 60px 0px;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-508 .elementor-element.elementor-element-3951de2:after{content:"0.5";}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__thumbnail__link{width:100%;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__text{padding:24px 0px 18px 0px;}.elementor-508 .elementor-element.elementor-element-3951de2.elementor-posts--thumbnail-left .elementor-post__thumbnail__link{margin-right:8px;}.elementor-508 .elementor-element.elementor-element-3951de2.elementor-posts--thumbnail-right .elementor-post__thumbnail__link{margin-left:8px;}.elementor-508 .elementor-element.elementor-element-3951de2.elementor-posts--thumbnail-top .elementor-post__thumbnail__link{margin-bottom:8px;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__thumbnail img{filter:brightness( 105% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__title, .elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__title a{color:#000000;font-family:"Manrope", Sans-serif;font-size:19px;font-weight:600;line-height:1.5em;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__title{margin-bottom:10px;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__meta-data{color:#555555;font-family:"Manrope", Sans-serif;font-size:14px;font-weight:700;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__meta-data span:before{color:#555555;}@media(min-width:768px){.elementor-508 .elementor-element.elementor-element-7d3a3cd{--content-width:856px;}}@media(max-width:1024px){.elementor-508 .elementor-element.elementor-element-7d3a3cd{--padding-top:100px;--padding-bottom:0px;--padding-left:32px;--padding-right:32px;}.elementor-508 .elementor-element.elementor-element-47af331f .elementor-heading-title{font-size:60px;line-height:1.2em;}.elementor-508 .elementor-element.elementor-element-3fbed418 .elementor-icon-list-item{font-size:14px;}.elementor-508 .elementor-element.elementor-element-2ac6275a img{height:470px;}.elementor-508 .elementor-element.elementor-element-6edbd49c .elementor-heading-title{font-size:45px;}}@media(max-width:767px){.elementor-508 .elementor-element.elementor-element-7d3a3cd{--padding-top:80px;--padding-bottom:0px;--padding-left:32px;--padding-right:32px;}.elementor-508 .elementor-element.elementor-element-47af331f{margin:12% 0% calc(var(--kit-widget-spacing, 0px) + 2%) 0%;}.elementor-508 .elementor-element.elementor-element-47af331f .elementor-heading-title{font-size:32px;line-height:1.2em;}.elementor-508 .elementor-element.elementor-element-2ac6275a img{height:250px;}.elementor-508 .elementor-element.elementor-element-6edbd49c{width:100%;max-width:100%;margin:10% 0% calc(var(--kit-widget-spacing, 0px) + 12%) 0%;}.elementor-508 .elementor-element.elementor-element-6edbd49c .elementor-heading-title{font-size:28px;line-height:1.1em;}.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__thumbnail__link{width:100%;}}/* Start custom CSS for theme-post-featured-image, class: .elementor-element-2ac6275a */.elementor-508 .elementor-element.elementor-element-2ac6275a {
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8d8a841 */:root {
  --brand-primary: #9185DE;
  --brand-primary-light: rgba(145, 133, 222, 0.08);
  --brand-primary-tint: rgba(145, 133, 222, 0.12);
  --brand-primary-border: rgba(145, 133, 222, 0.15);
  --brand-accent: #D2E97A;
  --brand-accent-hover: #c1da65;
  --text-dark: #111111;
  --text-muted: #000000;
  --text-gray: #555555;
  --text-light-gray: #666666;
  --bg-light: #FAFAFC;
  --bg-white: #FFFFFF;
}

.blog-main-wrapper {
  margin: 0 auto 40px auto; 
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--text-dark);
  line-height: 1.75;
}

.article-rich-body p {
  font-size: 18px;
  color: var(--text-muted);
  margin-bottom: 26px;
}

.article-rich-body .editorial-lead-text {
  font-size: 21px;
  font-weight: 700;
  color: var(--text-dark);
  line-height: 1.5;
  letter-spacing: -0.2px;
}

.text-color-highlight {
  color: var(--brand-primary);
  font-weight: 700;
}

.editorial-pullquote {
  border-left: 4px solid var(--brand-primary);
  background-color: var(--brand-primary-light);
  padding: 24px 30px;
  margin: 35px 0;
  border-radius: 0 20px 20px 0;
  font-style: italic;
  font-size: 17px;
  color: #222222;
  line-height: 1.65;
}

/* ==========================================================================
   Carousel System para sa Mobile (Dito nagbago ang layout infrastructure)
   ========================================================================== */
.framework-grid-container {
  margin: 35px 0;
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 15px; 
}

.framework-grid-container::-webkit-scrollbar {
  display: none;
}
.framework-grid-container {
  -ms-overflow-style: none;  
  scrollbar-width: none;  
}

.framework-card-item {
  display: flex;
  gap: 20px;
  background: var(--bg-light);
  padding: 24px;
  border-radius: 20px;
  border: 1px solid rgba(145, 133, 222, 0.05);
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  flex: 0 0 80%; 
  scroll-snap-align: center;
}

@media (min-width: 768px) {
  .framework-grid-container {
    flex-direction: column;
    gap: 24px;
    overflow-x: visible;
    padding-bottom: 0;
  }
  
  .framework-card-item {
    flex: initial; 
  }
}

.card-number-node {
  background-color: var(--brand-primary);
  color: var(--bg-white);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 14px;
  flex-shrink: 0;
}

.card-text-block h3 {
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 8px 0;
  color: var(--text-dark);
}

.card-text-block p {
  margin: 0 !important;
  font-size: 15px;
  color: #444444;
  line-height: 1.65;
}

/* Conversion CTA Module Banner */
.conversion-cta-banner {
  background-color: var(--brand-primary-light);
  border: 1px solid var(--brand-primary-border);
  border-radius: 24px;
  padding: 32px;
  margin: 40px 0;
}

.cta-flex-layout {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media (min-width: 600px) {
  .cta-flex-layout {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
  }
}

.cta-copy-wrapper h3 {
  font-size: 20px;
  font-weight: 800;
  margin: 0 0 8px 0;
  color: var(--text-dark);
  letter-spacing: -0.3px;
}

.cta-copy-wrapper p {
  font-size: 14px !important;
  margin: 0 !important;
  color: var(--text-gray) !important;
  line-height: 1.5;
}

.premium-action-btn {
  background-color: var(--brand-accent);
  color: #000000 !important;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  padding: 15px 26px;
  border-radius: 30px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  box-shadow: 0 5px 20px rgba(210, 233, 122, 0.25);
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.premium-action-btn:hover {
  background-color: #000000;
  transform: translateY(-1px);
  color: #FFFFFF !important;
}

.premium-action-btn:after {
  content: ' →';
  transition: transform 0.2s ease;
}

.premium-action-btn:hover:after {
  transform: translateX(4px);
}

@media (max-width: 575px) {
    .framework-card-item {
        display: block;
    }
    
    .card-text-block {
        margin-top: 20px;
    }
}/* End custom CSS */
/* Start custom CSS for posts, class: .elementor-element-3951de2 *//* ==========================================================================
   ELEMENTOR POSTS WIDGET PREMIUM UPGRADE (S&W PLUS THEME)
   ========================================================================== */

/* 1. Main Card Structure Transformation */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(145, 133, 222, 0.1) !important; /* Subtle purple outline */
  border-radius: 24px !important;
  padding: 0px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), 
              box-shadow 0.3s cubic-bezier(0.25, 1, 0.5, 1), 
              border-color 0.3s ease !important;
}

/* Elegant Hover Lift Effect */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post:hover {
  transform: translateY(-8px) !important;
  border-color: #9185DE !important; /* Changes to branding purple */
  box-shadow: 0 20px 40px rgba(145, 133, 222, 0.08) !important;
}

/* 2. Smooth Image Zoom Interaction */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__thumbnail {
  overflow: hidden !important;
}

.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__thumbnail img {
  transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
  width: 100% !important;
}

/* 3. Text Padding Allocation (Creates internal whitespace) */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__text {
  padding: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

/* 4. Meta Data Styling (Date Elements) */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__meta-data {
  font-family: 'Manrope', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #666666 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 12px !important;
}

/* 5. Title Typography Overhaul */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__title,
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__title a {
  font-family: 'Manrope', sans-serif !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  color: #111111 !important;
  letter-spacing: -0.4px !important;
  margin: 0 0 14px 0 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post:hover .elementor-post__title a {
  color: #9185DE !important; /* Title turns purple on hover */
}

/* 6. Excerpt/Description Copy Layout */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__excerpt,
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__excerpt p {
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  color: #444444 !important;
  line-height: 1.6 !important;
  margin-bottom: 0px !important;
  flex-grow: 1 !important; /* Pushes button to base */
}

/* 7. Dynamic Read More Custom Link Indicator */
.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__read-more {
  font-family: 'Manrope', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #9185DE !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  margin-top: 20px !important;
  transition: color 0.2s ease !important;
}

.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post__read-more:after {
  content: ' →' !important;
  transition: transform 0.2s ease !important;
}

.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post:hover .elementor-post__read-more {
  color: #111111 !important;
}

.elementor-508 .elementor-element.elementor-element-3951de2 .elementor-post:hover .elementor-post__read-more:after {
  transform: translateX(4px) !important;
}/* End custom CSS */