.elementor-953 .elementor-element.elementor-element-d78d008{--display:flex;}.elementor-953 .elementor-element.elementor-element-d78d008:not(.elementor-motion-effects-element-type-background), .elementor-953 .elementor-element.elementor-element-d78d008 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-953 .elementor-element.elementor-element-3d8af1c{--grid-columns:3;}@media(max-width:1024px){.elementor-953 .elementor-element.elementor-element-3d8af1c{--grid-columns:2;}}@media(max-width:767px){.elementor-953 .elementor-element.elementor-element-3d8af1c{--grid-columns:1;}}/* Start custom CSS for loop-grid, class: .elementor-element-3d8af1c *//* 1. Setup the Master Grid Framework */
.elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    grid-auto-rows: 200px !important; 
    grid-auto-flow: dense !important;  
    gap: 24px !important;              
}

.elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid > .elementor-element {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
}

/* 2. Read the card sizes from the content inside them automatically */

/* If the item contains your Sündmus design (2x2) */
.elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid > .elementor-element:has(.sundmus-card-marker) {
    grid-column: span 2 !important;
    grid-row: span 2 !important;
}

/* If the item contains your Juhend design (1x2 Tall) */
.elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid > .elementor-element:has(.juhend-card-marker) {
    grid-column: span 1 !important;
    grid-row: span 2 !important;
}

/* If the item contains your Fotogalerii design (1x2 Tall) */
.elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid > .elementor-element:has(.galerii-card-marker) {
    grid-column: span 1 !important;
    grid-row: span 2 !important;
}

/* 1x1 Cards (Mõte and Foto) naturally take up span 1 / row span 1, no code needed */


/* =========================================================
   4. MOBILE RESPONSIVENESS (FLAWLESS COLLAPSE)
   ========================================================= */
@media (max-width: 1024px) {
    .elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* Tablets drop to 2 columns */
    }
}

@media (max-width: 767px) {
    .elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid {
        grid-template-columns: 1fr !important; /* Phones collapse to a single clean row */
        grid-auto-rows: auto !important;
    }
    .elementor-953 .elementor-element.elementor-element-3d8af1c .e-loop-grid > .elementor-element {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
    }
}/* End custom CSS */
/* Start custom CSS */.cards-wrapper {
  overflow: visible !important;
}

.cards-wrapper > * {
  overflow: visible !important;
}

.cards-wrapper * {
  overflow: visible !important;
}/* End custom CSS */