:root {
    --color-ink: #172128;
    --color-ink-soft: #263746;
    --color-blue: #407ac3;
    --color-blue-dark: #2f64a6;
    --color-paper: #ffffff;
    --color-surface: #f3f4f5;
    --color-muted: #9a9a9a;
    --color-border: #dcdcdc;
    --color-line: #eeeeee;
    --color-text: #000000;
    --radius: 4px;
    --font-sans: "DM Sans", "Helvetica Neue", Arial, sans-serif;
    --font-serif: "Tinos", "Times New Roman", Times, serif;
    --shell: 1334px;
    --header-height: 90px;
    --space-section: clamp(4rem, 6vw, 6.5rem);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* clip (no hidden) para no crear un contenedor de scroll que anule position: sticky. */
html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-height) + var(--wp-admin--admin-bar--height, 0px));
    overflow-x: hidden;
    overflow-x: clip;
}

body {
    margin: 0;
    overflow-x: hidden;
    overflow-x: clip;
    background: var(--color-paper);
    color: var(--color-ink);
    font-family: var(--font-sans);
    font-size: 1rem;
    line-height: 1.55;
    text-rendering: optimizeLegibility;
}

/* El bloqueo va en html: overflow en body lo volveria contenedor de scroll y el header sticky saltaria. */
html:has(body.menu-open) {
    overflow: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    font: inherit;
}

[hidden] {
    display: none !important;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

.site-shell {
    width: min(var(--shell), calc(100% - 2rem));
    margin-inline: auto;
}

.section {
    padding-block: var(--space-section);
}

.skip-link {
    position: fixed;
    top: 0.75rem;
    left: 0.75rem;
    z-index: 100;
    transform: translateY(-160%);
    padding: 0.75rem 1rem;
    background: var(--color-ink);
    color: var(--color-paper);
}

.skip-link:focus {
    transform: translateY(0);
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    border: 0;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.button {
    display: inline-flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 0 1.5rem;
    border: 2px solid transparent;
    border-radius: var(--radius);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    /* El boton no se desplaza al hover: el efecto es solo el relleno de ::before. */
    position: relative;
    isolation: isolate;
    overflow: hidden;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

/* Relleno que entra desde abajo al hover/foco (color por variante via --button-fill). */
.button::before {
    position: absolute;
    inset: -2px;
    z-index: -1;
    background: var(--button-fill, currentColor);
    opacity: var(--button-fill-opacity, 0.08);
    content: "";
    pointer-events: none;
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: transform 420ms cubic-bezier(0.33, 1, 0.68, 1);
}

.button:hover::before,
.button:focus-visible::before {
    transform: scaleY(1);
}

.button > .icon-arrow,
.button > span[aria-hidden="true"] {
    order: -1;
    font-size: 0.75rem;
}

.button:focus-visible,
.site-nav a:focus-visible,
.text-link:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--color-blue) 50%, transparent);
    outline-offset: 4px;
}

.button--header {
    min-width: 120px;
    min-height: 35px;
    padding: 0 1.1rem;
    font-size: 0.875rem;
    font-weight: 400;
}

.button--primary,
.button--header {
    --button-fill: var(--color-blue-dark);
    --button-fill-opacity: 1;
    background: var(--color-blue);
    color: var(--color-paper);
}

.button--outline {
    border-color: var(--color-line);
    background: transparent;
    color: inherit;
}

.button--outline > .icon-arrow {
    color: var(--color-blue);
}

.button--quiet {
    border-color: var(--color-line);
    background: var(--color-paper);
    color: var(--color-text);
}

.button--quiet > .icon-arrow,
.button--light > .icon-arrow {
    color: var(--color-blue);
}

.button--light {
    background: var(--color-paper);
    color: var(--color-ink);
}

.eyebrow {
    margin: 0 0 1rem;
    font-size: 1.875rem;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 1.5rem;
    color: var(--color-blue);
    font-size: 1rem;
    font-weight: 400;
}

.site-header {
    position: sticky;
    top: var(--wp-admin--admin-bar--height, 0px);
    z-index: 50;
    min-height: var(--header-height);
    background: var(--color-paper);
}

/* Bajo 600px la barra de admin de WP deja de ser fija. */
@media (max-width: 600px) {
    .admin-bar .site-header {
        top: 0;
    }
}

.site-header__inner {
    display: grid;
    min-height: var(--header-height);
    align-items: center;
    grid-template-columns: auto 1fr auto;
    gap: clamp(1.5rem, 2.6vw, 3rem);
}

.site-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.28em;
}

.site-brand__mark {
    color: var(--color-blue);
    font-size: 1.25rem;
    font-weight: 400;
    transform: skewX(-18deg);
}

.site-brand img {
    width: auto;
    max-height: 3rem;
}

.site-brand .custom-logo-link {
    display: flex;
}

.site-nav {
    justify-self: end;
}

