.elementor-kit-164{--e-global-color-primary:#B8B0A6;--e-global-color-secondary:#8F8579;--e-global-color-text:#2F2F2F;--e-global-color-accent:#D8CFC4;--e-global-color-15c60b0:#DBCECE;--e-global-color-5680675:#928C8C;--e-global-color-d02350c:#58534EFA;--e-global-color-eb2438e:#2B2420;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;font-family:"Inter", Sans-serif;}.elementor-kit-164 e-page-transition{background-color:#FFBC7D;}.elementor-kit-164 h1{font-family:"Playfair Display", Sans-serif;}.elementor-kit-164 h2{font-family:"Playfair Display", Sans-serif;}.elementor-kit-164 h3{font-family:"Playfair Display", Sans-serif;}.elementor-kit-164 h4{font-family:"Playfair Display", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================================
   DECOKODIT – GLOBAL CUSTOM CSS (FINAL CLEAN)
   - Brand styles
   - Safe typography
   - Mobile: fix Posts section height collapse (no overlap)
   - Mobile: fix top Posts thumbnails (background cover + ratio)
========================================= */

/* Brand tokens */
:root{
  --decokodit-primary: #B8B0A6;
  --decokodit-secondary: #8F8579;
  --decokodit-accent: #D8CFC4;
  --decokodit-background: #F6F2EE;
  --decokodit-text: #2F2F2F;

  --decokodit-font-headings: "Playfair Display", serif;
  --decokodit-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Base */
body{
  color: var(--decokodit-text);
  background-color: var(--decokodit-background);
  font-family: var(--decokodit-font-body);
  font-weight: 400;
  line-height: 1.7;
}

/* Links */
a{ color: var(--decokodit-primary); text-decoration: none; }
a:hover{ color: var(--decokodit-secondary); }

/* Headings */
h1, h2, h3, h4, h5, h6{
  font-family: var(--decokodit-font-headings);
  font-weight: 600;
  letter-spacing: 0.1px;
  color: var(--decokodit-primary);
}

/* Optional heading scale */
h1{ font-size: 46px; line-height: 1.15; }
h2{ font-size: 34px; line-height: 1.25; }
h3{ font-size: 26px; line-height: 1.3; }
h4{ font-size: 20px; line-height: 1.35; }

/* Buttons (Elementor) */
.elementor .elementor-button{
  background-color: var(--decokodit-secondary);
  color: var(--decokodit-background);
  border-radius: 5px;
}
.elementor .elementor-button:hover{
  background-color: var(--decokodit-primary);
  color: var(--decokodit-background);
}

/* Highlight utility */
.decokodit-highlight{
  background-color: var(--decokodit-accent);
  padding: 40px;
}

/* =========================================
   MOBILE FIXES
========================================= */
@media (max-width: 767px){

  /* Mobile typography */
  body{ font-size: 16px; }
  h1{ font-size: 32px; }
  h2{ font-size: 26px; }
  h3{ font-size: 22px; }
  h4{ font-size: 18px; }

  /* -------------------------------------------------
     A) ROOT FIX: stop height collapse in the POSTS SECTION
     Parent container is flex (home-posts-wrap). On mobile,
     make it block so it measures its children correctly.
  -------------------------------------------------- */

  .home-posts-wrap,
  .home-posts-wrap > .e-con-inner{
    display: block !important;       /* kill flex on mobile for this section */
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /* Clear any floated/odd children just in case */
  .home-posts-wrap::after,
  .home-posts-wrap > .e-con-inner::after{
    content: "" !important;
    display: block !important;
    clear: both !important;
  }

  /* -------------------------------------------------
     B) TOP POSTS WIDGET FIX (ONLY #home-posts-top)
     Ensure widget + its internal container reserve height.
  -------------------------------------------------- */

  #home-posts-top,
  #home-posts-top .elementor-widget-container,
  #home-posts-top .elementor-posts-container,
  #home-posts-top .elementor-widget-posts{
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    position: static !important;     /* prevent absolute overlays */
  }

  /* Clearfix inside widget containers */
  #home-posts-top .elementor-widget-container::after,
  #home-posts-top .elementor-posts-container::after{
    content: "" !important;
    display: block !important;
    clear: both !important;
  }

  /* Each post card: keep in normal flow */
  #home-posts-top article.elementor-post{
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
  }

  /* Thumbnail is a DIV with background-image: make it fill nicely */
  #home-posts-top .elementor-post__thumbnail{
    display: block !important;
    width: 100% !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    /* ratio box */
    height: 0 !important;
    padding-bottom: 56.25% !important; /* 16:9 */
  }

  /* Keep text below image */
  #home-posts-top .elementor-post__text{
    margin-top: 12px !important;
    position: static !important;
    transform: none !important;
  }

  /* Remove potential ratio pseudo spacers */
  #home-posts-top .elementor-post__thumbnail__link::before,
  #home-posts-top .elementor-post__thumbnail__link::after{
    content: none !important;
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Small spacing after widget */
  #home-posts-top{
    margin-bottom: 40px !important;
  }
}/* End custom CSS */