.text-lahoda-1 {
    width: 100%;
    container-type: inline-size;
}

.text-lahoda-1__inner {
    max-width: var(--content-max-width);
    margin: 0 auto;
    /* Overall top/bottom padding — previously 0, so the component had no vertical
       breathing room of its own and relied entirely on whatever sat above/below it
       in the page. Same --space-7/--space-8 scale used by the other section-level
       components (about-lahoda-1, content-lahoda-1, gallery-lahoda-1, ...). */
    padding: var(--space-7) var(--container-gutter);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

@container (min-width: 768px) and (max-width: 1079.98px) {
    .text-lahoda-1__inner {
        /* var(--container-gutter) alone (clamp(16px, 4vw, 48px)) only reaches ~31px
           at the narrow end of this range (768px) — noticeably tighter than it
           should feel once there's room for the two-column block layout below.
           Fixed --space-8 (64px) gives tablet a clearly generous gutter instead of
           relying on the vw-scaled value to catch up. */
        padding-left: var(--space-8);
        padding-right: var(--space-8);
    }
}

@container (min-width: 1080px) {
    .text-lahoda-1__inner {
        padding: var(--space-8) var(--container-gutter);
    }
}

.text-lahoda-1__block {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    align-items: center;
}

@container (min-width: 1080px) {
    .text-lahoda-1__block {
        flex-direction: row;
        gap: var(--space-6);
    }

    .text-lahoda-1__block--image-right {
        flex-direction: row-reverse;
    }

    .text-lahoda-1__image {
        flex: 0 0 45%;
    }

    .text-lahoda-1__copy {
        flex: 0 0 55%;
    }
}

.text-lahoda-1__image {
    width: 100%;
}

.text-lahoda-1__img {
    width: 100%;
    height: auto;
    border-radius: var(--radius);
    display: block;
    box-shadow: var(--shadow-lg);
}

.text-lahoda-1__eyebrow {
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--brand-red);
    margin: 0 0 8px;
}

.text-lahoda-1__heading {
    font-family: var(--font-display);
    color: var(--ink);
    font-size: clamp(24px, 3vw, 32px);
    margin: 0 0 16px;
}

.text-lahoda-1__body {
    font-family: var(--font-body);
    color: var(--ink);
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}