.site-nav ul {
    display: flex;
    align-items: center;
    gap: clamp(1.5rem, 2.6vw, 3rem);
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-nav a {
    position: relative;
    display: block;
    padding-block: 1rem;
    color: var(--color-text);
    font-size: 0.875rem;
    font-weight: 400;
    letter-spacing: 0.025em;
    transition: color 250ms ease;
}

/* Subrayado animado: entra desde la izquierda y sale hacia la derecha. */
.site-nav a::before {
    position: absolute;
    right: 0;
    bottom: 0.65rem;
    left: 0;
    height: 1px;
    background: currentColor;
    content: "";
    transform: scaleX(0);
    transform-origin: 100% 50%;
    transition: transform 450ms cubic-bezier(0.33, 1, 0.68, 1);
}

.site-nav a:hover::before,
.site-nav a:focus-visible::before,
.site-nav .is-current > a::before {
    transform: scaleX(1);
    transform-origin: 0 50%;
}

.site-nav .is-current > a {
    font-weight: 600;
}

.site-nav .menu-item-has-children > a::after {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 0.5rem;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    content: "";
    transform: translateY(-0.2em) rotate(45deg);
    transition: transform 250ms ease;
}

.site-nav a:hover {
    color: var(--color-blue);
}

/* Dropdown de escritorio: abre con hover o con foco de teclado dentro del item. */
.site-nav .menu-item-has-children {
    position: relative;
}

.site-nav .sub-menu {
    position: absolute;
    top: 100%;
    left: -1.25rem;
    z-index: 10;
    display: block;
    min-width: 12rem;
    padding: 0.5rem 0;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
    box-shadow: 0 18px 30px -18px rgba(23, 33, 40, 0.25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(0.5rem);
    transition: opacity 200ms ease, transform 200ms ease, visibility 0s linear 200ms;
}

.site-nav .menu-item-has-children:hover > .sub-menu,
.site-nav .menu-item-has-children:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition-delay: 0s;
}

.site-nav .menu-item-has-children:hover > a::after,
.site-nav .menu-item-has-children:focus-within > a::after {
    transform: translateY(0.05em) rotate(225deg);
}

.site-nav .sub-menu a {
    padding: 0.6rem 1.25rem;
    white-space: nowrap;
}

.site-nav .sub-menu a::before {
    right: 1.25rem;
    bottom: 0.4rem;
    left: 1.25rem;
}

/* Contacto dentro del panel movil; en escritorio se usa .site-header__contact. */
.site-nav .site-nav__contact {
    display: none;
}

.site-header__toggle {
    display: none;
}

.home-page {
    overflow: clip;
}

.home-hero {
    position: relative;
    display: grid;
    min-height: clamp(34rem, 40.5vw, 47rem);
    align-items: center;
    isolation: isolate;
    background:
        linear-gradient(90deg, rgba(14, 27, 37, 0.9) 0%, rgba(14, 27, 37, 0.65) 28%, rgba(14, 27, 37, 0.12) 66%),
        var(--home-hero-image, linear-gradient(125deg, #162531 0%, #334b59 55%, var(--color-ink) 100%));
    background-position: center;
    background-size: cover;
    color: var(--color-paper);
}

.home-hero::after {
    position: absolute;
    inset: auto 0 0;
    z-index: -1;
    height: 22%;
    background: linear-gradient(0deg, rgba(8, 17, 24, 0.42), transparent);
    content: "";
}

.home-hero__inner {
    padding-block: clamp(4.5rem, 8vw, 7.5rem);
}

.home-hero__eyebrow {
    max-width: 38rem;
    margin: 0 0 1.5rem;
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.025em;
}

.home-hero__title {
    max-width: 10.5ch;
    margin: 0;
    font-size: clamp(3.8rem, 3.65vw, 4.25rem);
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.13;
}

.home-hero__emphasis {
    display: block;
    color: var(--color-paper);
    font-family: var(--font-serif);
    font-weight: 400;
}

.home-hero__cta {
    margin-top: clamp(2rem, 3vw, 2.8rem);
}

.home-intro {
    padding-top: clamp(7rem, 8.2vw, 9.5rem);
    padding-bottom: clamp(4rem, 5vw, 5.75rem);
    background: var(--color-paper);
}

.home-intro__grid {
    display: grid;
    align-items: start;
    grid-template-columns: minmax(15rem, 0.72fr) minmax(28rem, 1.28fr);
    gap: clamp(4rem, 9vw, 9rem);
}

.home-intro__summary {
    max-width: 25rem;
    color: var(--color-muted);
    font-size: 0.94rem;
}

.home-intro__summary p:not(.eyebrow) {
    margin: 0;
}

.home-intro__title {
    max-width: 23ch;
    margin: 0;
    font-size: clamp(2.8rem, 2.75vw, 3.2rem);
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.03;
}

.home-intro__title em {
    display: block;
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.home-services {
    padding-bottom: clamp(3.5rem, 6vw, 6rem);
    background: var(--color-paper);
}

.home-services__grid {
    display: grid;
    align-items: stretch;
    grid-auto-columns: minmax(32rem, 36rem);
    grid-auto-flow: column;
    grid-template-columns: none;
}

.service-card {
    position: relative;
    display: grid;
    min-height: 21.25rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
}

.service-card + .service-card {
    border-left: 0;
}

.service-card:is(:hover, :focus-within) {
    background: var(--color-blue);
    color: var(--color-paper);
}

.service-card__media {
    position: relative;
    min-width: 0;
}

.service-card__media::after {
    content: none;
}

.service-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-card__body {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    padding: clamp(1.5rem, 2.3vw, 2rem);
}

.service-card:has(.service-card__media) {
    color: inherit;
}

.service-card__number {
    display: none;
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 1rem;
}

.service-card:is(:hover, :focus-within) .service-card__number,
.service-card:has(.service-card__media) .service-card__number {
    color: #b9d9ff;
}

.service-card__title {
    max-width: 14ch;
    margin: 3.5rem 0 1.2rem;
    font-size: 1.55rem;
    font-weight: 400;
    line-height: 1.1;
}

.service-card__copy {
    max-width: 34rem;
    margin: 0;
    color: var(--color-muted);
    font-size: 0.78rem;
}

.service-card:is(:hover, :focus-within) .service-card__copy,
.service-card:has(.service-card__media) .service-card__copy {
    color: inherit;
    opacity: 0.78;
}

.service-card__link {
    display: inline-grid;
    width: auto;
    height: auto;
    place-items: center;
    align-self: flex-end;
    margin-top: 1.5rem;
    border: 0;
    color: var(--color-blue);
    font-size: 1.15rem;
    transition: background-color 180ms ease, color 180ms ease;
}

.service-card:is(:hover, :focus-within) .service-card__link,
.service-card:has(.service-card__media) .service-card__link {
    color: inherit;
}

.service-card__link:hover,
.service-card__link:focus-visible {
    background: var(--color-ink);
    color: var(--color-paper);
}

.home-stats {
    padding-top: clamp(4rem, 5.5vw, 6.25rem);
    padding-bottom: clamp(5rem, 7vw, 8rem);
}

.home-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.stat-item {
    min-width: 0;
    padding: 0 clamp(1rem, 3vw, 2.5rem);
    text-align: center;
}

.stat-item__icon {
    display: inline-block;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1.1rem;
    object-fit: contain;
    opacity: 0.72;
}

.stat-item__value,
.stat-item__label {
    margin: 0;
}

.stat-item__value {
    color: var(--color-blue);
    font-family: var(--font-sans);
    font-size: 4.1rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1;
}

.stat-item__label {
    margin-top: 0.45rem;
    color: var(--color-muted);
    font-size: 0.78rem;
}

.home-methodology {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--color-ink);
    color: var(--color-paper);
}

.home-methodology__shape {
    position: absolute;
    top: -18%;
    bottom: -18%;
    left: -5%;
    z-index: -1;
    width: min(45vw, 43rem);
    background: #223448;
    clip-path: polygon(0 0, 46% 0, 100% 50%, 46% 100%, 0 100%, 54% 50%);
}

.home-methodology__header {
    max-width: 44rem;
    margin-bottom: clamp(3rem, 4.5vw, 4.75rem);
}

.home-methodology__header .eyebrow {
    color: #c3cbd1;
}

.home-methodology__title {
    max-width: 21ch;
    margin: 0;
    font-size: clamp(3rem, 3.35vw, 3.9rem);
    font-weight: 300;
    line-height: 1.03;
}

.home-methodology__title em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.methodology {
    display: flex;
    min-height: 30rem;
}

.methodology__item {
    display: flex;
    min-width: 8rem;
    overflow: hidden;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
    transition: flex-grow 360ms ease;
}

.methodology__item:first-child {
    border-left: 0;
}

.methodology__item.is-active {
    flex: 1 1 auto;
}

.methodology__panel {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 30rem;
    display: grid;
    grid-template-columns: minmax(16rem, 0.95fr) minmax(20rem, 1.05fr);
    order: 1;
    animation: methodology-reveal 300ms ease;
}

.methodology__panel[hidden] {
    display: none;
}

.methodology__media {
    grid-column: 2;
    height: 100%;
    min-height: 30rem;
    overflow: hidden;
    background: #314455;
}

.methodology__media--fallback {
    display: grid;
    place-items: center;
    background:
        linear-gradient(145deg, rgba(47, 127, 211, 0.22), transparent 55%),
        #263746;
}

.methodology__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.methodology__monogram {
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 19rem;
    font-style: italic;
    line-height: 1;
}

.methodology__copy {
    position: absolute;
    right: calc(52% + 2rem);
    bottom: 2.75rem;
    left: 1.25rem;
    padding: 0;
    color: #d5dce1;
}

.methodology__copy h3 {
    margin: 0 0 1.25rem;
    color: var(--color-paper);
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.25;
}

.methodology__copy p {
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.5;
}

.methodology__detail-icon {
    position: absolute;
    bottom: 14.5rem;
    left: 1.25rem;
    width: 4.75rem;
    height: 4.75rem;
    filter: invert(48%) sepia(88%) saturate(1169%) hue-rotate(187deg) brightness(88%);
}

@keyframes methodology-reveal {
    from { opacity: 0; }
    to { opacity: 1; }
}

.methodology__trigger {
    display: flex;
    width: 8rem;
    min-width: 8rem;
    min-height: 30rem;
    align-items: center;
    flex-direction: column-reverse;
    gap: 1.5rem;
    order: 2;
    overflow: hidden;
    padding: 1.5rem 1.2rem 0;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.38);
    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease;
}

.methodology__trigger[aria-expanded="true"] {
    color: var(--color-paper);
}

.methodology__trigger:hover .methodology__number {
    color: var(--color-blue);
}

.methodology__trigger:focus-visible {
    outline: 3px solid var(--color-blue);
    outline-offset: -3px;
}

.methodology__number {
    align-self: flex-start;
    color: inherit;
    font-family: var(--font-serif);
    margin-bottom: -1.15rem;
    font-size: 7.5rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1;
}

.methodology__trigger[aria-expanded="true"] .methodology__number {
    color: var(--color-blue);
}

.methodology__label {
    overflow-wrap: anywhere;
    margin-block: auto;
    font-size: 1rem;
    line-height: 1.3;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

.methodology__arrow {
    align-self: flex-end;
    font-size: 2rem;
    line-height: 1;
}

.industry-selector {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--color-ink);
    color: var(--color-paper);
}

.industry-selector__shape {
    position: absolute;
    top: -18%;
    right: -8%;
    bottom: -18%;
    z-index: -1;
    width: min(40vw, 38rem);
    background: #223448;
    clip-path: polygon(54% 0, 100% 0, 100% 100%, 54% 100%, 100% 50%);
}

.industry-selector__header {
    max-width: 44rem;
    margin-bottom: clamp(3rem, 4.5vw, 4.75rem);
}

.industry-selector__header .eyebrow {
    color: #c3cbd1;
}

.industry-selector__title {
    max-width: 24ch;
    margin: 0;
    font-size: clamp(3rem, 3.35vw, 3.9rem);
    font-weight: 300;
    line-height: 1.03;
}

.industry-selector__title em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.industry-picker {
    display: grid;
    grid-template-columns: minmax(16rem, 0.82fr) minmax(0, 2.4fr);
    gap: 0;
    min-height: 34rem;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.industry-picker__list {
    display: flex;
    flex-direction: column;
    border-right: 1px solid rgba(255, 255, 255, 0.14);
    max-height: 40rem;
    overflow-y: auto;
}

.industry-picker__trigger {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.95rem 1.25rem;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: transparent;
    color: rgba(255, 255, 255, 0.5);
    text-align: left;
    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease;
}

.industry-picker__trigger:hover {
    color: var(--color-paper);
}

.industry-picker__trigger.is-active {
    background: rgba(255, 255, 255, 0.06);
    color: var(--color-paper);
    font-weight: 600;
}

.industry-picker__trigger:focus-visible {
    outline: 3px solid var(--color-blue);
    outline-offset: -3px;
}

.industry-picker__number {
    flex: 0 0 auto;
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 0.95rem;
    font-weight: 400;
}

.industry-picker__label {
    flex: 1 1 auto;
    font-size: 0.92rem;
    line-height: 1.3;
}

.industry-picker__arrow {
    display: none;
    flex: 0 0 auto;
    font-size: 1.1rem;
    line-height: 1;
    color: var(--color-blue);
}

.industry-picker__trigger.is-active .industry-picker__arrow {
    display: inline-block;
}

.industry-picker__panels {
    position: relative;
}

.industry-picker__panel[hidden] {
    display: none;
}

.industry-picker__panel {
    display: flex;
    flex-direction: column;
    height: 100%;
    animation: industry-panel-reveal 300ms ease;
}

@keyframes industry-panel-reveal {
    from { opacity: 0; }
    to { opacity: 1; }
}

.industry-picker__media {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #314455;
}

.industry-picker__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.industry-picker__media-number {
    position: absolute;
    bottom: 0.75rem;
    left: 1.25rem;
    color: rgba(255, 255, 255, 0.45);
    font-family: var(--font-serif);
    font-size: clamp(2.75rem, 5vw, 4.5rem);
    font-weight: 300;
    line-height: 1;
}

.industry-picker__media-name {
    position: absolute;
    right: 1.25rem;
    bottom: 1.15rem;
    color: var(--color-paper);
    font-size: 1.15rem;
    font-weight: 600;
}

.industry-picker__content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    background: var(--color-paper);
    color: var(--color-ink);
}

.industry-picker__summary {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.4;
}

.industry-picker__excerpt {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.92rem;
    line-height: 1.55;
}

.industry-picker__cta {
    align-self: flex-start;
}

@media (max-width: 900px) {
    .industry-picker {
        grid-template-columns: 1fr;
    }

    .industry-picker__list {
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
        max-height: none;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }

    .industry-picker__trigger {
        flex: 0 0 auto;
        border-bottom: 0;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
        white-space: nowrap;
    }

    .industry-selector__shape,
    .impact-carousel__shape {
        display: none;
    }
}

.home-brand {
    padding-block: clamp(6rem, 8vw, 9rem);
    background: var(--color-paper);
}

.home-brand__word {
    margin: 0;
    background: var(--brand-image, var(--color-ink));
    background-position: center;
    background-size: cover;
    background-clip: text;
    color: transparent;
    font-size: clamp(8rem, 13vw, 15rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 0.8;
    text-align: center;
    -webkit-background-clip: text;
}

.home-team {
    padding-top: clamp(6.5rem, 8vw, 9rem);
    padding-bottom: clamp(6.5rem, 8vw, 9rem);
    background: var(--color-ink);
    color: var(--color-paper);
}

.home-team__header {
    display: grid;
    align-items: end;
    grid-template-columns: 1.2fr 0.8fr;
    gap: clamp(2rem, 8vw, 8rem);
    margin-bottom: clamp(3rem, 5vw, 4.5rem);
}

.home-team__header > p {
    max-width: 34rem;
    margin: 0;
    color: #aeb9c1;
}

.home-team__title,
.section-heading h2,
.home-contact h2 {
    margin: 0;
    color: inherit;
    font-size: clamp(2.6rem, 2.95vw, 3.375rem);
    font-weight: 300;
    line-height: 1.11;
    letter-spacing: -0.01em;
}

.home-team__title em,
.section-heading em,
.home-contact h2 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 1.185em;
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.025em;
}

.team-grid {
    display: grid;
    grid-auto-flow: dense;
    grid-auto-rows: 8.5rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.team-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: var(--color-ink-soft);
}

.team-card--person {
    grid-row: span 3;
}

.team-card--person:nth-child(4n + 2) {
    grid-row: span 4;
}

.team-card--quote {
    display: flex;
    grid-row: span 2;
    align-items: flex-end;
    margin: 0;
    padding: 1.5rem;
}

.team-card--quote p {
    margin: 0;
    font-family: var(--font-sans);
    font-size: 1rem;
    font-style: normal;
    line-height: 1.25;
}

.team-card__image,
.team-card__placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-card__placeholder,
.testimonial-card__placeholder,
.featured-case__placeholder {
    display: grid;
    place-items: center;
    background: #334755;
    color: rgba(255, 255, 255, 0.11);
    font-family: var(--font-serif);
    font-size: 9rem;
    font-style: italic;
}

.team-card__caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 3rem 1rem 1rem;
    background: linear-gradient(transparent, rgba(11, 20, 27, 0.94));
}

.team-card__caption h3,
.team-card__caption p {
    margin: 0;
}

.team-card__caption h3 {
    font-size: 1rem;
    font-weight: 600;
}

.team-card__caption p {
    color: #b6c0c7;
    font-size: 0.75rem;
}

.home-team__cta {
    width: fit-content;
    margin: 2.5rem auto 0;
}

.home-testimonial,
.home-case,
.home-insights,
.home-contact {
    background: var(--color-surface);
}

.home-testimonial__header,
.section-heading {
    margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.home-testimonial__header {
    text-align: center;
}

.home-testimonial__header .eyebrow {
    margin-bottom: 1.25rem;
}

.home-testimonial__header h2 {
    max-width: none;
    margin: 0;
    margin-inline: auto;
    font-size: clamp(2.6rem, 2.95vw, 3.375rem);
    font-weight: 300;
    line-height: 1.11;
    letter-spacing: -0.01em;
}

.home-testimonial__header em,
.section-heading em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 1.185em;
    font-style: italic;
    font-weight: 400;
}

.testimonial-card {
    display: grid;
    grid-template-columns: 1.62fr 0.78fr;
    /* Levemente mas baja que los 651px que imponia la foto (ver __portrait). */
    min-height: 36rem;
    background: var(--color-ink);
    color: var(--color-paper);
}

.testimonial-card__content {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: clamp(2rem, 3.5vw, 3.5rem);
}

.testimonial-card__quote {
    position: absolute;
    top: 0.5rem;
    right: 2rem;
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 8rem;
    line-height: 1;
}

.testimonial-card blockquote {
    max-width: 50rem;
    margin: 0;
    padding-right: 3rem;
    font-size: 1rem;
    line-height: 1.55;
}

.testimonial-card__metrics {
    display: flex;
    gap: clamp(2rem, 7vw, 6rem);
    margin: auto 0 2rem;
}

.testimonial-card__metrics div {
    display: flex;
    flex-direction: column-reverse;
}

.testimonial-card__metrics dt {
    color: #aab6bf;
    font-size: 0.75rem;
}

.testimonial-card__metrics dd {
    margin: 0;
    color: var(--color-blue);
    font-family: var(--font-sans);
    font-size: 3.6rem;
    font-style: normal;
    font-weight: 300;
}

.testimonial-card__person {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    font-size: 0.8rem;
}

.testimonial-card__person span {
    color: #aab6bf;
}

/*
 * El retrato no dicta la altura de la tarjeta: la imagen se recorta (cover)
 * dentro de su columna. Antes su altura natural (651px con la foto actual)
 * estiraba toda la franja por encima del min-height.
 */
.testimonial-card__portrait {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 0;
}

.testimonial-card__image,
.testimonial-card__placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*
 * Franja de logos de clientes (template-parts/global/client-logos.php), igual en
 * Home, Que hacemos, detalle de industria y listados de Casos. Cada logo ocupa un
 * lienzo cuadrado de --logo-size (tope 120px, 75% en movil); los archivos
 * recortados se contienen en el area util del lienzo (--trim). La separacion va en
 * el padding de cada item para que el bucle de la marquesina no tenga costura.
 * Estados (assets/js/animations/core.js): .is-static (caben: quietos y centrados,
 * sin controles) e .is-scrolling (marquesina + flechas + pausa).
 * El tono (filtro/opacidad) y los margenes de cada pagina van en su contenedor:
 * .client-logos (Home y Casos), .impact-logos (hacemos.css), .ind-logos
 * (hacemos-singles.css).
 */
.logo-strip {
    --logo-scale: 1;
    --logo-gap: 44px;
    position: relative;
}

.logo-strip__viewport {
    overflow: hidden;
    touch-action: pan-y;
}

.logo-strip__track {
    display: flex;
    align-items: center;
    justify-content: safe center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.logo-strip.is-scrolling .logo-strip__track {
    width: max-content;
    justify-content: flex-start;
    will-change: transform;
}

.logo-strip__item {
    display: grid;
    flex: 0 0 auto;
    box-sizing: content-box;
    width: calc(var(--logo-size, 120px) * var(--logo-scale));
    height: calc(var(--logo-size, 120px) * var(--logo-scale));
    place-items: center;
    padding-inline: var(--logo-gap);
}

.logo-strip__img {
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: contain;
    filter: grayscale(1);
    opacity: 0.58;
}

.logo-strip__item--trim .logo-strip__img {
    width: 94%;
    height: 66%;
}

.logo-strip__controls {
    display: none;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.logo-strip.is-scrolling .logo-strip__controls {
    display: flex;
}

.logo-strip__button {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    /* Gris sutil, junto a los logos; #8a8a8a mantiene 3:1 sobre el fondo claro. */
    color: #8a8a8a;
    cursor: pointer;
    transition: transform 180ms ease, background-color 180ms ease, color 180ms ease;
}

.logo-strip__button svg {
    width: 16px;
    height: 16px;
}

.logo-strip__button--prev svg {
    transform: scaleX(-1);
}

.logo-strip__button:hover,
.logo-strip__button:focus-visible {
    color: var(--color-blue);
}

.logo-strip__button:hover {
    background: color-mix(in srgb, currentColor 8%, transparent);
}

.logo-strip__button--prev:hover {
    transform: translateX(-2px);
}

.logo-strip__button--next:hover {
    transform: translateX(2px);
}

.logo-strip__button:focus-visible {
    outline: 2px solid var(--color-blue);
    outline-offset: 2px;
}

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

@media (max-width: 640px) {
    .logo-strip {
        --logo-scale: 0.75;
        --logo-gap: 22px;
    }

    .logo-strip__controls {
        margin-top: 16px;
    }
}

/*
 * Navegacion de los testimonios (template-parts/global/slide-nav.php): flechas y
 * contador "2 / 4" sobre el bloque oscuro. La posicion la pone cada pagina.
 */
.slide-nav {
    display: flex;
    align-items: center;
    gap: 2px;
    color: var(--color-paper);
}

.slide-nav__count {
    display: flex;
    justify-content: center;
    gap: 5px;
    min-width: 3.5em;
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.slide-nav__of,
.slide-nav__count > span:last-child {
    color: #8a9096;
}

.slide-nav__button {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #8a9096;
    cursor: pointer;
    transition: transform 180ms ease, background-color 180ms ease, color 180ms ease;
}

.slide-nav__button svg {
    width: 16px;
    height: 16px;
}

.slide-nav__button--prev svg {
    transform: scaleX(-1);
}

.slide-nav__button:hover,
.slide-nav__button:focus-visible {
    color: var(--color-blue);
}

.slide-nav__button:hover {
    background: color-mix(in srgb, var(--color-paper) 8%, transparent);
}

.slide-nav__button--prev:hover {
    transform: translateX(-2px);
}

.slide-nav__button--next:hover {
    transform: translateX(2px);
}

.slide-nav__button:focus-visible {
    outline: 2px solid var(--color-paper);
    outline-offset: 2px;
}

/* Tactil: area de 40px por flecha. */
@media (pointer: coarse) {
    .slide-nav__button {
        width: 40px;
        height: 40px;
    }
}

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

/* Home y listados de Casos: franja bajo el testimonio. */
.client-logos {
    padding-top: 4.5rem;
    padding-bottom: 1rem;
}

.impact-carousel {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--color-surface);
}

.impact-carousel__shape {
    position: absolute;
    top: -18%;
    right: -8%;
    bottom: -18%;
    z-index: -1;
    width: min(40vw, 38rem);
    background: #223448;
    clip-path: polygon(54% 0, 100% 0, 100% 100%, 54% 100%, 100% 50%);
}

.impact-carousel__viewport {
    position: relative;
}

.impact-carousel__slide {
    margin: 0;
}

.home-case {
    background: var(--color-surface);
}

.section-heading--center {
    max-width: 62rem;
    margin-inline: auto;
    text-align: center;
}

.featured-case {
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    min-height: 30rem;
}

.featured-case__media,
.featured-case__image,
.featured-case__placeholder {
    width: 100%;
    height: 100%;
    min-height: 30rem;
    object-fit: cover;
}

.featured-case__content {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    padding: clamp(2.5rem, 4.5vw, 4.5rem);
    background: var(--color-surface);
}

.featured-case__content h3 {
    max-width: 22ch;
    margin: 0 0 1.5rem;
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 1.12;
}

.featured-case__content > p:not(.eyebrow) {
    max-width: 42rem;
    margin: 0;
    color: var(--color-muted);
    font-size: 0.82rem;
    line-height: 1.6;
}

.section-action {
    display: flex;
    justify-content: flex-end;
    margin-top: 2rem;
}

.section-action--with-nav {
    align-items: center;
    justify-content: space-between;
}

.section-slider-nav {
    display: flex;
    gap: 1rem;
    color: var(--color-blue);
    font-size: 2rem;
}

.section-slider-nav span:first-child {
    color: #c8cdd1;
}

.insights-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.insight-card {
    display: flex;
    min-height: 25rem;
    flex-direction: column;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
}

.insight-card:is(:hover, :focus-within) {
    background: var(--color-blue);
    color: var(--color-paper);
}

.insight-card__visual {
    display: grid;
    min-height: 11rem;
    place-items: center;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 5rem;
    font-style: italic;
}

.insight-card__visual img {
    width: 7rem;
    height: 7rem;
    object-fit: contain;
}

.insight-card__visual .insight-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.insight-card:is(:hover, :focus-within) .insight-card__visual img {
    filter: invert(1);
}

.insight-card:is(:hover, :focus-within) .insight-card__visual .insight-card__image {
    filter: none;
}

.insight-card:is(:hover, :focus-within) .insight-card__visual {
    border-color: rgba(255, 255, 255, 0.25);
    color: rgba(255, 255, 255, 0.45);
}

.insight-card__body {
    display: flex;
    flex: 1;
    align-items: flex-start;
    flex-direction: column;
    margin: 0 1.25rem 1.25rem;
    padding: 1.5rem;
    background: var(--color-paper);
    color: var(--color-ink);
}

.insight-card__body h3 {
    margin: 0 0 1rem;
    font-size: 1.35rem;
    font-weight: 500;
    line-height: 1.2;
}

.insight-card__body p {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.86rem;
}

.insight-card:is(:hover, :focus-within) .insight-card__body p {
    color: var(--color-muted);
}

.insight-card__body > a {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    align-self: flex-end;
    margin-top: auto;
    border: 0;
    color: var(--color-blue);
}

.home-contact {
    padding-block: 110px;
    background: var(--color-surface);
    color: var(--color-text);
}

.home-contact__inner {
    display: grid;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 3rem;
}

.home-contact .eyebrow {
    margin-bottom: 0.4rem;
}

.home-contact h2 {
    max-width: 48rem;
}

.site-footer {
    padding: 0;
    border-top: 0;
    background: var(--color-ink);
    color: var(--color-paper);
}

.site-footer__bottom,
.site-footer__nav ul,
.site-footer__links ul {
    display: flex;
    align-items: center;
}

.site-footer__main {
    display: grid;
    grid-template-columns: 582px 1fr;
    padding-block: 68px 58px;
}

.site-brand--footer {
    display: block;
    width: fit-content;
    color: var(--color-paper);
}

.site-footer .site-footer__logo {
    width: 270px;
    max-height: none;
    height: auto;
}

.site-footer__newsletter-copy {
    max-width: 22rem;
    margin: 1.25rem 0 1.1rem;
    color: var(--color-muted);
    font-size: 0.875rem;
    line-height: 1.5;
}

.site-footer__newsletter {
    display: grid;
    grid-template-columns: minmax(0, 288px) 160px;
    gap: 10px;
    max-width: 458px;
}

.site-footer__newsletter input[type="email"] {
    width: 100%;
    min-width: 0;
    height: 48px;
    padding: 0 1.1rem;
    border: 0;
    border-radius: var(--radius);
    background: var(--color-paper);
    color: var(--color-text);
    font-size: 0.875rem;
}

.site-footer__newsletter input[type="email"]::placeholder {
    color: #6b6b6b;
}

.site-footer__newsletter .button {
    min-width: 138px;
}

.site-footer__newsletter-trap {
    position: absolute;
    left: -9999px;
}

.site-footer__newsletter-consent,
.site-footer__newsletter-status {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--color-muted);
    font-size: 0.8rem;
    line-height: 1.45;
}

.site-footer__newsletter-consent {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.site-footer__newsletter-consent input[type="checkbox"] {
    margin: 3px 0 0;
}

.site-footer__newsletter-status:not(:empty) {
    color: var(--color-paper);
}

/* Error del servidor: se distingue del mensaje de exito. */
.site-footer__newsletter-status.is-error:not(:empty) {
    padding-left: 0.6rem;
    border-left: 2px solid #ff8a80;
    color: #ffb4ab;
}

/* Sin tope de ancho: el titular ocupa toda la columna y sus lineas terminan
   alineadas con la grilla de contacto que va debajo. */
.site-footer__learning h2 {
    max-width: none;
    margin: 0 0 2rem;
    font-size: 1.75rem;
    font-weight: 300;
    line-height: 1.25;
}

.site-footer__learning em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 1.1667em;
    font-weight: 400;
}

.site-footer__contact-grid {
    display: grid;
    grid-template-columns: 331px 258px auto;
}

/* Notebooks (1101-1365px): las columnas fijas no caben y el bloque de contacto
   se salia por la derecha. Columnas flexibles; desde 1366px rige el PSD. */
@media (min-width: 1101px) and (max-width: 1365px) {
    .site-footer__main {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
        column-gap: 2.5rem;
    }

    .site-footer__contact-grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
        column-gap: 1.5rem;
    }
}

.site-footer__contact-grid h3 {
    margin: 0 0 0.9rem;
    font-size: 1rem;
    font-weight: 500;
}

.site-footer__contact-grid p {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.875rem;
    line-height: 1.43;
}

.site-footer__contact-grid a {
    color: inherit;
}

.site-footer__contact-grid a:hover,
.site-footer__nav a:hover {
    color: var(--color-paper);
}

/* LinkedIn destacado: abajo a la derecha, alineado con el final del newsletter. */
.site-footer__learning {
    display: flex;
    flex-direction: column;
}

.site-footer__linkedin {
    display: inline-flex;
    align-items: center;
    align-self: flex-end;
    gap: 16px;
    margin-top: auto;
    padding-top: 2.5rem;
    color: var(--color-paper);
    font-size: 1.125rem;
    line-height: 1.2;
    text-decoration: none;
}

.site-footer__linkedin svg {
    flex: none;
    width: 48px;
    height: 48px;
    color: var(--color-blue);
    transition: transform 180ms ease;
}

.site-footer__linkedin:hover svg,
.site-footer__linkedin:focus-visible svg {
    transform: translateY(-2px);
}

.site-footer__linkedin:hover span,
.site-footer__linkedin:focus-visible span {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.site-footer__linkedin:focus-visible {
    outline: 2px solid var(--color-paper);
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .site-footer__linkedin svg {
        transition: none;
    }
}

/* Direccion clickeable (Google Maps) y botones Google Maps / Waze solo en celulares. */
.site-footer__address,
.contact-top__address {
    color: inherit;
    text-decoration: none;
}

.site-footer__address:hover,
.contact-top__address:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.location-apps {
    display: none;
}

@media (max-width: 767.98px) {
    .location-apps {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin: 14px 0 0;
    }

    .location-apps__link {
        display: inline-flex;
        min-height: 40px;
        align-items: center;
        gap: 8px;
        padding: 0 16px;
        border: 1px solid currentColor;
        border-radius: 999px;
        color: inherit;
        font-size: 14px;
        line-height: 1;
        text-decoration: none;
    }

    .site-footer .location-apps__link {
        border-color: rgba(255, 255, 255, 0.35);
        color: var(--color-paper);
    }

    /* .site-footer__contact-grid p anula el margen: los botones se separan de la direccion. */
    .site-footer__contact-grid .location-apps {
        margin-top: 14px;
    }

    .contact-top .location-apps__link {
        border-color: var(--color-border, #d5d9dc);
        color: var(--color-text);
    }

    .location-apps__link svg {
        flex-shrink: 0;
        color: var(--color-blue);
    }
}

/* Redes y enlaces forman un solo bloque a la izquierda; el copyright se va al
   extremo derecho con el margen automatico. */
.site-footer__bottom {
    position: relative;
    min-height: 68px;
    justify-content: flex-start;
    gap: 2rem 3rem;
    color: var(--color-muted);
    font-size: 0.875rem;
}

.site-footer__bottom::before {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 1px;
    background: #41494e;
    content: "";
    transform: translateX(-50%);
}

.site-footer__bottom p {
    margin: 0 0 0 auto;
}

.site-footer__nav ul {
    flex-wrap: wrap;
    gap: 3rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Enlaces de la franja inferior: "Trabaja con nosotros" y los legales. */
.site-footer__links ul {
    flex-wrap: wrap;
    gap: 2rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer__links a {
    color: inherit;
    transition: color 180ms ease;
}

.site-footer__links a:hover,
.site-footer__links a:focus-visible {
    color: var(--color-paper);
}

.page-hero {
    position: relative;
    display: grid;
    min-height: 400px;
    align-items: center;
    isolation: isolate;
    overflow: hidden;
    background:
        linear-gradient(rgba(32, 38, 44, 0.62), rgba(32, 38, 44, 0.62)),
        var(--page-hero-image, none) center / cover no-repeat,
        #20262c;
    color: var(--color-paper);
    text-align: center;
}

.page-hero::after {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1857 400' preserveAspectRatio='xMidYMid slice'%3E%3Cpath fill='%23407ac3' fill-opacity='.22' fill-rule='evenodd' d='M560 400L1120-200 1680 400ZM810 400L1120 68 1430 400Z'/%3E%3C/svg%3E") center / cover no-repeat;
    content: "";
}

.page-hero__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-block: 4rem;
}

.page-hero h1 {
    margin: 0;
    font-size: clamp(3.2rem, 3.9vw, 4.5rem);
    font-weight: 300;
    line-height: 1.1;
    letter-spacing: -0.025em;
}

.breadcrumbs {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 30px;
    margin-top: 1rem;
    padding: 0 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    background: rgba(32, 38, 44, 0.3);
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.breadcrumbs__sep {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: currentColor;
}

/* Lista semantica (ol > li) sin cambiar el aspecto: mismo flujo y gap que el nav. */
.breadcrumbs__list,
.breadcrumbs__item {
    display: flex;
    align-items: center;
    gap: inherit;
    margin: 0;
    padding: 0;
    list-style: none;
}

.about-intro__heading {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 6rem;
    margin-bottom: 5rem;
}

.about-intro__heading h2 {
    max-width: 22ch;
    margin: 0;
    font-size: clamp(3rem, 3.35vw, 3.85rem);
    font-weight: 300;
    line-height: 1.05;
}

.about-intro__heading h2 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.about-intro__heading p {
    align-self: end;
    max-width: 32rem;
    margin: 0;
    color: var(--color-muted);
}

.about-summary {
    display: grid;
    grid-template-columns: 0.65fr 1.35fr 0.7fr;
    gap: 1rem;
    min-height: 28rem;
}

.about-summary__image,
.about-summary__statement,
.about-summary__stats {
    min-width: 0;
}

.about-summary__image,
.about-summary__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-summary__image {
    display: grid;
    place-items: center;
    overflow: hidden;
    background: #334755;
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 10rem;
}

.about-summary__statement {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    padding: 3rem;
    background: var(--color-ink);
    color: var(--color-paper);
}

.about-summary__statement h3 {
    max-width: 19ch;
    margin: 0 0 1.5rem;
    font-size: 2rem;
    font-weight: 300;
    line-height: 1.1;
}

.about-summary__statement p {
    max-width: 40rem;
    margin: 0;
    color: #aab6bf;
    font-size: 0.82rem;
}

.about-summary__statement .button {
    margin-top: auto;
}

.about-summary__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.about-summary__stats div {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 2rem;
    background: var(--color-surface);
}

.about-summary__stats strong {
    color: var(--color-blue);
    font-family: var(--font-sans);
    font-size: 3.5rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1;
}

.about-summary__stats span {
    color: var(--color-muted);
    font-size: 0.8rem;
}

.about-sello {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--color-ink);
    color: var(--color-paper);
}

.about-sello__shape {
    position: absolute;
    top: -20%;
    bottom: -20%;
    right: -8%;
    z-index: -1;
    width: min(40vw, 40rem);
    background: #223448;
    clip-path: polygon(54% 0, 100% 0, 100% 100%, 54% 100%, 100% 50%);
}

.about-sello__header {
    max-width: 44rem;
    margin-bottom: clamp(2.5rem, 4vw, 3.75rem);
}

.about-sello__title {
    margin: 0;
    max-width: 24ch;
    font-size: clamp(2.1rem, 3vw, 3rem);
    font-weight: 300;
    line-height: 1.1;
}

.about-sello__title em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-style: italic;
    font-weight: 400;
}

.sello-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.sello-card {
    padding: 2rem 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0.5rem;
    background: transparent;
    color: var(--color-paper);
}

.sello-card.is-active {
    background: var(--color-blue);
    border-color: var(--color-blue);
}

.sello-card:not(.is-active) {
    background: rgba(255, 255, 255, 0.04);
}

.sello-card__icon {
    display: inline-flex;
    width: 2.5rem;
    height: 2.5rem;
    color: currentColor;
}

.sello-card__icon svg {
    width: 100%;
    height: 100%;
}

.sello-card__title {
    margin: 1.25rem 0 0.5rem;
    font-size: 1.05rem;
    font-weight: 500;
}

.sello-card__copy {
    margin: 0;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.85rem;
    line-height: 1.55;
}

.sello-card.is-active .sello-card__copy {
    color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 900px) {
    .sello-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    .sello-grid {
        grid-template-columns: 1fr;
    }
}

.about-values {
    background: var(--color-surface);
}

.about-values__intro {
    max-width: 58rem;
    margin: 1.5rem auto 0;
    color: var(--color-muted);
    font-size: 0.78rem;
    line-height: 1.55;
}

.about-values__media {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 4rem;
}

.about-values__media span {
    display: grid;
    min-height: 20rem;
    place-items: center;
    background: #324653;
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 8rem;
    font-style: italic;
}

.about-values__media img {
    width: 100%;
    height: 20rem;
    object-fit: cover;
}

.about-values__media img:nth-child(2) {
    transform: translateY(2rem);
}

.about-values__media span:nth-child(2) {
    transform: translateY(2rem);
}

.values-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2rem;
}

.value-item {
    min-width: 0;
    text-align: center;
}

.value-item__icon {
    display: block;
    width: 2.75rem;
    height: 2.75rem;
    margin-bottom: 1rem;
    margin-inline: auto;
    object-fit: contain;
    opacity: 0.78;
}

.value-item h3 {
    margin: 0 0 0.75rem;
    font-size: 1rem;
}

.value-item p {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.78rem;
}

.about-story {
    background: var(--color-paper);
}

.about-story__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.about-story article,
.about-story__visual,
.about-story blockquote {
    min-height: 19rem;
    margin: 0;
}

.about-story article,
.about-story blockquote {
    padding: 3rem;
}

.about-story article {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    background: var(--color-surface);
}

.about-story article h2 {
    max-width: 20ch;
    margin: 0;
    font-size: 1.8rem;
    font-weight: 400;
}

.about-story article > a {
    margin-top: auto;
    color: var(--color-blue);
    font-size: 1.25rem;
}

.about-story__visual {
    display: grid;
    overflow: hidden;
    place-items: center;
    background: var(--color-blue);
    color: rgba(255, 255, 255, 0.25);
    font-family: var(--font-serif);
    font-size: 8rem;
    font-style: italic;
}

.about-story__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-story__visual--portrait {
    position: relative;
    min-height: 25rem;
}

.about-story__play {
    position: absolute;
    top: 50%;
    left: 50%;
    display: grid;
    width: 3.25rem;
    height: 3.25rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    color: var(--color-paper);
    font-family: var(--font-sans);
    font-size: 1.2rem;
    font-style: normal;
    transform: translate(-50%, -50%);
}

.about-story blockquote {
    position: relative;
    display: flex;
    grid-column: 2 / -1;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    background: var(--color-ink);
    color: var(--color-paper);
}

.about-story__quote {
    position: absolute;
    top: 1rem;
    right: 2rem;
    color: rgba(255, 255, 255, 0.2);
    font-family: var(--font-serif);
    font-size: 7rem;
    line-height: 1;
}

.about-story blockquote p {
    max-width: 25ch;
    margin: 0 0 2rem;
    font-size: 2.2rem;
    line-height: 1.15;
}

.about-story blockquote cite {
    color: #9fadb6;
    font-size: 0.8rem;
    font-style: normal;
}

@media (min-width: 1101px) {
    .home-intro {
        padding-block: 5.5rem;
    }

    .home-services {
        padding-bottom: 4rem;
    }

    .home-services .service-card {
        min-height: 22rem;
    }

    .home-stats {
        padding-block: 3.5rem 5rem;
    }

    .home-team,
    .home-case,
    .home-insights {
        padding-block: 5.5rem;
    }

    .about-intro {
        padding-block: 8rem;
    }

    .about-intro__heading {
        margin-bottom: 7rem;
    }

    .about-summary {
        min-height: 36rem;
    }

    .about-page .methodology,
    .about-page .methodology__panel,
    .about-page .methodology__media,
    .about-page .methodology__trigger {
        min-height: 34rem;
    }

    .about-values {
        padding-block: 8rem;
    }

    .about-values__media span,
    .about-values__media img {
        min-height: 30rem;
        height: 30rem;
    }

    .values-grid {
        min-height: 18rem;
    }

    .about-story {
        padding-block: 8rem;
    }

    .about-story article,
    .about-story__visual,
    .about-story blockquote {
        min-height: 22rem;
    }

    .about-story__visual--portrait,
    .about-story blockquote {
        min-height: 30rem;
    }
}

.team-archive__intro {
    display: grid;
    grid-template-columns: 0.45fr 1.55fr;
    gap: 5rem;
    margin-bottom: 5rem;
}

.team-archive__count {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    margin: 0;
}

.team-archive__summary {
    display: grid;
    align-content: start;
    grid-template-columns: auto 1fr;
    column-gap: 0.9rem;
}

.team-archive__summary > p:last-child {
    grid-column: 1 / -1;
    max-width: 17rem;
    margin: 1rem 0 0;
    color: var(--color-muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.team-archive__avatars {
    display: flex;
    align-items: center;
    padding-left: 0.45rem;
}

.team-archive__avatars img {
    width: 2.5rem;
    height: 2.5rem;
    margin-left: -0.45rem;
    border: 2px solid var(--color-paper);
    border-radius: 50%;
    object-fit: cover;
}

.team-archive__count strong {
    color: var(--color-blue);
    font-family: var(--font-sans);
    font-size: 3.35rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1;
}

.team-archive__intro h2 {
    max-width: 20ch;
    margin: 0 0 1.5rem;
    font-size: clamp(3rem, 3.35vw, 3.85rem);
    font-weight: 300;
    line-height: 1.05;
}

.team-archive__intro h2 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.team-archive__intro > div p {
    max-width: 42rem;
    color: var(--color-muted);
}

.team-archive__intro > div p strong {
    color: var(--color-ink);
    font-weight: 600;
}

.team-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 2rem;
    color: var(--color-muted);
    font-size: 0.75rem;
}

.team-filters button {
    min-height: 2.25rem;
    padding: 0.45rem 1rem;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
    color: var(--color-ink);
    cursor: pointer;
    font-size: 0.68rem;
    text-transform: uppercase;
}

.team-filters button:hover,
.team-filters button.is-active,
.team-filters button:focus-visible {
    border-color: var(--color-ink);
    background: var(--color-ink);
    color: var(--color-paper);
}

.directory-grid {
    display: grid;
    align-items: start;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}

.directory-card[hidden] {
    display: none;
}

.directory-card {
    position: relative;
    min-width: 0;
    background: var(--color-surface);
}

.directory-card > a {
    position: relative;
    display: block;
}

.directory-card__media {
    display: grid;
    height: 27rem;
    place-items: center;
    overflow: hidden;
    background: #334755;
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 8rem;
}

.directory-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.directory-card--quote .directory-card__media {
    align-items: start;
    padding: 2rem;
    background: var(--color-surface);
    color: var(--color-ink);
    font-family: var(--font-sans);
    font-size: 1rem;
}

.directory-card--quote blockquote {
    margin: 0;
}

.directory-card--quote blockquote span {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 5rem;
    line-height: 0.7;
}

.directory-card--quote blockquote p {
    margin: 1.5rem 0 0;
    font-size: 1.5rem;
    line-height: 1.25;
}

.directory-card--quote blockquote {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.directory-card--quote blockquote footer {
    margin-top: auto;
    padding-top: 2rem;
    color: var(--color-blue);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 600;
}

.directory-card a:hover .directory-card__media img {
    transform: scale(1.025);
}

.directory-card__caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 5rem;
    padding: 3.5rem 3rem 1rem 1rem;
    background: linear-gradient(transparent, rgba(12, 22, 29, 0.92));
    color: var(--color-paper);
}

.directory-card__caption h2,
.directory-card__caption h3,
.directory-card__caption p {
    margin: 0;
}

.directory-card__caption h2,
.directory-card__caption h3 {
    font-size: 1rem;
}

.directory-grid--compact .directory-card__media {
    height: 20rem;
}

.profile-team {
    background: var(--color-paper);
}

.directory-card__caption p {
    color: #c2cbd1;
    font-size: 0.72rem;
}

.directory-card__caption > span {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    color: var(--color-blue);
}

.expert-card__media span[aria-hidden="true"] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    background: #334755;
    color: rgba(255, 255, 255, 0.14);
    font-family: var(--font-serif);
    font-size: 8rem;
    font-style: italic;
}

.expert-card__caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 60%;
    padding: 2rem 1.5rem 1.5rem;
    background: linear-gradient(transparent, rgba(12, 22, 29, 0.92) 55%);
    color: var(--color-paper);
}

.expert-card__caption blockquote {
    display: flex;
    height: 100%;
    flex-direction: column;
    margin: 0;
}

.expert-card__caption blockquote span[aria-hidden="true"] {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 3rem;
    line-height: 0.6;
}

.expert-card__caption blockquote p {
    margin: 0.5rem 0 0;
    font-size: 0.95rem;
    line-height: 1.35;
}

.expert-card__caption blockquote footer {
    margin-top: auto;
    padding-top: 1rem;
    font-style: normal;
}

.expert-card__caption blockquote footer strong {
    display: block;
    font-size: 0.85rem;
}

.expert-card__caption blockquote footer span {
    color: #c2cbd1;
    font-size: 0.72rem;
}

.archive-pagination {
    margin-top: 4rem;
    text-align: center;
}

.archive-pagination .nav-links {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.archive-pagination .page-numbers {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border: 1px solid var(--color-border);
}

.archive-pagination > a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    padding: 0.65rem 1.35rem;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
    font-size: 0.76rem;
}

.archive-pagination .current {
    background: var(--color-ink);
    color: var(--color-paper);
}

.profile-page {
    background: var(--color-surface);
}

.profile-layout {
    display: grid;
    align-items: start;
    grid-template-columns: minmax(20rem, 0.7fr) minmax(30rem, 1.3fr);
    gap: 5rem;
}

.profile-layout__portrait {
    position: sticky;
    top: 2rem;
}

.back-link {
    display: inline-block;
    margin-bottom: 1rem;
    color: var(--color-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
}

.profile-layout__portrait img,
.profile-placeholder {
    width: 100%;
    min-height: 40rem;
    object-fit: cover;
}

.profile-placeholder {
    display: grid;
    place-items: center;
    background: #334755;
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 12rem;
}

.profile-header {
    padding-bottom: 2.5rem;
    border-bottom: 1px solid var(--color-border);
}

.profile-header h1 {
    margin: 0;
    font-size: clamp(3rem, 3.4vw, 3.9rem);
    font-weight: 300;
    line-height: 1;
}

.profile-header h1 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.profile-header > p {
    color: var(--color-muted);
}

.profile-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.button--dark {
    --button-fill: var(--color-ink-soft);
    --button-fill-opacity: 1;
    background: var(--color-ink);
    color: var(--color-paper);
}

.profile-section {
    display: grid;
    grid-template-columns: 9rem 1fr;
    gap: 2rem;
    padding-block: 3rem;
    border-bottom: 1px solid var(--color-border);
}

.profile-section__label {
    margin: 0;
    color: var(--color-blue);
    font-size: 0.75rem;
}

.profile-about > div > *:first-child {
    margin-top: 0;
}

.profile-about > div {
    color: var(--color-muted);
}

.profile-quote {
    margin: 3rem 0;
}

.profile-quote p {
    max-width: 24ch;
    margin: 0 0 1.5rem;
    font-size: clamp(2.5rem, 2.8vw, 3.2rem);
    font-weight: 300;
    line-height: 1.08;
}

.profile-quote cite {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--color-blue);
    font-size: 0.78rem;
    font-style: normal;
}

.profile-quote cite img {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    object-fit: cover;
}

.profile-quote cite span {
    display: flex;
    flex-direction: column;
    color: var(--color-muted);
    font-size: 0.68rem;
}

.profile-quote cite strong {
    color: var(--color-blue);
    font-size: 0.76rem;
}

.profile-list {
    background: var(--color-paper);
}

.profile-list article {
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--color-border);
}

