/* GW New Arrivals — Figma 8:50 (desktop 1440) / 20:64 (mobile 390).
   Mobile-first: base = mobile 390 exact (2x2 wrapped grid, square images),
   >=768 fluid tablet (still 2-up), >=1025 desktop 1440 exact (4-up row,
   304 x 312 near-square images). Colours are design literals; the optional
   section background, text, star and image-placeholder colours arrive as
   --gw-na-* from the scoped <style>.
   Line-heights are the Figma box heights in px (heading 52 mobile / 63
   desktop, title and price 21), matching sections/gw-category-tiles.liquid
   rather than the `normal` the Figma exporter emits.
   Card width is FLUID, not Figma's fixed 170: two 170s plus a 16 gap is 356
   inside a 358 container, and a pinned Figma px collapses at 375 (recorded
   on the gw-benefit-bar row). calc((100% - 16px) / 2) = 171 at 390.
   The image box carries aspect-ratio at BOTH breakpoints, which is what
   gives it real area before load and makes loading="lazy" safe here
   (the zero-area lazy bug recorded on gw-brand-story).
   .gw-new-arrivals__card needs margin:0 — the theme's li rule adds 4.5px
   of margin-bottom that is invisible in the item's own bounding box. */
.gw-new-arrivals{padding:64px 16px;background-color:var(--gw-na-bg,transparent)}
.gw-new-arrivals__wrap{display:flex;flex-direction:column;align-items:center;width:100%;max-width:1312px;margin-inline:auto}
.gw-new-arrivals__head{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;align-self:stretch;box-sizing:border-box;padding-bottom:28px;text-align:center;word-break:break-word}
.gw-new-arrivals__sparkle{display:flex;flex:0 0 auto;align-items:center;justify-content:center;width:49px;height:49px;color:var(--gw-na-star,#c8a96a)}
.gw-new-arrivals__sparkle svg{display:block;width:32.4063px;height:32.4063px}
.gw-new-arrivals__heading{margin:0;font-size:40px;font-weight:400;line-height:52px;letter-spacing:0;color:var(--gw-na-text,#242424)}
.gw-new-arrivals__grid{display:flex;flex-wrap:wrap;align-items:flex-start;align-content:flex-start;justify-content:flex-start;gap:16px;width:100%;margin:0;padding:0;list-style:none}
.gw-new-arrivals__card{box-sizing:border-box;width:calc((100% - 16px) / 2);min-width:0;margin:0}
.gw-new-arrivals__link{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%;color:inherit;text-decoration:none}
.gw-new-arrivals__media-box{width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:0;background-color:var(--gw-na-image-bg,#e7e7e7)}
.gw-new-arrivals__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.gw-new-arrivals__info{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;min-width:0}
.gw-new-arrivals__price-row{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:8px;width:100%;min-width:0}
.gw-new-arrivals__title{min-width:0;overflow:hidden;font-size:16px;font-weight:400;line-height:21px;letter-spacing:0;color:var(--gw-na-text,#242424);text-overflow:ellipsis;white-space:nowrap}
.gw-new-arrivals__price{flex:0 0 auto;font-size:16px;font-weight:400;line-height:21px;letter-spacing:0;color:var(--gw-na-text,#242424);white-space:nowrap}
.gw-new-arrivals__stars{display:flex;flex-direction:row;align-items:center;gap:1.7037px;height:17.037px}
.gw-new-arrivals__stars svg{display:block;flex:0 0 auto}
.gw-new-arrivals__placeholder{box-sizing:border-box;width:100%;padding:24px;font-size:14px;line-height:21px;text-align:center;color:#6a5632;background-color:#fdfaf4;outline:1px dashed #a88e57;outline-offset:-1px}
@media screen and (min-width:768px){
.gw-new-arrivals{padding:80px clamp(24px,5vw,64px)}
.gw-new-arrivals__heading{font-size:clamp(40px,3.6vw,48px);line-height:1.3125}
}
@media screen and (min-width:1025px){
.gw-new-arrivals{padding:96px 64px}
.gw-new-arrivals__heading{font-size:48px;line-height:63px}
.gw-new-arrivals__grid{gap:32px}
.gw-new-arrivals__card{width:calc((100% - 96px) / 4)}
.gw-new-arrivals__link{gap:16px}
.gw-new-arrivals__media-box{aspect-ratio:304 / 312}
}
/* Non-recurring hover fade — no @keyframes, and dropped entirely under
   prefers-reduced-motion, per the gw convention. */
@media (prefers-reduced-motion:no-preference){
.gw-new-arrivals__img{transition:opacity .2s ease}
.gw-new-arrivals__link:hover .gw-new-arrivals__img{opacity:.88}
}
