/* /package-offers landing page. Order: desktop (1440 design) → 05 bundle, Why, compare, FAQ → breakpoints ≤1279 → phones ≤767 (390 design) → phones, continued (bundle vertical flow ≤1023). */

/* ===== landing page (desktop, 1440 design).  ===== */
/* In-page anchors (tab bar, starting-point cards) animate; sections carry scroll-margin-top for the stuck bar. */
html#page-package-offers {
    scroll-behavior: smooth;
}
/* style.css makes <main> a scroll container at <=1280px, which would stop the tab bar from sticking. */
#page-package-offers main {
    overflow: visible;
    overflow-x: clip;
}
#page-package-offers article {
    box-sizing: border-box;
    width: auto;
    margin: 0;
    padding: 0;
}
#page-package-offers .po-page {
    width: 996px;
    margin: 0 auto;
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-weight: 400;
    letter-spacing: normal;
    text-align: left;
}
#page-package-offers .po-page *,
#page-package-offers .po-page *::before,
#page-package-offers .po-page *::after {
    box-sizing: border-box;
}
#page-package-offers :where(.po-page) * {
    font-weight: 400;
}
#page-package-offers :where(.po-page) h1,
#page-package-offers :where(.po-page) h2,
#page-package-offers :where(.po-page) h3,
#page-package-offers :where(.po-page) h4,
#page-package-offers :where(.po-page) p,
#page-package-offers :where(.po-page) ul,
#page-package-offers :where(.po-page) li {
    margin: 0;
    padding: 0;
    border: 0;
    color: inherit;
    text-align: inherit;
    text-indent: 0;
    font-weight: 400;
    letter-spacing: inherit;
}
#page-package-offers :where(.po-page) li::before {
    content: none;
}
#page-package-offers :where(.po-page) b {
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-weight: 400;
}
#page-package-offers :where(.po-page) a,
#page-package-offers :where(.po-page) a:hover {
    border: 0;
    color: inherit;
    text-decoration: none;
}
#page-package-offers :where(.po-page) button {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: inherit;
    cursor: pointer;
    transition: none;
}
#page-package-offers [x-cloak] {
    display: none !important;
}
#page-package-offers .po-mobile,
#page-package-offers .po-compare__mobile,
#page-package-offers .po-carousel {
    display: none;
}

/* Shared */
#page-package-offers .po-h2 {
    color: #333232;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 40px;
    line-height: 42px;
}
#page-package-offers .po-h2--underline::after {
    content: "";
    display: block;
    width: 57px;
    height: 3px;
    margin-top: 16px;
    background: #8bc543;
}
#page-package-offers .po-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 44px;
    padding: 0 10px 0 21px;
    border-radius: 30px;
    background: #8bc543;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
    color: #fff;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 16px;
    line-height: 20px;
    white-space: nowrap;
}
#page-package-offers .po-btn:hover {
    background: #7cb046;
}
#page-package-offers .po-btn__circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #fff;
    color: #8bc54e;
}
#page-package-offers .po-btn__arrow {
    display: block;
}
#page-package-offers .po-price {
    display: inline-block;
    min-width: 109px;
    height: 30px;
    padding: 0 16px;
    border-radius: 16px;
    background: #8bc543;
    color: #fff;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0.6px;
    text-align: center;
}
#page-package-offers .po-price:hover {
    background: #7cb046;
}
#page-package-offers .po-price--red,
#page-package-offers .po-price--red:hover {
    min-width: 119px;
    background: #dd2727;
}
#page-package-offers .po-arrow {
    display: block;
}

/* Hero */
#page-package-offers .po-hero {
    height: 477px;
    padding-top: 68px;
    border-radius: 16px;
    background: #e8f1e3 url("/i/package-offers/hero-bg.jpg") 62.4% 0 / 132.33% 100% no-repeat;
}
#page-package-offers .po-hero__title {
    width: 332px;
    margin-left: 41px;
    color: #333232;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 50px;
    line-height: 62px;
    text-align: center;
}
#page-package-offers .po-hero__text {
    width: 461px;
    margin: 6px 0 0 55px;
    font-size: 14px;
    line-height: 20px;
}
#page-package-offers .po-stats {
    display: flex;
    width: 741px;
    height: 87px;
    margin: 25px 0 0 43px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
}
#page-package-offers .po-stats__cell {
    position: relative;
    padding-top: 11px;
    text-align: center;
}
#page-package-offers .po-stats__cell + .po-stats__cell::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 1px;
    height: 70px;
    background: #dbdde3;
}
#page-package-offers .po-stats__cell--1 { width: 234px; }
#page-package-offers .po-stats__cell--2 { width: 153px; }
#page-package-offers .po-stats__cell--3 { width: 123px; }
#page-package-offers .po-stats__cell--4 { width: 231px; }
#page-package-offers .po-stats__value {
    color: #8bc543;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 20px;
    line-height: 25px;
    white-space: nowrap;
}
#page-package-offers .po-stats__label {
    margin: 2px auto 0;
    font-size: 14px;
    line-height: 20px;
}
#page-package-offers .po-stats__cell--1 .po-stats__label { max-width: 158px; }
#page-package-offers .po-stats__cell--3 .po-stats__label { max-width: 123px; }
#page-package-offers .po-btn--quote {
    width: 196px;
    margin: 32px 0 0 42px;
}

/* Group tabs */
#page-package-offers .po-tabs {
    /* The site header is static at every width, so the bar sticks 5px below the top (below the site's modals, z-index 10000). */
    position: sticky;
    top: 5px;
    z-index: 50;
    width: 967px;
    height: 71px;
    margin: -50px 0 0 17px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 2px rgba(0, 0, 0, 0.25);
}
#page-package-offers .po-tabs__strip {
    display: flex;
    height: 100%;
}
#page-package-offers .po-tabs__cell {
    position: relative;
    flex: 0 0 auto;
    padding-top: 17px;
    border-radius: 13px;
    color: #333232;
    text-align: center;
}
#page-package-offers .po-tabs__cell:nth-child(1) { width: 209px; }
#page-package-offers .po-tabs__cell:nth-child(2) { width: 219px; }
#page-package-offers .po-tabs__cell:nth-child(3) { width: 216px; }
#page-package-offers .po-tabs__cell:nth-child(4) { width: 197px; }
#page-package-offers .po-tabs__cell:nth-child(5) { width: 126px; }
#page-package-offers .po-tabs__cell + .po-tabs__cell::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    width: 1px;
    height: 49px;
    background: #dbdde3;
}
#page-package-offers .po-tabs__name {
    display: block;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    white-space: nowrap;
}
#page-package-offers .po-tabs__info {
    display: block;
    font-size: 14px;
    line-height: 24px;
    white-space: nowrap;
}
#page-package-offers .po-tabs__cell--compare {
    display: flex;
    align-items: center;
    padding: 1px 0 0 9px;
    text-align: left;
}
#page-package-offers .po-tabs__cell--compare .po-tabs__name {
    line-height: 24px;
}
#page-package-offers .po-tabs__cell.is-active {
    background: rgba(139, 197, 67, 0.1);
}
#page-package-offers .po-tabs__cell.is-active .po-tabs__name {
    color: #8bc543;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
}
#page-package-offers .po-tabs__cell.is-active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 184px;
    max-width: calc(100% - 16px);
    height: 3px;
    margin-left: -92px;
    background: #8bc543;
}
#page-package-offers .po-tabs__cell--compare.is-active::after {
    width: 100px;
    margin-left: -50px;
}

