/* ==========================================================================
   SPROUT THEME — product page: gallery, buy box, care card, room check, set, reviews
   Loads after theme.css. Sections: product-main · product-care · product-pairs · product-reviews · product-related. v1
   ========================================================================== */

@keyframes pfade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ---------- main: gallery + buy box ---------- */
.pmain { padding-block: 1rem clamp(3rem, 6vw, 6rem); }
.pmain__in { display: grid; gap: 2rem; align-items: start; }
@media (min-width: 960px) { .pmain__in { grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); gap: clamp(2.5rem, 5vw, 5.5rem); } }

/* gallery: a scroll-snap row of arched windows, thumbs under it */
.gal { display: grid; gap: 1rem; --gw: 100%; }
@media (min-width: 600px) and (max-width: 959px) { .gal { --gw: min(100%, 32rem); } }
@media (min-width: 960px) { .gal { position: sticky; top: calc(var(--header-h) + 1.25rem); --gw: min(100%, calc((100vh - var(--header-h) - 11rem) * .8)); } }
.gal__stage { position: relative; width: var(--gw); margin-inline: auto; }
/* reserve the gallery's box before JS fills it, and keep the JS-filled blocks invisible until they are laid out, so nothing visible shifts */
.gal__thumbs { min-height: 5.3125rem; }
.js .pmain:not(.is-ready) :is(.crumbs ol, .buy) { visibility: hidden; }
.gal__track { aspect-ratio: 4 / 5; display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; border-radius: 999px 999px var(--r) var(--r); position: relative; }
.gal__track::-webkit-scrollbar { display: none; }
.gal__track:focus-visible { outline-offset: 6px; }
.gal__slide { flex: 0 0 100%; scroll-snap-align: center; aspect-ratio: 4 / 5; background: var(--sage-tint); position: relative; overflow: hidden; border-radius: inherit; }
.gal__slide img { width: 100%; height: 100%; object-fit: cover; }
.gal__slide svg.scale { width: 100%; height: 100%; }
.gal__badge { position: absolute; z-index: 2; left: 1.1rem; bottom: 1.1rem; display: inline-flex; align-items: center; min-height: 1.75rem; padding: 0 .85rem; border-radius: 999px; background: var(--cream); color: var(--forest); font: 600 .75rem/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; }
.gal__badge.is-new { background: var(--lime); }
.gal__badge.is-sale { background: var(--clay-d); color: #fff; }
.gal__badge.is-rare { background: var(--forest); color: var(--lime); }
.gal__arrow { position: absolute; z-index: 3; bottom: 1rem; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: rgba(251, 249, 242, .94); box-shadow: var(--sh-1); transition: transform .25s var(--ease), background-color .2s, opacity .2s; }
.gal__arrow:hover { background: #fff; transform: scale(1.06); }
.gal__arrow[disabled] { opacity: .35; pointer-events: none; }
.gal__arrow--prev { right: 4.1rem; }
.gal__arrow--next { right: 1rem; }
.gal__arrow--prev .i { transform: rotate(180deg); }
.gal__thumbs { display: flex; justify-content: center; gap: .6rem; width: var(--gw); margin-inline: auto; }
.gal__thumb { position: relative; flex: 0 0 auto; width: 4.25rem; aspect-ratio: 4 / 5; border-radius: 999px 999px 10px 10px; overflow: hidden; background: var(--sage-tint); opacity: .7; transition: opacity .25s, transform .3s var(--ease), box-shadow .25s; }
.gal__thumb img, .gal__thumb svg { width: 100%; height: 100%; object-fit: cover; }
.gal__thumb:hover { opacity: 1; transform: translateY(-2px); }
.gal__thumb[aria-current="true"] { opacity: 1; box-shadow: 0 0 0 2px var(--cream), 0 0 0 4px var(--forest); }
.gal__thumb:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

/* buy box */
.buy { display: grid; gap: 1.5rem; align-content: start; min-width: 0; }
.buy__top { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; font-size: .875rem; }
.buy__rate { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem 0; }
.buy__rate b { font-weight: 600; }
.buy__rate span { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); transition: text-decoration-color .2s; }
.buy__rate:hover span { text-decoration-color: currentColor; }
.chip-s { display: inline-flex; align-items: center; gap: .4rem; min-height: 1.75rem; padding: 0 .75rem; border-radius: 999px; background: var(--sage-tint); color: var(--moss); font: 600 .75rem/1 var(--sans); }
.chip-s .i { width: .9rem; height: .9rem; }
.buy__head { display: grid; gap: .55rem; }
.buy__latin { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.6rem); color: var(--text-3); line-height: 1.1; }
.buy__title { font: 400 clamp(3rem, 1.8rem + 4.4vw, 5.5rem)/.94 var(--display); letter-spacing: -.024em; text-wrap: balance; }
.buy__title em { font-style: italic; color: var(--moss); }
.buy__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1rem; }
.buy__price b { font: 400 clamp(2.25rem, 2rem + 1vw, 3rem)/1 var(--display); letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.buy__price s { color: var(--text-3); font-variant-numeric: tabular-nums; }
.buy__price .save { font-size: .8125rem; font-weight: 600; color: var(--clay-d); }
.buy__price small { color: var(--text-3); font-size: .875rem; }
.buy__blurb { font-size: var(--fs-lede); line-height: 1.55; color: var(--text-2); max-width: 46ch; text-wrap: pretty; }
.buy .care { gap: .4rem .5rem; }
.buy .care li { min-height: 2rem; font-size: .8125rem; }

.opt-g { border: 0; padding: 0; margin: 0; display: grid; gap: .75rem; min-width: 0; }
.opt-g legend { padding: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; width: 100%; font: 600 .75rem/1 var(--sans); letter-spacing: .13em; text-transform: uppercase; color: var(--ink-2); float: left; margin-bottom: .75rem; }
.opt-g legend + * { clear: both; }
.opt-g legend span { font: 500 .9375rem/1 var(--sans); letter-spacing: 0; text-transform: none; color: var(--text-2); }
.potpick { display: grid; grid-template-columns: repeat(auto-fit, minmax(5.5rem, 1fr)); gap: .5rem; }
.pot { position: relative; display: block; }
.pot input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.pot__box { display: grid; justify-items: center; gap: .45rem; padding: .85rem .4rem .75rem; border-radius: var(--r-sm); border: 1px solid var(--line-2); background: var(--paper); text-align: center; height: 100%; transition: border-color .2s, background-color .2s, transform .25s var(--ease), box-shadow .2s; }
.pot__dot { width: 2.1rem; height: 1.7rem; background: var(--c); clip-path: polygon(8% 0, 92% 0, 80% 100%, 20% 100%); border-radius: 3px; box-shadow: inset 0 3px 0 rgba(255, 255, 255, .18); }
.pot__n { font-weight: 600; font-size: .8125rem; line-height: 1.15; }
.pot__p { font-size: .75rem; color: var(--text-3); font-variant-numeric: tabular-nums; }
.pot:hover .pot__box { border-color: var(--text); transform: translateY(-1px); }
.pot input:checked + .pot__box { border-color: var(--forest); background: var(--sage-tint); box-shadow: inset 0 0 0 1px var(--forest); }
.pot input:focus-visible + .pot__box { outline: 3px solid var(--focus); outline-offset: 3px; }

.buy__cta { display: flex; flex-wrap: wrap; gap: .75rem; align-items: stretch; }
.buy__cta .qty { min-height: 3.25rem; padding-inline: .25rem; }
.buy__cta .qty button { width: 2.75rem; height: 2.75rem; }
.buy__cta .qty output { min-width: 2rem; font-size: 1rem; }
.buy__cta .btn--primary { flex: 1 1 14rem; }
.wishbtn { display: inline-grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; border: 1px solid var(--line-2); transition: background-color .2s, color .2s, border-color .2s, transform .25s var(--ease); }
.wishbtn:hover { border-color: var(--text); transform: scale(1.05); }
.wishbtn[aria-pressed="true"] { background: var(--clay-d); border-color: var(--clay-d); color: #fff; }
.wishbtn[aria-pressed="true"] .i { fill: currentColor; }
.buy__stock { display: flex; align-items: center; gap: .55rem; font-size: .875rem; color: var(--text-2); margin-top: -.5rem; }
.buy__stock i { width: .55rem; height: .55rem; border-radius: 50%; background: var(--fern); box-shadow: 0 0 0 3px rgba(79, 138, 75, .22); flex: none; }

/* delivery estimate */
.eta { display: grid; gap: .8rem; padding: 1.15rem 1.2rem; border-radius: var(--r); background: var(--sage-tint); }
.eta__t { display: flex; align-items: center; gap: .55rem; font-weight: 600; font-size: .9375rem; }
.eta__t .i { color: var(--moss); }
.eta__f { display: flex; gap: .5rem; }
.eta__f input { flex: 1; min-width: 0; height: 2.75rem; padding: 0 1.1rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--paper); }
.eta__f input:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.eta__out { font-size: .9375rem; line-height: 1.5; color: var(--text-2); min-height: 3rem; }
.eta__out b { display: block; font: 400 1.75rem/1.1 var(--display); color: var(--text); margin-bottom: .2rem; animation: pfade .45s var(--ease); }
.eta__out p { animation: pfade .45s var(--ease); }

.trust { list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; font-size: .9375rem; }
.trust li { display: grid; grid-template-columns: auto 1fr; gap: .15rem .8rem; align-items: start; }
.trust .i { width: 1.35rem; height: 1.35rem; color: var(--moss); margin-top: .1rem; grid-row: span 2; }
.trust b { font-weight: 600; }
.trust span { color: var(--text-2); font-size: .875rem; line-height: 1.4; }
.trust span a { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }


/* ---------- care card + room check ---------- */
.pcare { padding-block: clamp(3rem, 6vw, 6rem); background: var(--paper); }
.pcare__in { display: grid; gap: clamp(2rem, 4vw, 4rem); align-items: start; }
@media (min-width: 960px) { .pcare__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.pcare__head { display: grid; gap: 1rem; margin-bottom: 1.75rem; }
.pcare__head .h2 { font-size: clamp(2.5rem, 1.6rem + 3.2vw, 4.5rem); max-width: 11ch; }
.crow { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 0 1rem; padding-block: 1.1rem; border-top: 1px solid var(--line); align-items: start; }
.crow:last-of-type { border-bottom: 1px solid var(--line); }
.crow__ic { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--sage-tint); color: var(--moss); }
.crow__ic .i { width: 1.35rem; height: 1.35rem; }
.crow__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; }
.crow__h b { font: 400 1.5rem/1.1 var(--display); }
.crow__h span { font-size: .875rem; font-weight: 600; color: var(--moss); }
.crow p { color: var(--text-2); font-size: .9375rem; line-height: 1.5; margin-top: .3rem; max-width: 46ch; }
.meter { display: flex; gap: 4px; margin-top: .65rem; max-width: 16rem; }
.meter i { flex: 1; height: .5rem; border-radius: 999px; background: rgba(36, 90, 55, .14); }
.meter i.on { background: var(--moss); }
.meter i.on.sun { background: linear-gradient(90deg, var(--lime-2), var(--moss)); }
.tipcard { display: grid; gap: .6rem; margin-top: 1.5rem; padding: 1.4rem 1.5rem; border-radius: var(--r); background: var(--clay-tint); }
.tipcard .eyebrow { color: #7d3a1e; }
.tipcard .eyebrow::before { background: var(--clay); box-shadow: none; }
.tipcard p { font: 400 1.5rem/1.2 var(--display); font-style: italic; text-wrap: pretty; }

.room { background: var(--forest); color: var(--cream); border-radius: var(--r-lg); padding: clamp(1.5rem, 3vw, 2.5rem); display: grid; gap: 1.5rem; position: relative; overflow: hidden; isolation: isolate; --text: var(--cream); --text-2: rgba(246, 242, 231, .84); --text-3: rgba(246, 242, 231, .74); --line: var(--line-inv); --line-2: rgba(246, 242, 231, .3); --focus: var(--lime); }
.room::before { content: ""; position: absolute; z-index: -1; right: -15%; top: -25%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(207, 234, 106, .28), rgba(207, 234, 106, 0)); }
.room h2 { font: 400 clamp(2rem, 1.5rem + 1.8vw, 3rem)/1 var(--display); letter-spacing: -.015em; text-wrap: balance; }
.room h2 em { font-style: italic; color: var(--lime); }
.room .opt-g legend { color: var(--lime); }
.rstops { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
@media (min-width: 560px) { .rstops { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rstop { position: relative; display: block; }
.rstop input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.rstop__box { display: grid; gap: .35rem; padding: .8rem .75rem; border-radius: var(--r-sm); border: 1px solid var(--line-2); background: rgba(246, 242, 231, .06); height: 100%; transition: background-color .25s, border-color .25s, color .25s, transform .25s var(--ease); }
.rstop__sun { display: inline-flex; gap: 2px; }
.rstop__sun i { width: .45rem; height: .45rem; border-radius: 50%; background: var(--lime); opacity: .25; }
.rstop__sun i.on { opacity: 1; }
.rstop b { font-size: .875rem; font-weight: 600; line-height: 1.15; }
.rstop span.w { font-size: .75rem; color: var(--text-3); line-height: 1.25; }
.rstop:hover .rstop__box { border-color: var(--cream); transform: translateY(-1px); }
.rstop input:checked + .rstop__box { background: var(--lime); border-color: var(--lime); color: var(--forest); }
.rstop input:checked + .rstop__box .rstop__sun i { background: var(--forest); }
.rstop input:checked + .rstop__box span.w { color: rgba(23, 61, 42, .85); }
.rstop input:focus-visible + .rstop__box { outline: 3px solid var(--lime); outline-offset: 3px; }
.rchips { display: flex; flex-wrap: wrap; gap: .5rem; }
.rchip { position: relative; }
.rchip input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.rchip span { display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--line-2); font-size: .875rem; font-weight: 500; transition: background-color .2s, color .2s, border-color .2s; }
.rchip:hover span { border-color: var(--cream); }
.rchip input:checked + span { background: var(--lime); color: var(--forest); border-color: var(--lime); }
.rchip input:focus-visible + span { outline: 3px solid var(--lime); outline-offset: 3px; }
.verdict { display: grid; gap: .85rem; padding: 1.25rem 1.3rem; border-radius: var(--r); background: rgba(246, 242, 231, .08); border: 1px solid var(--line-inv); min-height: 11rem; align-content: start; }
.verdict__w { font: 400 clamp(2rem, 1.6rem + 1.4vw, 2.75rem)/1 var(--display); animation: pfade .45s var(--ease); }
.verdict__w em { font-style: italic; }
.verdict[data-tone="great"] .verdict__w { color: var(--lime); }
.verdict[data-tone="ok"] .verdict__w { color: #f1d98a; }
.verdict[data-tone="stretch"] .verdict__w, .verdict[data-tone="no"] .verdict__w { color: #f4b79b; }
.verdict ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; animation: pfade .45s var(--ease); }
.verdict li { display: grid; grid-template-columns: auto 1fr; gap: .15rem .7rem; font-size: .9375rem; line-height: 1.45; color: var(--text-2); }
.verdict li .i { width: 1.15rem; height: 1.15rem; margin-top: .2rem; grid-row: span 2; }
.verdict li b { color: var(--cream); font-weight: 600; }
.verdict li[data-t="great"] .i { color: var(--lime); }
.verdict li[data-t="ok"] .i { color: #f1d98a; }
.verdict li[data-t="stretch"] .i, .verdict li[data-t="no"] .i { color: #f4b79b; }
.verdict__more { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; animation: pfade .45s var(--ease); }
.verdict > p:not(.verdict__w) { color: var(--text-2); font-size: .9375rem; max-width: 40ch; }

/* ---------- complete the set ---------- */
.pairs { padding-block: clamp(3.5rem, 7vw, 7rem); background: var(--clay-tint); }
.pairs .h2 em { color: var(--clay-d); }
.pairs__in { display: grid; gap: 2rem; }
.pairs__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
@media (min-width: 760px) { .pairs__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; } }
.pi { position: relative; display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: .9rem 1.1rem; align-items: center; padding: 1rem; border-radius: var(--r); background: var(--paper); }
@media (min-width: 760px) { .pi { grid-template-columns: 1fr; text-align: center; padding: 1.25rem; gap: 1rem; } .pairs__list > li + li { position: relative; } .pairs__list > li + li::before { content: "+"; position: absolute; z-index: 2; left: -.8rem; top: 38%; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--forest); color: var(--lime); display: grid; place-items: center; font-weight: 700; line-height: 1; transform: translateX(-50%); } .pairs__list { gap: 1.6rem; } .pairs__list > li + li::before { left: -.8rem; } }
.pi__img { aspect-ratio: 4 / 5; border-radius: 999px 999px 12px 12px; overflow: hidden; background: var(--stone); }
@media (min-width: 760px) { .pi__img { width: min(72%, 11rem); margin-inline: auto; } }
.pi__img img { width: 100%; height: 100%; object-fit: cover; }
.pi__b { display: grid; gap: .25rem; min-width: 0; }
.pi__n { font: 400 1.5rem/1.05 var(--display); }
.pi__n a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1.5px no-repeat; transition: background-size .4s var(--ease); }
.pi__n a:hover { background-size: 100% 1.5px; }
.pi__s { font-size: .8125rem; color: var(--text-3); }
.pi__p { font-weight: 600; font-variant-numeric: tabular-nums; }
.pi__chk { position: relative; display: inline-flex; align-items: center; gap: .55rem; font-size: .875rem; font-weight: 500; min-height: 2.5rem; cursor: pointer; justify-self: start; }
@media (min-width: 760px) { .pi__chk { justify-self: center; } }
.pi__chk input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; width: 100%; height: 100%; }
.pi__chk .box { width: 1.3rem; height: 1.3rem; border-radius: 6px; border: 1.5px solid var(--line-2); background: var(--paper); display: grid; place-items: center; transition: background-color .2s, border-color .2s; }
.pi__chk .box .i { width: .85rem; height: .85rem; stroke-width: 2.4; color: var(--lime); opacity: 0; transform: scale(.6); transition: opacity .2s, transform .3s var(--ease); }
.pi__chk input:checked + .box { background: var(--forest); border-color: var(--forest); }
.pi__chk input:checked + .box .i { opacity: 1; transform: none; }
.pi__chk input:focus-visible + .box { outline: 3px solid var(--focus); outline-offset: 3px; }
.pi__chk input:disabled + .box { opacity: .6; }
.pi.is-off { opacity: .6; }
.pairs__buy { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(20, 36, 27, .18); }
.pairs__total { font: 400 clamp(2.25rem, 2rem + 1vw, 3rem)/1 var(--display); font-variant-numeric: tabular-nums; }
.pairs__total small { display: block; font: 500 .875rem/1.3 var(--sans); color: var(--ink-2); margin-top: .3rem; }
.btn--clay-d { --b-bg: var(--clay-d); --b-fg: #fff; }

/* ---------- reviews ---------- */
.previews { padding-block: clamp(3.5rem, 7vw, 7rem); }
.previews__in { display: grid; gap: clamp(2rem, 4vw, 4rem); align-items: start; }
@media (min-width: 960px) { .previews__in { grid-template-columns: 22rem minmax(0, 1fr); } .rsum { position: sticky; top: calc(var(--header-h) + 1.5rem); } }
.rsum { display: grid; gap: 1.1rem; }
.rsum__n { font: 400 clamp(5rem, 4rem + 4vw, 7.5rem)/.85 var(--display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.rsum__n small { font: 500 1rem/1 var(--sans); color: var(--text-3); letter-spacing: 0; margin-left: .35rem; }
.rsum .stars .i { width: 1.35rem; height: 1.35rem; }
.rsum p:not(.rsum__n) { color: var(--text-2); font-size: .9375rem; }
.bars { list-style: none; padding: 0; margin: .3rem 0 0; display: grid; gap: .45rem; }
.bars li { display: grid; grid-template-columns: 2.1rem minmax(0, 1fr) 2.4rem; align-items: center; gap: .7rem; font-size: .8125rem; color: var(--text-2); font-variant-numeric: tabular-nums; }
.bars li > span:nth-child(3) { text-align: right; }
.bars i { display: block; height: .5rem; border-radius: 999px; background: rgba(36, 90, 55, .14); position: relative; overflow: hidden; }
.bars i::after { content: ""; position: absolute; inset: 0; transform-origin: 0 50%; transform: scaleX(var(--w)); background: var(--moss); border-radius: inherit; transition: transform 1s var(--ease); }
.js .bars:not(.is-in) i::after { transform: scaleX(0); }
.rlist { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
@media (min-width: 700px) { .rlist { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rev { display: grid; gap: .8rem; align-content: start; padding: 1.4rem 1.5rem; border-radius: var(--r); background: var(--paper); border: 1px solid var(--line); animation: pfade .5s var(--ease) both; }
.rev__top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.rev__tag { font-size: .75rem; font-weight: 600; color: var(--moss); display: inline-flex; align-items: center; gap: .35rem; }
.rev__tag .i { width: .9rem; height: .9rem; }
.rev h3 { font: 400 1.625rem/1.1 var(--display); }
.rev p { color: var(--text-2); font-size: .9375rem; line-height: 1.55; }
.rev footer { display: flex; align-items: center; gap: .75rem; font-size: .8125rem; color: var(--text-3); margin-top: .2rem; }
.rev__av { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--c, var(--moss)); color: #fff; font-weight: 600; font-size: .8125rem; flex: none; }
.rev footer b { display: block; color: var(--text); font-weight: 600; font-size: .875rem; }
.previews__more { display: flex; justify-content: center; margin-top: 1.5rem; }

/* ---------- related ---------- */
.prel { padding-block: 0 var(--sec); }
.prel__grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.25rem .9rem; }
@media (min-width: 900px) { .prel__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.75rem 1.25rem; } }
.prel__grid > li { animation: pfade .6s var(--ease) both; animation-delay: calc(var(--i, 0) * 60ms); }

/* ---------- sticky bar (phones) ---------- */
.stick { position: fixed; z-index: 50; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: .85rem; padding: .7rem var(--gutter) calc(.7rem + env(safe-area-inset-bottom)); background: rgba(251, 249, 242, .97); border-top: 1px solid var(--line); box-shadow: 0 -14px 30px -22px rgba(20, 36, 27, .4); transform: translateY(105%); transition: transform .45s var(--ease); visibility: hidden; }
.stick.is-on { transform: none; visibility: visible; }
.stick__img { width: 2.75rem; aspect-ratio: 4 / 5; border-radius: 999px 999px 8px 8px; overflow: hidden; flex: none; background: var(--stone); }
.stick__img img { width: 100%; height: 100%; object-fit: cover; }
.stick__t { flex: 1; min-width: 0; display: grid; line-height: 1.2; }
.stick__t b { font: 400 1.25rem/1.1 var(--display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stick__t span { font-size: .875rem; color: var(--text-2); font-variant-numeric: tabular-nums; }
.stick .btn { min-height: 2.9rem; padding: 0 1.2rem; flex: none; }
@media (min-width: 960px) { .stick { display: none; } }
@media (max-width: 959px) { .toasts { bottom: 5.5rem; } }

/* not found */
.pnf { display: grid; justify-items: center; gap: 1.1rem; text-align: center; padding-block: clamp(4rem, 10vw, 8rem); }
.pnf svg { width: 6rem; height: 6rem; color: var(--sage-2); }
.pnf h1 { font: 400 var(--fs-h2)/.98 var(--display); letter-spacing: -.02em; }
.pnf p { color: var(--text-2); max-width: 40ch; }

@media (prefers-reduced-motion: reduce) {
  .eta__out b, .eta__out p, .verdict__w, .verdict ul, .verdict__more, .rev, .prel__grid > li { animation: none; }
  .gal__thumb, .pot__box, .rstop__box, .stick, .bars i::after { transition: none; }
}