@charset "utf-8";

/* =========================================================
   Excess Stock
========================================================= */

#excess .ws-excess-crumb *,
#excess .ws-excess-hero *,
#excess .ws-excess-process *,
#excess .ws-excess-form-section *,
#excess .ws-excess-guidance *,
#excess .ws-excess-faq * {
    box-sizing: border-box;
}


/* Breadcrumb */

.ws-excess-crumb {
    border-bottom: 1px solid #e6edf1;
    background: #fff;
}

.ws-excess-crumb .container {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    color: #8a96a8;
    font-size: 13px;
    white-space: nowrap;
}

.ws-excess-crumb a {
    color: #55657a;
    text-decoration: none;
}

.ws-excess-crumb a:hover {
    color: #0000ff;
}

.ws-excess-crumb i {
    color: #00a9a0;
}


/* Shared */

.ws-excess-eyebrow {
    min-height: 30px;
    padding: 4px 13px;
    border-radius: 999px;
    background: linear-gradient(90deg, #0000ff, #28cbe8);
    display: inline-flex;
    align-items: center;
    color: #fff;
    font-size: 12px;
    line-height: 22px;
    letter-spacing: .9px;
}

.ws-excess-section-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) 440px;
    gap: 40px;
    align-items: end;
}

.ws-excess-section-head > div > span {
    display: block;
    margin-bottom: 5px;
    color: #00a9a0;
    font-size: 12px;
    line-height: 19px;
    letter-spacing: .9px;
}

.ws-excess-section-head h2 {
    margin: 0;
    color: #17233a;
    font-size: 28px;
    line-height: 37px;
}

.ws-excess-section-head > p {
    margin: 0;
    color: #6b788b;
    font-size: 14px;
    line-height: 23px;
}


/* Hero */

.ws-excess-hero {
    position: relative;
    overflow: hidden;
    padding: 58px 0;
    background:
        radial-gradient(circle at 87% 10%, rgba(40,203,232,.25), transparent 28%),
        linear-gradient(135deg, #f3f7ff 0%, #eefbfb 56%, #fff 100%);
}

.ws-excess-hero::before {
    content: "";
    position: absolute;
    left: -130px;
    bottom: -165px;
    width: 360px;
    height: 360px;
    border: 50px solid rgba(0,0,255,.025);
    border-radius: 50%;
}

.ws-excess-hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0,1fr) 390px;
    gap: 62px;
    align-items: center;
}

.ws-excess-hero-copy h1 {
    max-width: 850px;
    margin: 14px 0 0;
    color: #111827;
    font-size: 38px;
    line-height: 48px;
}

.ws-excess-hero-copy > p {
    max-width: 800px;
    margin: 15px 0 0;
    color: #617086;
    font-size: 15px;
    line-height: 25px;
}

.ws-excess-hero-points {
    margin-top: 19px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px 20px;
}

.ws-excess-hero-points span {
    color: #4f6076;
    font-size: 13px;
    line-height: 21px;
}

.ws-excess-hero-points i {
    margin-right: 6px;
    color: #00a9a0;
}

