/* Structural styles for The Door Man blocks. Colors/typography come from the active theme
   via CSS custom properties, with neutral fallbacks so the blocks work with any theme. */

.tdm-services, .tdm-areas, .tdm-projects, .tdm-contact, .tdm-breadcrumbs { list-style: none; margin: 0; padding: 0; }

/* Service cards */
.tdm-services--cards { display: grid; gap: var(--wp--preset--spacing--40, 1.5rem); grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.tdm-card { position: relative; display: flex; flex-direction: column; background: var(--tdm-card-bg, #fff); border: 1px solid var(--tdm-card-border, rgba(0,0,0,.12)); border-radius: var(--tdm-radius, 6px); overflow: hidden; transition: border-color .15s ease, transform .15s ease; }
.tdm-card:hover, .tdm-card:focus-within { border-color: var(--wp--preset--color--accent, currentColor); }
.tdm-card__media img { display: block; width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; }
.tdm-card__body { display: flex; flex-direction: column; gap: .5rem; flex: 1; padding: var(--wp--preset--spacing--30, 1.25rem); }
.tdm-card__title { margin: 0; font-size: var(--wp--preset--font-size--medium, 1.2rem); line-height: 1.25; }
.tdm-card__title a { color: inherit; text-decoration: none; }
.tdm-card__title a::after { content: ""; position: absolute; inset: 0; } /* whole card clickable */
.tdm-card__title a:focus-visible { outline: none; }
.tdm-card:focus-within { outline: 3px solid var(--wp--preset--color--accent, #1a5fb4); outline-offset: 2px; }
.tdm-card__text { margin: 0; }
.tdm-card__more { margin-top: auto; font-weight: 600; color: var(--wp--preset--color--accent-dark, inherit); }
.tdm-card__more::after { content: " →"; }
.tdm-services--links { display: grid; gap: .4rem; }

/* Areas */
.tdm-areas--grid { display: grid; gap: .5rem 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr)); }
.tdm-areas--inline { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }
.tdm-areas__item { padding: .2rem 0; }

/* Gallery grid */
.tdm-projects { display: grid; gap: var(--wp--preset--spacing--30, 1.25rem); grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.tdm-project-card a { display: block; color: inherit; text-decoration: none; }
.tdm-project-card__media { position: relative; aspect-ratio: 4 / 3; background: var(--tdm-placeholder, #e9e6e1); border-radius: var(--tdm-radius, 6px); overflow: hidden; }
.tdm-project-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tdm-project-card__title { display: block; margin-top: .5rem; font-weight: 600; }
.tdm-badge { position: absolute; left: .6rem; top: .6rem; padding: .2rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 700; background: rgba(0,0,0,.72); color: #fff; }

/* Project media */
.tdm-figure { margin: 0; }
.tdm-figure img { display: block; width: 100%; height: auto; border-radius: var(--tdm-radius, 6px); }
.tdm-figure__label { display: inline-block; margin-bottom: .4rem; padding: .15rem .6rem; border-radius: 999px; font-weight: 700; font-size: .85rem; letter-spacing: .04em; text-transform: uppercase; background: var(--wp--preset--color--contrast, #111); color: var(--wp--preset--color--base, #fff); }
.tdm-figure__caption { margin-top: .4rem; font-size: .9rem; opacity: .8; }
.tdm-ba-pair { display: grid; gap: var(--wp--preset--spacing--30, 1.25rem); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 782px) { .tdm-ba-pair { grid-template-columns: 1fr 1fr; } }
.tdm-ba-pair img, .tdm-ba-combined img { object-fit: contain; max-height: none; } /* never crop */
.tdm-photo-grid { display: grid; gap: var(--wp--preset--spacing--30, 1.25rem); grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); }

/* Contact */
.tdm-contact { display: grid; gap: .5rem; }
.tdm-contact__label { display: block; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; opacity: .75; }

/* Breadcrumbs */
.tdm-breadcrumbs { display: flex; flex-wrap: wrap; gap: .25rem; font-size: .9rem; }
.tdm-breadcrumbs li + li::before { content: "/"; margin-right: .25rem; opacity: .5; }
.tdm-breadcrumbs [aria-current] { opacity: .8; }

.tdm-note { padding: .75rem 1rem; border: 1px dashed currentColor; border-radius: 4px; opacity: .75; }

@media (prefers-reduced-motion: reduce) { .tdm-card { transition: none; } }