.profile-list article:last-child {
    border-bottom: 0;
}

.profile-list span {
    color: var(--color-muted);
    font-size: 0.68rem;
    text-transform: uppercase;
}

.profile-list h2,
.profile-list p {
    margin: 0;
}

.profile-list h2 {
    font-size: 0.95rem;
}

.profile-list p {
    color: var(--color-muted);
    font-size: 0.8rem;
}

.profile-tags {
    padding-block: 2rem;
}

.profile-tags p {
    color: var(--color-muted);
}

.profile-tags a {
    display: inline-block;
    margin: 0 0.35rem 0.5rem 0;
    padding: 0.4rem 0.7rem;
    background: var(--color-ink);
    color: var(--color-paper);
    font-size: 0.65rem;
    text-transform: uppercase;
}

.profile-contact {
    padding-block: 3rem;
}

.profile-contact h2 {
    max-width: 22ch;
    margin: 0 0 1.5rem;
    font-size: 2.2rem;
    font-weight: 300;
}

.profile-related {
    margin-top: 6rem;
    background: var(--color-paper);
}

.profile-related .section-heading {
    max-width: 48rem;
}

.profile-case-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.profile-case-card {
    min-width: 0;
    border: 1px solid var(--color-border);
    border-right: 0;
}

.profile-case-card:last-child {
    border-right: 1px solid var(--color-border);
}

