/* hero — purpose: 90vh bottom-aligned stage, full-width band paddings */
.purpose-hero {
    min-height: 90vh;
    padding-top: 8rem;
    padding-inline: 1.5rem;
}

@media (min-width: 1024px) {
    .purpose-hero {
        padding-inline: 10%;
    }
}

.purpose-hero__watermark {
    font-size: 12rem;
    line-height: 1;
    letter-spacing: -0.05em;
    writing-mode: vertical-rl;
    opacity: 0.1;
}

.purpose-hero__wrap {
    max-width: 72rem;
}

.purpose-hero__title {
    font-size: clamp(2.5rem, 8vw, 5rem);
    line-height: 0.9;
    letter-spacing: -0.05em;
}

.purpose-hero__lead {
    max-width: 42rem;
}

.purpose-hero__btn {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.1em;
}

.purpose-hero__btn--lift {
    transition: transform 300ms ease, background-color 300ms ease;
}

.purpose-hero__btn--lift:hover {
    transform: translate(0.25rem, -0.25rem);
}

.purpose-hero__btn--lift:active {
    transform: translate(0, 0);
}

.purpose-hero__rule {
    height: 1px;
    margin-top: 5rem;
}

@media (min-width: 1024px) {
    .purpose-hero__rule {
        margin-top: 8rem;
    }
}

.purpose-hero__rule-mark {
    width: 6rem;
    height: 0.5rem;
    transform: translateY(-50%);
}

@media (prefers-reduced-motion: reduce) {
    .purpose-hero__btn--lift,
    .purpose-hero__btn--lift:hover {
        transition: none;
        transform: none;
    }
}

/* about — catalyst: full-width band paddings */
.catalyst-about {
    padding-block: 6rem;
    padding-inline: 1.5rem;
}

@media (min-width: 1024px) {
    .catalyst-about {
        padding-inline: 10%;
    }
}

.catalyst-about__label {
    writing-mode: vertical-rl;
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.2em;
}

.catalyst-about__title {
    font-size: clamp(2rem, 5vw, 3.5rem);
    line-height: 1.25;
}

.catalyst-about__caps {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.1em;
}

/* offset solid shadow behind the photo */
.catalyst-about__shadow {
    transform: translate(0.75rem, 0.75rem);
}

.catalyst-about__frame {
    aspect-ratio: 4 / 5;
}

.catalyst-about__img {
    object-fit: cover;
}

.catalyst-about__quote {
    max-width: 20rem;
    transform: translate(-2rem, 2rem);
}

.catalyst-about__quote-text {
    font-size: 0.875rem;
}

/* reveal — only when JS is ready and motion is allowed */
@media (prefers-reduced-motion: no-preference) {
    .catalyst-about.is-ready .catalyst-about__reveal {
        opacity: 0;
        transition: opacity 900ms ease, transform 900ms ease;
    }

    .catalyst-about.is-ready .catalyst-about__reveal--right {
        transform: translateX(-3rem);
    }

    .catalyst-about.is-ready .catalyst-about__reveal--left {
        transform: translateX(3rem);
    }

    .catalyst-about.is-ready .catalyst-about__reveal.is-visible {
        opacity: 1;
        transform: none;
    }
}

.catalyst-about__copy {
    line-height: 1.625;
}

/* services — core: dark band */
.core-services__band {
    padding-block: 8rem;
}

/* soft highlight glow in the bottom-left corner */
.core-services__glow {
    width: 40rem;
    height: 40rem;
    left: -14rem;
    bottom: -18rem;
    filter: blur(64px);
    opacity: 0.1;
}

.core-services__head {
    margin-bottom: 5rem;
}

.core-services__title {
    font-size: 2.25rem;
    letter-spacing: -0.05em;
}

@media (min-width: 1024px) {
    .core-services__title {
        font-size: 4.5rem;
    }
}

.core-services__rule {
    height: 1px;
}