/* What is Your Starting Point? */
#page-package-offers .po-start {
    display: flex;
    margin-top: 23px;
}
#page-package-offers .po-start__intro {
    flex: 0 0 320px;
    min-width: 0;
    padding: 45px 0 0 40px;
}
#page-package-offers .po-start__intro .po-h2 {
    width: 283px;
}
#page-package-offers .po-start__text {
    width: 229px;
    margin-top: 14px;
    color: #000;
    font-size: 14px;
    line-height: 20px;
}
#page-package-offers .po-start__cards {
    display: grid;
    grid-template-columns: repeat(4, 156.67px);
    column-gap: 10.6px;
}
#page-package-offers .po-start__card {
    position: relative;
    display: block;
    height: 224px;
    border-radius: 20px;
    background: rgba(236, 239, 234, 0.3);
    color: #413e3e;
    transition: background-color 0.2s;
}
#page-package-offers .po-start__card:hover {
    background: rgba(139, 197, 67, 0.12);
}
#page-package-offers .po-start__icon {
    position: absolute;
}
#page-package-offers .po-start__icon img {
    display: block;
    width: 100%;
    height: 100%;
}
#page-package-offers .po-start__card--1 .po-start__icon { top: 63px; left: 21px; width: 109px; height: 66px; }
#page-package-offers .po-start__card--2 .po-start__icon { top: 12px; left: 8px; width: 143px; height: 143px; }
#page-package-offers .po-start__card--3 .po-start__icon { top: 39px; left: 36px; width: 95px; height: 95px; }
#page-package-offers .po-start__card--4 .po-start__icon { top: 45px; left: 36px; width: 84px; height: 84px; }
#page-package-offers .po-start__caption {
    position: absolute;
    top: 155px;
    right: 10px;
    left: 10px;
    max-width: 134px;
    margin: 0 auto;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
}

/* Package groups */
#page-package-offers .po-packages {
    display: flow-root;
    margin-top: 55px;
    padding: 0 50px 30px 45px;
    border-radius: 16px;
    background: #f3f9ee url("/i/package-offers/sections-bg.jpg") 0 0 / 100% auto no-repeat;
}
#page-package-offers .po-group {
    scroll-margin-top: 96px;
}
#page-package-offers .po-group__title {
    color: #413e3e;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 24px;
    line-height: 42px;
}
#page-package-offers .po-group__sub {
    font-size: 14px;
    line-height: 24px;
}
#page-package-offers .po-group--ligand-based .po-group__title { margin-top: -4px; }
#page-package-offers .po-group--ligand-based .po-group__sub { margin-top: -3px; }
#page-package-offers .po-group--ligand-based .po-group__track { margin: 21px 0 0 -8px; }
#page-package-offers .po-group--structure-based { margin-top: 36px; }
#page-package-offers .po-group--structure-based .po-group__sub { margin-top: -2px; }
#page-package-offers .po-group--structure-based .po-group__track { margin-top: 22px; }
#page-package-offers .po-group__track {
    display: grid;
    grid-template-columns: repeat(3, 283px);
    column-gap: 26px;
}
#page-package-offers .po-pair {
    display: grid;
    grid-template-columns: 293px 592px;
    column-gap: 16px;
    margin-top: 19px;
}
#page-package-offers .po-pair .po-group__sub { margin-top: 1px; }
#page-package-offers .po-pair .po-group__track { margin-top: 16px; }
#page-package-offers .po-group--fragment-based .po-group__sub { width: 296px; }
#page-package-offers .po-group--del .po-group__sub { max-width: 542px; }
#page-package-offers .po-pair .po-card__stats { margin-top: 20px; }
#page-package-offers .po-pair .po-card__lead { margin-bottom: 10px; }
#page-package-offers .po-group--del .po-group__head { padding-left: 15px; }
#page-package-offers .po-group__track--1 { grid-template-columns: 293px; }
#page-package-offers .po-group__track--2 {
    grid-template-columns: 285px 291px;
    column-gap: 16px;
}
/* Side-by-side groups (03 + 04): heads share one subgrid row, so both card rows start at the same height
   whatever the subtitle lengths. Below 1024px the groups stack and keep their own flow. */
@media (min-width: 1024px) {
    #page-package-offers .po-pair .po-group {
        display: grid;
        grid-row: span 2;
        grid-template-rows: subgrid;
    }
    #page-package-offers .po-group--del .po-group__sub { max-width: none; }
}

/* Package card */
#page-package-offers .po-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 23px 16px 14px 27px;
    border-radius: 30px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
    scroll-margin-top: 96px;
}
#page-package-offers .po-group--ligand-based .po-card { min-height: 363px; }
#page-package-offers .po-group--structure-based .po-card { min-height: 380px; }
#page-package-offers .po-pair .po-card { min-height: 392px; }
#page-package-offers .po-card__title {
    max-width: 229px;
    color: #8bc543;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 20px;
    line-height: 22px;
    letter-spacing: 0.6px;
}
#page-package-offers .po-card__stats {
    display: flex;
    align-items: flex-start;
    margin: 13px 0 0 -6px;
}
#page-package-offers .po-card__num {
    color: #333232;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 35px;
    line-height: 20px;
    white-space: nowrap;
}
#page-package-offers .po-card__stats--long .po-card__num {
    font-size: 30px;
}
#page-package-offers .po-card__label {
    margin-top: 7px;
    color: #413e3e;
    font-size: 12px;
    line-height: 15px;
    white-space: nowrap;
}
#page-package-offers .po-card__stat:first-child .po-card__label {
    padding-left: 5px;
}
#page-package-offers .po-card__arrow {
    flex: 0 0 auto;
    margin: 7px 8px 0;
    color: #333232;
}
/* DEL cards: the short word "DEL" sits centred over its two-line caption, so the columns get fixed widths. */
#page-package-offers #package-classical-del .po-card__num,
#page-package-offers #package-del-ml .po-card__num {
    font-size: 30px;
}
#page-package-offers #package-del-ml .po-card__stat:last-child .po-card__num {
    font-size: 28px;
}
#page-package-offers #package-classical-del .po-card__label,
#page-package-offers #package-del-ml .po-card__label {
    white-space: nowrap;
}
#page-package-offers #package-classical-del .po-card__stat:first-child { flex: 0 0 93px; min-width: 0; }
#page-package-offers #package-classical-del .po-card__stat:first-child .po-card__num { padding-left: 4px; }
#page-package-offers #package-classical-del .po-card__stat:first-child .po-card__label { padding-left: 7px; }
#page-package-offers #package-classical-del .po-card__arrow { margin-right: 31px; }
#page-package-offers #package-del-ml .po-card__stat:first-child { flex: 0 0 91px; min-width: 0; }
#page-package-offers #package-del-ml .po-card__stat:first-child .po-card__num { padding-left: 3px; }
#page-package-offers #package-del-ml .po-card__stat:first-child .po-card__label { padding-left: 6px; }
#page-package-offers #package-del-ml .po-card__arrow { margin-right: 26px; }
#page-package-offers .po-card__bullets {
    margin: 18px 0 0 -10px;
    padding: 0;
    list-style: none;
    font-size: 12px;
    line-height: 16px;
}
#page-package-offers .po-card__bullets li {
    position: relative;
    padding-left: 18px;
}
#page-package-offers .po-page .po-card__bullets li::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 8px;
    width: 3px;
    height: 3px;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: #333232;
}
#page-package-offers .po-card__hit {
    width: 258px;
    margin: 12px 0 0 -10px;
    padding: 5px 17px 6px;
    border-radius: 8px;
    background: rgba(139, 197, 67, 0.15);
    font-size: 12px;
    line-height: 16px;
}
#page-package-offers .po-card__hit b {
    color: #8bc543;
}
#page-package-offers .po-card__lead {
    margin: auto 0 12px -2px;
    padding-top: 4px;
    color: #413e3e;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 18px;
    line-height: 20px;
}
#page-package-offers .po-card .po-price {
    align-self: center;
    margin-left: -11px;
}

/* ===== 05 bundle, "Why" cards, compare table and FAQ (desktop). ===== */