.profile-case-card a {
    display: grid;
    min-height: 20rem;
    grid-template-columns: 1fr 1fr;
}

.profile-case-card__body {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    flex-direction: column;
    padding: 1.5rem;
}

.profile-case-card__body p {
    margin: 0 0 1rem;
    color: var(--color-blue);
    font-size: 0.68rem;
}

.profile-case-card__body h3 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.2;
}

.profile-case-card__body > span {
    margin-top: auto;
    color: var(--color-blue);
}

.profile-case-card__media {
    display: grid;
    min-width: 0;
    overflow: hidden;
    place-items: center;
    background: #334755;
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 7rem;
    font-style: italic;
}

.profile-case-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.related-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.related-grid article {
    min-height: 18rem;
    border: 1px solid var(--color-border);
    border-right: 0;
}

.related-grid article:last-child {
    border-right: 1px solid var(--color-border);
}

.related-grid a {
    display: flex;
    height: 100%;
    align-items: flex-start;
    flex-direction: column;
    justify-content: space-between;
    padding: 2rem;
}

.related-grid h3 {
    max-width: 20ch;
    margin: 0;
    font-size: 1.5rem;
    font-weight: 400;
}

.related-grid span {
    align-self: flex-end;
    color: var(--color-blue);
}

.content-archive__intro {
    max-width: 62rem;
    margin-bottom: 4rem;
}

.content-archive__intro h2 {
    margin: 0;
    font-size: 3.8rem;
    font-weight: 300;
    line-height: 1.08;
}

.content-archive__intro--cases {
    display: grid;
    max-width: none;
    grid-template-columns: minmax(18rem, 0.8fr) minmax(24rem, 1.2fr);
    gap: clamp(4rem, 10vw, 10rem);
}

.content-archive__intro--cases > p {
    max-width: 28rem;
    min-width: 0;
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.35;
}

.content-archive__intro--cases h2 {
    max-width: 17ch;
    min-width: 0;
    text-align: right;
}

.content-archive__intro--cases h2 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.content-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-bottom: 2rem;
    color: var(--color-muted);
    font-size: 0.7rem;
}

.content-filters button {
    min-height: 2rem;
    padding: 0.4rem 0.9rem;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
    cursor: pointer;
    font-size: 0.62rem;
    text-transform: uppercase;
}

.content-filters button:hover,
.content-filters button:focus-visible,
.content-filters button.is-active {
    border-color: var(--color-ink);
    background: var(--color-ink);
    color: var(--color-paper);
}

.content-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.content-grid--cases {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2.5rem 1.5rem;
}

.content-grid--cases .content-card {
    border: 0;
}

.content-grid--cases .content-card:first-child {
    grid-column: span 2;
    grid-row: span 2;
}

.content-grid--cases .content-card:nth-child(4),
.content-grid--cases .content-card:nth-child(6n + 5),
.content-grid--cases .content-card:nth-child(6n + 8) {
    grid-column: span 2;
}

.content-grid--cases .content-card__media {
    height: 20rem;
}

.content-grid--cases .content-card:first-child .content-card__media {
    height: 42.5rem;
}

.content-grid--cases .content-card:nth-child(4) .content-card__media,
.content-grid--cases .content-card:nth-child(6n + 5) .content-card__media,
.content-grid--cases .content-card:nth-child(6n + 8) .content-card__media {
    height: 25rem;
}

.content-grid--cases .content-card__body {
    min-height: 0;
    padding: 1rem 0 0;
}

.content-grid--cases .content-card__body h2 {
    margin-bottom: 0.85rem;
    font-size: 1rem;
    line-height: 1.2;
}

.content-card__read {
    color: var(--color-blue);
    font-size: 0.72rem;
}

.content-grid--cases .content-card[hidden] {
    display: none;
}

.content-card {
    min-width: 0;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
}

.content-card__media {
    display: grid;
    height: 20rem;
    place-items: center;
    overflow: hidden;
    background: #334755;
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 8rem;
}

.content-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.content-card a:hover .content-card__media img {
    transform: scale(1.025);
}

