/* ==========================================================================
   Home page: label manufacturing band (resources/views/frontend/index.blade.php)

   Copy on the left, a short label requirement form on the right that
   hands width, height and quantity to /label-requirement.html.
   ========================================================================== */

.sd-home-lbl {
    padding: 72px 0;
    background: var(--sd-tint, #F4F7FC);
}

.sd-home-lbl__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    gap: 48px;
    align-items: center;
}

.sd-home-lbl__eyebrow {
    margin: 0 0 8px;
    color: var(--sd-orange-ink, #c9531f);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sd-home-lbl h2 {
    margin: 0 0 14px;
    color: var(--sd-navy, #1A365D);
    font-size: 34px;
    font-weight: 800;
    line-height: 1.2;
}

.sd-home-lbl__lead {
    margin: 0 0 22px;
    color: var(--sd-ink, #16233A);
    font-size: 16px;
    line-height: 1.65;
}

.sd-home-lbl__facts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 0 0 22px;
}

.sd-home-lbl__facts div {
    padding: 14px 16px;
    border: 1px solid var(--sd-line, #E3E9F3);
    border-radius: 10px;
    background: #fff;
}

.sd-home-lbl__facts dt {
    margin-bottom: 4px;
    color: var(--sd-blue, #124A9A);
    font-size: 14px;
    font-weight: 700;
}

.sd-home-lbl__facts dd {
    margin: 0;
    color: var(--sd-muted, #5D6E88);
    font-size: 14px;
    line-height: 1.5;
}

.sd-home-lbl__uses-title {
    margin: 0 0 8px;
    color: var(--sd-navy, #1A365D);
    font-size: 14px;
    font-weight: 700;
}

.sd-home-lbl__uses {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sd-home-lbl__uses li {
    padding: 6px 12px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--sd-line, #E3E9F3);
    color: var(--sd-ink, #16233A);
    font-size: 13.5px;
}

/* ---- start form ---- */

.sd-home-lbl__start {
    padding: 28px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(18, 74, 154, .10);
    border-top: 4px solid var(--sd-orange, #E86A38);
}

.sd-home-lbl__start h3 {
    margin: 0 0 4px;
    color: var(--sd-navy, #1A365D);
    font-size: 22px;
    font-weight: 800;
}

.sd-home-lbl__start-note {
    margin: 0 0 18px;
    color: var(--sd-muted, #5D6E88);
    font-size: 14px;
}

.sd-home-lbl__start label {
    display: block;
    margin-bottom: 14px;
}

.sd-home-lbl__start label span {
    display: block;
    margin-bottom: 6px;
    color: var(--sd-ink, #16233A);
    font-size: 14px;
    font-weight: 600;
}

.sd-home-lbl__start input,
.sd-home-lbl__start select {
    width: 100%;
    height: 46px;
    padding: 0 12px;
    border: 1px solid #C9D4E4;
    border-radius: 8px;
    background: #fff;
    color: var(--sd-ink, #16233A);
    font-size: 15px;
}

.sd-home-lbl__start input:focus,
.sd-home-lbl__start select:focus {
    outline: 2px solid var(--sd-blue, #124A9A);
    outline-offset: 1px;
}

.sd-home-lbl__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.sd-home-lbl__go {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    height: 50px;
    margin-top: 4px;
    border: 0;
    border-radius: 8px;
    background: var(--sd-orange, #E86A38);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.sd-home-lbl__go:hover,
.sd-home-lbl__go:focus-visible {
    background: var(--sd-orange-ink, #c9531f);
}

.sd-home-lbl__alt {
    margin: 14px 0 0;
    color: var(--sd-muted, #5D6E88);
    font-size: 13.5px;
    line-height: 1.5;
    text-align: center;
}

.sd-home-lbl__alt a {
    color: var(--sd-orange-ink, #c9531f);
    font-weight: 600;
}

@media (max-width: 991.98px) {
    .sd-home-lbl__grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

@media (max-width: 575.98px) {
    .sd-home-lbl {
        padding: 48px 0;
    }

    .sd-home-lbl h2 {
        font-size: 26px;
    }

    .sd-home-lbl__lead {
        font-size: 15px;
    }

    .sd-home-lbl__facts {
        grid-template-columns: 1fr;
    }

    .sd-home-lbl__start {
        padding: 22px 18px;
    }
}