/* Teaser und Cards: eigenständiger Block; gemeinsame atomic-Styles bleiben die Designbasis. */
.block.usteasercards{overflow:visible;--teasercards-sticky-top:calc(var(--us-header-height,0px) + var(--us-gap,32px));--teasercards-parallax-distance:64px;}
.block.usteasercards.border-top::before{display:none;}
.block.usteasercards > .block-content{display:block!important;margin:0 auto;container:teasercards / inline-size;overflow:visible;}
.block.usteasercards.alignwide[class*="bg-"] > .block-content{box-shadow:inset 0 1px 0 rgba(255,255,255,.1),var(--us-box-shadow);border-radius:var(--us-radius);padding:var(--us-block-gap,32px);}
.block.usteasercards > .block-content .blog-grid{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:var(--us-block-gap,32px);}
.block.usteasercards > .block-content .blog-grid > .container-teaser{--teasercards-viewport:0;display:block;position:static;top:var(--teasercards-sticky-top);align-self:start;min-width:0;width:100%;height:auto;margin:0;padding:0!important;order:0!important;}
.block.usteasercards > .block-content .blog-grid > .container-teaser > .teaser{align-self:center;width:100%;max-width:none;}
.block.usteasercards > .block-content .blog-grid > .container-teaser > .teaser > hgroup > .h2{font-size:22px;}
.block.usteasercards > .block-content .teasercards-cards{min-width:0;container:teasercards-cards / inline-size;}
.block.usteasercards > .block-content .teasercards-grid{--teasercards-columns:1;--teasercards-offset:0px;--teasercards-space:0px;display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:var(--us-gap,24px);padding-top:var(--teasercards-space);padding-bottom:calc(var(--teasercards-offset) + var(--teasercards-space));}
.block.usteasercards > .block-content .teasercards-grid > .card-item{display:flex;flex-direction:column;min-width:0;translate:0 calc(0px - var(--teasercards-shift,0px));}
.block.usteasercards > .block-content .teasercards-grid > .card-item:nth-child(even){translate:0 calc(var(--teasercards-offset) + var(--teasercards-shift,0px));}
.block.usteasercards > .block-content .teasercards-grid > .card-item > .card{flex:1 1 auto;margin:0;min-width:0;width:100%;scroll-margin-top:var(--teasercards-sticky-top);}
/* Card-Bildecken auch bei älteren gespeicherten Block-Klassen erhalten. */
.block.usteasercards > .block-content .teasercards-grid .card .card-image.top img{border-radius:var(--us-radius) var(--us-radius) 0 0;}

@media screen and (max-width:800px){
    .block.usteasercards > .block-content .blog-grid > .container-teaser .btn-holder > *{max-width:calc(50% - 8px);}
    .block.usteasercards > .block-content .blog-grid > .container-teaser .themebtn span{overflow:hidden;height:18px;line-height:18px;}
}

