/*! ==========================================================================
    Blog
    Cards keep every image inside a fixed-ratio frame (object-fit: cover), so
    the size or shape of an uploaded image never changes the height of a card,
    a row or a section. Frame ratio comes from the section "Image frame"
    setting; the artwork is anchored to the left edge (--article-card-focus)
    because Resin Rock blog artwork carries its headline on the left.
   ========================================================================== *//*! blog-filter */.blog-filter{text-align:center}.blog-filter .select{width:calc(var(--width) + var(--input-padding-inline) + var(--input-padding-inline) + var(--input-padding-inline))}/*! ==========================================================================
    Section header
   ========================================================================== */.blog-section .title-wrapper{margin-block-end:clamp(var(--sp-8),3vw,var(--sp-14))}.blog-section .title-wrapper>.grid>p.heading{display:inline-flex;align-items:center;gap:var(--sp-3);font-size:var(--text-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--color-foreground) / .7)}.blog-section .title-wrapper>.grid>p.heading:before{content:"";display:inline-block;width:var(--sp-6);height:2px;border-radius:2px;background-color:rgb(var(--color-highlight))}.blog-section .title-wrapper.text-center>.grid>p.heading,.blog-section .title-wrapper.md\:items-center>.grid>p.heading{justify-content:center}.blog-section .title-wrapper .description{color:rgb(var(--color-foreground) / .7)}/*! ==========================================================================
    Blog grids
   ========================================================================== */.blog-grid{--card-grid-gap: var(--sp-6);align-items:stretch}@media screen and (min-width:640px){.blog-grid{--card-grid-per-row: 2;--card-grid-gap: clamp(var(--sp-5), 1.6vw, var(--sp-8))}}@media screen and (min-width:768px){.blog-grid.card-grid--3:not(.blog-collage),.blog-grid.card-grid--4:not(.blog-collage),.blog-grid.card-grid--5:not(.blog-collage){--card-grid-per-row: 3}}@media screen and (min-width:1024px){.blog-grid{--card-grid-per-row: 3}.blog-grid.card-grid--1{--card-grid-per-row: 1}.blog-grid.card-grid--2{--card-grid-per-row: 2}}@media screen and (min-width:1024px){.blog-grid.with-only2{--card-grid-per-row: 2}}@media screen and (min-width:1280px){.blog-grid.card-grid--4,.blog-grid.card-grid--5{--card-grid-per-row: 4}}@media screen and (max-width:1023px){.slider--tablet>.blog-grid{padding-block:var(--sp-2) var(--sp-10)}}@media screen and (min-width:1024px){.slider--desktop>.blog-grid{padding-block:var(--sp-2) var(--sp-10)}}.blog-grid.with-only1{grid-template-columns:minmax(0,46rem);justify-content:center}/*! featured story: first card spans the row, the rest fill a grid below */.blog-collage--featured .article-card--featured{grid-column:1 / -1}@media screen and (min-width:1024px){.blog-collage--featured.with-only3{--card-grid-per-row: 2}}/*! ==========================================================================
    Article card
   ========================================================================== */.article-card{--article-card-radius: var(--rounded-block, .75rem);--article-card-pad: clamp(var(--sp-5), 1.6vw, var(--sp-7));--article-card-focus: left center;--article-card-surface: rgb(var(--color-background));--article-card-ring: 0 0 0 1px rgb(var(--color-foreground) / .08);--article-card-shadow: 0 1px 2px rgb(var(--color-foreground) / .04), 0 12px 32px -20px rgb(var(--color-foreground) / .22);--article-card-shadow-hover: 0 2px 4px rgb(var(--color-foreground) / .05), 0 32px 56px -28px rgb(var(--color-foreground) / .38);min-width:0}.blog-grid .article-card{height:100%}.article-card__inner{height:100%;overflow:hidden;background-color:var(--article-card-surface);border-radius:var(--article-card-radius);box-shadow:var(--article-card-shadow),var(--article-card-ring);transition:transform var(--animation-primary),box-shadow var(--animation-primary)}/*! media frame */.article-card__media{flex:0 0 auto;min-width:0}.article-card__frame{display:block;position:relative;width:100%;overflow:hidden;aspect-ratio:var(--article-card-ratio, 16 / 9);background-color:rgb(var(--color-placeholder))}.article-card__frame--wide{--article-card-ratio: 16 / 9}.article-card__frame--social{--article-card-ratio: 1.91 / 1}.article-card__frame--landscape{--article-card-ratio: 4 / 3}.article-card__frame--square{--article-card-ratio: 1 / 1}.article-card__frame--portrait{--article-card-ratio: 4 / 5}.article-card__frame>.article-card__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--article-card-focus)}.article-card__frame>.article-card__image--placeholder{padding:18%;fill:rgb(var(--color-foreground) / .12);object-fit:contain}.article-card__media .badges{z-index:2;position:absolute}.article-card__media .badge{padding:var(--sp-2) var(--sp-3d5);font-size:var(--text-2xs);line-height:1;color:rgb(var(--color-foreground));background-color:rgb(var(--color-background) / .92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.article-card__media .badge--custom{color:var(--badge-foreground);background-color:var(--badge-background)}/*! content */.article-card__content{flex:1 1 auto;min-width:0;gap:var(--sp-3);padding:var(--article-card-pad)}.article-card__eyebrow{display:inline-flex;align-items:center;gap:var(--sp-2d5);margin:0;font-size:var(--text-2xs);font-weight:600;line-height:1;letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--color-foreground) / .7)}.article-card__eyebrow:before{content:"";width:var(--sp-5);height:2px;border-radius:2px;background-color:rgb(var(--color-highlight))}.article-card__meta{gap:var(--sp-1d5) var(--sp-3);margin:0;padding:0;list-style:none;font-size:var(--text-xs);line-height:1.25;color:rgb(var(--color-foreground) / .65)}.article-card__meta-item{display:inline-flex;align-items:center;gap:var(--sp-1d5);min-width:0}.article-card__meta-item+.article-card__meta-item:before{content:"";flex:0 0 auto;width:3px;height:3px;border-radius:50%;background-color:currentColor;opacity:.6;margin-inline-end:var(--sp-1d5)}.article-card__meta .icon{flex:0 0 auto;width:.875rem;height:.875rem}.article-card__meta a{color:inherit;text-decoration:underline;text-decoration-color:rgb(var(--color-foreground) / .35);text-underline-offset:.2em;transition:color var(--animation-primary),text-decoration-color var(--animation-primary)}.article-card__meta a:hover{text-decoration-color:currentColor}.article-card__meta a:hover{color:rgb(var(--color-foreground))}.article-card__heading{margin:0;font-size:clamp(var(--text-lg),.9rem + .5vw,var(--text-xl));line-height:1.3;letter-spacing:-.015em;text-transform:none}.article-card__heading-link{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:inherit;text-decoration:none;transition:opacity var(--animation-primary)}.article-card__excerpt{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;margin:0;font-size:var(--text-sm);line-height:1.6;color:rgb(var(--color-foreground) / .68)}.article-card__cta{margin:auto 0 0;padding-block-start:var(--sp-3)}.article-card__more{gap:var(--sp-2d5);font-size:var(--text-sm);font-weight:600;line-height:1;color:rgb(var(--color-foreground));text-decoration:none}.article-card__more-icon{flex:0 0 auto;width:1.75rem;height:1.75rem;border-radius:50%;box-shadow:inset 0 0 0 1px rgb(var(--color-foreground) / .18);transition:background-color var(--animation-primary),color var(--animation-primary),box-shadow var(--animation-primary)}.article-card__more-icon .icon{width:.875rem;height:.875rem;transition:transform var(--animation-primary)}/*! hover (pointer devices only) */@media screen and (pointer:fine){.article-card__frame>.article-card__image{--tw-scale-x: 1;--tw-scale-y: 1;transform:scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform-origin:var(--article-card-focus);transition:transform var(--animation-primary),opacity var(--animation-primary)}.article-card:hover .article-card__inner{transform:translateY(-6px);box-shadow:var(--article-card-shadow-hover),var(--article-card-ring)}.article-card:hover .article-card__frame>.article-card__image{--tw-scale-x: 1.05;--tw-scale-y: 1.05}.article-card:hover .article-card__heading-link{opacity:.72}.article-card:hover .article-card__more-icon{color:rgb(var(--color-background));background-color:rgb(var(--color-foreground));box-shadow:inset 0 0 0 1px rgb(var(--color-foreground))}.article-card:hover .article-card__more-icon .icon{transform:translate(2px)}}@media(prefers-reduced-motion:reduce){.article-card__inner,.article-card__frame>.article-card__image,.article-card__more-icon,.article-card__more-icon .icon{transition:none}}/*! ==========================================================================
    Featured card (first story of a "Featured story + grid" layout)
   ========================================================================== */.article-card--featured .article-card__heading{font-size:clamp(var(--text-xl),1rem + 1.1vw,var(--text-3xl));line-height:1.2;letter-spacing:-.02em}.article-card--featured .article-card__heading-link{-webkit-line-clamp:3}.article-card--featured .article-card__excerpt{-webkit-line-clamp:4;font-size:var(--text-base)}@media screen and (min-width:1024px){.article-card--featured .article-card__inner{flex-direction:row;align-items:stretch}.article-card--featured .article-card__media{display:flex;flex-direction:column;flex:0 0 56%;width:56%}.article-card--featured .article-card__frame{flex:1 1 auto;min-height:0}.article-card--featured .article-card__content{justify-content:center;gap:var(--sp-4);padding:clamp(var(--sp-6),2.8vw,var(--sp-16))}.article-card--featured .article-card__heading-link{-webkit-line-clamp:3}.article-card--featured .article-card__excerpt{-webkit-line-clamp:3;font-size:var(--text-sm)}.article-card--featured .article-card__meta{font-size:var(--text-sm)}.article-card--featured .article-card__heading{font-size:var(--text-2xl);line-height:1.15;letter-spacing:-.02em}.article-card--featured .article-card__cta{margin-block-start:var(--sp-2)}}@media screen and (min-width:1280px){.article-card--featured .article-card__media{flex-basis:58%;width:58%}.article-card--featured .article-card__heading{font-size:clamp(var(--text-2xl),1.2rem + 1.4vw,var(--text-5xl));line-height:1.12;letter-spacing:-.025em}.article-card--featured .article-card__excerpt{-webkit-line-clamp:4;font-size:var(--text-base)}}@media screen and (min-width:1536px){.article-card--featured .article-card__media{flex-basis:60%;width:60%}}/*! ==========================================================================
    Legacy helpers still used by comments, search results and the
    previous / next post links inside the article sections.
   ========================================================================== */.article-card__title{font-family:var(--font-product-family);font-weight:var(--font-product-weight);text-transform:var(--font-product-text-transform)}.article-card__top{row-gap:var(--sp-2)}.article-card__top li{padding-inline-end:var(--sp-4)}.article-card__top li:after{content:"";position:absolute;inset-inline-end:0;width:1px;height:16px;background-color:currentColor;opacity:.3}.article-card__top li:last-child{padding-inline-end:0}.article-card__top li:last-child:after{content:none}.article-card__top .icon{width:var(--sp-4);height:var(--sp-4)}
/*# sourceMappingURL=/cdn/shop/t/22/assets/blog.css.map */