/* Keep ice-type explanations readable on desktop and preserve the mobile stack. */
@media (min-width: 1281px) {
    .guide-ice-types-page .guide-article-layout {
        grid-template-columns: minmax(210px, 240px) minmax(0, 1fr);
        gap: clamp(42px, 4vw, 60px);
        width: min(100% - 64px, 1400px);
    }

    .guide-ice-types-page .guide-article-body {
        font-size: 18px;
        line-height: 1.78;
    }

    .guide-ice-types-page .guide-ice-type-grid {
        grid-template-columns: minmax(0, 1.1fr) minmax(390px, .9fr);
        gap: clamp(34px, 3vw, 48px);
    }

    .guide-ice-types-page .guide-ice-type-section--reverse .guide-ice-type-grid {
        grid-template-columns: minmax(390px, .9fr) minmax(0, 1.1fr);
    }
}

@media (max-width: 1280px) {
    .guide-ice-types-page .guide-toc {
        display: none;
    }

    .guide-ice-types-page .guide-toc-mobile {
        display: block;
        width: min(100% - 48px, 1040px);
        margin-inline: auto;
    }

    .guide-ice-types-page .guide-article-layout {
        grid-template-columns: minmax(0, 1fr);
        justify-content: center;
        gap: 0;
        width: min(100% - 48px, 1040px);
    }

    .guide-ice-types-page .guide-ice-type-grid {
        grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
        gap: clamp(26px, 3vw, 42px);
    }

    .guide-ice-types-page .guide-ice-type-section--reverse .guide-ice-type-grid {
        grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
    }
}

.guide-ice-types-page .guide-ice-type-figure img {
    aspect-ratio: 4 / 3;
}

@media (max-width: 760px) {
    .guide-ice-types-page .guide-article-layout,
    .guide-ice-types-page .guide-toc-mobile {
        width: min(100% - 28px, 720px);
    }

    .guide-ice-types-page .guide-ice-type-grid,
    .guide-ice-types-page .guide-ice-type-section--reverse .guide-ice-type-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }
}