.content-card__body {
    position: relative;
    min-height: 17rem;
    padding: 2rem 3.5rem 2rem 2rem;
}

.content-card__body h2 {
    margin: 0 0 1rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.15;
}

.content-card__body > p:not(.eyebrow) {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.85rem;
}

.content-card__arrow {
    position: absolute;
    right: 1.5rem;
    bottom: 1.5rem;
    color: var(--color-blue);
}

.content-card--insight time {
    display: block;
    margin-top: 1.5rem;
    color: var(--color-muted);
    font-size: 0.7rem;
}

.insights-archive .content-archive__intro em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.insights-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-bottom: 1.25rem;
}

.insights-chips a {
    display: inline-block;
    min-height: 2rem;
    padding: 0.4rem 0.9rem;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
    color: var(--color-ink);
    font-size: 0.62rem;
    text-transform: uppercase;
    text-decoration: none;
}

.insights-chips a:hover,
.insights-chips a:focus-visible,
.insights-chips a.is-active {
    border-color: var(--color-ink);
    background: var(--color-ink);
    color: var(--color-paper);
}

.insights-chips--sub {
    margin-bottom: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--color-border);
}

.insights-industry-filter {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2.5rem;
    font-size: 0.7rem;
    color: var(--color-muted);
}

.insights-industry-filter label {
    text-transform: uppercase;
    font-size: 0.62rem;
}

.insights-industry-filter select {
    min-height: 2.4rem;
    padding: 0.4rem 0.9rem;
    border: 1px solid var(--color-border);
    background: var(--color-paper);
    color: var(--color-ink);
    font-size: 0.75rem;
}

.insights-grid-mosaic {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem 1.5rem;
}

.insights-grid-mosaic .insight-item:nth-child(6n + 1) {
    grid-column: span 2;
}

.insights-grid-mosaic .insight-item:nth-child(6n + 1) .content-card__media {
    height: 26rem;
}

.insights-grid-mosaic .insight-cta {
    grid-column: span 3;
    border: 0;
    background: var(--color-ink);
    color: var(--color-paper);
}

.insights-grid-mosaic .insight-cta a {
    display: block;
    padding: 3rem;
}

.insights-grid-mosaic .insight-cta .eyebrow,
.insights-grid-mosaic .insight-cta h2 {
    color: var(--color-paper);
}

.insights-grid-mosaic .insight-cta h2 {
    max-width: 32ch;
    font-size: 2.2rem;
    font-weight: 300;
}

.insights-grid-mosaic .insight-cta .content-card__read {
    color: var(--color-paper);
    text-decoration: underline;
}

.insights-grid-mosaic .content-card[hidden] {
    display: none;
}

@media (max-width: 720px) {
    .insights-grid-mosaic {
        grid-template-columns: minmax(0, 1fr);
    }

    .insights-grid-mosaic .insight-item:nth-child(6n + 1) {
        grid-column: span 1;
    }

    .insights-grid-mosaic .insight-cta {
        grid-column: span 1;
    }
}

.article-header {
    background: var(--color-surface);
}

.article-header__inner {
    max-width: 66rem;
}

.article-header h1 {
    max-width: 19ch;
    margin: 0;
    font-size: 5rem;
    font-weight: 300;
    line-height: 1.03;
}

.article-header__excerpt {
    max-width: 46rem;
    margin: 2rem 0;
    color: var(--color-muted);
    font-size: 1.15rem;
}

.article-meta {
    display: flex;
    gap: 2rem;
    color: var(--color-muted);
    font-size: 0.75rem;
}

.article-featured {
    margin-top: 4rem;
}

.article-featured img {
    width: 100%;
    max-height: 46rem;
    object-fit: cover;
}

.article-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-top: 2rem;
}

.article-share {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.article-share__label {
    color: var(--color-muted);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.article-share a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid var(--color-border, #d8dde3);
    border-radius: 50%;
    color: var(--color-ink);
    font-size: 0.75rem;
    text-transform: uppercase;
    text-decoration: none;
}

.article-share a:hover {
    background: var(--color-ink);
    color: var(--color-paper);
}

.estudio-lead {
    background: var(--color-surface);
}

.estudio-lead__grid {
    display: grid;
    grid-template-columns: minmax(0, 22rem) minmax(0, 34rem);
    gap: clamp(2rem, 6vw, 5rem);
    align-items: start;
}

.estudio-lead__copy p:not(.eyebrow) {
    color: var(--color-muted);
}

.estudio-lead__form {
    display: grid;
    gap: 1.25rem;
}

.estudio-lead__row {
    display: grid;
    gap: 0.4rem;
}

.estudio-lead__row label {
    font-size: 0.8rem;
    color: var(--color-muted);
}

.estudio-lead__row input {
    padding: 0.75rem 1rem;
    border: 1px solid var(--color-border, #d8dde3);
    border-radius: 0.25rem;
    font: inherit;
}

.estudio-lead__terms {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-size: 0.85rem;
    color: var(--color-muted);
}

.estudio-lead__terms input {
    margin-top: 0.2rem;
}

.article-related__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

@media (max-width: 61.99rem) {
    .estudio-lead__grid {
        grid-template-columns: 1fr;
    }

    .article-related__grid {
        grid-template-columns: 1fr;
    }
}

.article-layout {
    display: grid;
    grid-template-columns: 14rem minmax(0, 48rem);
    justify-content: center;
    gap: 5rem;
    padding-block: 6rem;
}

.article-content {
    font-size: 1.08rem;
}

.article-content > *:first-child {
    margin-top: 0;
}

.article-content h2,
.article-content h3 {
    margin-top: 2.5rem;
    font-weight: 400;
}

.article-content h2 {
    font-size: 2.5rem;
}

.article-content img,
.article-content figure {
    max-width: 100%;
}

.article-content blockquote {
    margin: 3rem 0;
    padding-left: 2rem;
    border-left: 3px solid var(--color-blue);
    font-family: var(--font-serif);
    font-size: 1.75rem;
    font-style: italic;
}

/* Flexible content builder */
.builder-section {
    padding-block: clamp(3.5rem, 6vw, 6.5rem);
}

.builder-section h2 {
    margin: 0 0 1.5rem;
    font-size: clamp(2.5rem, 3vw, 3.5rem);
    font-weight: 300;
    line-height: 1.08;
}

.builder-theme--paper { background: var(--color-paper); }
.builder-theme--surface,
.builder-theme--light { background: var(--color-surface); }
.builder-theme--blue { background: var(--color-blue); color: var(--color-paper); }
.builder-theme--dark { background: var(--color-ink); color: var(--color-paper); }

.builder-theme--blue .eyebrow,
.builder-theme--dark .eyebrow { color: #bfcee0; }

.builder-width--narrow { max-width: 52rem; }
.builder-width--normal { max-width: 68rem; }
.builder-width--wide { max-width: var(--shell); }

.builder-rich-text {
    color: var(--color-muted);
    font-size: 1.05rem;
    line-height: 1.7;
}

.builder-theme--blue .builder-rich-text,
.builder-theme--dark .builder-rich-text { color: #d4dce2; }

.builder-rich-text > *:first-child { margin-top: 0; }
.builder-rich-text > *:last-child { margin-bottom: 0; }
.builder-rich-text h2 { color: var(--color-ink); }
.builder-theme--blue .builder-rich-text h2,
.builder-theme--dark .builder-rich-text h2 { color: var(--color-paper); }

.builder-columns__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(3rem, 8vw, 8rem);
}

.builder-columns--left .builder-columns__grid { grid-template-columns: 0.7fr 1.3fr; }
.builder-columns--right .builder-columns__grid { grid-template-columns: 1.3fr 0.7fr; }

.builder-image {
    margin: 0 auto;
    padding-block: 3rem;
}

.builder-image--normal { width: min(100% - 3rem, 68rem); }
.builder-image--wide { width: min(100% - 3rem, var(--shell)); }
.builder-image--full { width: 100%; }
.builder-image img { width: 100%; max-height: 52rem; object-fit: cover; }
.builder-image figcaption { margin-top: 0.75rem; color: var(--color-muted); font-size: 0.72rem; }
.builder-image--full figcaption { padding-inline: max(1.5rem, calc((100% - var(--shell)) / 2)); }

.builder-gallery__grid,
.builder-metrics__grid,
.builder-cards__grid {
    display: grid;
    grid-template-columns: repeat(var(--builder-columns), minmax(0, 1fr));
    gap: 1rem;
}

.builder-gallery figure { margin: 0; overflow: hidden; }
.builder-gallery img { width: 100%; height: 100%; min-height: 20rem; object-fit: cover; }

.builder-embed h2,
.builder-comparison h2 { max-width: 22ch; }
.builder-embed__frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--color-ink); }
.builder-embed__frame iframe { width: 100%; height: 100%; border: 0; }
.builder-embed p { color: var(--color-muted); font-size: 0.78rem; }

.builder-quote blockquote {
    display: grid;
    max-width: 68rem;
    grid-template-columns: 1fr;
    margin: 0 auto;
}
.builder-quote blockquote.has-image { grid-template-columns: 0.65fr 1.35fr; }
.builder-quote blockquote > div:first-child img { width: 100%; height: 100%; min-height: 25rem; object-fit: cover; }
.builder-quote__content { position: relative; display: flex; min-height: 25rem; flex-direction: column; justify-content: center; padding: clamp(2rem, 5vw, 4rem); }
.builder-quote__content > span { position: absolute; top: 0; right: 2rem; color: rgba(255,255,255,0.2); font-family: var(--font-serif); font-size: 8rem; line-height: 1; }
.builder-quote__content > p { position: relative; margin: 0; font-size: clamp(1.8rem, 2.5vw, 2.8rem); font-weight: 300; line-height: 1.15; }
.builder-quote cite { display: flex; flex-direction: column; margin-top: 2rem; color: inherit; font-size: 0.75rem; font-style: normal; opacity: 0.75; }

.builder-metrics__grid article { min-width: 0; padding: 2rem; border: 1px solid var(--color-border); background: rgba(255,255,255,0.06); }
.builder-metrics__grid strong { color: var(--color-blue); font-size: clamp(3rem, 4vw, 4.5rem); font-weight: 300; line-height: 1; }
.builder-theme--blue .builder-metrics__grid strong,
.builder-theme--dark .builder-metrics__grid strong { color: var(--color-blue); }
.builder-metrics__grid p { margin: 0.75rem 0 0; }
.builder-metrics__grid small { display: block; margin-top: 1rem; color: var(--color-muted); }

.builder-cards__grid article { min-height: 18rem; padding: 2rem; background: var(--color-surface); }
.builder-cards__grid img { width: 3.5rem; height: 3.5rem; object-fit: contain; }
.builder-cards__grid article > span { color: var(--color-blue); font-size: 4rem; font-weight: 300; }
.builder-cards__grid h3 { margin: 2rem 0 0.75rem; font-size: 1.2rem; }
.builder-cards__grid p { margin: 0; color: var(--color-muted); font-size: 0.82rem; }

.builder-comparison__table { border: 1px solid var(--color-border); }
.builder-comparison__row { display: grid; grid-template-columns: 0.7fr 1.15fr 1.15fr; }
.builder-comparison__row > * { margin: 0; padding: 1rem 1.25rem; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.builder-comparison__row > *:last-child { border-right: 0; }
.builder-comparison__row:last-child > * { border-bottom: 0; }
.builder-comparison__row.is-heading { background: var(--color-ink); color: var(--color-paper); }
.builder-comparison__row p { color: var(--color-muted); font-size: 0.85rem; }

.builder-highlight-list ul { display: grid; grid-template-columns: repeat(var(--builder-columns), minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; list-style: none; }
.builder-highlight-list li { display: flex; gap: 1rem; padding: 1.25rem; border: 1px solid rgba(255,255,255,0.18); }
.builder-highlight-list li span { color: var(--color-blue); }

.builder-download { background: var(--color-surface); }
.builder-download__grid { display: grid; align-items: center; grid-template-columns: 0.65fr 1.35fr; gap: clamp(3rem, 8vw, 8rem); }
.builder-download__grid > div:first-child img { width: 100%; max-height: 32rem; object-fit: contain; }
.builder-download__grid > div:last-child > p:not(.eyebrow) { max-width: 42rem; color: var(--color-muted); }

.builder-section__header { max-width: 48rem; margin-bottom: 2.5rem; }
.builder-section__header > p:last-child { color: var(--color-muted); }

.builder-faq__grid { display: grid; grid-template-columns: 0.75fr 1.25fr; gap: clamp(3rem, 8vw, 8rem); }
.builder-faq__items { border-top: 1px solid var(--color-border); }
.builder-faq details { border-bottom: 1px solid var(--color-border); }
.builder-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.5rem 0; cursor: pointer; font-size: 1.05rem; font-weight: 600; list-style: none; }
.builder-faq summary::-webkit-details-marker { display: none; }
.builder-faq summary span { color: var(--color-blue); font-size: 1.75rem; font-weight: 300; transition: transform 180ms ease; }
.builder-faq details[open] summary span { transform: rotate(45deg); }
.builder-faq details .builder-rich-text { padding: 0 3rem 1.5rem 0; }

.builder-team { background: var(--color-surface); }
.builder-team__grid { display: grid; grid-template-columns: repeat(var(--builder-columns), minmax(0, 1fr)); gap: 1rem; }
.builder-team article { min-width: 0; background: var(--color-paper); }
.builder-team article > a { display: block; color: inherit; text-decoration: none; }
.builder-team img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(100%); }
.builder-team article div { padding: 1.25rem; }
.builder-team h3 { margin: 0; font-size: 1rem; }
.builder-team article p { margin: 0.4rem 0 0; color: var(--color-muted); font-size: 0.75rem; }

.builder-case-summary > .site-shell > h2 { max-width: 20ch; }
.builder-case-summary__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 3rem; border-top: 1px solid currentColor; }
.builder-case-summary__grid article { padding: 2rem 2rem 2rem 0; }
.builder-case-summary__grid article + article { padding-left: 2rem; border-left: 1px solid currentColor; }
.builder-case-summary__grid span { color: var(--color-blue); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.builder-theme--blue .builder-case-summary__grid span,
.builder-theme--dark .builder-case-summary__grid span { color: var(--color-blue); }
.builder-case-summary__grid p { margin: 1rem 0 0; line-height: 1.65; opacity: 0.78; }
.builder-case-summary__results { display: grid; grid-template-columns: 0.5fr 1.5fr; gap: 2rem; padding-top: 2rem; border-top: 1px solid currentColor; }
.builder-case-summary__results h3 { margin: 0; font-size: 1rem; }
.builder-case-summary__results ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.builder-case-summary__results li { padding-left: 1.5rem; position: relative; }
.builder-case-summary__results li::before { position: absolute; left: 0; color: var(--color-blue); content: "✓"; }

.builder-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.builder-related article { min-width: 0; background: var(--color-surface); }
.builder-related article > a { display: block; color: inherit; text-decoration: none; }
.builder-related img,
.builder-related__placeholder { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--color-blue); }
.builder-related article > a > div { padding: 1.5rem; }
.builder-related article .eyebrow { margin-bottom: 0.75rem; }
.builder-related h3 { min-height: 3.2em; margin: 0; font-size: 1.15rem; line-height: 1.35; }
.builder-related__link { display: inline-block; margin-top: 2rem; color: var(--color-blue); font-size: 0.76rem; font-weight: 700; }

.builder-cta__grid { display: grid; align-items: center; grid-template-columns: 1fr auto; gap: 3rem; }
.builder-cta__grid h2 { max-width: 20ch; }
.builder-cta__grid > div > p:last-child { max-width: 42rem; opacity: 0.78; }

.contact-page {
    background: var(--color-surface);
}

.contact-intro-wrap {
    margin-bottom: 3rem;
}

.contact-intro h2,
.career-intro h2 {
    max-width: 18ch;
    margin: 0;
    font-size: 4.2rem;
    font-weight: 300;
    line-height: 1.05;
}

.contact-intro h2 em,
.career-intro h2 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.contact-intro > p:not(.eyebrow) {
    max-width: 36rem;
    color: var(--color-muted);
}

.contact-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 4rem;
}

