html, body { max-width: 100%; overflow-x: clip; }

/* Media and embeds never exceed their container. */
img, svg, video, canvas, iframe, embed, object, figure, picture {
    max-width:100%;
}
img, video, canvas { height: auto; }
pre, code, kbd, samp { overflow-x: auto; max-width: 100%; }

h1, h2, h3, h4, h5, h6,
[class*='lockup'], [class*='display'], [class*='headline'], [class*='title'],
[class*='hero'] h1, [class*='hero'] h2 {
    overflow-wrap:break-word;
    word-break:normal;
    hyphens:auto;
}
[class*='lockup'], [class*='lockup'] > * { white-space: normal !important; }

/* Long unbroken strings (URLs, emails, ids) wrap rather than overflow. */
p, li, dd, dt, blockquote, figcaption, address, a, span, td, th {
    overflow-wrap:break-word;
}

/* Grid and flex children may shrink below their content so a single wide
    child cannot force the whole track past the viewport. */
[class*='grid'] > *, [class*='row'] > *, [class*='flex'] > *,
[class*='cols'] > *, [class*='columns'] > * { min-width: 0; }

:not(img):not(picture):not(svg):not(video):not(canvas):only-child {
    grid-column:1 / -1;
}

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) {
    animation-duration:.28s;
}
@media (prefers-reduced-motion: reduce) {
    ::view-transition-group(*),
    ::view-transition-old(*),
    ::view-transition-new(*) { animation: none !important; }
}

.gefuf74 { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.gefuf74 > table { min-width: max-content; }
@media (max-width: 48rem) {
    .gefuf74 > table { font-size: .94em; }
}
    The cell widths go back with the display. A stacking rule sets
    `width: 100%` on the cells along with `display: block`, which is right
    for a block and ruinous for a cell: a table is as wide as its cells ask
    to be, so every cell asking for the whole table makes the table ask for
    the whole table again. Taking back only the display left a two-column
    table on a vet's site a million pixels wide, with the row headings on
    the phone and every value scrolled off the side of it. */
.gefuf74 > table,
.gefuf74 > table > thead, .gefuf74 > table > tbody,
.gefuf74 > table > tfoot, .gefuf74 > table tr,
.gefuf74 > table th, .gefuf74 > table td { display: revert; }
.gefuf74 > table th, .gefuf74 > table td {
    inline-size:auto;
    min-inline-size:0;
}

@media (max-width: 30rem) {
    :root {
        --fowo-967:clamp(2.2rem, 9vw, 3rem);
        --fowo-fc1:clamp(2rem, 8vw, 2.7rem);
        --fowo-4ea:clamp(1.8rem, 7vw, 2.4rem);

        --fowo-326:clamp(1.55rem, 6vw, 2.05rem);
        --fowo-1a5:clamp(1.35rem, 5vw, 1.8rem);
    }
}
@media (min-width: 30.01rem) and (max-width: 48rem) {
    :root {
        --fowo-967:clamp(2.8rem, 8vw, 4.6rem);
        --fowo-fc1:clamp(2.5rem, 7vw, 4rem);
        --fowo-4ea:clamp(2.2rem, 6vw, 3.4rem);
    }
}

@media (pointer: coarse) {
    a.btn, button, [role='button'], .btn,
    input[type='submit'], input[type='button'] { min-height: 44px; }
}


.consent-banner {
    max-height:20vh;
    overflow:auto;

    top:auto;
    bottom:0;
}
@media (max-width: 30rem) {

    .consent-banner { max-height: 38vh; }
}

/* 5.0 characters a line in 4 columns holding 4 item(s) */
div.hero-quick-specs { grid-template-columns: none !important; }