/**
 * NTTT homepage layout fixes.
 * Scoped to the front page to avoid changing archive/single layouts.
 */

/* -------------------------------------------------------------------------
 * #1 Product grid: reserve the same vertical price area whether or not the
 * Tiered Pricing "you save" line is present.
 * ---------------------------------------------------------------------- */
body.home .featured-product-grid .products-grid .product-data .price,
body.home .featured-product-grid .products-grid .product-data span.price {
    display: block;
    width: 100%;
    min-height: 48px;
    box-sizing: border-box;
    line-height: 1.25;
}

body.home .featured-product-grid .products-grid .product-data .price .tiered-pricing-you-save {
    display: block;
    min-height: 18px;
    margin-top: 2px;
    line-height: 18px;
}

/* Keep the reserved price area even when the compatibility script hides the
 * saving line because no real saving is available. */
body.home .featured-product-grid .products-grid .product-data .price .tiered-pricing-you-save--hidden {
    display: none !important;
}

/* -------------------------------------------------------------------------
 * #2 Post grid: one line for title, two lines for excerpt. Fixed line boxes
 * keep all four homepage cards aligned. Browsers render an ellipsis whenever
 * the visible text exceeds the allowed line count.
 * ---------------------------------------------------------------------- */
body.home .featured-blog-post .featured-blog-post-title {
    height: 1.4em;
    min-height: 1.4em;
    line-height: 1.4;
    overflow: hidden;
}

body.home .featured-blog-post .featured-blog-post-title > a {
    display: block;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

body.home .featured-blog-post .post-excerpt {
    display: -webkit-box;
    float: left;
    width: 100%;
    height: 3em;
    min-height: 3em;
    max-height: 3em;
    overflow: hidden;
    box-sizing: border-box;
    line-height: 1.5;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

/* -------------------------------------------------------------------------
 * #3 Static homepage CTA: mobile + tablet use the full available width while
 * retaining exactly 5px space at the left and right edges.
 * Desktop (>=1100px) keeps the existing auto-width CTA.
 * ---------------------------------------------------------------------- */
@media (max-width: 1099px) {
    body.home .nttt-static-home__button {
        width: calc(100% - 10px);
        max-width: calc(100% - 10px);
        margin-left: 5px;
        margin-right: 5px;
        box-sizing: border-box;
    }
}