/* Ein Link pro Card; Fokusdarstellung und Hoverline wie beim Teaser-Slider. */
.block.usteasercards .teasercards-grid a.card{position:relative;}
.block.usteasercards .teasercards-grid .card-item:has(> a.card:hover),.block.usteasercards .teasercards-grid .card-item:has(> a.card:focus-visible){z-index:1;}
.block.usteasercards .teasercards-grid a.card:focus-visible{outline:none!important;}
.block.usteasercards .teasercards-grid a.card:focus-visible > *{position:relative;z-index:1;}
.block.usteasercards .teasercards-grid a.card:focus-visible::before{position:absolute;inset:-8px;display:block;content:'';z-index:0;pointer-events:none;border-radius:calc(var(--us-radius) + 4px);box-shadow:inset 0 0 0 2px var(--us-primary-color),inset 0 0 var(--us-gap,16px) var(--us-bg-surface,var(--us-surface-color,#FFFFFF));background:var(--us-bg-surface,var(--us-surface-color,#FFFFFF));}
.block.usteasercards .teasercards-grid .themebtn.textlink.hoverline > span{position:relative;overflow:visible;}
.block.usteasercards .teasercards-grid .themebtn.textlink.hoverline > span::after{position:absolute;bottom:-2px;left:0;width:0;height:1px;background:var(--us-secondary-color);opacity:.33;content:'';transition:var(--us-transition);}
.block.usteasercards .teasercards-grid a.card:focus-visible .themebtn.textlink.hoverline > span::after{width:100%;}
.block.usteasercards .teasercards-grid a.card:focus-visible .themebtn i{transform:translateX(3px);}
@media screen and (min-width:1280px){
    .block.usteasercards .teasercards-grid a.card:focus-visible::before{inset:-16px;}
}
@media (hover:hover) and (pointer:fine){
    .block.usteasercards .teasercards-grid a.card:hover .themebtn.textlink.hoverline > span::after{width:100%;}
    .block.usteasercards .teasercards-grid a.card:hover .themebtn i{transform:translateX(3px);}
}
/* Die vorhandenen hoverzoom-Regeln gelten nur für Geräte mit präzisem Hover. */
@media (hover:none),(pointer:coarse){
    .block.usteasercards .teasercards-grid a.card.hoverzoom,.block.usteasercards .teasercards-grid a.card .card-image.hoverzoom img{transform:none!important;}
}

@container teasercards (min-width:900px){
    .block.usteasercards > .block-content .blog-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
    .block.usteasercards > .block-content .blog-grid > .container-teaser{position:sticky;grid-column:2;grid-row:1;}
    .block.usteasercards > .block-content .teasercards-cards{grid-column:1;grid-row:1;}
    .block.usteasercards.reverse > .block-content .blog-grid > .container-teaser{grid-column:1;}
    .block.usteasercards.reverse > .block-content .teasercards-cards{grid-column:2;}
    .block.usteasercards.ratio-2-1 > .block-content .blog-grid,.block.usteasercards.reverse.ratio-1-2 > .block-content .blog-grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr);}
    .block.usteasercards.ratio-1-2 > .block-content .blog-grid,.block.usteasercards.reverse.ratio-2-1 > .block-content .blog-grid{grid-template-columns:minmax(0,1fr) minmax(0,2fr);}
    .block.usteasercards.ratio-3-2 > .block-content .blog-grid{grid-template-columns:minmax(0,3fr) minmax(0,2fr);}
    .block.usteasercards.reverse.ratio-3-2 > .block-content .blog-grid{grid-template-columns:minmax(0,2fr) minmax(0,3fr);}
    /* Die volle Höhe beginnt direkt unter dem Header; der Abstand liegt innen. */
    .block.usteasercards.teaser-viewport > .block-content .blog-grid:has(.card-item) > .container-teaser{--teasercards-viewport:1;display:flex;flex-direction:column;justify-content:center;top:var(--us-header-height,0px);min-height:calc(100vh - var(--us-header-height,0px));min-height:calc(100dvh - var(--us-header-height,0px));box-sizing:border-box;padding:var(--us-block-gap,32px) 0!important;}
    .block.usteasercards.teaser-viewport > .block-content .blog-grid:has(.card-item) > .container-teaser.align-bottom{justify-content:flex-end;}
    .block.usteasercards.teaser-viewport > .block-content .blog-grid:has(.card-item) > .container-teaser > .teaser{flex:0 0 auto;}
}

/* 2 x 16rem Mindestbreite plus Abstand; niemals mehr als zwei Card-Spalten. */
@container teasercards-cards (min-width:34rem){
    .block.usteasercards > .block-content .teasercards-grid:has(> .card-item:nth-child(2)){--teasercards-columns:2;--teasercards-offset:var(--teasercards-stagger,var(--us-block-gap,32px));grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* Platz für die Bewegung bleibt im normalen Dokumentfluss reserviert. */
@media screen and (min-width:1280px) and (prefers-reduced-motion:no-preference){
    .block.usteasercards > .block-content .teasercards-grid[data-parallax-active="1"]{--teasercards-space:var(--teasercards-parallax-distance);}
    .block.usteasercards > .block-content .teasercards-grid[data-parallax-active="1"] > .card-item{will-change:translate;}
}

/* Editor und zu hohe Teaser bleiben vollständig im normalen Lesefluss. */
.block.usteasercards > .block-content .blog-grid[data-teasercards-editor="1"] > .container-teaser,.block.usteasercards > .block-content .blog-grid[data-sticky-disabled="1"] > .container-teaser{position:static;}
.block.usteasercards > .block-content .blog-grid[data-teasercards-has-teaser="0"],.block.usteasercards > .block-content .blog-grid:not(:has(.card-item)){grid-template-columns:minmax(0,1fr);}
.block.usteasercards > .block-content .blog-grid[data-teasercards-has-teaser="0"] > .teasercards-cards,.block.usteasercards > .block-content .blog-grid:not(:has(.card-item)) > .container-teaser,.block.usteasercards > .block-content .blog-grid:not(:has(.card-item)) > .teasercards-cards{grid-column:1;grid-row:auto;}

/* Eingangsanimation über atomic; Parallax liegt weiterhin auf dem äußeren card-item. */
.block.usteasercards .blog-grid > .container-teaser > .teaser.step-1:focus-within,.block.usteasercards .teasercards-grid a.card[class*="step-"]:focus-visible{opacity:1!important;transform:none!important;transition:none!important;}
@media screen and (min-width:1280px) and (hover:hover) and (pointer:fine){
    .block.usteasercards:is(.has-animation,.has-animation-repeat).animated .teasercards-grid a.card.hoverzoom:hover{transform:scale(1.05);transition-delay:0s;}
}

@media (prefers-reduced-motion:reduce){
    .block.usteasercards .blog-grid > .container-teaser > .teaser.step-1,.block.usteasercards .teasercards-grid .card[class*="step-"]{opacity:1!important;transform:none!important;transition:none!important;will-change:auto;}
    .block.usteasercards > .block-content .teasercards-grid > .card-item{translate:none;will-change:auto;}
    .block.usteasercards > .block-content .teasercards-grid > .card-item:nth-child(even){translate:0 var(--teasercards-offset);}
    .block.usteasercards .teasercards-grid .card,.block.usteasercards .teasercards-grid .card-image img,.block.usteasercards .teasercards-grid .themebtn i,.block.usteasercards .teasercards-grid .themebtn.textlink.hoverline > span::after{transition:none!important;}
    .block.usteasercards .teasercards-grid a.card.hoverzoom,.block.usteasercards .teasercards-grid a.card .card-image.hoverzoom img,.block.usteasercards .teasercards-grid a.card .themebtn i{transform:none!important;}
}