/* Marketing templates only; loaded by landing/base.html. */
body.landing-marketing {
    --landing-hero-size: 64px;
    --landing-section-size: 42px;
    --landing-card-size: 24px;
    --landing-lead-size: 22px;
    --landing-body-size: 18px;
    --landing-bullet-size: 17px;
    --landing-small-size: 15px;
    font-size: var(--landing-body-size);
    font-weight: 400;
    line-height: 1.55;
}

body.landing-marketing :is(.custom-title-1, .custom-title-3, .custom-title-4, .custom-title-5),
body.landing-marketing div.news-item .page-module :is(h1, h2) {
    font-size: var(--landing-section-size);
    font-weight: 400;
    line-height: 1.15;
}

body.landing-marketing div.index-promo-container-content h1 {
    font-size: var(--landing-hero-size);
    font-weight: 400;
    line-height: 1.05;
}

body.landing-marketing div.index-promo-container-content h1 strong {
    font-weight: inherit;
}

body.landing-marketing h3,
body.landing-marketing div.packages-list h2,
body.landing-marketing div.mok-features-list .custom-title-1,
body.landing-marketing div.news-list .cont a.title,
body.landing-marketing div.news-item .page-module :is(h3, h4),
body.landing-marketing div.features-list-item a {
    font-size: var(--landing-card-size);
    font-weight: 600;
    line-height: 1.25;
}

/* The existing about-card heading size uses !important. */
body.landing-marketing div.about-tips-item h2 {
    font-size: var(--landing-card-size) !important;
    font-weight: 600;
    line-height: 1.25;
}

body.landing-marketing .page-module,
body.landing-marketing div.packages-list > div {
    font-size: var(--landing-body-size);
    font-weight: 400;
    line-height: 1.55;
}

body.landing-marketing .page-module:is(.f_20, .f_21),
body.landing-marketing div.index-promo-container-content .cont > p {
    font-size: var(--landing-lead-size);
    font-weight: 400;
    line-height: 1.5;
}

body.landing-marketing :is(.page-module, .packages-list, .section.grey-bg) ul:not([class]) {
    font-size: var(--landing-bullet-size);
    font-weight: 400;
    line-height: 1.5;
}

body.landing-marketing #header ul.main-menu > li > a,
body.landing-marketing .mob_nav_menus ul.main-menu > li > a {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.2;
}

body.landing-marketing .ext_button.blue-style,
body.landing-marketing div.index-promo-container-content .ext_button.blue-style {
    font-size: 17px;
    font-weight: 600;
    line-height: 1;
}

/* Match the homepage View pricing CTA footprint, including longer labels. */
body.landing-marketing .ext_button.f_15.blue-style.rounded {
    box-sizing: border-box;
    width: 232.5px;
    max-width: 100%;
    min-width: 0;
    padding: 0 24px;
    justify-content: center;
}

body.landing-marketing #header .industries-dropdown > .ext_button.blue-style {
    height: 52px;
    width: auto;
    padding: 0 24px;
    font-size: 15px;
}

body.landing-marketing :is(p.uppercase, .packages-list small) {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}

body.landing-marketing .custom-title-2,
body.landing-marketing div.news-list .cont .date,
body.landing-marketing small:not(.packages-list small) {
    font-size: var(--landing-small-size);
    font-weight: 600;
    line-height: 1.5;
}

body.landing-marketing div.prices-container table tbody tr:not(.priceline) td {
    font-size: var(--landing-body-size);
    font-weight: 400;
    line-height: 1.55;
}

/* A note beside a feature's name: StartVivo's fee on online payments (VIVO-136);
   on a phone the row's name is the stacked table's heading (th.st-head-row). */
body.landing-marketing div.prices-container table tbody td .feature-note,
body.landing-marketing div.prices-container table th.st-head-row .feature-note {
    margin-left: 6px;
    font-size: 13px;
    font-weight: 400;
    color: #8a8a8a;
    white-space: nowrap;
}

/* A feature a plan announces before it is built (VIVO-98). */
body.landing-marketing div.prices-container table tbody td .soon {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
}

body.landing-marketing div.prices-container table thead td {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.2;
}

body.landing-marketing div.prices-container table thead td.selected:before {
    font-size: var(--landing-small-size);
    font-weight: 600;
}

@media (max-width: 767px) {
    body.landing-marketing .ext_button.f_15.blue-style.rounded {
        padding: 0 15px;
    }

    body.landing-marketing {
        --landing-hero-size: 44px;
        --landing-section-size: 32px;
        --landing-card-size: 21px;
        --landing-lead-size: 21px;
        --landing-body-size: 16px;
        --landing-bullet-size: 16px;
        --landing-small-size: 14px;
    }

    /* The legacy mobile feature-copy rule also uses !important. */
    body.landing-marketing div.mok-features-list .f_18 {
        font-size: var(--landing-body-size) !important;
    }
}
