@layer vendor, core, helpers, components, blocks;@layer components{.projects{--btn-bg:var(--color-primary);--btn-color:var(--color-on-primary);--btn-hover-bg:var(--color-primary-shade);--btn-hover-color:var(--color-on-primary-shade);--card-overlay-bg:var(--color-secondary);--card-overlay-color:var(--color-on-secondary)}.projects__grid{container:projects/inline-size}@media(width >= 991px){.projects__grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr)}.projects__grid>.project:nth-child(3n+1){grid-column:span 2;grid-row:span 2}.projects__grid>.project:nth-child(3n+1) .card__content{justify-content:flex-end;padding:2em}.projects__grid>.project:nth-child(3n+1):nth-child(2n){grid-column:2/span 2}.projects__grid>.project:only-child{grid-column:1/-1;grid-row:1/-1}}.projects .button{margin-block-start:calc(var(--spacing-y-start, var(--spacing-y))/2)}.projects .pagination{grid-column:1/-1}.project{container:project/inline-size}@container project (width <= 320px){.project .card__title{font-size:2.25ch}}@container project (width <= 360px){.project p{display:none}}@media(width >= 991px){.project:not(:nth-child(3n+1)) .card__title{font-size:3ch}}}