/* 05 · Classical DEL + DEL-ML */
#page-package-offers .po-group--bundle {
    margin-top: 31px;
}
#page-package-offers .po-group--bundle .po-group__title {
    color: #333232;
}
#page-package-offers .po-bundle {
    position: relative;
    width: 901px;
    height: 288px;
    margin-top: 20px;
    padding: 11px 0 0 50px;
    border: 5px solid #619322;
    border-radius: 30px;
    background: linear-gradient(to bottom, #b3d75b, #619322);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
    color: #fff;
}
#page-package-offers .po-bundle__ribbon {
    position: absolute;
    top: -5px;
    right: 18px;
    width: 67px;
    height: 87px;
    padding-top: 20px;
    background: #dd2727;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 49.34% 68.9%, 0 100%);
    color: #fff;
    font-family: Inter, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    text-align: center;
}
#page-package-offers .po-bundle__flow {
    display: flex;
    align-items: flex-start;
}
#page-package-offers .po-bundle__source {
    flex: 0 0 126px;
    margin-top: 65px;
}
#page-package-offers .po-bundle__big {
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 28px;
    line-height: 20px;
    white-space: nowrap;
}
#page-package-offers .po-bundle__small {
    font-size: 12px;
    line-height: 16px;
}
#page-package-offers .po-bundle__source .po-bundle__small {
    width: 100px;
    margin-top: 8px;
    line-height: 15px;
}
#page-package-offers .po-bundle__arrow {
    flex: 0 0 24px;
    margin: 90px 21px 0 0;
    color: #fff;
}
#page-package-offers .po-bundle__arrow + .po-bundle__result {
    margin-left: -4px;
}
#page-package-offers .po-bundle__paths {
    display: flex;
    flex: 0 0 385px;
    flex-direction: column;
    gap: 8px;
    margin-right: 17px;
}
#page-package-offers .po-bundle__path {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 7px 10px 7px 21px;
    border: 1px solid #fff;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.15);
}
#page-package-offers .po-bundle__path:nth-child(2) {
    padding-top: 5px;
    padding-bottom: 6px;
}
#page-package-offers .po-bundle__pill {
    display: inline-block;
    height: 22px;
    margin-left: -3px;
    padding: 0 10px;
    border-radius: 10px;
    background: rgba(97, 147, 34, 0.4);
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 15px;
    line-height: 22px;
    white-space: nowrap;
}
#page-package-offers .po-bundle__path:nth-child(2) .po-bundle__pill {
    padding: 0 9px;
}
#page-package-offers .po-bundle__count {
    height: 15px;
    margin-top: 8px;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 12px;
    line-height: 15px;
    white-space: nowrap;
}
#page-package-offers .po-bundle__path:nth-child(2) .po-bundle__count {
    margin-top: 7px;
}
#page-package-offers .po-bundle__count b {
    font-size: 28px;
}
#page-package-offers .po-bundle__path .po-bundle__small {
    max-width: 351px;
    margin-top: 8px;
}
#page-package-offers .po-bundle__path:nth-child(2) .po-bundle__small {
    margin-top: 9px;
}
#page-package-offers .po-bundle__result {
    flex: 0 0 126px;
    height: 103px;
    margin-top: 43px;
    padding: 12px 10px 0;
    border-radius: 20px;
    background: #fff;
    color: #333232;
    font-size: 12px;
    line-height: 15px;
}
#page-package-offers .po-bundle__total {
    color: #699641;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 28px;
    line-height: 20px;
}
#page-package-offers .po-bundle__total-text {
    width: 90px;
    margin-top: 10px;
}
#page-package-offers .po-bundle__total-note {
    margin-top: 1px;
    color: #699641;
    white-space: nowrap;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
}
#page-package-offers .po-bundle__footer {
    display: flex;
    align-items: center;
    margin: 17px 0 0 -9px;
}
#page-package-offers .po-bundle__price-wrap {
    flex: 0 0 147px;
}
#page-package-offers .po-bundle__lead {
    flex: 0 0 231px;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 18px;
    line-height: 20px;
}
#page-package-offers .po-bundle__note {
    font-size: 12px;
    line-height: 16px;
}

/* Why Work with Chemspace? */
#page-package-offers .po-why {
    margin-top: 29px;
}
#page-package-offers .po-why__title {
    margin-left: 4px;
}
#page-package-offers .po-why__cards {
    display: grid;
    grid-template-columns: repeat(4, 200px);
    column-gap: 31px;
    margin-top: 33px;
}
#page-package-offers .po-why__card {
    height: 244px;
    padding-top: 10px;
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
    text-align: center;
}
#page-package-offers .po-why__icon {
    display: block;
    width: 105px;
    height: 105px;
    margin: 0 auto;
}
#page-package-offers .po-why__body {
    margin: 8px auto 0;
    padding: 0 4px;
}
#page-package-offers .po-why__card--1 .po-why__body { max-width: 181px; }
#page-package-offers .po-why__card--2 .po-why__body { max-width: 192px; }
#page-package-offers .po-why__card--3 .po-why__body { max-width: 188px; }
#page-package-offers .po-why__card--4 .po-why__body { max-width: 174px; }
#page-package-offers .po-why__name {
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 16px;
    line-height: 20px;
}
#page-package-offers .po-why__text {
    font-size: 14px;
    line-height: 20px;
}

/* Compare All Packages */
#page-package-offers .po-compare {
    display: flex;
    align-items: flex-start;
    margin-top: 33px;
    scroll-margin-top: 96px;
}
#page-package-offers .po-compare__intro {
    flex: 0 0 238px;
    min-width: 0;
    margin-left: 42px;
    padding-top: 28px;
}
#page-package-offers .po-compare__intro .po-h2 {
    width: 100%;
}
#page-package-offers .po-compare__intro .po-h2--underline::after {
    margin-top: 20px;
}
#page-package-offers .po-compare__text {
    width: 229px;
    margin-top: 22px;
    color: #000;
    font-size: 14px;
    line-height: 20px;
}
#page-package-offers .po-btn--contact {
    width: 211px;
    margin-top: 22px;
    padding: 0 12px 0 57px;
}
#page-package-offers .po-table {
    width: 704px;
    border: 1px solid #d9d9d9;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 20px;
    overflow: hidden;
    table-layout: fixed;
    color: #000;
    letter-spacing: 0.3px;
}
#page-package-offers .po-table th {
    height: 48px;
    padding: 5px 0 0;
    border-bottom: 1px solid #6ebe37;
    background: #fff;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: 0.45px;
    text-align: center;
    vertical-align: middle;
}
#page-package-offers .po-table th:nth-child(1) { width: 239px; padding-right: 17px; }
#page-package-offers .po-table th:nth-child(2) { width: 179px; padding-right: 10px; }
#page-package-offers .po-table th:nth-child(3) { width: 109px; }
#page-package-offers .po-table th:nth-child(4) { width: 100px; }
#page-package-offers .po-table th:nth-child(5) { width: 75px; }
#page-package-offers .po-table td {
    height: 26.7px;
    padding: 0;
    border-left: 1px solid rgba(217, 217, 217, 0.8);
    font-size: 10px;
    line-height: 10px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}
#page-package-offers .po-table tbody tr:nth-child(even) td {
    background: #f5faf2;
}
#page-package-offers .po-table td:first-child {
    position: relative;
    padding-left: 26px;
    border-left: 0;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    text-align: left;
}
#page-package-offers .po-table td:first-child::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 11px;
    width: 4px;
    height: 4px;
    margin-top: -2px;
    border-radius: 50%;
    background: #8bc543;
}
#page-package-offers .po-pill {
    display: inline-block;
    height: 17px;
    border-radius: 16px;
    font-family: "Source Sans Pro Bold", Arial, sans-serif;
    line-height: 17px;
    text-align: center;
    white-space: nowrap;
}
#page-package-offers .po-pill--lead {
    min-width: 66px;
    padding: 0 6px;
    background: #eaf6e3;
    color: #4e7f29;
    font-size: 10px;
    letter-spacing: 0.24px;
}
#page-package-offers .po-pill--price {
    width: 56px;
    background: #8bc543;
    color: #fff;
    font-size: 10px;
    letter-spacing: 0.3px;
}

