.coverit-intro:has(> .coverit-hero--product:first-of-type) {
    grid-template-columns: 48% 52%;
    grid-template-rows: minmax(40px, 1fr) auto auto minmax(40px, 1fr);
    max-width: none;
    padding: 0 max(0px, calc((100vw - var(--coverit-shell)) / 2)) 0 calc(var(--coverit-gutter) + max(0px, (100vw - var(--coverit-shell)) / 2));
}
.coverit-intro:has(> .coverit-hero--product:first-of-type) > .coverit-page-heading {
    grid-column: 1;
    grid-row: 2;
    padding: 0 var(--coverit-gutter) 0 0;
}
.coverit-intro:has(> .coverit-hero--product:first-of-type) .coverit-page-heading h1 { margin-block: 12px; }
.coverit-intro:has(> .coverit-hero--product:first-of-type) .coverit-page-heading .eyebrow { font-size: var(--coverit-body); }
.coverit-intro > .coverit-hero--product:first-of-type > .coverit-hero__text { grid-row: 3; padding: 0 var(--coverit-gutter) 0 0; }
.coverit-intro > .coverit-hero--product:first-of-type > .coverit-hero__image { grid-row: 1 / 5; align-self: stretch; display: flex; flex-direction: column; min-height: 100%; margin: 0; }
.coverit-intro > .coverit-hero--product:first-of-type > .coverit-hero__image img { flex: 1 1 auto; width: 100%; height: 100%; min-height: 480px; object-fit: cover; }
.coverit-hero--product .eyebrow { margin-bottom: 12px; color: var(--coverit-text); font-size: var(--coverit-body); }
.coverit-hero--product h2 { margin-bottom: 12px; font-size: var(--coverit-claim); line-height: 1.1; }
.coverit-hero--product .coverit-hero__body { font-size: clamp(16px, 1.198vw, 23px); font-weight: 300; }
.coverit-hero--product .coverit-hero__body p { margin-bottom: 0; color: var(--coverit-text); }
.coverit-hero--product .coverit-hero__body p + p { margin-top: 16px; }
.coverit-hero--product .coverit-button { margin: 0; min-width: calc((100% - 16px) / 2); line-height: 1.25; }
.coverit-hero--product .coverit-hero__image { position: relative; }
.coverit-hero--product .coverit-hero__image figcaption { position: absolute; left: 0; bottom: 0; z-index: 1; max-width: 100%; margin: 0; padding: 6px 12px; background: color-mix(in srgb, var(--coverit-background) 72%, transparent); color: var(--coverit-text); font-size: 13px; line-height: 1.5; }
@media (max-width: 767px) {
    .coverit-intro:has(> .coverit-hero--product:first-of-type) { grid-template-columns: 1fr; grid-template-rows: 32px auto auto 32px auto; padding: 0; }
    .coverit-intro:has(> .coverit-hero--product:first-of-type) > .coverit-page-heading,
    .coverit-intro > .coverit-hero--product:first-of-type > .coverit-hero__text { padding-inline: var(--coverit-gutter); }
    .coverit-intro:has(> .coverit-hero--product:first-of-type) .coverit-page-heading h1 { font-size: 64px; }
    .coverit-intro > .coverit-hero--product:first-of-type > .coverit-hero__image { grid-row: 5; margin: 0; }
    .coverit-intro > .coverit-hero--product:first-of-type > .coverit-hero__image img,
    .coverit-hero--product .coverit-hero__image img { aspect-ratio: 39 / 32; object-fit: cover; min-height: 0; height: auto; }
    .coverit-hero--product .coverit-hero__image figcaption { padding: 4px var(--coverit-gutter); font-size: 12px; }
    .coverit-hero--product .coverit-button { width: 100%; padding: 16px 12px; font-size: 14px; }
}

.coverit-product-intro-actions { display:flex; flex-wrap:wrap; gap:16px; margin-top:16px; }
.coverit-product-intro-actions .coverit-button { flex:1 1 16rem; min-width:0; gap:16px; }
.coverit-product-intro-actions .coverit-button svg { flex:none; }
.coverit-product-intro-actions .coverit-button--outline { background:transparent; color:var(--coverit-text); border-color:var(--coverit-border); }
.coverit-product-intro-actions .coverit-button--outline:hover { border-color:var(--coverit-accent); }
.coverit-product-shop-note { margin:12px 0 0; font-size:13px; }
@media(max-width:767px) {
    .coverit-product-intro-actions { flex-direction:column; }
    .coverit-product-intro-actions .coverit-button { flex-basis:auto; }
}

.coverit-intro--system:has(> .coverit-hero--product:first-of-type) .coverit-page-heading h1 { font-size: clamp(32px, 3vw, 56px); line-height: 1.1; hyphens: manual; text-wrap: balance; }
@media (max-width: 1100px) { .coverit-intro--system:has(> .coverit-hero--product:first-of-type) .coverit-page-heading h1 { hyphens: auto; } }
.coverit-intro--system .coverit-hero__body .coverit-button { display: flex; width: 100%; margin-top: 16px; }