.contact-details div {
    padding-top: 1rem;
    border-top: 1px solid var(--color-border);
}

.contact-details dt {
    color: var(--color-muted);
    font-size: 0.7rem;
    text-transform: uppercase;
}

.contact-details dd {
    margin: 0.25rem 0 0;
}

.contact-details dd a {
    display: inline-block;
}

.contact-map {
    position: relative;
    margin-top: 2rem;
}

.contact-map__iframe {
    display: block;
    width: 100%;
    height: 42rem;
    border: 0;
}

.contact-form-card {
    position: absolute;
    top: 3rem;
    right: 4vw;
    z-index: 2;
    display: grid;
    gap: 0.75rem;
    width: min(32rem, 90vw);
    max-height: calc(100% - 6rem);
    overflow-y: auto;
    padding: 3rem;
    background: var(--color-paper);
    box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.18);
}

.contact-form-card h3 {
    margin: 0 0 0.5rem;
    font-size: 1.6rem;
    font-weight: 300;
}

.contact-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.contact-form-card label:not(.contact-form__consent) {
    margin-top: 0.5rem;
    font-size: 0.78rem;
    font-weight: 600;
}

.contact-form-card input:not([type="checkbox"]),
.contact-form-card select,
.contact-form-card textarea {
    width: 100%;
    padding: 0.85rem 0;
    border: 0;
    border-bottom: 1px solid var(--color-border);
    border-radius: 0;
    background: transparent;
    appearance: none;
}

.contact-form-card input:focus,
.contact-form-card select:focus,
.contact-form-card textarea:focus {
    border-color: var(--color-blue);
    outline: 0;
}

.contact-form__consent {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-block: 0.5rem;
    color: var(--color-muted);
    font-size: 0.75rem;
}

.contact-form__consent input {
    margin-top: 0.2rem;
}

.contact-form__consent a {
    color: var(--color-blue);
}

.contact-form-card .button {
    justify-self: start;
}

.contact-form__trap {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.contact-form__status {
    min-height: 1.5rem;
    margin: 0.5rem 0 0;
    color: var(--color-blue-dark);
    font-size: 0.8rem;
}

.contact-form-card.has-error .contact-form__status {
    color: #a23232;
}

.contact-form-card.is-sending {
    opacity: 0.72;
}

.career-intro {
    background: var(--color-paper);
}

.career-intro__grid {
    display: grid;
    grid-template-columns: minmax(18rem, 0.8fr) minmax(26rem, 1.2fr);
    gap: clamp(4rem, 10vw, 10rem);
}

.career-intro__grid > div h2 {
    max-width: 20ch;
    margin: 0 0 1rem;
    font-size: 1.5rem;
    font-weight: 400;
}

.career-intro__grid > div p {
    max-width: 30rem;
    color: var(--color-muted);
    font-size: 0.8rem;
}

.career-intro__grid .button {
    margin-top: 1rem;
}

.career-intro__statement {
    max-width: 19ch;
    margin: 0;
    font-size: clamp(3rem, 3.4vw, 3.9rem);
    font-weight: 300;
    line-height: 1.05;
    text-align: right;
}

.career-intro__statement em,
.career-plan h2 em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-weight: 400;
}

.career-traits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 6rem;
}

.career-traits article {
    position: relative;
    min-height: 22rem;
    overflow: hidden;
    padding: 2rem;
    background: var(--color-surface);
}

.career-traits span {
    color: var(--color-blue);
    font-size: 7rem;
    font-weight: 300;
    line-height: 1;
}

.career-traits p {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    min-height: 8rem;
    margin: 0;
    padding: 2rem 1.5rem;
    background: var(--color-paper);
    font-size: 1rem;
}

.career-plan {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: var(--color-ink);
    color: var(--color-paper);
}

.career-plan__media {
    position: relative;
    min-height: 48rem;
}

.career-plan__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.career-plan__media strong {
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    font-size: 2.5rem;
    font-weight: 300;
}

.career-plan__content {
    padding: clamp(3rem, 6vw, 6rem);
    background-image: linear-gradient(60deg, transparent 45%, rgba(72, 98, 120, 0.2) 45%, rgba(72, 98, 120, 0.2) 62%, transparent 62%);
}

.career-plan__content > h2 {
    margin: 0;
    font-size: 3.5rem;
    font-weight: 300;
}

.career-plan__content > p {
    color: #aab6bf;
    font-size: 0.8rem;
}

.career-plan ol {
    margin: 3rem 0 0;
    padding: 0;
    list-style: none;
    counter-reset: career-step;
}

.career-plan li {
    position: relative;
    padding: 1rem 0 1.5rem 3.5rem;
    border-left: 1px solid rgba(117, 175, 241, 0.45);
    counter-increment: career-step;
}

.career-plan li::before {
    position: absolute;
    top: 1rem;
    left: 1rem;
    color: var(--color-blue);
    content: counter(career-step, decimal-leading-zero);
    font-size: 0.72rem;
}

.career-plan li h3,
.career-plan li p {
    margin: 0;
}

.career-plan li h3 {
    font-size: 1.2rem;
    font-weight: 400;
}

.career-plan li p {
    margin-top: 0.4rem;
    color: #8997a1;
    font-size: 0.72rem;
}

.career-development {
    background: var(--color-surface);
}

.career-development .section-heading > p:last-child {
    max-width: 48rem;
    margin: 1.5rem auto 0;
    color: var(--color-muted);
    font-size: 0.78rem;
}

.career-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4rem 3rem;
}

.career-benefits article {
    text-align: center;
}

.career-benefits img {
    width: 4rem;
    height: 4rem;
    margin-bottom: 1.25rem;
    object-fit: contain;
    opacity: 0.75;
}

.career-benefits h3 {
    margin: 0 0 0.75rem;
    font-size: 1rem;
}

.career-benefits p {
    max-width: 22rem;
    margin: 0 auto;
    color: var(--color-muted);
    font-size: 0.72rem;
}

.career-testimonial {
    display: grid;
    grid-template-columns: 0.68fr 1.32fr;
    max-width: 72rem;
    margin: 7rem auto 0;
}

.career-testimonial > div,
.career-testimonial > div img,
.career-testimonial blockquote {
    min-height: 28rem;
}

.career-testimonial > div img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.career-testimonial blockquote {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 3rem;
    background: var(--color-ink);
    color: var(--color-paper);
}

.career-testimonial blockquote > span {
    position: absolute;
    top: 0.5rem;
    right: 2rem;
    color: rgba(255, 255, 255, 0.18);
    font-family: var(--font-serif);
    font-size: 7rem;
}

.career-testimonial blockquote p {
    margin: 0;
    font-size: 1.15rem;
    line-height: 1.45;
}

.career-testimonial cite {
    display: flex;
    flex-direction: column;
    margin-top: auto;
    color: #aab6bf;
    font-size: 0.7rem;
    font-style: normal;
}

.career-testimonial cite strong {
    color: var(--color-paper);
}

.career-openings {
    background: var(--color-paper);
}

.career-openings .section-heading {
    margin-bottom: 2rem;
}

.career-openings__empty {
    text-align: center;
}

.job-list {
    border-top: 1px solid var(--color-border);
}

.job-list article {
    display: grid;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 2rem;
    padding-block: 2rem;
    border-bottom: 1px solid var(--color-border);
}

.job-list article h3,
.job-list article p {
    margin: 0;
}

.job-list article h3 {
    font-size: 1.5rem;
    font-weight: 400;
}

.job-list article > div > p:not(.eyebrow) {
    color: var(--color-muted);
    font-size: 0.8rem;
}

.job-list__empty {
    max-width: 45rem;
    padding: 3rem;
    background: var(--color-paper);
}

.job-list__empty h3 {
    margin: 0;
    font-size: 2rem;
    font-weight: 400;
}

.job-list__empty p {
    color: var(--color-muted);
}

.standard-content {
    max-width: 52rem;
    font-size: 1.08rem;
}

.standard-content > *:first-child {
    margin-top: 0;
}

.standard-content h2,
.standard-content h3 {
    margin-top: 2.5rem;
    font-weight: 400;
}

.standard-content h2 {
    font-size: 2.5rem;
}

.standard-content img,
.standard-content figure {
    max-width: 100%;
}

.error-page {
    display: grid;
    min-height: 70vh;
    align-items: center;
    background: var(--color-surface);
}

.error-page__inner {
    max-width: 58rem;
}

.error-page__code {
    margin: 0;
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 8rem;
    font-style: italic;
    line-height: 0.8;
}

.error-page h1,
.search-page__header h1 {
    max-width: 19ch;
    margin: 1rem 0;
    font-size: 4.2rem;
    font-weight: 300;
    line-height: 1.05;
}

.error-page__inner > p:not(.eyebrow, .error-page__code) {
    max-width: 40rem;
    color: var(--color-muted);
}

.error-page .search-form {
    margin-block: 2rem;
}

.search-form {
    display: flex;
    max-width: 42rem;
}

.search-form input {
    min-width: 0;
    flex: 1;
    padding: 0.75rem 1rem;
    border: 1px solid var(--color-border);
    border-right: 0;
    background: var(--color-paper);
}

.search-form input:focus {
    border-color: var(--color-blue);
    outline: 2px solid rgba(47, 127, 211, 0.2);
    outline-offset: 0;
}

.search-page__header {
    margin-bottom: 4rem;
}

.search-page__header .search-form {
    margin-top: 2rem;
}

.search-results {
    border-top: 1px solid var(--color-border);
}

.search-results article {
    display: grid;
    grid-template-columns: 0.25fr 1fr 1fr auto;
    gap: 2rem;
    padding-block: 2rem;
    border-bottom: 1px solid var(--color-border);
}

.search-results article h2,
.search-results article > p {
    margin: 0;
}

.search-results article h2 {
    font-size: 1.4rem;
    font-weight: 400;
}

.search-results article > p:not(.eyebrow) {
    color: var(--color-muted);
    font-size: 0.85rem;
}

.search-results .text-link {
    margin-top: 0;
    white-space: nowrap;
}

.search-empty {
    max-width: 42rem;
    padding: 3rem;
    background: var(--color-surface);
}

.search-empty h2 {
    margin-top: 0;
    font-weight: 400;
}

.detail-hero {
    padding-block: 5rem;
    background: var(--color-surface);
}

.detail-hero__grid {
    display: grid;
    align-items: stretch;
    grid-template-columns: 1.05fr 0.95fr;
    min-height: 38rem;
}

.detail-hero__content {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    padding: 4rem;
    background: var(--color-paper);
}

.detail-hero__content h1 {
    max-width: 16ch;
    margin: 0;
    font-size: 4.5rem;
    font-weight: 300;
    line-height: 1.03;
}

.detail-hero__summary {
    max-width: 40rem;
    margin: 2rem 0 0;
    color: var(--color-muted);
}

.detail-hero__media {
    display: grid;
    min-height: 38rem;
    place-items: center;
    overflow: hidden;
    background: var(--color-ink);
    color: rgba(255, 255, 255, 0.12);
    font-family: var(--font-serif);
    font-size: 12rem;
}

.detail-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-body {
    display: grid;
    grid-template-columns: 14rem minmax(0, 48rem);
    justify-content: center;
    gap: 5rem;
    padding-block: 6rem;
}

.detail-body__aside {
    padding-top: 0.5rem;
}

.detail-body__content {
    font-size: 1.08rem;
}

.detail-body__content > *:first-child {
    margin-top: 0;
}

.detail-body__content h2,
.detail-body__content h3 {
    margin-top: 2.5rem;
    font-weight: 400;
}

.detail-body__content h2 {
    font-size: 2.5rem;
}

.detail-body__content img {
    width: 100%;
    margin-block: 2rem;
}

.detail-metrics {
    background: var(--color-ink);
    color: var(--color-paper);
}

.detail-metrics__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.detail-metrics__grid div {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-direction: column;
    padding: 2rem;
    border-left: 1px solid rgba(255, 255, 255, 0.15);
    text-align: center;
}

.detail-metrics__grid div:first-child {
    border-left: 0;
}

.detail-metrics strong {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-size: 4rem;
    font-style: italic;
    font-weight: 400;
    line-height: 1;
}

.detail-metrics span {
    margin-top: 0.5rem;
    color: #aeb9c1;
    font-size: 0.78rem;
}

.detail-related {
    background: var(--color-surface);
}

.detail-page--caso_exito .detail-hero {
    padding-block: 4rem 0;
}

.detail-page--caso_exito .detail-hero__grid {
    grid-template-columns: 1fr;
}

.detail-page--caso_exito .detail-hero__content {
    display: grid;
    grid-template-columns: minmax(24rem, 1.1fr) minmax(18rem, 0.9fr);
    gap: 1rem clamp(4rem, 10vw, 10rem);
    padding: 0 0 4rem;
    background: transparent;
}

.detail-page--caso_exito .detail-hero__content .back-link,
.detail-page--caso_exito .detail-hero__content .eyebrow {
    grid-column: 1 / -1;
}

.detail-page--caso_exito .detail-hero__content h1 {
    font-size: clamp(3.2rem, 3.6vw, 4.2rem);
}

.detail-page--caso_exito .detail-hero__summary {
    align-self: end;
    margin: 0;
}

.detail-page--caso_exito .detail-hero__media {
    min-height: 40rem;
    max-height: 45rem;
}

.detail-page--caso_exito .detail-body {
    background: var(--color-surface);
}

.detail-page--caso_exito .detail-metrics {
    background: var(--color-surface);
    color: var(--color-ink);
}

.detail-page--caso_exito .detail-metrics__grid {
    gap: 1px;
}

.detail-page--caso_exito .detail-metrics__grid div {
    border: 0;
    background: var(--color-paper);
}

.detail-page--caso_exito .detail-metrics strong {
    font-family: var(--font-sans);
    font-style: normal;
    font-weight: 300;
}