/* FAQ */
#page-package-offers .po-faq {
    min-height: 323px;
    margin-top: 33px;
    padding: 17px 0 36px 41px;
    border-radius: 16px;
    background: #eef5ea url("/i/package-offers/faq-bg.jpg") 55.1% 15.4% / 130.18% 160.37% no-repeat;
}
#page-package-offers .po-faq__title {
    margin-left: -3px;
    font-size: 36px;
}
#page-package-offers .po-faq__grid {
    display: flex;
    gap: 30px;
    margin-top: 31px;
}
#page-package-offers .po-faq__col {
    display: flex;
    flex: 0 0 393px;
    flex-direction: column;
    gap: 16px;
}
#page-package-offers .po-faq__item {
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
}
#page-package-offers .po-faq__q {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 55px;
    padding: 9px 28px 9px 23px;
    color: #000;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 14px;
    line-height: 18px;
    text-align: left;
}
#page-package-offers .po-faq__q-text {
    flex: 1 1 auto;
}
#page-package-offers .po-faq__icon {
    display: flex;
    flex: 0 0 19px;
    align-items: center;
    justify-content: center;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: #8bc543;
    color: #fff;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 16px;
    line-height: 18px;
}
#page-package-offers .is-open .po-faq__q {
    align-items: flex-start;
    min-height: 0;
    padding-top: 18px;
    padding-bottom: 5px;
}
#page-package-offers .po-faq__a {
    padding: 0 28px 14px 23px;
    color: #413e3e;
    font-size: 12px;
    line-height: 18px;
}
#page-package-offers .po-faq__a p + p {
    margin-top: 8px;
}


/* ===== breakpoints. 768-1279px is not designed: the desktop grid shrinks fluidly. Mobile design is 390px wide. ===== */
@media (max-width: 1279px) {
    #page-package-offers .po-page {
        width: auto;
        max-width: 1030px;
        padding: 0 16px;
    }
    #page-package-offers .po-hero {
        height: auto;
        min-height: 477px;
        padding: 68px 24px 80px 0;
    }
    #page-package-offers .po-hero__text {
        width: auto;
        max-width: 461px;
    }
    #page-package-offers .po-stats {
        width: auto;
        max-width: 741px;
        height: auto;
        min-height: 87px;
        padding-bottom: 9px;
    }
    #page-package-offers .po-stats__cell {
        flex: 1 1 auto;
        width: auto;
    }
    #page-package-offers .po-tabs {
        width: auto;
        margin-right: 12px;
        overflow: hidden;
    }
    #page-package-offers .po-tabs__strip {
        overflow-x: auto;
        scrollbar-width: none;
    }
    #page-package-offers .po-tabs__strip::-webkit-scrollbar {
        display: none;
    }
    #page-package-offers .po-start__cards {
        flex: 1 1 auto;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    #page-package-offers .po-packages {
        padding: 0 24px 30px;
        background-size: cover;
    }
    #page-package-offers .po-group--ligand-based .po-group__track {
        margin-left: 0;
    }
    #page-package-offers .po-group__track {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: 16px;
    }
    #page-package-offers .po-pair {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    }
    #page-package-offers .po-group__track--1 {
        grid-template-columns: minmax(0, 1fr);
    }
    #page-package-offers .po-group__track--2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #page-package-offers .po-group--fragment-based .po-group__sub {
        width: auto;
    }
    #page-package-offers .po-group--del .po-group__head {
        padding-left: 0;
    }
    #page-package-offers .po-card__title,
    #page-package-offers .po-card__label {
        white-space: normal;
    }
    #page-package-offers .po-bundle {
        width: auto;
    }
    #page-package-offers .po-why__cards {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        column-gap: 16px;
    }
    #page-package-offers .po-compare {
        flex-wrap: wrap;
        gap: 32px 0;
    }
    #page-package-offers .po-table {
        flex: 1 1 560px;
        width: auto;
        max-width: 704px;
    }
    #page-package-offers .po-faq {
        padding-right: 41px;
        background-size: cover;
    }
    #page-package-offers .po-faq__col {
        flex: 1 1 0;
        min-width: 0;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    #page-package-offers .po-start {
        flex-wrap: wrap;
    }
    #page-package-offers .po-start__intro {
        flex-basis: 100%;
        padding: 0 0 24px 40px;
    }
    /* 2x2 cards with the icon and caption in normal flow, so they never overlap. */
    #page-package-offers .po-start__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
        padding: 0 40px;
    }
    #page-package-offers .po-start__card {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        height: auto;
        min-height: 196px;
        padding: 20px 24px;
    }
    #page-package-offers .po-start__card .po-start__icon {
        display: flex;
        position: static;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 143px;
        height: 110px;
        overflow: hidden;
    }
    #page-package-offers .po-start__card .po-start__icon img {
        width: auto;
        height: auto;
        object-fit: contain;
    }
    #page-package-offers .po-start__card--1 .po-start__icon img { width: 109px; height: 66px; }
    #page-package-offers .po-start__card--2 .po-start__icon img { width: 143px; height: 110px; object-fit: cover; object-position: 50% 75%; }
    #page-package-offers .po-start__card--3 .po-start__icon img { width: 95px; height: 95px; }
    #page-package-offers .po-start__card--4 .po-start__icon img { width: 84px; height: 84px; }
    #page-package-offers .po-start__card .po-start__caption {
        position: static;
        width: auto;
        max-width: 260px;
        text-align: center;
    }
    #page-package-offers .po-group__track--3 .po-card:last-child {
        grid-column: 1 / -1;
        justify-self: center;
        width: calc(50% - 8px);
    }
    #page-package-offers .po-group__track {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 16px;
    }
    #page-package-offers .po-pair {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 36px;
    }
    #page-package-offers .po-group__track--1 {
        grid-template-columns: minmax(0, 1fr);
        max-width: 50%;
    }
    #page-package-offers .po-why__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 16px;
    }
    #page-package-offers .po-compare__intro {
        flex-basis: calc(100% - 42px);
    }
    #page-package-offers .po-table {
        flex-basis: 100%;
        max-width: none;
    }
}

