/* ─────────────────────────────────────────
   Small Parts
───────────────────────────────────────── */

/*button link*/
.leafy-button {
    border-radius: 20px 0 20px 0;
    width: fit-content;
}
.leafy-button a {
    padding: 16px 24px;
    border-radius: 20px 0 20px 0;
}
.primary-button a {
    /*background: #DD906A;*/
}
.secondary-button a {
    /*background: #94B0B4;*/
}

.round-button {
    width: fit-content;
}
.round-button a {
    background: rgba(148, 176, 180, 0.3);
    border-radius: 8px;
    padding: 12px 32px;
}
.round-button__download a span {
    display: flex;
    gap: 8px;
    align-items: center;
}
.round-button__download a span:after {
    content: url("../images/download-button-lg.svg");
    width: 24px;
    height: 24px;
}
.article-body .round-button__download {
    padding: 20px 0 24px 0;
}
.article-link-hub {
    gap: 16px;
    align-items: center;
}
.article-link-hub .leafy-button + .round-button__download {
    padding: 0;
}
.article-link-hub .leafy-button + .round-button__download a {
    padding: 8px 20px;
    background: none;
}

/*leafy box*/
.leafy-box.top-left,
.leafy-box.down-right {
    border-radius: 0 27% 0 27%;
}
.leafy-box.top-right,
.leafy-box.down-left {
    border-radius: 27% 0 27% 0;
}
.leafy-box-small {
    border-radius: 8px 0;
}

.arrow-button a {
    display: flex;
    align-items: center;
    gap: 12px;
}
.arrow-button a:after {
    content: url('../images/arrow.svg');
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;    
}


/*input box*/
input {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px 12px;
    gap: 8px;
    border: 1px solid #FAECE1;
    border-radius: 4px;
    background: none;
    outline: none;
    color: #A9A8A1;
}
button {
    padding: 16px 24px;
    border: none;
}








/* ─────────────────────────────────────────
   Get Started Pages Components
───────────────────────────────────────── */

/*banner with description*/
.paragraph--type--banner-with-description {
    max-width: 1312px;  
    margin: auto;
    /*padding: 48px 0 112px;*/
    padding-bottom: 112px;
}
.paragraph--type--banner-with-description > .flex-col {
    gap: 80px;
}
.paragraph--type--banner-with-description .banner-desc {
    max-width: 616px;
    gap: 32px;
}
.paragraph--type--banner-with-description .banner-desc p {
    margin-bottom: 0;
}
.paragraph--type--banner-with-description .banner-links {
    gap: 24px;
}
.paragraph--type--banner-with-description iframe {
    pointer-events: all;
}
.paragraph--type--banner-with-description .banner-video__unmute {
    position: absolute;
    bottom: 25px;
    left: 25px;    
}

/*program card*/
.get-started-program-list {
    padding-top: 64px;
    padding-bottom: 112px;
}
.get-started-program-list .view-content.view-rows {
    gap: 40px;
}
.program-card {
    width: 410px;
    aspect-ratio: 410/540;
    padding: 20px;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    background: #415554;
    /*justify-content: space-between;*/
    gap: 20px;
}
.program-card hr {
    margin: 0;
}
.program-card__body,
.program-card ul {
    display: flex;
    flex-direction: column;
    gap: 16px;    
}
.program-card ul {
    margin-left: 0;
    padding-left: 0;
    margin-bottom: 0;
}
.program-card__body {
    /*margin-bottom: 16px;*/
    height: 100%;
    max-height: 282px;
}
.program-card__subtitle {
    padding: 4px 0;
}
.program-card__header {
    padding: 0 10px 16px 10px;
    gap: 8px;
    border-bottom: 1px solid #94B0B4;
}
.program-card__icon {
    margin-bottom: 8px;
}
.program-card__header h6 {
    margin-bottom: 0;
}
.program-card__footer {
    padding: 16px 10px 0 10px;
    border-top: 1px solid #94B0B4;
}
.program-card .special-notice {
    margin-bottom: -4px;
}

.program-card li span {
    font-size: 10px;
    color: #162927;
    border-radius: 9px 0 9px 0;
    padding: 2px 6px;
    background: #94B0B4;
    margin-left: 4px;
    margin-top: -2px;
    position: relative;
    top: -3px;
}