@media (max-width: 1100px) {
    .builder-gallery__grid,
    .builder-metrics__grid,
    .builder-cards__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .content-archive__intro--cases {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .content-archive__intro--cases h2 {
        text-align: left;
    }

    .detail-page--caso_exito .detail-hero__content {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .detail-page--caso_exito .detail-hero__content .back-link,
    .detail-page--caso_exito .detail-hero__content .eyebrow {
        grid-column: auto;
    }

    .about-story__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about-story__visual--portrait {
        grid-column: 1;
    }

    .about-story blockquote {
        grid-column: 2;
    }

    .page-hero h1 {
        font-size: 4rem;
    }

    .about-intro__heading,
    .team-archive__intro {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .about-intro__heading h2,
    .team-archive__intro h2 {
        font-size: 3.6rem;
    }

    .about-summary {
        grid-template-columns: 1fr 1.4fr;
    }

    .about-summary__stats {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, 1fr);
    }

    .values-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .directory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-layout {
        grid-template-columns: 1fr;
    }

    .profile-layout__portrait {
        position: static;
    }

    .profile-layout__portrait img,
    .profile-placeholder {
        min-height: 35rem;
        max-height: 48rem;
    }

    .profile-header h1 {
        font-size: 3.7rem;
    }

    .content-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .detail-hero__grid {
        grid-template-columns: 1fr;
    }

    .detail-hero__content h1 {
        font-size: 3.7rem;
    }

    .detail-body {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .article-header h1 {
        font-size: 4rem;
    }

    .article-layout {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .career-intro__grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .contact-map__iframe {
        height: 34rem;
    }

    .contact-form-card {
        position: static;
        width: auto;
        max-height: none;
        margin-top: -6rem;
        margin-inline: 1.25rem;
    }

    .contact-details {
        grid-template-columns: 1fr;
    }

    .career-intro__statement {
        text-align: left;
    }

    .career-traits,
    .career-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .career-plan {
        grid-template-columns: 1fr;
    }

    .career-plan__media {
        min-height: 34rem;
    }

    .contact-intro h2,
    .career-intro h2 {
        font-size: 3.6rem;
    }

    .error-page h1,
    .search-page__header h1 {
        font-size: 3.6rem;
    }

    .search-results article {
        grid-template-columns: 1fr 1fr;
    }

    .home-hero__title {
        font-size: 4.75rem;
    }

    .home-intro__title,
    .home-methodology__title,
    .home-team__title,
    .section-heading h2,
    .home-contact h2 {
        font-size: 3.6rem;
    }

    .home-brand__word {
        font-size: 10rem;
    }

    .home-testimonial__header h2 {
        font-size: 3.25rem;
    }

    .site-header__inner {
        grid-template-columns: 1fr auto;
    }

    .site-header__toggle {
        display: inline-flex;
        width: 3rem;
        height: 3rem;
        align-items: center;
        justify-content: center;
        border: 0;
        background: transparent;
        color: var(--color-ink);
        cursor: pointer;
    }

    .site-header__toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    .site-header__toggle-icon,
    .site-header__toggle-icon::before,
    .site-header__toggle-icon::after {
        display: block;
        width: 1.5rem;
        height: 1px;
        background: currentColor;
        content: "";
        transition: transform 380ms cubic-bezier(0.65, 0, 0.35, 1), background-color 200ms ease;
    }

    .site-header__toggle-icon::before {
        transform: translateY(-0.45rem);
    }

    .site-header__toggle-icon::after {
        transform: translateY(0.4rem);
    }

    /* Hamburguesa -> X: la barra central se desvanece y las externas se cruzan. */
    .site-header__toggle[aria-expanded="true"] .site-header__toggle-icon {
        background-color: transparent;
    }

    .site-header__toggle[aria-expanded="true"] .site-header__toggle-icon::before {
        background-color: var(--color-ink);
        transform: translateY(0) rotate(45deg);
    }

    .site-header__toggle[aria-expanded="true"] .site-header__toggle-icon::after {
        background-color: var(--color-ink);
        transform: translateY(-1px) rotate(-45deg);
    }

    .site-header__toggle:focus-visible {
        outline: 3px solid color-mix(in srgb, var(--color-blue) 50%, transparent);
        outline-offset: 2px;
    }

    .site-nav a::before {
        display: none;
    }

    .site-nav {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        display: none;
        /* justify-self: end (escritorio) encogeria el panel absoluto pese a left/right 0. */
        justify-self: stretch;
        padding: 1rem;
        border-top: 1px solid var(--color-border);
        background: var(--color-paper);
        box-shadow: 0 18px 30px -18px rgba(23, 33, 40, 0.25);
    }

    .menu-open .site-nav {
        display: block;
    }

    .site-nav ul {
        align-items: stretch;
        flex-direction: column;
        gap: 0;
    }

    .site-nav a {
        padding: 0.9rem;
        border-bottom: 1px solid var(--color-border);
        font-size: 0.95rem;
    }

    /* En el panel movil el submenu va siempre abierto e indentado: el chevron sobra. */
    .site-nav .menu-item-has-children > a::after {
        display: none;
    }

    .site-nav .sub-menu {
        position: static;
        min-width: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: none;
    }

    .site-nav .sub-menu a {
        padding: 0.75rem 0.9rem 0.75rem 2rem;
        color: var(--color-ink-soft);
        font-size: 0.9rem;
        white-space: normal;
    }

    .site-header__contact {
        display: none;
    }

    /* En movil/tablet el boton Contacto del header se oculta: va al final del panel. */
    .menu-open .site-nav .site-nav__contact {
        display: flex;
        width: 100%;
        min-height: 48px;
        margin-top: 1rem;
        justify-content: center;
        border-bottom: 0;
        color: var(--color-paper);
        font-weight: 500;
    }

    .menu-open .site-nav .site-nav__contact:hover {
        color: var(--color-paper);
    }

    .home-intro__grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .home-services__grid {
        grid-template-columns: 1fr;
        grid-auto-columns: auto;
        grid-auto-flow: row;
    }

    .service-card {
        min-height: 21rem;
    }

    .service-card + .service-card {
        border-top: 0;
        border-left: 1px solid var(--color-border);
    }

    .home-stats__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 3rem;
    }

    .stat-item:nth-child(odd) {
        border-left: 0;
    }

    .methodology {
        display: block;
        min-height: 0;
    }

    .methodology__item {
        display: block;
        min-width: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.18);
        border-left: 0;
    }

    .methodology__panel {
        grid-template-columns: 1fr;
    }

    .methodology__panel,
    .methodology__media {
        min-height: 30rem;
    }

    .methodology__trigger {
        width: 100%;
        min-width: 0;
        min-height: 8rem;
        align-items: flex-start;
        flex-direction: row;
        justify-content: space-between;
    }

    .methodology__label {
        max-width: 15ch;
        writing-mode: initial;
        transform: none;
    }

    .methodology__number,
    .methodology__arrow {
        align-self: auto;
    }

    .home-team__header,
    .testimonial-card,
    .featured-case,
    .site-footer__main {
        grid-template-columns: 1fr;
    }

    .team-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Apilada, la imagen absoluta necesita que la columna aporte su altura:
       proporcion 16:10 (no una franja ancha) y encuadre alto para no cortar
       la cabeza del retrato vertical. */
    .testimonial-card__portrait {
        min-height: 0;
        max-height: 40rem;
        aspect-ratio: 16 / 10;
    }

    .testimonial-card__image {
        object-position: center 30%;
    }

    .site-footer__main {
        gap: 4rem;
    }

    /* Apilado: el LinkedIn destacado va bajo los contactos, alineado a la izquierda. */
    .site-footer__linkedin {
        align-self: flex-start;
        padding-top: 2.25rem;
    }

    /* 16px evita el zoom automatico de iOS al enfocar campos. */
    .site-footer__newsletter input[type="email"],
    .search-form input {
        font-size: 1rem;
    }

    /* Area tactil de 40px para telefonos, email, redes y enlaces legales. */
    .site-footer__contact-grid a,
    .site-footer__nav a,
    .site-footer__links a {
        display: inline-flex;
        align-items: center;
        min-height: 40px;
    }

    /* En el bloque de contacto el texto va arriba (alineado con la direccion) y
       el area tactil crece hacia abajo. Los dos telefonos, de 32px cada uno,
       quedan seguidos sin un interlineado de 40px y sin solaparse. */
    .site-footer__contact-grid a:not(.location-apps__link) {
        align-items: flex-start;
    }

    .site-footer__contact-grid a[href^="tel:"] {
        min-height: 32px;
    }

    .site-footer__nav ul,
    .site-footer__links ul {
        row-gap: 0;
    }

    .site-footer__newsletter-consent {
        gap: 10px;
        font-size: 0.8125rem;
    }

    .site-footer__newsletter-consent input[type="checkbox"] {
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
        margin: 0;
        accent-color: var(--color-blue);
    }

    .breadcrumbs {
        font-size: 0.75rem;
    }

    /* Area tactil de 40px sin alterar la altura visual de la pastilla. */
    .breadcrumbs a {
        display: inline-block;
        margin: -11px -4px;
        padding: 11px 4px;
    }
}

@media (max-width: 640px) {
    :root {
        --space-section: 3.75rem;
    }

    .page-hero {
        min-height: 19rem;
    }

    .page-hero h1 {
        font-size: 3.2rem;
    }

    .about-intro__heading h2,
    .team-archive__intro h2 {
        font-size: 3rem;
    }

    .about-intro__heading {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .about-intro__heading p {
        align-self: auto;
    }

    .team-archive__summary {
        grid-template-columns: auto 1fr;
    }

    .team-archive__summary > p:last-child {
        max-width: 20rem;
    }

    .about-summary,
    .about-values__media,
    .values-grid,
    .about-story__grid,
    .profile-section,
    .related-grid {
        grid-template-columns: 1fr;
    }

    .about-summary__image {
        min-height: 22rem;
    }

    .about-summary__statement {
        min-height: 23rem;
        padding: 2rem;
    }

    .about-summary__stats {
        grid-column: auto;
    }

    .about-values__media span:nth-child(2) {
        transform: none;
    }

    .about-values__media img:nth-child(2) {
        transform: none;
    }

    .values-grid {
        gap: 3rem;
    }

    .about-story blockquote {
        grid-column: auto;
    }

    .about-story__visual--portrait {
        grid-column: auto;
    }

    .directory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .directory-card__media,
    .directory-grid--compact .directory-card__media {
        height: auto;
        aspect-ratio: 3 / 4;
    }

    .directory-card__caption {
        min-height: 5.5rem;
        padding: 0.85rem 2rem 0.85rem 0.85rem;
    }

    .directory-card__caption h2,
    .directory-card__caption h3 {
        font-size: 0.88rem;
        line-height: 1.2;
    }

    .directory-card__caption > span {
        right: 0.75rem;
        bottom: 0.85rem;
    }

    .directory-card--quote .directory-card__media {
        padding: 1rem;
    }

    .directory-card--quote blockquote span {
        font-size: 3rem;
    }

    .directory-card--quote blockquote p {
        margin-top: 0.75rem;
        font-size: 1rem;
        line-height: 1.2;
    }

    .directory-card--quote blockquote footer {
        padding-top: 0.75rem;
        font-size: 0.62rem;
    }

    .profile-layout {
        gap: 3rem;
    }

    .profile-layout__portrait img,
    .profile-placeholder {
        min-height: 28rem;
    }

    .profile-header h1 {
        font-size: 3rem;
    }

    .profile-quote p {
        font-size: 2.4rem;
    }

    .profile-section {
        gap: 1rem;
    }

    .related-grid article,
    .related-grid article:last-child {
        border-right: 1px solid var(--color-border);
        border-bottom: 0;
    }

    .related-grid article:last-child {
        border-bottom: 1px solid var(--color-border);
    }

    .profile-case-grid {
        grid-template-columns: 1fr;
    }

    .profile-case-card,
    .profile-case-card:last-child {
        border-right: 1px solid var(--color-border);
        border-bottom: 0;
    }

    .profile-case-card:last-child {
        border-bottom: 1px solid var(--color-border);
    }

    .profile-case-card a {
        min-height: 15rem;
    }

    .profile-case-card__body {
        padding: 1rem;
    }

    .content-archive__intro h2 {
        font-size: 3rem;
    }

    .content-grid,
    .detail-metrics__grid {
        grid-template-columns: 1fr;
    }

    .content-grid--cases .content-card:first-child,
    .content-grid--cases .content-card:nth-child(4),
    .content-grid--cases .content-card:nth-child(6n + 5),
    .content-grid--cases .content-card:nth-child(6n + 8) {
        grid-column: span 1;
        grid-row: span 1;
    }

    .content-grid--cases .content-card__media,
    .content-grid--cases .content-card:first-child .content-card__media,
    .content-grid--cases .content-card:nth-child(4) .content-card__media,
    .content-grid--cases .content-card:nth-child(6n + 5) .content-card__media,
    .content-grid--cases .content-card:nth-child(6n + 8) .content-card__media {
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .detail-hero {
        padding-block: 0;
    }

    .detail-hero__content {
        padding: 3rem 1.5rem;
    }

    .detail-hero__content h1 {
        font-size: 3rem;
    }

    .detail-hero__media {
        min-height: 25rem;
    }

    .detail-metrics__grid div,
    .detail-metrics__grid div:first-child {
        border-top: 1px solid rgba(255, 255, 255, 0.15);
        border-left: 0;
    }

    .article-header h1 {
        font-size: 3rem;
    }

    .article-meta {
        flex-direction: column;
        gap: 0.35rem;
    }

    .article-layout {
        padding-block: 4rem;
    }

    .contact-intro h2,
    .career-intro h2 {
        font-size: 3rem;
    }

    .contact-form-card {
        padding: 2rem 1.25rem;
        margin-top: -3rem;
    }

    .contact-form__row {
        grid-template-columns: 1fr;
    }

    .job-list article {
        align-items: start;
        grid-template-columns: 1fr;
    }

    .builder-columns__grid,
    .builder-columns--left .builder-columns__grid,
    .builder-columns--right .builder-columns__grid,
    .builder-gallery__grid,
    .builder-metrics__grid,
    .builder-cards__grid,
    .builder-quote blockquote.has-image,
    .builder-download__grid,
    .builder-faq__grid,
    .builder-team__grid,
    .builder-case-summary__grid,
    .builder-case-summary__results,
    .builder-related__grid,
    .builder-cta__grid {
        grid-template-columns: 1fr;
    }

    .builder-case-summary__grid article + article {
        padding-left: 0;
        border-left: 0;
        border-top: 1px solid currentColor;
    }

    .builder-comparison__table {
        overflow-x: auto;
    }

    .builder-comparison__row {
        min-width: 42rem;
    }

    .career-traits,
    .career-benefits,
    .career-testimonial {
        grid-template-columns: 1fr;
    }

    .career-traits article {
        min-height: 18rem;
    }

    .career-plan__media {
        min-height: 26rem;
    }

    .career-plan__content {
        padding: 3rem 1.5rem;
    }

    .career-testimonial > div,
    .career-testimonial > div img,
    .career-testimonial blockquote {
        min-height: 22rem;
    }

    .error-page__code {
        font-size: 6rem;
    }

    .error-page h1,
    .search-page__header h1 {
        font-size: 3rem;
    }

    .search-form {
        align-items: stretch;
        flex-direction: column;
    }

    .search-form input {
        min-height: 3rem;
        border-right: 1px solid var(--color-border);
        border-bottom: 0;
    }

    .search-results article {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    /* En una columna el tipo (Entrada, Servicio...) no debe pesar mas que el titulo. */
    .search-results article > .eyebrow {
        color: var(--color-muted);
        font-size: 1rem;
    }

    /* Area tactil de 40px sin mover el texto. */
    .search-results .text-link {
        margin-block: -8px;
        padding-block: 8px;
    }
    :root {
        --header-height: 68px;
    }

    .site-shell {
        width: min(100% - 1.5rem, var(--shell));
    }

    .home-hero {
        min-height: calc(100svh - var(--header-height));
    }

    .home-hero__title {
        font-size: 3.35rem;
    }

    .home-intro__title {
        font-size: 3rem;
    }

    .home-methodology__title,
    .home-team__title,
    .section-heading h2,
    .home-contact h2,
    .home-testimonial__header h2 {
        font-size: 3rem;
    }

    .home-brand__word {
        font-size: 5rem;
    }

    .featured-case__content h3 {
        font-size: 2rem;
    }

    .site-footer__learning h2 {
        font-size: 1.75rem;
    }

    .service-card__title {
        margin-top: 3rem;
    }

    .service-card {
        grid-template-columns: 1fr;
    }

    .service-card__media {
        min-height: 15rem;
        order: -1;
    }

    .stat-item {
        padding-inline: 0.75rem;
    }

    .stat-item__value {
        font-size: 2.65rem;
    }

    .home-methodology__shape {
        width: 90vw;
    }

    .methodology__panel,
    .methodology__media {
        min-height: 25rem;
    }

    .methodology__trigger {
        min-height: 5.5rem;
        align-items: center;
        padding: 1rem;
    }

    .methodology__number {
        font-size: 2.4rem;
    }

    .methodology__copy {
        right: 0.75rem;
        bottom: 0.75rem;
        left: 0.75rem;
    }

    .insights-grid {
        grid-template-columns: 1fr;
    }

    .team-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 5.5rem;
        gap: 0.75rem;
    }

    .team-card--person,
    .team-card--person:nth-child(4n + 2) {
        grid-row: span 3;
    }

    .team-card--quote {
        grid-row: span 2;
        padding: 1rem;
    }

    .team-card--quote p {
        font-size: 1.05rem;
    }

    .team-card__caption {
        padding: 2.5rem 0.75rem 0.75rem;
    }

    .team-card__caption h3 {
        font-size: 0.85rem;
    }

    .testimonial-card__metrics {
        margin-top: 3rem;
    }

    .testimonial-card__portrait {
        aspect-ratio: 1 / 1;
    }

    .featured-case__media,
    .featured-case__image,
    .featured-case__placeholder {
        min-height: 20rem;
    }

    .home-contact__inner {
        align-items: start;
        grid-template-columns: 1fr;
    }

    .home-contact__inner .button {
        justify-self: start;
    }

    .site-footer__bottom {
        align-items: flex-start;
        flex-direction: column;
        padding-block: 1.25rem;
    }

    /* En columna el margen automatico empujaria el copyright fuera de la
       alineacion izquierda del resto. */
    .site-footer__bottom p {
        margin-left: 0;
    }

    .site-footer__nav ul,
    .site-footer__links ul {
        gap: 1rem 1.5rem;
    }

    .site-footer__contact-grid {
        grid-template-columns: 1fr;
        gap: 1.75rem;
    }

    .site-footer__newsletter {
        grid-template-columns: 1fr;
    }

    .site-footer__newsletter-consent,
    .site-footer__newsletter-status {
        grid-column: 1;
    }

    .standard-content h2 {
        font-size: 1.75rem;
        line-height: 1.2;
    }

    .hacemos-intro__header {
        grid-template-columns: 1fr;
    }

    .hacemos-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .hacemos-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.hacemos-intro {
    padding-block: var(--space-section);
}

.hacemos-intro__header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
    margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.hacemos-intro__title {
    margin: 0;
    font-size: clamp(2.4rem, 3.45vw, 3.4rem);
    font-weight: 300;
    line-height: 1.1;
}

.hacemos-intro__title em {
    color: var(--color-blue);
    font-family: var(--font-serif);
    font-style: normal;
    font-weight: 400;
}

.hacemos-intro__copy p:first-child {
    margin-top: 0;
}

.hacemos-intro__copy p:last-child {
    color: var(--color-muted);
}

.hacemos-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.service-tile,
.quote-tile {
    border-radius: 1rem;
    overflow: hidden;
}

.service-tile {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 16rem;
    background: var(--color-surface);
}

.service-tile__media {
    position: absolute;
    inset: 0;
}

.service-tile__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-tile__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(23, 35, 45, 0) 40%, rgba(23, 35, 45, 0.75) 100%);
}

.service-tile__title {
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 1.25rem;
    color: var(--color-paper);
    font-size: 1.1rem;
    font-weight: 500;
}

.quote-tile {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.25rem;
    min-height: 16rem;
    padding: 1.5rem;
    background: var(--color-ink);
    color: var(--color-paper);
}

.quote-tile p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.5;
}

.quote-tile__person {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.quote-tile__avatar {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-blue);
    color: var(--color-paper);
    font-family: var(--font-serif);
}

img.quote-tile__avatar {
    object-fit: cover;
}

.quote-tile__person span {
    display: flex;
    flex-direction: column;
    font-size: 0.85rem;
    line-height: 1.3;
}

.quote-tile__person strong {
    font-weight: 600;
}

.quote-tile__person span span {
    color: color-mix(in srgb, var(--color-paper) 70%, transparent);
}

/* Service detail: hero industry chips. */
.service-hero__industries {
    margin-top: 1.75rem;
}

.service-hero__industries-label {
    margin: 0 0 0.75rem;
    color: var(--color-muted);
    font-size: 0.82rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.chip {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.95rem;
    border: 1px solid color-mix(in srgb, var(--color-ink) 16%, transparent);
    border-radius: 999px;
    color: var(--color-ink);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.chip:hover,
.chip:focus-visible {
    background: var(--color-blue);
    border-color: var(--color-blue);
    color: var(--color-paper);
}

/* Service detail: dark band with 5 elements + structural/potentiator toggle. */
.service-elements {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding-block: clamp(3rem, 6vw, 5.5rem);
    background: var(--color-ink);
    color: var(--color-paper);
}

.service-elements__shape {
    position: absolute;
    top: -18%;
    right: -8%;
    bottom: -18%;
    z-index: -1;
    width: min(40vw, 38rem);
    background: #223448;
    clip-path: polygon(54% 0, 100% 0, 100% 100%, 54% 100%, 100% 50%);
}

.service-elements__header {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.service-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem;
    margin-bottom: 1.75rem;
}

.service-pills__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: transparent;
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.85rem;
    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.service-pills__trigger:hover {
    border-color: rgba(255, 255, 255, 0.5);
    color: var(--color-paper);
}

.service-pills__trigger.is-active {
    background: var(--color-blue);
    border-color: var(--color-blue);
    color: var(--color-paper);
}

.service-pills__number {
    font-family: var(--font-serif);
    font-weight: 400;
}

.service-toggle {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: 0;
}

.service-toggle__button {
    padding: 0.65rem 1.4rem;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    background: transparent;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.service-toggle__button.is-active {
    background: var(--color-paper);
    border-color: var(--color-paper);
    color: var(--color-ink);
}

/* Elementos estructurales. */
.service-structural {
    margin-top: clamp(2.5rem, 5vw, 4rem);
}

.service-structural__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.75rem;
    margin-bottom: 2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    padding-bottom: 1rem;
}

.service-structural__trigger {
    padding: 0.35rem 0;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    transition: color 180ms ease;
}

.service-structural__trigger.is-active {
    color: var(--color-paper);
    box-shadow: 0 2px 0 var(--color-blue);
}

.service-structural__panel[hidden] {
    display: none;
}

.service-structural__grid {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: clamp(2rem, 4vw, 3rem);
    align-items: start;
}

.service-structural__content h3 {
    margin: 0 0 1rem;
    font-size: 1.5rem;
    font-weight: 400;
}

.service-structural__content > p {
    margin: 0 0 1.5rem;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.6;
}

.service-structural__list-label {
    margin: 0 0 0.65rem;
    color: var(--color-blue);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.service-structural__list {
    margin: 0 0 1.5rem;
    padding-left: 1.1rem;
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.92rem;
    line-height: 1.6;
}

.service-structural__list--tools strong {
    color: var(--color-paper);
    font-weight: 700;
}

.service-structural__aside {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
    background: #223448;
    border-radius: 0.5rem;
}

.service-structural__media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 0.35rem;
    background: #314455;
}

.service-structural__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-structural__quote {
    margin: 0;
    color: var(--color-paper);
    font-family: var(--font-serif);
    font-size: 1.05rem;
    font-style: italic;
    line-height: 1.5;
}

/* Elementos potenciadores. */
.service-potentiator {
    margin-top: clamp(2.5rem, 5vw, 4rem);
}

.service-potentiator__carousel {
    position: relative;
}

.service-potentiator__card[hidden] {
    display: none;
}

.service-potentiator__card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(2rem, 4vw, 3rem);
    align-items: center;
}

.service-potentiator__media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 0.5rem;
    background: #314455;
}

.service-potentiator__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-potentiator__body h3 {
    margin: 0 0 1rem;
    font-size: 1.4rem;
    font-weight: 400;
}

.service-potentiator__body p {
    margin: 0;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.6;
}

.service-potentiator__nav {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.service-potentiator__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 50%;
    background: transparent;
    color: var(--color-paper);
    cursor: pointer;
    transition: background-color 180ms ease, border-color 180ms ease;
}

.service-potentiator__arrow:hover {
    background: var(--color-blue);
    border-color: var(--color-blue);
}

.service-potentiator__metrics {
    margin-top: clamp(2.5rem, 4vw, 3.5rem);
    padding-top: clamp(2rem, 4vw, 3rem);
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.service-potentiator__metrics strong {
    color: var(--color-paper);
}

.service-potentiator__metrics span {
    color: rgba(255, 255, 255, 0.65);
}

@media (max-width: 900px) {
    .service-structural__grid,
    .service-potentiator__card {
        grid-template-columns: 1fr;
    }

    .service-pills,
    .service-toggle {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

.icon-arrow {
    display: inline-block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    vertical-align: -0.125em;
}

.service-card__link,
.content-card__arrow,
.directory-card__caption > span,
.methodology__arrow,
.industry-picker__arrow {
    font-size: 1.45rem;
    line-height: 1;
}

/* ------------------------------------------------------------------ */
/* Filtros en movil: selector con icono (inc/navigation.php,           */
/* land_theme_filter_select). En escritorio se ven los botones.        */
/* ------------------------------------------------------------------ */

.filter-select {
    display: none;
}

@media (max-width: 768px) {
    .filter-select {
        display: block;
        margin: 0 0 28px;
    }

    .filter-select__box {
        position: relative;
        display: flex;
        min-height: 56px;
        align-items: center;
        gap: 14px;
        padding: 0 18px;
        border: 1px solid var(--color-border, #d5d9dc);
        border-radius: 10px;
        background: var(--color-paper);
        color: var(--color-text);
        cursor: pointer;
        transition: border-color 180ms ease, box-shadow 180ms ease;
    }

    .filter-select__box:focus-within {
        border-color: var(--color-blue);
        box-shadow: 0 0 0 3px rgba(64, 122, 195, 0.18);
    }

    .filter-select__icon {
        flex-shrink: 0;
        color: var(--color-blue);
    }

    .filter-select__text {
        display: flex;
        min-width: 0;
        flex: 1 1 auto;
        flex-direction: column;
        gap: 2px;
    }

    .filter-select__label {
        color: var(--color-muted);
        font-size: 11px;
        letter-spacing: 0.06em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    .filter-select__value {
        overflow: hidden;
        font-size: 16px;
        line-height: 1.3;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .filter-select__chevron {
        flex-shrink: 0;
        color: var(--color-text);
    }

    /* El select nativo cubre la pildora: abre el selector del sistema (16px evita el zoom en iOS). */
    .filter-select__native {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        font-size: 16px;
        cursor: pointer;
        appearance: none;
    }

    /* La fila de botones/enlaces queda solo para escritorio. */
    #equipo-filters,
    #case-filters,
    #insights-tabs-nav,
    .insights-filters__tabs > .insights-filters__label {
        display: none;
    }
}

/* ==========================================================================
   Estado de carga de fotos diferidas (global). Lo activa assets/js/main.js
   (VinsonImg) solo en una lista cerrada de fotos dentro de contenedores con
   tamano propio: sin JS no se oculta nada. Mientras la foto carga, su
   contenedor muestra un marcador neutro con un brillo sutil; al cargar, la
   foto entra con un fundido corto. Se oculta con filter: opacity() (no con
   opacity) para no chocar con GSAP ni con scripts que leen su opacidad.
   Neutros existentes: --color-surface (fondo claro) / --color-ink-soft (oscuro).
   ========================================================================== */
[data-img-host~="light"] {
    --img-shine: rgba(255, 255, 255, 0.7);
}

[data-img-host~="dark"] {
    --img-shine: rgba(255, 255, 255, 0.06);
}

/* Contenedor transparente: fondo neutro mientras carga (la foto, opaca, lo cubre al llegar). */
[data-img-host][data-img-host~="fill"][data-img-host~="light"] {
    background-color: var(--color-surface);
}

[data-img-host][data-img-host~="fill"][data-img-host~="dark"] {
    background-color: var(--color-ink-soft);
}

/* "still": el contenedor ya tiene imagen de fondo propia; "idle": cargada o con error. */
[data-img-host]:not([data-img-host~="still"]):not([data-img-host~="idle"]) {
    background-image: linear-gradient(100deg, transparent 35%, var(--img-shine) 50%, transparent 65%);
    background-repeat: no-repeat;
    background-size: 250% 100%;
    animation: land-img-shine 1.6s ease-in-out infinite;
}

/* Pendiente o con error: no se dibuja (nunca el icono de imagen rota); queda el marcador. */
img[data-img="wait"],
img[data-img="fail"] {
    filter: opacity(0);
}

img[data-img="in"] {
    animation: land-img-in 0.35s ease-out both;
}

@keyframes land-img-shine {
    from {
        background-position: 100% 0;
    }

    to {
        background-position: 0 0;
    }
}

@keyframes land-img-in {
    from {
        filter: opacity(0);
    }

    to {
        filter: opacity(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-img-host]:not([data-img-host~="still"]):not([data-img-host~="idle"]) {
        background-image: none;
        animation: none;
    }

    img[data-img="in"] {
        animation: none;
    }
}

/* ==========================================================================
   Fotos circulares de personas: encuadre superior comun para todos los
   avatares (citas, tarjetas y capas de equipo, firma del perfil, mosaico de
   Que hacemos, expertos, equipo de casos y articulos, autor en Insights).
   Solo el encuadre: tamano y forma siguen en cada hoja. :root suma
   especificidad para ganar a las hojas de pagina, que cargan despues.
   50% 12%: elegido con las 70 fotos reales del equipo (con 18-25% varias
   pierden la coronilla; con 0% sobra fondo sobre la cabeza). Solo actua con
   fotos proporcionales: el "thumbnail" 150x150 ya viene recortado al centro
   por WordPress.
   ========================================================================== */
:root {
    --avatar-focus: 50% 12%;
}

:root :is(
    .team-archive__avatars img,
    .team-card__avatar,
    .team-reveal__avatar,
    .profile-quote cite img,
    .profile-quote figcaption img,
    img.quote-tile__avatar,
    .hs-expert__avatar img,
    .case-team__avatar,
    .article-team__photo,
    .a-team__avatar,
    .insights-card__avatar
) {
    object-fit: cover;
    object-position: var(--avatar-focus);
}