/* ===== phones (design: 390px frame, 16px gutters). ===== */
@media (max-width: 767px) {
    #page-package-offers .po-page {
        padding: 0;
    }
    #page-package-offers .po-desktop,
    #page-package-offers .po-br-desktop,
    #page-package-offers .po-table,
    #page-package-offers .po-compare__intro .po-btn {
        display: none;
    }
    #page-package-offers .po-mobile,
    #page-package-offers .po-carousel {
        display: block;
    }
    #page-package-offers .po-compare__mobile {
        display: block;
    }
    #page-package-offers .po-h2 {
        font-size: 20px;
        line-height: 28px;
    }

    /* Hero */
    #page-package-offers .po-hero {
        height: auto;
        min-height: 481px;
        padding: 26px 16px 61px;
        border-radius: 0;
        background-position: -354.5px 0;
        background-size: 1373.6px 481px;
    }
    #page-package-offers .po-hero__title {
        width: auto;
        margin: 0;
        font-size: 24px;
        line-height: 32px;
        text-align: left;
    }
    #page-package-offers .po-hero__text {
        max-width: none;
        margin: 0;
    }
    #page-package-offers .po-stats {
        position: relative;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 90px 89px;
        max-width: none;
        height: 179px;
        margin: 17px 0 0;
        padding: 0;
    }
    #page-package-offers .po-stats::before,
    #page-package-offers .po-stats::after {
        content: "";
        position: absolute;
        background: #dbdde3;
    }
    #page-package-offers .po-stats::before {
        top: 0;
        bottom: 0;
        left: 50%;
        width: 1px;
    }
    #page-package-offers .po-stats::after {
        top: 90px;
        left: 0;
        right: 0;
        height: 1px;
    }
    #page-package-offers .po-stats__cell + .po-stats__cell::before {
        content: none;
    }
    #page-package-offers .po-stats__value {
        margin: 0 auto;
        line-height: 18px;
        white-space: normal;
    }
    #page-package-offers .po-stats__label {
        line-height: 18px;
    }
    #page-package-offers .po-stats__cell--1 { order: 1; padding-top: 7px; }
    #page-package-offers .po-stats__cell--1 .po-stats__value { max-width: 175px; line-height: 20px; }
    #page-package-offers .po-stats__cell--4 { order: 2; padding-top: 8px; }
    #page-package-offers .po-stats__cell--4 .po-stats__value { max-width: 165px; }
    #page-package-offers .po-stats__cell--4 .po-stats__label { margin-top: 5px; line-height: 20px; }
    #page-package-offers .po-stats__cell--3 { order: 3; padding-top: 16px; }
    #page-package-offers .po-stats__cell--3 .po-stats__label { margin-top: 0; }
    #page-package-offers .po-stats__cell--2 { order: 4; padding-top: 12px; }
    #page-package-offers .po-stats__cell--2 .po-stats__value { line-height: 25px; }
    #page-package-offers .po-stats__cell--2 .po-stats__label { margin-top: -3px; }
    #page-package-offers .po-btn--quote {
        width: 100%;
        margin: 22px 0 0;
    }

    /* Group tabs: horizontal strip running off the right edge */
    #page-package-offers .po-tabs {
        margin: -48px 0 -23px 10px;
        border-radius: 14px 0 0 14px;
    }
    #page-package-offers .po-tabs__strip {
        scroll-snap-type: x proximity;
    }
    #page-package-offers .po-tabs__cell {
        scroll-snap-align: start;
    }

    /* Starting point + packages + "why" share one background on phones */
    #page-package-offers .po-main {
        padding-bottom: 11px;
        background: #f3f9ee url("/i/package-offers/sections-bg.jpg") -336px -2px / 1606px auto no-repeat;
    }
    #page-package-offers .po-start {
        display: block;
        margin: 0;
        padding: 40px 16px 0;
    }
    #page-package-offers .po-start__intro {
        padding: 0;
    }
    #page-package-offers .po-start__intro .po-h2 {
        width: auto;
    }
    #page-package-offers .po-h2--underline::after {
        margin-top: 6px;
    }
    #page-package-offers .po-start__text {
        width: auto;
        margin: 8px -7px 0 0;
    }
    #page-package-offers .po-start__cards {
        grid-template-columns: repeat(2, minmax(0, 157px));
        column-gap: 10px;
        row-gap: 8px;
        justify-content: center;
        margin: 8px 3px 0 -1px;
    }
    #page-package-offers .po-start__card {
        height: 153px;
        overflow: hidden;
    }
    #page-package-offers .po-start__icon {
        overflow: hidden;
    }
    #page-package-offers .po-start__icon img {
        object-fit: cover;
    }
    #page-package-offers .po-start__card--1 .po-start__icon { top: 21px; left: 17px; }
    #page-package-offers .po-start__card--2 .po-start__icon { top: 0; left: 8px; height: 92px; }
    #page-package-offers .po-start__card--2 .po-start__icon img { object-position: 50% 85.3%; }
    #page-package-offers .po-start__card--3 .po-start__icon { top: 8px; left: 31px; height: 84px; }
    #page-package-offers .po-start__card--3 .po-start__icon img { object-position: 50% 72.7%; }
    #page-package-offers .po-start__card--4 .po-start__icon { top: 9px; left: 36px; }
    #page-package-offers .po-start__caption { top: 87px; }
    #page-package-offers .po-start__card--3 .po-start__caption { top: 99px; }
    #page-package-offers .po-start__card--4 .po-start__caption { top: 97px; }

    /* Package groups */
    #page-package-offers .po-packages {
        margin-top: 23px;
        padding: 0;
        border-radius: 0;
        background: none;
    }
    #page-package-offers .po-group .po-group__head {
        padding: 0 16px;
    }
    #page-package-offers .po-group .po-group__title {
        margin: 0;
        color: #333232;
        font-family: "Source Sans Pro Semibold", Arial, sans-serif;
        font-size: 20px;
        line-height: 28px;
    }
    #page-package-offers .po-group .po-group__sub,
    #page-package-offers .po-pair .po-group__sub {
        width: auto;
        max-width: none;
        margin: 0;
    }
    #page-package-offers .po-pair {
        display: block;
        margin: 0;
    }
    #page-package-offers .po-group__track,
    #page-package-offers .po-group__track--2 {
        display: flex;
        gap: 9px;
        margin: 1px 0 0;
        padding: 4px 26px 6px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 26px;
        scrollbar-width: none;
    }
    #page-package-offers .po-group__track::-webkit-scrollbar {
        display: none;
    }
    #page-package-offers .po-card__label {
        white-space: nowrap;
    }
    #page-package-offers .po-group__track .po-card {
        flex: 0 0 283px;
        min-width: 0;
        scroll-snap-align: start;
    }
    #page-package-offers .po-group__track--2 .po-card:first-child { flex-basis: 285px; }
    #page-package-offers .po-group__track--2 .po-card:last-child { flex-basis: 291px; }
    #page-package-offers #package-classical-del .po-card__stat:first-child { flex-basis: 110px; }
    #page-package-offers #package-classical-del .po-card__stat:first-child .po-card__num { padding-left: 5px; }
    #page-package-offers #package-classical-del .po-card__stat:first-child .po-card__label { padding-left: 4px; }
    #page-package-offers #package-classical-del .po-card__arrow { margin-right: 14px; }
    #page-package-offers .po-group__track--1 {
        justify-content: center;
        overflow: visible;
    }
    #page-package-offers .po-group__track--1 .po-card {
        flex-basis: 293px;
    }
    #page-package-offers .po-group--ligand-based .po-group__track { margin: 1px 0 0; }
    #page-package-offers .po-group--structure-based { margin-top: 11px; }
    #page-package-offers .po-group--structure-based .po-group__track { margin-top: 13px; }
    #page-package-offers .po-group--fragment-based { margin-top: 16px; }
    #page-package-offers .po-group--fragment-based .po-group__track { margin-top: 7px; }
    #page-package-offers .po-group--del { margin-top: 29px; }
    #page-package-offers .po-group--del .po-group__track { margin-top: 2px; }
    #page-package-offers .po-carousel {
        text-align: center;
    }
    #page-package-offers .po-carousel__controls {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 171px;
        margin: 5px auto 0;
    }
    #page-package-offers .po-group--structure-based .po-carousel__controls { margin-top: 10px; }
    #page-package-offers .po-group--del .po-carousel__controls { width: 151px; margin-top: 8px; }
    #page-package-offers .po-carousel__btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 35px;
        height: 35px;
        border: 1px solid #bfbaba;
        border-radius: 50%;
        color: #333232;
    }
    #page-package-offers .po-carousel__btn--next svg {
        transform: scaleX(-1);
    }
    #page-package-offers .po-carousel__btn:disabled {
        opacity: 0.35;
        cursor: default;
    }
    #page-package-offers .po-carousel__dots {
        display: flex;
        gap: 8px;
    }
    #page-package-offers .po-carousel__dot {
        width: 8px;
        height: 8px;
        border-radius: 4px;
        background: #d9d9d9;
        transition: width 0.2s, background-color 0.2s;
    }
    #page-package-offers .po-carousel__dot.is-active {
        width: 30px;
        background: #8bc543;
    }
    #page-package-offers .po-carousel__caption {
        font-size: 14px;
        line-height: 24px;
    }
}

