/* Team Grid Block Styles */

/* Make InnerBlocks wrapper transparent in editor */
.astangu-team-grid-editor .block-editor-inner-blocks,
.astangu-team-grid-editor .block-editor-block-list__layout {
	display: contents;
}

/* Ensure proper grid layout in editor */
.astangu-team-grid-editor .block-editor-block-list__layout {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 1.5rem;
}

/* Frontend: Remove WordPress wrappers */
.wp-block-astangu-team-grid > .wp-block-group__inner-container,
.wp-block-astangu-team-grid .wp-block {
	display: contents;
}

/* Remove div wrapper inside team grid ul */
ul[role="list"].grid > div {
	display: contents;
}

/* Force 3-column grid layout since Tailwind class may not be compiled */
ul[role="list"].grid.grid-cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	column-gap: 32px !important;
	row-gap: 80px !important;
}

/* Constrain team member images to fixed width like reference (w-52 = 208px) */
ul[role="list"].grid li img,
ul[role="list"].grid li > div:first-child {
    width: 208px !important;
    flex: none !important;
}

/* Fix aspect ratio for team member images/placeholders (Tailwind aspect-4/5 not compiled) */
ul[role="list"].grid li img.aspect-4\/5,
ul[role="list"].grid li div.aspect-4\/5,
.aspect-4\/5 {
    aspect-ratio: 4 / 5 !important;
}

/* Fix placeholder background color (Tailwind bg-gray-300 not compiled) */
ul[role="list"].grid li div.bg-gray-300,
.bg-gray-300 {
    background-color: rgb(209, 213, 219) !important;
}

/* Fix image/placeholder outline to match reference (subtle black 5% opacity) */
ul[role="list"].grid li img,
ul[role="list"].grid li div.rounded-2xl {
    outline: 1px solid rgba(0, 0, 0, 0.05) !important;
    outline-offset: -1px !important;
}

/* Center the team section title and subtitle */
.wp-block-astangu-team-grid .mx-auto.max-w-2xl,
.bg-white .mx-auto.max-w-2xl,
.bg-white.py-24 .max-w-2xl,
.wp-block-group .max-w-2xl {
    text-align: center !important;
}

/* Center the Kontakt page title heading */
main h1.heading-cond-bold,
main .text-4xl.heading-cond-bold,
.entry-content h1,
.entry-content .wp-block-heading {
    text-align: center !important;
}

/* Center subtitle text */
main .text-lg\/8.text-gray-600,
.entry-content > p {
    text-align: center !important;
}

/* Add space between images/placeholders and text below */
ul[role="list"].grid li img,
ul[role="list"].grid li > div:first-child,
ul[role="list"].grid li > div.aspect-4\/5,
ul[role="list"].grid li > div.rounded-2xl {
    margin-bottom: 32px !important;
}

/* Add spacing above and below the team section */
.wp-block-astangu-team-grid,
.bg-white.py-24 {
    padding-top: 80px !important;
    padding-bottom: 120px !important;
}

/* Space between title/subtitle and the grid */
ul[role="list"].grid {
    margin-top: 64px !important;
    margin-bottom: 120px !important;
}