@scope(.hero-background-image) to ([class*=loam-]){@layer loamui.components{:scope{background:var(--loam-color-bg);border-radius:var(--loam-radius-xl);color:var(--loam-color-fg);isolation:isolate;position:relative;container-type:inline-size}:scope:before{background:color-mix(in oklch, var(--loam-color-bg) 88%, transparent);border-radius:inherit;content:"";z-index:-1;position:absolute;inset:0}img{border-radius:inherit;object-fit:cover;z-index:-2;block-size:100%;inline-size:100%;position:absolute;inset:0}.copy{font-size:var(--loam-text-md);align-content:end;gap:var(--loam-space-s);overflow-wrap:anywhere;min-block-size:clamp(28rem,20rem + 20cqi,34rem);padding:clamp(var(--loam-space-s), var(--loam-space-xs) + 3cqi, var(--loam-space-l) * 1.5);grid-template-columns:minmax(0,1fr);display:grid}h1,p{margin-block:0}h1{max-inline-size:20ch}p.lede{font-size:var(--loam-text-lg);max-inline-size:var(--loam-measure)}div.actions{align-items:center;gap:var(--loam-space-xs);flex-wrap:wrap;display:flex}div.actions>a{align-items:center;gap:var(--loam-space-3xs);display:inline-flex}div.actions>a svg{flex:none;block-size:1em;inline-size:1em}@media (forced-colors:active){:scope{border:1px solid canvastext}img,:scope:before{display:none}}}}