.program-card li,
.why-good-fit li {
    list-style: none;
    padding-left: 22px;
    position: relative;
}
.program-card li:before,
.why-good-fit li:before {
    content: "";
    position: absolute;
    left: 0;
    width: 13px;
    height: 13px;
    background-size: contain;
    background-repeat: no-repeat;    
}
.why-good-fit li:before {
    background-image: url('../images/good-fit.svg');
    top: 7px;
}
.why-bad-fit li:before {
    background-image: url('../images/bad-fit.svg');
    top: 6px;
}
.program-card__phone span {
    display: flex;
    gap: 4px;
    align-items: center;
}
.program-card__phone span:before {
    content: url("../images/phone-icon-mist.svg");
    width: 24px;
    height: 24px;
    position: relative;
    top: 2px;
}


/*centered article*/
.node__container header {
    padding: 0;
}
.node--id-48 .centered-article {
    max-width: 1312px;
}
.centered-article {
    max-width: 645px;
    text-align: center;
    gap: 16px;
    margin: auto;
    padding: 112px 0 20px 0;
    ul {
        display: flex;
        flex-direction: column;
        margin: 0 auto;
        width: fit-content;
        padding: 20px 0 36px 0;
        gap: 12px;
    }
    li {
        list-style: none;
        width: fit-content;
        a {
            color: #DD906A;
            text-decoration: underline;
        }
    }
}
.node--id-47 .centered-article {
    padding: 24px 0;
}

/*program guide group*/
.step-group-lock-zone {
  height: calc(555px * var(--step-count));
}
.step-group {
    position: sticky; top: 7vw;
}
.step-group {
    height: 555px;
    /*position: relative;*/
    overflow: hidden;    
    display: flex;
    flex-direction: column;
}
.step-counter {
    gap: 8px;
    z-index: 10;
    align-self: center;
}
@media (min-width: 1345px) {
    .step-counter {
        margin-left: 4rem;
    }
}
@media (min-width: 1400px) {
    .step-counter {
        margin-left: 6rem;
    }
}
.step-number-wrap,
.step-number {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px; 
}
.step-number {
    width: 32px;
    height: 32px;
    border-radius: 500px;
    cursor: pointer;
}
.step-divider {
    width: 3px;
    height: 24px;
}
.step-counter .step-number-wrap:last-child .step-divider {
    height: 179px;
}
/*program guide item*/
.guide-step-item {
    gap: 128px;
    align-items: flex-start;
    max-width: 1310px;
    width: 100%;
    height: 555px;
    margin: auto;
    position: absolute;
    opacity: 0; pointer-events: none;
    transition: opacity .42s;
}
.step-group__item.active .guide-step-item {
    opacity: 1; pointer-events: all;
}
.guide-video,
.guide-video .banner-video__wrap {
    max-width: 645px;
    max-height: 414px;    
}
.guide-video,
.guide-video.leafy-box.top-right,
.guide-video .banner-video__wrap,
.guide-video iframe,
.guide-step-video .banner-video__thumb,
.guide-step-video .banner-video__thumb img {
    aspect-ratio: 645/414;
    width: 100%;
    overflow: clip;
    border-radius: 152px 0 152px 0;
    pointer-events: all;
}

.guide-step-video .banner-video__thumb,
.guide-step-video .banner-video__thumb img {
    object-fit: cover;
    transform: translate(-50%, -50%);    
    top: 50%;
    left: 50%;    
    position: relative;
    z-index: 1;
}
.guide-step-video .banner-video__unmute {
    z-index: 12;
    position: absolute;
    bottom: 1rem;
    left: 1rem;
}
.guide-step-video .banner-video__thumb {
    position: absolute;
}
.guide-video iframe,
.guide-step-video .banner-video__thumb,
.guide-step-video .banner-video__thumb img {
    width: 135%;
    height: 135%;
}
.guide-step-video .banner-video__player,
.guide-step-video .banner-video__player iframe {
    z-index: 10;
    position: relative;
}
.guide-step-body {
    max-width: 534px;
    width: 100%;
    padding: 24px 0;
}
.program-guide-nav {
    margin-bottom: 132px;
}
.program-guide-nav button {
    padding: 8px 16px;
    background: none;
    color: var(--color-mist);
    border: 1px solid var(--color-mist);
    border-radius: 16px 0 16px 0;
}
.program-guide-nav button.active {
    background: var(--color-mist);
    color: var(--color-inlet-deep);
}