/* inner hairlines between the cells: widths only, colour comes from the utilities */
.core-services__cell {
    border-style: solid;
    border-width: 0 0 1px 0;
}

.core-services__cell:last-child {
    border-bottom-width: 0;
}

@media (min-width: 1024px) {
    .core-services__cell {
        border-width: 0 1px 0 0;
    }

    .core-services__cell:last-child {
        border-right-width: 0;
    }
}

.core-services__card-title {
    line-height: 1.25;
}

.core-services__link {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.1em;
}

.core-services__arrow {
    font-size: 0.75rem;
}

.core-services__copy {
    line-height: 1.625;
}

/* content — viability: grey band paddings */
.viability-card {
    padding-block: 6rem;
    padding-inline: 1.5rem;
}

@media (min-width: 1024px) {
    .viability-card {
        padding-inline: 10%;
    }
}

.viability-card__media {
    min-height: 25rem;
}

.viability-card__img {
    object-fit: cover;
}

.viability-card__body {
    padding: 3rem;
}

@media (min-width: 1024px) {
    .viability-card__body {
        padding: 5rem;
    }
}

.viability-card__eyebrow {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.3em;
}

.viability-card__title {
    line-height: 1.25;
}

.viability-card__figure {
    line-height: 1.25;
}

.viability-card__caption {
    font-size: 0.75rem;
    line-height: 1rem;
}

.viability-card__link {
    text-decoration-line: underline;
    text-decoration-thickness: 4px;
    text-underline-offset: 4px;
}

.viability-card__copy {
    line-height: 1.625;
}

/* contact-info — presence: full-width band paddings */
.presence-info {
    padding-block: 6rem;
    padding-inline: 1.5rem;
}

@media (min-width: 1024px) {
    .presence-info {
        padding-inline: 10%;
    }
}

.presence-info__title {
    font-size: 2.25rem;
    line-height: 1.25;
}

.presence-info__icon {
    width: 1rem;
    flex-shrink: 0;
}

.presence-info__photo {
    height: 16rem;
}

.presence-info__img {
    object-fit: cover;
    filter: grayscale(1);
    transition: filter 500ms ease;
}

.presence-info__photo:hover .presence-info__img {
    filter: grayscale(0);
}

.presence-info__caps {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.1em;
}

.presence-info__note {
    font-size: 0.75rem;
    line-height: 1.375;
}

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

.presence-info__copy {
    line-height: 1.625;
}

/* cta — transition: full-width band paddings */
.transition-cta {
    padding-block: 8rem;
    padding-inline: 1.5rem;
}

@media (min-width: 1024px) {
    .transition-cta {
        padding-inline: 10%;
    }
}

/* solid offset block peeking out bottom-right of the framed box */
.transition-cta__offset {
    transform: translate(0.75rem, 0.75rem);
}

@media (min-width: 640px) {
    .transition-cta__offset {
        transform: translate(1.5rem, 1.5rem);
    }
}

.transition-cta__box {
    padding: 3rem;
    border-style: solid;
    border-width: 8px;
}

@media (min-width: 1024px) {
    .transition-cta__box {
        padding: 6rem;
    }
}

.transition-cta__title {
    font-size: 2.25rem;
    letter-spacing: -0.05em;
}

@media (min-width: 1024px) {
    .transition-cta__title {
        font-size: 3.75rem;
    }
}

.transition-cta__lead {
    max-width: 36rem;
}

.transition-cta__btn {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.1em;
}

.transition-cta__btn--lift {
    transition: transform 300ms ease, background-color 300ms ease;
}

.transition-cta__btn--lift:hover {
    transform: translate(0.25rem, -0.25rem);
}

.transition-cta__caption {
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.1em;
}

@media (prefers-reduced-motion: reduce) {
    .transition-cta__btn--lift,
    .transition-cta__btn--lift:hover {
        transition: none;
        transform: none;
    }
}

