/* Developer directories reuse the approved portraits; singles give the brand room to breathe. */
.merade-developers-page .merade-developer-grid { margin: 0; }
.merade-developers-page .merade-developer-card-link { width: 100%; }
body.single-merade_developer { --project-gutter: var(--catalog-gutter); }
.merade-developer-page.merade-project-page { max-width: none; padding: 0 0 48px; }
.merade-developer-hero {
 position: relative; isolation: isolate; display: grid; grid-template-rows: auto 1fr; gap: 28px;
 min-height: 520px; padding: 22px max(var(--project-gutter), calc((100% - 1328px) / 2)) 64px;
 background: var(--merade-navy); color: var(--merade-ivory);
}
.merade-developer-hero-media { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.merade-developer-hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
/* Match the approved city hero: strong contrast behind copy, open imagery on the right. */
.merade-developer-hero-media::after {
 content: ''; position: absolute; inset: 0; pointer-events: none;
 background: linear-gradient(90deg, rgb(10 20 34 / 94%) 0%, rgb(10 20 34 / 76%) 45%, rgb(10 20 34 / 35%) 100%), linear-gradient(0deg, rgb(10 20 34 / 20%), transparent 45%);
}
.merade-developer-hero-content { align-self: center; display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); align-items: center; gap: 20px clamp(28px, 4vw, 64px); }
.merade-developer-hero-actions { display: grid; align-self: end; gap: 12px; min-width: 0; }
.merade-developer-hero-actions > button {
 display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; margin: 0; padding: 13px 20px;
 border: 1px solid transparent; border-radius: 8px; box-shadow: none;
 font: 500 14px/1.5 var(--merade-font-body); text-align: center; text-transform: none; cursor: pointer; touch-action: manipulation;
 transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 120ms var(--ease-out, cubic-bezier(.23, 1, .32, 1));
}
.merade-developer-hero-actions .merade-developer-brochure { background: rgb(10 20 34 / 30%); border-color: rgb(245 243 238 / 55%); color: var(--merade-ivory); }
.merade-developer-hero-actions .merade-developer-consultation { justify-content: space-between; background: var(--merade-ivory); border-color: var(--merade-ivory); color: var(--merade-navy); text-align: left; }
.merade-developer-hero-actions .merade-symbol { order: -1; flex-shrink: 0; width: 20px; height: 20px; font-size: 20px; }
.merade-developer-hero-actions .merade-developer-consultation .merade-symbol { order: 0; }
.merade-developer-hero-actions > button:focus-visible { outline: 2px solid var(--merade-gold); outline-offset: 4px; transition: none; }
.merade-developer-hero-actions > button:active:not(:focus-visible) { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) {
 .merade-developer-hero-actions .merade-developer-brochure:hover { background: rgb(245 243 238 / 12%); border-color: var(--merade-ivory); }
 .merade-developer-hero-actions .merade-developer-consultation:hover { background: #fff; border-color: #fff; }
}
@media (max-width: 1000px) {
 .merade-developer-hero-content { grid-template-columns: minmax(0, 1fr); gap: 28px; }
 .merade-developer-hero-actions { width: min(100%, 360px); }
}
@media (prefers-reduced-motion: reduce) {
 .merade-developer-hero-actions > button { transition: none; }
 .merade-developer-hero-actions > button:active:not(:focus-visible) { transform: none; }
}
.merade-developer-summary { align-self: center; position: relative; min-width: 0; width: min(100%,760px); }
.merade-developer-page .merade-developer-hero h1 { color: var(--merade-ivory); font-size: clamp(42px,4.5vw,66px); text-wrap: balance; }
.merade-developer-intro { color: #e1e4e7; font-size: 17px; line-height: 1.6; }
.merade-developer-hero .merade-breadcrumbs { margin: 0; padding: 0; color: var(--merade-gold); font: 400 13px/1.5 var(--merade-font-body); }
.merade-developer-hero .merade-breadcrumbs p { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.merade-developer-hero .merade-breadcrumbs a { text-decoration: none; }
.merade-developer-page .merade-developer-hero a:focus-visible { outline-color: var(--merade-gold); }
.merade-developer-page > section { width: calc(100% - 2 * var(--project-gutter)); max-width: 1328px; margin-inline: auto; }
.merade-developer-page:has(> h1) { max-width: calc(1328px + 2 * var(--project-gutter)); padding: 22px var(--project-gutter) 48px; }
.merade-developer-intro > :last-child { margin-bottom: 0; }
.merade-developer-intro :is(ul,ol) { margin: 14px 0; padding-inline-start: 22px; }
.merade-developer-page .merade-developer-catalog { margin-top: 36px; margin-inline: auto; }
.merade-developer-company { margin-top: 36px; padding-block: 12px 8px; }
.merade-company-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border: 1px solid #dce0e3; }
.merade-company-fact { display: grid; grid-template-columns: clamp(120px, 12vw, 160px) minmax(0, 1fr); align-content: start; gap: 6px 16px; min-width: 0; padding: 12px 16px; border-bottom: 1px solid #dce0e3; }
.merade-company-fact.is-column-start { border-inline-end: 1px solid #dce0e3; }
.merade-company-fact:last-child { border-bottom: 0; }
.merade-company-facts-measure { position: absolute; visibility: hidden; pointer-events: none; }
.merade-company-fact dt { margin: 0; color: #626b76; font: 400 14px/1.6 var(--merade-font-body); }
.merade-company-fact dd { min-width: 0; margin: 0; color: var(--merade-navy); font: 400 15px/1.6 var(--merade-font-body); overflow-wrap: anywhere; }
.merade-company-fact a { color: inherit; text-decoration-line: underline; text-decoration-thickness: 1px; text-decoration-color: rgb(18 29 46 / 30%); text-underline-offset: 4px; }
.merade-company-fact a:focus-visible { outline: 2px solid var(--merade-gold); outline-offset: 4px; }
.merade-company-facts .merade-company-values { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.merade-company-facts .merade-company-values > li { margin: 0; }
.merade-company-contact-name { font-weight: 600; }
.merade-company-fact .merade-company-logo { display: block; width: auto; max-width: min(100%, 180px); max-height: 100px; object-fit: contain; }
@media (min-width: 1001px) {
 .merade-company-fact:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
}
@media (max-width: 1000px) {
 .merade-company-facts { grid-template-columns: minmax(0, 1fr); }
 .merade-company-fact.is-column-start { border-inline-end: 0; }
}
@media (max-width: 600px) {
 .merade-company-fact { grid-template-columns: minmax(0, 1fr); gap: 3px; padding: 10px 12px; }
}
.merade-developer-page .merade-developer-feedback { padding: 22px; border: 1px solid var(--merade-surface); border-radius: 12px; background: white; }
@media(hover:hover) and (pointer:fine) {
 .merade-developer-hero .merade-breadcrumbs a:hover { text-decoration: underline; text-underline-offset: 4px; }
}
@media(max-width:760px) {
 .merade-developer-page.merade-project-page { padding-bottom: 32px; }
 .merade-developer-hero { min-height: 440px; padding-block: 20px 40px; }
 .merade-developer-hero-media::after { background: rgb(10 20 34 / 80%); }
 .merade-developer-page .merade-developer-hero h1 { font-size: clamp(38px,7vw,52px); }
 .merade-developer-intro { font-size: 16px; }
 .merade-developer-page .merade-developer-catalog { margin-top: 28px; }
}

/* Optional company facts sit with the developer introduction. */
.merade-developer-identity { grid-column: 1; box-sizing: border-box; width: min(100%, 760px); display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 20px; margin: 0; padding-top: 20px; border-top: 1px solid rgb(245 243 238 / 24%); font-size: 14px; line-height: 1.6; }
.merade-developer-identity > div { min-width: 0; max-width: 100%; }
.merade-developer-identity dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: var(--merade-ivory); }
.merade-developer-identity a { color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.merade-developer-identity a:focus-visible { outline: 2px solid var(--merade-gold); outline-offset: 4px; }

/* Keep the hero compact below the optional company details. */
.merade-developer-hero:has(.merade-developer-identity) { min-height: 488px; padding-bottom: 32px; }
@media (max-width: 760px) {
 .merade-developer-hero:has(.merade-developer-identity) { min-height: 424px; padding-bottom: 24px; }
}

/* Company details occupy their own row; actions end at the introduction above. */
@media (max-width: 1000px) {
 .merade-developer-hero-content:has(.merade-developer-identity) { row-gap: 20px; }
 .merade-developer-hero-content > .merade-developer-identity { grid-row: 2; }
 .merade-developer-hero-content:has(.merade-developer-identity) > .merade-developer-hero-actions { grid-column: 1; grid-row: 3; }
}