.red-hint {
    padding: 20px;
    border-radius: 16px;
    border: 3px solid #CB5D4B;
    display: flex;
    margin: 16px auto;
    max-width: 968px;
    width: 100%;
}
.red-hint:before {
    content: url("../images/warning-bell.svg");
    width:32px;
    height: 32px;
    margin-right: 8px;
}
.red-hint .tagline {
    font-size: 18px;
    margin-bottom: 8px;
    font-weight: 700;
}
.red-hint .text-regular {
    color: #3D5C52;
}
.red-hint p {
    margin-bottom: 0;
}


/*application package*/
.apply-package {
    max-width: 1312px;
    width: 100%;
    margin: 0 auto 80px auto;
    border-radius: 20px;
    overflow: clip;
}
.apply-package.family-program {
    margin-top: 64px;
}
.apply-package__header {
    padding: 20px 20px 8px 20px;
    gap: 16px;
}
.apply-package__header h5 {
    margin: 0;
}
.apply-package__header .flex-pc-row {
    justify-content: space-between;
    align-items: center;
}
.apply-package__header.family-program,
.apply-package.family-program .apply-file {
    background: #23575E;
}
.apply-package__header.supportive-recovery,
.apply-package.supportive-recovery .apply-file {
    background: #59335F;
}
.apply-package__header.rebuild-circle,
.apply-package.rebuild-circle .apply-file {
    background: #89332B;
}
.apply-package__body {
    gap: 20px;
    padding: 20px 0;
}
.apply-package__hint {
    padding: 10px;
    background: rgba(224, 155, 122, 0.4);
    border: 2.5px solid #9F4F38;
    border-radius: 8px;
    margin: 0 20px;
}
.apply-package__hint p {
    margin: 0;
}
.apply-package__hint p a {
    text-decoration: underline;
}
.apply-package__files {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 0 20px;
}


/*apply material*/
.apply-file {
    gap: 16px;
    padding: 10px;
    border-radius: 16px;
}
.apply-file__meta {
    gap: 16px;
    padding: 0 16px 8px 16px;
    border-bottom: 1px solid #94B0B4;
}
.apply-file__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
}
.apply-file__tags {
    margin-top: -8px;
}
.apply-file__download {
    padding: 0 10px;
}
.apply-file__download a,
.apply-package__phone,
.apply-package__hint p {
    display: flex;
    align-items: center;    
}
.apply-file__download a:before,
.apply-package__phone:before,
.apply-package__hint p:before {
    width: 24px;
    height: 24px;
    content: url("../images/download-mist.svg");
    margin-right: 8px;
    display: flex;
    align-items: center;
}
.apply-package__phone:before {
    content: url("../images/phone-white.svg");
}
.apply-package__hint p:before {
    content: url("../images/printer-ember.svg");
}
.apply-package__hint.supportive p:before {
    content: url("../images/doc-ember.svg");
}
.apply-file__tags {
    gap: 4px;
}


/*need help with block*/
.need-help-block {
    padding-top: 64px;
    gap: 24px;
    max-width: 1312px;
    margin: auto;
}
.need-help-block__text {
    gap: 16px;
    max-width: 868px;
}
.need-help-block__links {
    padding: 24px 0;
    .field__items {
        display: flex;
        gap: 24px;
    }
    a {
        background: var(--color-mist);
        border-radius: 20px 0 20px 0;
        padding: 10px 20px;
        display: flex;
        gap: 12px;
        color: #162927;
        align-items: center;
    }
    a:after {
        content: url("../images/arrow-right.svg");
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
    }
}


/*faq accordion*/
.faq {
    padding: 20px 0;
    max-width: 868px;
    width: 100%;
    margin: auto;
    border-bottom: 1px solid;
    p strong {
        padding-top: 36px;
    }
    .faq__answer {
        margin-top: 36px;
    }
    li:before {
        content: none;
    }
    li {
        list-style: disc;
        padding-left: 8px;
        margin-left: 18px;
        color: rgb(184, 200, 196);
    }
    .article-link {
        margin: 0;
    }
}
.field-paragraph--field-faq-accordion-item {
    .field__items {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }    
}