/* ===== phones, continued (why, compare, FAQ). The 05 bundle switches to its vertical flow below 1024px. ===== */
@media (max-width: 1023px) {
    /* 05 bundle: vertical flow */
    #page-package-offers .po-bundle {
        width: min(341px, calc(100% - 32px));
        height: auto;
        margin: 10px auto 0;
        padding: 29px 0 15px;
    }
    #page-package-offers .po-bundle__ribbon {
        top: 0;
        right: 29px;
        width: 48px;
        height: 64px;
        padding-top: 12px;
        font-size: 10px;
        line-height: 12px;
    }
    #page-package-offers .po-bundle__flow {
        flex-direction: column;
        align-items: flex-start;
    }
    #page-package-offers .po-bundle__source {
        flex: none;
        margin: 0;
        padding-left: 19px;
    }
    #page-package-offers .po-bundle__source .po-bundle__small {
        width: auto;
        max-width: 217px;
        margin-top: 4px;
    }
    #page-package-offers .po-bundle__arrow,
    #page-package-offers .po-bundle__arrow:nth-of-type(2) {
        display: flex;
        flex: none;
        align-items: center;
        justify-content: center;
        align-self: center;
        width: 24px;
        height: 24px;
        margin: -3px 0 0;
    }
    #page-package-offers .po-bundle__arrow .po-arrow {
        transform: rotate(90deg);
    }
    #page-package-offers .po-bundle__paths {
        flex: none;
        align-self: stretch;
        gap: 5px;
        width: auto;
        margin: 13px 16px 0 22px;
    }
    #page-package-offers .po-bundle__path {
        padding: 7px 10px 6px 14px;
    }
    #page-package-offers .po-bundle__path:nth-child(2) {
        padding: 5px 10px 6px 14px;
    }
    #page-package-offers .po-bundle__pill,
    #page-package-offers .po-bundle__path:nth-child(2) .po-bundle__pill {
        height: 15px;
        margin-left: 0;
        padding: 0 6.5px;
        border-radius: 7.5px;
        font-size: 10px;
        line-height: 15px;
    }
    #page-package-offers .po-bundle__count,
    #page-package-offers .po-bundle__path:nth-child(2) .po-bundle__count {
        height: auto;
        min-height: 22px;
        white-space: normal;
        margin-top: 6px;
        line-height: 22px;
    }
    #page-package-offers .po-bundle__count b {
        line-height: 0;
    }
    #page-package-offers .po-bundle__path:nth-child(2) .po-bundle__count {
        margin-top: 7px;
    }
    #page-package-offers .po-bundle__path .po-bundle__small,
    #page-package-offers .po-bundle__path:nth-child(2) .po-bundle__small {
        max-width: 271px;
        margin-top: 0;
    }
    #page-package-offers .po-bundle__path:nth-child(2) .po-bundle__small {
        max-width: 265px;
    }
    #page-package-offers .po-bundle__arrow:nth-of-type(2) {
        margin-top: 10px;
    }
    #page-package-offers .po-bundle__result,
    #page-package-offers .po-bundle__arrow + .po-bundle__result {
        display: grid;
        flex: none;
        grid-template-columns: auto 1fr;
        align-self: stretch;
        width: auto;
        height: auto;
        min-height: 71px;
        align-content: start;
        margin: 11px 16px 0 22px;
        padding: 10px 15px 8px;
    }
    #page-package-offers .po-bundle__total {
        height: 22px;
        color: #619322;
    }
    #page-package-offers .po-bundle__total-text {
        width: auto;
        margin: 8px 0 0 7px;
    }
    #page-package-offers .po-bundle__total-note {
        grid-column: 1 / -1;
        margin-top: 8px;
    }
    #page-package-offers .po-bundle__footer {
        flex-direction: column;
        align-items: flex-start;
        margin: 10px 0 0;
        padding: 0 23px;
    }
    #page-package-offers .po-bundle__note {
        order: 1;
        max-width: 285px;
    }
    #page-package-offers .po-bundle__lead {
        flex: none;
        order: 2;
        margin-top: 15px;
    }
    #page-package-offers .po-bundle__price-wrap {
        flex: none;
        order: 3;
        align-self: center;
        margin-top: 17px;
    }
}

@media (max-width: 767px) {
    #page-package-offers .po-group--bundle {
        margin-top: 15px;
    }
    #page-package-offers .po-bundle__source + .po-bundle__arrow {
        margin-top: 12px;
    }
    #page-package-offers .po-bundle__paths {
        gap: 4px;
    }

    /* Why */
    #page-package-offers .po-why {
        margin-top: 16px;
        padding: 0 16px;
    }
    #page-package-offers .po-why__title {
        margin: 0;
    }
    #page-package-offers .po-why__cards {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin: 12px -4px 0;
    }
    #page-package-offers .po-why__card {
        display: flex;
        align-items: center;
        height: 114px;
        padding: 0 8px 0 13px;
        text-align: left;
    }
    #page-package-offers .po-why__icon {
        flex: 0 0 74px;
        width: 74px;
        height: 74px;
        margin: 0;
    }
    #page-package-offers .po-why__body,
    #page-package-offers .po-why__card .po-why__body {
        max-width: 256px;
        margin: 0 0 0 8px;
        padding: 0;
    }

    /* Compare */
    #page-package-offers .po-compare {
        display: block;
        margin-top: 5px;
        padding: 0 16px;
    }
    #page-package-offers .po-compare__intro {
        margin: 0;
        padding: 0;
    }
    #page-package-offers .po-compare__intro .po-h2 {
        width: auto;
    }
    #page-package-offers .po-compare__intro .po-h2--underline::after {
        margin-top: 6px;
    }
    #page-package-offers .po-compare__text {
        width: auto;
        margin-top: 7px;
        color: #333232;
        line-height: 24px;
    }
    #page-package-offers .po-switch {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        height: 90px;
        margin-top: 4px;
        padding: 5px 7px 6px;
        border-radius: 20px;
        background: rgba(139, 197, 67, 0.15);
    }
    #page-package-offers .po-switch__cell {
        border-radius: 20px;
        color: #333232;
        font-family: "Source Sans Pro Bold", Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
    }
    #page-package-offers .po-switch__cell.is-active {
        background: #fff;
    }
    #page-package-offers .po-compare__hint {
        margin-top: 6px;
        font-size: 14px;
        line-height: 24px;
    }
    #page-package-offers .po-list {
        margin: 12px -4px 0;
        border: 1px solid #f5faf2;
        border-radius: 20px;
        overflow: hidden;
    }
    #page-package-offers .po-list__group {
        height: 27px;
        padding: 4px 0 0 11px;
        background: #f5faf2;
        color: #8bc543;
        font-family: "Source Sans Pro Bold", Arial, sans-serif;
        font-size: 16px;
        line-height: 20px;
    }
    #page-package-offers .po-list__group:first-child {
        height: 28px;
        padding-top: 5px;
    }
    #page-package-offers .po-list__row {
        display: flex;
        align-items: center;
        width: 100%;
        height: 26px;
        padding: 0 6px 0 12px;
        background: #fff;
        color: #000;
        font-size: 10px;
        letter-spacing: 0.3px;
    }
    #page-package-offers .po-list__row + .po-list__row {
        height: 27px;
        border-top: 1px solid #eef5e9;
    }
    #page-package-offers .po-list__name {
        flex: 1 1 auto;
        font-family: "Source Sans Pro Bold", Arial, sans-serif;
        line-height: 13px;
    }
    #page-package-offers .po-list__value {
        flex: 0 0 auto;
        line-height: 17px;
    }
    #page-package-offers .po-list__chevron {
        display: flex;
        flex: 0 0 8.5px;
        justify-content: center;
        margin-left: 3px;
        color: #333232;
    }
    #page-package-offers .po-btn--contact-mobile {
        position: relative;
        justify-content: center;
        width: 100%;
        margin-top: 20px;
        padding: 0;
    }
    #page-package-offers .po-btn--contact-mobile .po-btn__circle {
        position: absolute;
        top: 6px;
        right: 8px;
    }

    /* FAQ */
    #page-package-offers .po-faq {
        min-height: 0;
        margin-top: 21px;
        padding: 12px 15px 24px 18px;
        border-radius: 0;
        background-position: -2254px -115px;
        background-size: 4952px 1980px;
    }
    #page-package-offers .po-faq__title {
        margin: 0;
        font-size: 20px;
    }
    #page-package-offers .po-faq__grid {
        flex-direction: column;
        gap: 10px;
        margin-top: 13px;
    }
    #page-package-offers .po-faq__col {
        flex: none;
        gap: 10px;
    }
    #page-package-offers .po-faq__item {
        border-radius: 19px;
    }
    #page-package-offers .po-faq__q {
        gap: 11px;
        min-height: 50px;
        padding: 8px 24px 8px 20px;
        font-size: 12.7px;
        line-height: 16.3px;
    }
    #page-package-offers .po-faq__icon {
        flex-basis: 17px;
        width: 17px;
        height: 17px;
        font-size: 14.5px;
        line-height: 16px;
    }
    #page-package-offers .is-open .po-faq__q {
        min-height: 0;
        padding-top: 17px;
        padding-bottom: 4.7px;
    }
    #page-package-offers .po-faq__a {
        padding: 0 18px 7px 20px;
    }
}

