/* ---------- hero ---------- */

.hero {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 72px 20px 88px;
}

.hero__logo {
    width: 232px;
    max-width: 62vw;
    height: auto;
    display: block;
    margin: 0 auto 38px;
}

.hero__tagline {
    margin: 0 0 26px;
    font-size: clamp(26px, 4.4vw, 40px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.015em;
}

.hero__promise {
    margin: 0 0 30px;
    font-size: clamp(20px, 3.6vw, 32px);
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--blue);
}

.hero__url {
    display: inline-block;
    font-size: clamp(16px, 2.3vw, 21px);
    font-style: italic;
    font-weight: 500;
    color: var(--brown);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.25s;
}

.hero__url:hover,
.hero__url:focus-visible { border-bottom-color: currentColor; }