/*newsletter archive*/
.view-newsletter-archives {
    .view-header .flex-col {
        padding: 24px 40px;
        border-radius: 40px 0 40px 0;
        gap: 4px;
        p {
            color: var(--color-mist);
        }
        h5, p {
            margin: 0;
        }
    }
    table {
        margin: 32px 0;
        width: 100%;
        th, td { padding: 28px 24px; }
        td.views-field-nothing { padding: 12px 16px; }
        .views-field-field-issue-number { color: #B8C8C4; }
        a { color: #94B0B4; padding: 16px 24px; }
        a:hover {
            color: var(--color-cedar);
            background: #415554;
            border-radius: 20px 0 20px 0;
        }
        thead, tr { border-bottom: 1px solid #94B0B4; }
    }
    .pager__items {
        margin: auto;
        padding: 0;
        display: flex;
        justify-content: center;
        gap: 2px;
        li {
            overflow: clip;
            border-radius: 8px 0 8px 0;
        }
        .pager__item--previous,
        .pager__item--next {
            flex-grow: 1;
            display: flex;
            align-items: center;            
            gap: 12px;
        }
        .pager__item--previous:before,
        .pager__item--next:after {
            width: 24px;
            height: 24px;
            color: var(--color-mist);
            display: flex;
            align-items: center;       
            justify-content: center;
        }
        .pager__item--previous:before {
            content: url(../images/chevron-left-mist.svg);
        }
        .pager__item--next:after {
            content: url(../images/chevron-right-mist.svg);
        }        
        .pager__item--next {
            justify-content: flex-end;
        }
        a {
            color: #94B0B4;
            padding: 12px;
            width: 40px;
            height: 40px;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        a:hover {
            background: #415554;
            color: var(--color-driftwood);
        }
    }
    .pager__item.is-active {
        color: var(--color-driftwood);
        background: #415554;
        
    }
}
#archiveModal {
    background: rgba(65, 85, 84, 0.85) !important;
    .modal-content {
        background: rgba(65, 85, 84, 0.85) !important;
        justify-content: center;
    }
    .modal-body {
        padding: 24px 24px 16px 24px;
        border-radius: 20px;
        max-width: 353px;
        margin: auto;
        height: fit-content;
    }    
    .archive-modal__issue-number-wrap {
        gap: 4px;
        justify-content: center;
    }
    .archive-modal__summary {
        gap: 4px;
        text-align: center;
        margin-bottom: 40px;
        h2,p {
            margin: 0;
        }
    }
    .archive-modal__actions {
        gap: 20px;
        width: 100%;
        .leafy-button,
        .leafy-button a {
            width: 100%;
            text-align: center;
        }        
    }
    .archive__modal_close {
        padding: 8px 20px;
        background: 0;
    }
}

@media (max-width: 499px) {
  .view-newsletter-archives #view-nothing-table-column,
  .view-newsletter-archives #view-nothing-1-table-column,
  .view-newsletter-archives table tbody td.views-field-nothing,
  .view-newsletter-archives table tbody td.views-field-nothing-1 {
    display: none;
  }
  .has-sidebar .main-inner aside {
      z-index: -1;
      position: relative;
  }

}



/*survey modal*/

/* Modal shell */
.survey-modal__content {}
.survey-modal__body {}
.survey-wizard {}

/* Step */
.survey-step {}
.survey-step__inner {}
.survey-step__rule {}
.survey-step__title {}
.survey-step__desc {}
.survey-step__actions {}

/* Custom select */
.survey-select {}
.survey-select__trigger {}
.survey-select__label {}
.survey-select__chevron {}
.survey-select__list {}
.survey-select__option {}
.survey-select__option.is-selected {}

/* Buttons */
.survey-btn {}
.survey-btn--next {}
.survey-btn--ghost {}
.survey-btn--cancel {}

/* Result step */
.survey-step--result {}
.survey-result {}
.survey-result__heading {}
.survey-result__message {}
.survey-result__phone {}
.survey-result__learn-more {}

/* Trigger (in paragraph) */
.survey-trigger-btn {}