.demo-hero{background-color:var(--neutral-surface-main);border-radius:var(--radius-16);width:100%;position:relative;overflow:hidden}.demo-hero-media{position:absolute;inset:0}.demo-hero-media img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.demo-hero-media:before{content:"";background:linear-gradient(#0000 40%,#000c 100%);position:absolute;inset:0}.demo-hero-body{gap:var(--space-16);padding:var(--space-80);z-index:1;flex-direction:column;padding-top:480px;display:flex;position:relative}
.demo-content{gap:var(--space-24);background-color:var(--neutral-surface-main);border-radius:var(--radius-16);flex-direction:column;width:100%;padding:48px;display:flex}.demo-content-media img{-o-object-fit:cover;object-fit:cover;aspect-ratio:16/5;border-radius:var(--radius-8);width:100%;height:auto}.demo-content-body{gap:var(--space-16);flex-direction:column;display:flex}
.demo-callout{background-color:var(--neutral-surface-main);border-radius:var(--radius-16);flex-direction:column;width:100%;display:flex;position:relative;overflow:hidden}.demo-callout-media{position:absolute;inset:0}.demo-callout-media img{-o-object-fit:cover;object-fit:cover;border-radius:var(--radius-8);width:100%;height:100%}.demo-callout-media:after{content:"";border-radius:var(--radius-8);background:linear-gradient(#0006 0%,#0009 100%);position:absolute;inset:0}.demo-callout-body{justify-content:flex-end;gap:var(--space-16);z-index:1;flex-direction:column;width:100%;padding:48px;display:flex;position:relative}.demo-callout--wide .demo-callout-body{padding:128px}
.demo-grid-items{gap:var(--space-24);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.demo-grid-card{gap:var(--space-12);background-color:var(--neutral-surface-main);padding:var(--space-8);border-radius:var(--radius-16);color:inherit;flex-direction:column;text-decoration:none;display:flex}.demo-grid-card-title{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.demo-grid-card-summary{white-space:pre-line;-webkit-line-clamp:4;line-clamp:4;color:var(--neutral-content-support);-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.demo-grid-card-media{border-radius:var(--radius-8);width:100%;position:relative;overflow:hidden}.demo-grid-card-media img{-o-object-fit:cover;object-fit:cover;aspect-ratio:1;width:100%;height:auto;transition:transform var(--speed-medium) var(--ease-custom)}.demo-grid-card-body{gap:var(--space-8);padding:0 var(--space-8);padding-bottom:var(--space-16);flex-direction:column;display:flex}.demo-grid-card:hover .demo-grid-card-media img{transform:scale(1.05)}