/* ===== "Request a quote" modal (Figma "Contact us": 998x636 desktop, 358 wide mobile). ===== */
#page-package-offers .po-quote {
    position: fixed;
    inset: 0;
    z-index: 9000;
}
#page-package-offers .po-quote__overlay {
    display: flex;
    position: absolute;
    inset: 0;
    padding: 40px 16px;
    overflow-y: auto;
    background: rgba(0, 0, 0, 0.5);
    overscroll-behavior: contain;
}
#page-package-offers #get-in-touch-form.po-quote__form {
    position: relative;
    flex: none;
    gap: 0;
    width: 998px;
    max-width: 100%;
    min-height: 636px;
    margin: auto;
    padding: 60px 60px 38px;
    overflow: hidden;
    border-radius: 16px;
    background: #c5e2a1;
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-weight: 400;
    text-align: left;
}
#page-package-offers #get-in-touch-form .po-quote__close {
    display: flex;
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 3;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    color: #333232;
}
#page-package-offers #get-in-touch-form .po-quote__close:hover {
    background: none;
    color: #8bc543;
}
#page-package-offers .po-quote__deco {
    position: absolute;
    z-index: 1;
    line-height: 0;
    pointer-events: none;
}
#page-package-offers .po-quote__deco--1 { top: 42px; left: 547px; }
#page-package-offers .po-quote__deco--2 { top: 0; left: 667px; }
#page-package-offers .po-quote__deco--3 { top: 369px; left: 689px; }
#page-package-offers .po-quote__deco--4 { top: 483px; left: 524px; }
#page-package-offers #get-in-touch-form .po-quote__heading {
    position: relative;
    z-index: 2;
    gap: 18px;
}
#page-package-offers #get-in-touch-form .po-quote__title {
    margin: 0;
    padding: 0;
    color: #333232;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 36px;
    font-weight: 400;
    line-height: 42px;
}
#page-package-offers #get-in-touch-form .po-quote__sub {
    font-size: 14px;
    line-height: 24px;
}
#page-package-offers #get-in-touch-form .po-quote__fields {
    gap: 48px;
    margin-top: 36px;
}
#page-package-offers #get-in-touch-form .get-in-touch-field label,
#page-package-offers #get-in-touch-form .po-quote__country label {
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
}
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field input,
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field select,
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field textarea,
#page-package-offers #get-in-touch-form .po-quote__country select {
    width: 100%;
    height: 36px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: #fff;
    box-shadow: none;
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    outline: none;
}
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field input:focus,
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field select:focus,
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field textarea:focus,
#page-package-offers #get-in-touch-form .po-quote__country select:focus {
    border-color: #8bc543;
}
#page-package-offers #get-in-touch-form ::placeholder {
    color: #ccc;
    opacity: 1;
}
#page-package-offers #get-in-touch-form .po-quote__select {
    position: relative;
}
#page-package-offers #get-in-touch-form .po-quote__select select {
    padding-right: 36px;
    appearance: none;
    cursor: pointer;
}
#page-package-offers #get-in-touch-form .po-quote__select select:has(option[value=""]:checked) {
    color: #ccc;
}
#page-package-offers #get-in-touch-form .po-quote__select option {
    color: #333232;
}
#page-package-offers .po-quote__caret {
    position: absolute;
    top: 31px;
    right: 12px;
    color: #333232;
    pointer-events: none;
}
#page-package-offers #get-in-touch-form .get-in-touch-field-message {
    flex: 1 1 auto;
}
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field-message textarea {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    padding-top: 8px;
    resize: none;
}
#page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field.invalid input,
#page-package-offers #get-in-touch-form .po-quote__country.invalid select {
    border-color: #c00;
}
#page-package-offers #get-in-touch-form .po-quote__country .get-in-touch-validation-container {
    display: none;
}
#page-package-offers #get-in-touch-form .po-quote__country.invalid .get-in-touch-validation-container {
    display: block;
    color: #c00;
    font-size: 12px;
}
#page-package-offers .po-quote__bottom {
    display: grid;
    position: relative;
    z-index: 2;
    grid-template-columns: 424px 415px;
    column-gap: 39px;
    align-items: start;
    margin-top: 31px;
}
#page-package-offers .po-quote__checks {
    display: flex;
    flex-direction: column;
    gap: 7px;
}
#page-package-offers .po-quote__check {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 0;
    color: #333232;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    cursor: pointer;
}
#page-package-offers .po-quote__check--consent span {
    width: 396px;
}
#page-package-offers .po-quote__check a {
    color: inherit;
    text-decoration: underline;
}
#page-package-offers .po-quote__check a:hover {
    color: #8bc543;
}
#page-package-offers .po-quote__check input[type="checkbox"] {
    display: block;
    flex: 0 0 16px;
    position: static;
    width: 16px;
    height: 16px;
    margin: 0;
    border: 1px solid #bfbaba;
    border-radius: 3px;
    background: #fff center / 14px 14px no-repeat;
    opacity: 1;
    appearance: none;
    cursor: pointer;
}
#page-package-offers .po-quote__check input[type="checkbox"]:checked {
    border-color: #8bc543;
    background-image: url("data:image/svg+xml,%3csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M5.25 9.43L3.23 7.41a.58.58 0 0 0-.82.82l2.43 2.44c.23.22.6.22.83 0l6.17-6.18a.58.58 0 0 0-.82-.82L5.25 9.43z' fill='%238BC543'/%3e%3c/svg%3e");
}
#page-package-offers .po-quote__check.invalid input[type="checkbox"] {
    border-color: #c00;
}
#page-package-offers .po-quote__check.invalid span {
    color: #c00;
}
#page-package-offers .po-quote__country {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
#page-package-offers .po-quote__actions {
    position: relative;
    z-index: 2;
    margin: 22px 0 0 -3px;
}
#page-package-offers #get-in-touch-form.get-in-touch-form .po-quote__actions button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 40px;
    padding: 0;
    border: 1px solid #8bc543;
    border-radius: 45px;
    background: #fff;
    color: #8bc543;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
}
#page-package-offers #get-in-touch-form.get-in-touch-form .po-quote__actions button:hover {
    background: #8bc543;
    color: #fff;
}
#page-package-offers #get-in-touch-form.get-in-touch-form .po-quote__actions button:disabled {
    border-color: #d6e7c3;
    background: #fff;
    color: #d6e7c3;
}
#page-package-offers #get-in-touch-form .contact-us-toast {
    right: 60px;
    bottom: 38px;
    left: auto;
    z-index: 4;
    width: 480px;
    max-width: calc(100% - 32px);
}