.ws-excess-hero-button {
    min-height: 43px;
    margin-top: 20px;
    padding: 0 16px;
    border-radius: 8px;
    background: linear-gradient(90deg, #0000ff, #28cbe8);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 13px;
    text-decoration: none;
}

.ws-excess-hero-button:hover {
    background: linear-gradient(90deg, #042858, #00c6bc);
    color: #fff;
}

.ws-excess-hero-panel {
    position: relative;
    padding: 25px;
    overflow: hidden;
    border: 1px solid rgba(0,198,188,.22);
    border-radius: 18px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 18px 42px rgba(4,40,88,.09);
}

.ws-excess-hero-panel::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 5px;
    height: 100%;
    background: linear-gradient(180deg, #0000ff, #28cbe8 55%, #00c6bc);
}

.ws-excess-hero-panel > span {
    display: block;
    color: #00a9a0;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: .9px;
}

.ws-excess-hero-panel h2 {
    margin: 6px 0 0;
    color: #17233a;
    font-size: 23px;
    line-height: 31px;
}

.ws-excess-review-list {
    margin-top: 16px;
    display: grid;
    gap: 8px;
}

.ws-excess-review-list div {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    color: #536276;
    font-size: 13px;
    line-height: 20px;
}

.ws-excess-review-list i {
    margin-top: 3px;
    color: #00a9a0;
}

.ws-excess-hero-panel > p {
    margin: 15px 0 0;
    padding-top: 14px;
    border-top: 1px solid #e5ecef;
    color: #8793a4;
    font-size: 12px;
    line-height: 20px;
}


/* Process */

.ws-excess-process {
    padding: 48px 0 54px;
    background: #fff;
}

.ws-excess-process-grid {
    margin-top: 22px;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 11px;
}

.ws-excess-process-grid article {
    position: relative;
    min-height: 205px;
    padding: 21px 19px;
    overflow: hidden;
    border: 1px solid #dfe7ec;
    border-radius: 13px;
    background: #fff;
}

.ws-excess-process-grid article > span {
    position: absolute;
    right: 16px;
    top: 13px;
    color: #dce7eb;
    font-size: 27px;
    line-height: 34px;
}

.ws-excess-process-grid article > i {
    width: 43px;
    height: 43px;
    border-radius: 11px;
    background: #eef9fb;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00a9a0;
    font-size: 17px;
}

.ws-excess-process-grid article:nth-child(even) > i {
    background: #f0f2ff;
    color: #0000ff;
}

.ws-excess-process-grid h3 {
    margin: 16px 0 0;
    color: #24344c;
    font-size: 16px;
    line-height: 24px;
}

.ws-excess-process-grid p {
    margin: 7px 0 0;
    color: #6d7b8d;
    font-size: 13px;
    line-height: 21px;
}


/* Form */

.ws-excess-form-section {
    padding: 0 0 56px;
    background: #fff;
}

.ws-excess-form-shell {
    overflow: hidden;
    border: 1px solid #dbe5eb;
    border-radius: 18px;
    background: #fff;
    display: grid;
    grid-template-columns: 320px minmax(0,1fr);
    box-shadow: 0 16px 40px rgba(4,40,88,.07);
}

.ws-excess-form-intro {
    padding: 30px 27px;
    background:
        radial-gradient(circle at 88% 0%, rgba(40,203,232,.18), transparent 28%),
        linear-gradient(145deg, #042858, #000087);
}

.ws-excess-form-intro > span {
    display: block;
    color: #78e2e8;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: .9px;
}

.ws-excess-form-intro h2 {
    margin: 6px 0 0;
    color: #fff;
    font-size: 24px;
    line-height: 33px;
}

.ws-excess-form-intro > p {
    margin: 11px 0 0;
    color: rgba(255,255,255,.74);
    font-size: 13px;
    line-height: 22px;
}

.ws-excess-form-map {
    margin-top: 24px;
    display: grid;
    gap: 14px;
}

.ws-excess-form-map > div {
    padding: 12px 13px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 10px;
    background: rgba(255,255,255,.06);
}

.ws-excess-form-map strong,
.ws-excess-form-map span {
    display: block;
}

.ws-excess-form-map strong {
    color: #fff;
    font-size: 13px;
    line-height: 20px;
}

.ws-excess-form-map span {
    margin-top: 2px;
    color: rgba(255,255,255,.60);
    font-size: 11px;
    line-height: 18px;
}

.ws-excess-form {
    padding: 30px;
}

.ws-excess-status {
    margin-bottom: 18px;
    padding: 13px 15px;
    border: 1px solid #dbe6eb;
    border-radius: 10px;
    background: #f7fbfb;
    display: grid;
    grid-template-columns: 24px minmax(0,1fr);
    gap: 9px;
}

.ws-excess-status > i {
    margin-top: 2px;
    color: #00a9a0;
    font-size: 17px;
}

.ws-excess-status strong,
.ws-excess-status span {
    display: block;
}

.ws-excess-status strong {
    color: #26364e;
    font-size: 13px;
    line-height: 20px;
}

.ws-excess-status span {
    margin-top: 2px;
    color: #6d7b8e;
    font-size: 12px;
    line-height: 19px;
}

.ws-excess-status.is-error {
    border-color: #f0c9cc;
    background: #fff8f8;
}

.ws-excess-status.is-error > i {
    color: #e5484d;
}

.ws-excess-status.is-success {
    border-color: #c9ead9;
    background: #f4fbf7;
}

.ws-excess-status.is-success > i {
    color: #15945f;
}

.ws-excess-form-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 17px 18px;
}

.ws-excess-field {
    min-width: 0;
}

.ws-excess-field-full {
    grid-column: 1 / -1;
}

.ws-excess-field label {
    margin-bottom: 7px;
    display: block;
    color: #34445b;
    font-size: 13px;
    line-height: 20px;
}

.ws-excess-field label em {
    color: #e5484d;
    font-style: normal;
}

.ws-excess-field input[type="text"],
.ws-excess-field select,
.ws-excess-field textarea {
    width: 100%;
    border: 1px solid #d9e3e8;
    border-radius: 9px;
    background: #fbfdfe;
    color: #17233a;
    font-size: 14px;
    outline: 0;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.ws-excess-field input[type="text"],
.ws-excess-field select {
    height: 46px;
    padding: 0 13px;
}

.ws-excess-field select {
    cursor: pointer;
}

.ws-excess-field textarea {
    min-height: 132px;
    padding: 12px 13px;
    display: block;
    line-height: 21px;
    resize: vertical;
}

.ws-excess-field input::placeholder,
.ws-excess-field textarea::placeholder {
    color: #9aa5b5;
}

.ws-excess-field input[type="text"]:focus,
.ws-excess-field select:focus,
.ws-excess-field textarea:focus {
    border-color: #00c6bc;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0,198,188,.10);
}

.ws-excess-field.is-error input[type="text"],
.ws-excess-field.is-error select,
.ws-excess-field.is-error textarea,
.ws-excess-field.is-error .ws-excess-upload {
    border-color: #e5484d;
    box-shadow: 0 0 0 3px rgba(229,72,77,.08);
}

.ws-excess-field-error {
    display: none;
    margin-top: 6px;
    color: #e5484d;
    font-size: 12px;
    line-height: 18px;
}

.ws-excess-field.is-error .ws-excess-field-error {
    display: block;
}


/* Upload */

.ws-excess-upload {
    position: relative;
    min-height: 108px;
    padding: 16px;
    border: 1px dashed #bfd7df;
    border-radius: 11px;
    background: #f7fcfc;
    display: grid;
    grid-template-columns: 46px minmax(0,1fr) auto;
    gap: 13px;
    align-items: center;
    transition: border-color .2s ease, background .2s ease;
}

.ws-excess-upload.is-dragover {
    border-color: #00c6bc;
    background: #f0fbfb;
}

.ws-excess-upload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.ws-excess-upload-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: #edf8fa;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00a9a0;
    font-size: 19px;
}

.ws-excess-upload-copy strong,
.ws-excess-upload-copy span {
    display: block;
}

.ws-excess-upload-copy strong {
    color: #26364e;
    font-size: 14px;
    line-height: 21px;
}

.ws-excess-upload-copy span {
    margin-top: 2px;
    color: #8995a6;
    font-size: 11px;
    line-height: 18px;
}

.ws-excess-file-button {
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid #d5e2e8;
    border-radius: 7px;
    background: #fff;
    color: #43536a;
    font-size: 12px;
    cursor: pointer;
}

.ws-excess-file-button:hover {
    border-color: #00c6bc;
    color: #0000ff;
}

.ws-excess-file-info {
    margin-top: 8px;
    padding: 9px 11px;
    border: 1px solid #dce7eb;
    border-radius: 8px;
    background: #fbfdfe;
    display: grid;
    grid-template-columns: 20px minmax(0,1fr) 28px;
    gap: 7px;
    align-items: center;
    color: #64748b;
    font-size: 12px;
    line-height: 19px;
}

.ws-excess-file-info > i {
    color: #00a9a0;
}

.ws-excess-file-info span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ws-excess-file-info button {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: #f1f5f7;
    color: #7b8797;
    cursor: pointer;
}


/* Submit */

.ws-excess-submit-row {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #e7edf1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.ws-excess-submit-row > p {
    margin: 0;
    color: #718095;
    font-size: 12px;
    line-height: 19px;
}

.ws-excess-submit-row > p i {
    margin-right: 5px;
    color: #00a9a0;
}

.ws-excess-submit {
    min-width: 190px;
    height: 44px;
    padding: 0 17px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(90deg, #0000ff, #28cbe8);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

.ws-excess-submit:hover {
    background: linear-gradient(90deg, #042858, #00c6bc);
}

.ws-excess-submit.is-loading {
    pointer-events: none;
    opacity: .76;
}

.ws-excess-submit.is-loading span::before {
    content: "";
    width: 15px;
    height: 15px;
    margin-right: 8px;
    border: 2px solid rgba(255,255,255,.42);
    border-top-color: #fff;
    border-radius: 50%;
    display: inline-block;
    vertical-align: -3px;
    animation: wsExcessSpin .7s linear infinite;
}

@keyframes wsExcessSpin {
    to {
        transform: rotate(360deg);
    }
}


/* Guidance */

.ws-excess-guidance {
    padding: 0 0 54px;
    background: #fff;
}

.ws-excess-guidance-grid {
    margin-top: 22px;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 9px;
}

.ws-excess-guidance-grid > div {
    min-width: 0;
    padding: 14px;
    border: 1px solid #dfe7ec;
    border-radius: 10px;
    background: #fff;
    display: grid;
    grid-template-columns: 36px minmax(0,1fr);
    gap: 10px;
}

.ws-excess-guidance-grid i {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    background: #eef9fb;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00a9a0;
}

.ws-excess-guidance-grid span {
    color: #7a8798;
    font-size: 11px;
    line-height: 17px;
}

.ws-excess-guidance-grid strong {
    margin-bottom: 2px;
    display: block;
    color: #34445a;
    font-size: 12px;
    line-height: 19px;
}


/* FAQ */

.ws-excess-faq {
    padding: 0 0 62px;
    background: #fff;
}

.ws-excess-faq-grid {
    margin-top: 22px;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
}

.ws-excess-faq-grid article {
    padding: 18px;
    border: 1px solid #dfe7ec;
    border-radius: 11px;
    background: #fbfdfe;
}

.ws-excess-faq-grid h3 {
    margin: 0;
    color: #25364e;
    font-size: 14px;
    line-height: 22px;
}

.ws-excess-faq-grid p {
    margin: 7px 0 0;
    color: #6e7b8d;
    font-size: 13px;
    line-height: 21px;
}


/* Responsive */

@media screen and (max-width: 1180px) {
    .ws-excess-process-grid,
    .ws-excess-guidance-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media screen and (max-width: 1024px) {
    .ws-excess-hero-grid {
        grid-template-columns: minmax(0,1fr) 330px;
        gap: 34px;
    }

    .ws-excess-section-head {
        grid-template-columns: minmax(0,1fr) 360px;
        gap: 28px;
    }

    .ws-excess-form-shell {
        grid-template-columns: 280px minmax(0,1fr);
    }
}

@media screen and (max-width: 767px) {
    .ws-excess-hero {
        padding: 34px 0 38px;
    }

    .ws-excess-hero-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .ws-excess-hero-copy h1 {
        font-size: 28px;
        line-height: 36px;
    }

    .ws-excess-hero-copy > p {
        font-size: 14px;
        line-height: 22px;
    }

    .ws-excess-hero-points {
        display: grid;
        gap: 6px;
    }

    .ws-excess-hero-panel {
        padding: 20px;
        border-radius: 14px;
    }

    .ws-excess-process {
        padding: 34px 0 42px;
    }

    .ws-excess-section-head {
        display: block;
    }

    .ws-excess-section-head h2 {
        font-size: 23px;
        line-height: 31px;
    }

    .ws-excess-section-head > p {
        margin-top: 7px;
    }

    .ws-excess-process-grid,
    .ws-excess-guidance-grid,
    .ws-excess-faq-grid {
        grid-template-columns: 1fr;
    }

    .ws-excess-process-grid article {
        min-height: 0;
    }

    .ws-excess-form-section {
        padding-bottom: 42px;
    }

    .ws-excess-form-shell {
        grid-template-columns: 1fr;
        border-radius: 14px;
    }

    .ws-excess-form-intro {
        padding: 24px 20px;
    }

    .ws-excess-form {
        padding: 22px 18px;
    }

    .ws-excess-form-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .ws-excess-field-full {
        grid-column: auto;
    }

    .ws-excess-upload {
        grid-template-columns: 42px minmax(0,1fr);
    }

    .ws-excess-file-button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .ws-excess-submit-row {
        display: block;
    }

    .ws-excess-submit {
        width: 100%;
        margin-top: 14px;
    }

    .ws-excess-guidance {
        padding-bottom: 42px;
    }

    .ws-excess-faq {
        padding-bottom: 44px;
    }
}