/* Explain: Styles for spacing, section rhythm, and responsive layout adjustments. */
.section-pad {
    padding-top: clamp(5rem, 9vw, 8rem);
    padding-bottom: clamp(5rem, 9vw, 8rem);
}

.content-shell {
    width: min(100% - 2rem, 1180px);
    margin-inline: auto;
}

.wide-shell {
    width: min(100% - 1rem, 1440px);
    margin-inline: auto;
}

.board-grid {
    background-image:
        linear-gradient(rgba(32, 33, 36, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(32, 33, 36, 0.045) 1px, transparent 1px);
    background-size: 42px 42px;
}

.layered-offset {
    transform: translateY(clamp(-3rem, -5vw, -1.5rem));
}

@media (max-width: 767px) {
    .layered-offset {
        transform: none;
    }

    .section-pad {
        padding-top: clamp(3.75rem, 12vw, 5rem);
        padding-bottom: clamp(3.75rem, 12vw, 5rem);
    }

    header img[alt="ברכת הצנרת"] {
        max-height: 7.5rem;
    }

    #top > section:first-child {
        min-height: 88svh;
    }

    #top > section:first-child .content-shell {
        min-height: 88svh;
        padding-top: 9.5rem;
        padding-bottom: 3rem;
    }

    #top > section:first-child .eyebrow {
        max-width: min(100%, 22rem);
        padding: 0.65rem 1rem;
        font-size: 0.66rem;
        line-height: 1.45;
        letter-spacing: 0.08em;
    }

    #top > section:first-child h1 {
        font-size: clamp(2.35rem, 10.5vw, 3.2rem);
        line-height: 1.08;
    }

    #top > section:first-child p {
        font-size: 1rem;
        line-height: 1.65;
    }

    #top > section:first-child .flex.flex-col.justify-center {
        width: 100%;
        max-width: 22rem;
    }

    #top > section:first-child .btn {
        width: 100%;
        min-height: 3.25rem;
        padding-inline: 1.25rem;
        font-size: 1rem;
    }

    #top > section:not(:first-child) h2 {
        font-size: clamp(2rem, 8.5vw, 2.75rem);
        line-height: 1.15;
    }

    #top > section:not(:first-child) h3 {
        font-size: clamp(1.65rem, 7vw, 2.2rem);
        line-height: 1.2;
    }

    #top > section:not(:first-child) p,
    #top > section:not(:first-child) li {
        font-size: 1rem;
        line-height: 1.75;
    }
}