@media (max-width: 767px) {
    #page-package-offers .po-quote__overlay {
        padding: 16px;
    }
    #page-package-offers #get-in-touch-form.po-quote__form {
        width: 100%;
        min-height: 0;
        padding: 36px 16px 26px;
        border-radius: 8px;
    }
    #page-package-offers #get-in-touch-form .po-quote__close {
        top: 8px;
        right: 8px;
    }
    #page-package-offers .po-quote__deco {
        display: none;
    }
    #page-package-offers #get-in-touch-form .po-quote__title {
        font-size: 20px;
        line-height: 28px;
        text-align: center;
    }
    #page-package-offers #get-in-touch-form .po-quote__sub {
        text-align: center;
    }
    #page-package-offers #get-in-touch-form .po-quote__fields {
        flex-direction: column;
        gap: 12px;
        margin-top: 18px;
    }
    #page-package-offers #get-in-touch-form .get-in-touch-field-message {
        flex: none;
    }
    #page-package-offers #get-in-touch-form .get-in-touch-fields-container .get-in-touch-fields .get-in-touch-field-message textarea {
        flex: none;
        height: 109px;
    }
    #page-package-offers .po-quote__bottom {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 12px;
        margin-top: 18px;
    }
    #page-package-offers .po-quote__checks {
        gap: 6px;
    }
    #page-package-offers .po-quote__check--consent span {
        width: auto;
        max-width: 281px;
    }
    #page-package-offers .po-quote__checks .po-quote__check:last-child {
        margin-left: -1px;
    }
    #page-package-offers .po-quote__actions {
        margin: 18px 0 0 -1px;
    }
    #page-package-offers #get-in-touch-form.get-in-touch-form .po-quote__actions button {
        width: calc(100% - 1px);
        height: 39px;
    }
    #page-package-offers #get-in-touch-form .contact-us-toast {
        right: 16px;
        bottom: 16px;
        width: auto;
        left: 16px;
        max-width: none;
    }
}

/* ===== "You've chosen {Package}" modal (Figma 197:999, 422x505), opened with openModalDialog(). ===== */
#page-package-offers #psaas-contact-form.po-chosen {
    box-sizing: border-box;
    width: 422px;
    min-width: 0;
    max-width: calc(100vw - 32px);
    min-height: 0;
    margin: 0;
    padding: 24px 24px 21px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    text-align: left;
}
#page-package-offers .po-chosen *,
#page-package-offers .po-chosen *::before,
#page-package-offers .po-chosen *::after {
    box-sizing: border-box;
}
#page-package-offers .po-chosen * {
    letter-spacing: normal;
}
#page-package-offers .po-chosen .po-chosen__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
}
#page-package-offers .po-chosen .po-chosen__title {
    margin: 0;
    padding: 0;
    border: 0;
    color: #333232;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    text-align: left;
    text-transform: none;
}
#page-package-offers .po-chosen .po-chosen__head a.close {
    flex: 0 0 16px;
    position: static;
    width: 16px;
    height: 16px;
    margin: 0;
    padding: 0;
    border: 0;
    background: url("data:image/svg+xml,%3csvg width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M3 3l10 10M13 3L3 13' stroke='%23333232' stroke-width='1.5' stroke-linecap='round'/%3e%3c/svg%3e") center / 16px 16px no-repeat;
    opacity: 1;
}
#page-package-offers .po-chosen .po-chosen__fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
}
#page-package-offers .po-chosen .po-chosen__field {
    position: relative;
    display: flex;
    flex-direction: column;
    width: auto;
    margin: 0;
    padding: 0;
}
#page-package-offers .po-chosen .po-chosen__field label {
    display: block;
    width: auto;
    height: auto;
    margin: 0 0 6px;
    padding: 0;
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    text-align: left;
}
#page-package-offers .po-chosen .po-chosen__req {
    color: #c00;
}
/* bo_style.css adds " *" after labels of required fields; the markup already carries the red asterisk. */
#page-package-offers .po-chosen .required label::after {
    content: none;
}
#page-package-offers .po-chosen .po-chosen__field input,
#page-package-offers .po-chosen .po-chosen__field textarea {
    display: block;
    width: 100%;
    height: 36px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    box-shadow: none;
    color: #333232;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    outline: none;
}
#page-package-offers .po-chosen .po-chosen__field input:focus,
#page-package-offers .po-chosen .po-chosen__field textarea:focus {
    border-color: #8bc543;
}
#page-package-offers .po-chosen ::placeholder {
    color: #ccc;
    opacity: 1;
}
#page-package-offers .po-chosen .po-chosen__field textarea {
    height: 90px;
    padding: 6px 12px;
    line-height: 18px;
    resize: none;
}
#page-package-offers .po-chosen .po-chosen__hidden {
    display: none;
}
#page-package-offers .po-chosen .po-chosen__field.has-error input,
#page-package-offers .po-chosen .po-chosen__field.has-error textarea {
    border-color: #c00;
}
#page-package-offers .po-chosen .help-block {
    margin: 4px 0 0;
    padding: 0;
    color: #c00;
    font-size: 12px;
    line-height: 15px;
}
#page-package-offers .po-chosen .help-block:empty {
    display: none;
}
#page-package-offers .po-chosen .po-chosen__consent {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: auto;
    margin: 16px 0 0;
    padding: 0;
    color: #333232;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
    cursor: pointer;
}
#page-package-offers .po-chosen .po-chosen__consent span {
    max-width: 349px;
}
#page-package-offers .po-chosen .po-chosen__consent a {
    color: inherit;
    text-decoration: underline;
}
#page-package-offers .po-chosen .po-chosen__consent a:hover {
    color: #8bc543;
}
#page-package-offers .po-chosen .po-chosen__consent input[type="checkbox"] {
    display: block;
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    margin: 2px 0 0 1px;
    border: 1px solid #bfbaba;
    border-radius: 3px;
    background: #fff center / 14px 14px no-repeat;
    opacity: 1;
    appearance: none;
    cursor: pointer;
}
#page-package-offers .po-chosen .po-chosen__consent input[type="checkbox"]:checked {
    border-color: #8bc543;
    background-image: url("data:image/svg+xml,%3csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M5.25 9.43L3.23 7.41a.58.58 0 0 0-.82.82l2.43 2.44c.23.22.6.22.83 0l6.17-6.18a.58.58 0 0 0-.82-.82L5.25 9.43z' fill='%238BC543'/%3e%3c/svg%3e");
}
#page-package-offers .po-chosen .po-chosen__consent.invalid input[type="checkbox"] {
    border-color: #c00;
}
#page-package-offers .po-chosen .po-chosen__consent.invalid span {
    color: #c00;
}
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin: 20px 0 0;
    padding: 0 5px 0 0;
}
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons .btn {
    width: auto;
    min-width: 0;
    height: 26px;
    margin: 0;
    padding: 0 15.5px;
    border: 1px solid #8bc543;
    border-radius: 45px;
    background: #8bc543;
    box-shadow: none;
    color: #fff;
    font-family: "Source Sans Pro Semibold", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    text-transform: none;
    transition: none;
}
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons .btn:hover {
    border-color: #7cb046;
    background: #7cb046;
}
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons .btn.btn-orange-inverse {
    border-color: #ffa500;
    background: #fff;
    color: #ffa500 !important;
}
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons .btn.btn-orange-inverse:hover {
    background: #ffa500;
    color: #fff !important;
}
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons .btn::before,
#page-package-offers #psaas-contact-form.po-chosen .po-chosen__buttons .btn::after {
    content: none;
}

/* Tablet portrait: the vertical 05 bundle gets more room than on phones. */
@media (min-width: 768px) and (max-width: 1023px) {
    #page-package-offers .po-bundle {
        width: min(520px, calc(100% - 32px));
    }
    #page-package-offers .po-bundle__note,
    #page-package-offers .po-bundle__source .po-bundle__small,
    #page-package-offers .po-bundle__path .po-bundle__small,
    #page-package-offers .po-bundle__path:nth-child(2) .po-bundle__small {
        max-width: none;
    }
}
