/* Native store (phase B1, 24.9.2026) — shop, product categories/tags, single product.
   Faithful port of the Elementor templates 4891 / 4894 / 4889: sizes, colours and spacing measured from the live render.
   Loaded only on those pages (inc/store.php). */

/* ---------- Elementor kit 2031 element defaults ----------
   On Elementor pages the kit styles every link, heading and button, including what snippets print (7248's WhatsApp line is navy
   there, not the snippet's green), at specificity (0,1,1). Same here inside the store content, placed first so the store's own rules
   below win at equal weight. The header and footer keep the site-wide look. */
.rf-store a{color:var(--navy);font-family:var(--mfe);font-weight:400}
.rf-store a:hover{color:var(--orange)}
.rf-store h1{color:var(--navy);font-family:var(--mfe);font-size:2rem;font-weight:800}
.rf-store h2{font-family:var(--mfe);font-size:1.3rem;font-weight:800;line-height:25px;letter-spacing:0}
.rf-store h3{color:var(--navy);font-family:var(--mfe);font-size:1.5rem;font-weight:700}
.rf-store h4{color:var(--navy);font-family:var(--mfe);font-size:1.2rem;font-weight:700}
.rf-store button,.rf-store input[type=button],.rf-store input[type=submit]{font-family:var(--mfe)}

/* ---------- WooCommerce defaults that fight the grid ---------- */
.rf-store ul.products{display:grid;list-style:none;margin:0;padding:0}
.rf-store ul.products::before,.rf-store ul.products::after{content:none;display:none}
.rf-store ul.products li.product{float:none;width:auto;margin:0;padding:0;clear:none}
/* woocommerce-smallscreen.css: ".woocommerce ul.products[class*=columns-] li.product{width:48%;float:…}" (the attribute selector adds weight) */
.rf-store ul.products[class] li.product{float:none;width:auto;margin:0;clear:none}

/* ---------- title band (archive) ---------- */
.rf-store-hero{background:var(--peach);min-height:250px;display:flex;align-items:center;justify-content:center;padding:0 15px;text-align:center}
.rf-store-hero-in{width:100%;max-width:var(--wrap)}
.rf-store-crumbs{font-family:var(--mfe);font-size:14px;line-height:1.65;letter-spacing:0;color:var(--navy);margin:0 0 10px} /* 00a3cc2 / 657f31a */
.rf-store-crumbs a{color:inherit;text-decoration:none}
.rf-store-crumbs a:hover{text-decoration:underline}
.rf-store .rf-store-h1{max-width:525px;margin:0 auto;font-family:var(--mfe);font-size:50px;font-weight:400;line-height:55px;color:var(--navy);-webkit-text-stroke:2px var(--navy)} /* 4891 d0c71d3 */
.rf-store .rf-store-h2{font-family:var(--mfe);font-weight:400;font-size:50px;line-height:55px;color:var(--navy);text-align:center;margin:0}

/* ---------- product grid ---------- */
/* 4891: the list block 9524248 (padding 50, boxed 1440) > 1290b10 (column, 15px between the store bar and the grid) > loop grid 4d2b859
   (4 columns, 2 on tablets and phones, equal-height rows: grid-auto-rows 1fr + cards at 100%) */
.rf-store-list{padding:50px}
.rf-store-in{max-width:1440px;margin:0 auto;padding:0;display:flex;flex-direction:column;gap:15px}
.rf-store-in > .woocommerce-notices-wrapper:empty{display:none} /* an empty flex item would still add a gap */
.rf-store .rf-store-list ul.products{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:30px}
/* the loop grid's end line ("no more" message): space kept from the start, text shown on the last page (reef.js after the last load) */
.rf-store-end,.rf-store-none{margin:15px 0 0;font-size:16px;line-height:1.6;color:var(--text);text-align:center}
.rf-store-end.is-off{visibility:hidden}

/* card (loop item 4894) */
.rf-store ul.products li.product.rf-pcard{position:relative;display:flex;flex-direction:column;align-items:center;gap:15px;text-align:center;background:rgba(237,240,242,.35);border-radius:15px;padding:15px;transition:transform .4s}
.rf-store ul.products li.product.rf-pcard:hover{transform:scale(1.01)} /* the loop item's hover scale */
.rf-store ul.products li.rf-pcard .rf-pcard-media{width:100%;background:#fff;margin:0;padding:0}
.rf-store ul.products li.rf-pcard .rf-pcard-img{display:block;width:100%}
/* 7247 puts the 12-payments card right after the image link, i.e. inside the white media box, full width (as in the Elementor card) */
.rf-store ul.products li.rf-pcard .rf-pcard-media .reef-inst-card{margin:11px 13px 2px}
.rf-store ul.products li.rf-pcard .rf-pcard-img img{display:block;width:100%;height:400px;margin:0;object-fit:contain;border-radius:15px;background:#fff}
/* the title is an inline heading in a 16px / 1.6 widget there: every line box is 25.6px, whatever the font size */
/* Room for two lines on every card, so the titles start and the prices end level (Mor 8.10: "מפריע בעין"); a name is never cut —
 * none passes 2 lines from 768px up (3 is only a guard), and the phone rule below lets the longest ones run to 4. */
.rf-store ul.products li.rf-pcard .rf-pcard-title{padding:0;text-transform:capitalize;font-family:var(--mfe);font-weight:400;font-size:20px;line-height:1.6rem;min-height:3.2rem;color:var(--navy);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rf-store ul.products li.rf-pcard .rf-pcard-title a{color:inherit;text-decoration:none}
.rf-store ul.products li.rf-pcard .price{display:block;font-family:var(--mfe);font-size:25px;font-weight:700;line-height:1.6;letter-spacing:-1px;color:var(--orange-ink);margin:auto 0 25px} /* auto: price and button sit at the card's foot, level across the row */
.rf-store ul.products li.rf-pcard .price del{font-size:.7em;font-weight:400;opacity:.7}
.rf-store ul.products li.rf-pcard .price ins{text-decoration:none}
.rf-store ul.products li.rf-pcard .rf-pcard-btn{margin:0;letter-spacing:.2px;display:inline-flex;align-items:center;justify-content:center;width:220px;max-width:100%;min-height:48px;padding:15px 0;border-radius:15px;font-family:var(--mfe);font-size:18px;line-height:1;color:#fff;text-decoration:none;background-color:#AE4F14;background-image:linear-gradient(292deg,#FF6200 0%,#E27029 100%)}
.rf-store ul.products li.rf-pcard .rf-pcard-btn:hover,.rf-store ul.products li.rf-pcard .rf-pcard-btn:focus-visible{background-image:linear-gradient(292deg,#E85800 0%,#C95F1D 100%);color:#fff}

/* "load more" (infinite scroll in reef.js; plain link without JS) */
.rf-store-more{display:flex;justify-content:center;margin:25px 0 0}
.rf-store-more-btn{display:inline-flex;align-items:center;min-height:48px;padding:12px 30px;border-radius:15px;font-family:var(--mfe);font-size:18px;color:#fff;text-decoration:none;background:var(--navy)}
.rf-store-more-btn[aria-busy="true"]{opacity:.6;pointer-events:none}

/* ---------- single product ---------- */
.rf-pdp-crumbs{background:var(--peach);min-height:40px;display:flex;align-items:center;padding:10px} /* f27ab72 + the kit's 10px inner padding: 43 / 53 (tablet, 20px text) / 40 */
.rf-pdp-crumbs .rf-store-crumbs{margin:0;text-align:start;letter-spacing:0}
.rf-pdp-grid{display:flex;flex-direction:row;gap:25px;max-width:1490px;margin:0 auto;padding:25px}
.rf-pdp-media{flex:0 1 45%;min-width:0}
.rf-store div.product.rf-pdp div.summary.rf-pdp-summary{flex:0 1 55%;float:none;width:auto;margin:0;min-width:0;padding:15px;display:flex;flex-direction:column;gap:5px}
.rf-store div.product.rf-pdp .rf-pdp-summary .product_title{text-transform:capitalize;font-family:var(--mfe);font-weight:400;font-size:30px;line-height:55px;color:var(--navy);margin:0}
.rf-store div.product.rf-pdp .rf-pdp-price .price{font-family:var(--mfe);font-size:25px;font-weight:700;line-height:1.6;color:var(--orange-ink);margin:0 0 25px}
.rf-pdp-price{position:relative;margin-bottom:-25px;background:#fff} /* 8960a9a: the -25px takes back the price's 25px; the widget is positioned and white, so it covers the first 10px of 7248's box */
.rf-pdp-hr{border:0;border-top:1px solid rgba(0,0,0,.36);margin:15px 0;width:100%} /* dividers 6003abd / 1f601654 */
.rf-pdp-short{font-family:var(--mfe);font-size:16px;font-weight:400;line-height:1.6;color:var(--navy)} /* 6c34fdd9 */
.rf-pdp-short h1,.rf-pdp-short h2,.rf-pdp-short h3,.rf-pdp-short h4{font-size:16px;font-weight:700;color:var(--navy);margin:14px 0 6px;line-height:1.5}
.rf-pdp-atc{font-family:var(--mfe)} /* 6ea1315 custom CSS: the whole add-to-cart block (incl. what snippets add to it) in the site font */
.rf-pdp-short{margin-bottom:-15px} /* 6c34fdd9's -15px after the last paragraph's 1em */
.rf-pdp-short p{margin:0 0 1em}
/* WooCommerce gives form.cart 2em below it (at higher weight): Elementor's add-to-cart widget has none, and its flex form keeps the
   children's margins inside (flow-root does the same without changing their widths) */
.rf-store div.product.rf-pdp .rf-pdp-summary form.cart{display:flow-root;margin:0}
.rf-store div.product.rf-pdp .rf-pdp-summary form.cart:not(.variations_form){display:flex;flex-direction:column} /* no margin merging at all, as in the flex form */
.rf-store div.product.rf-pdp .rf-pdp-summary > .reef-pdp-shabbat{margin-top:5px;align-self:flex-start} /* 7248 puts the chip inside the title widget there: 10px under the title (not 10 + the column's 5), and as inline-flex it keeps its own width */
/* "justify" button of 6ea1315: not floated (so the trust box keeps its 14px), 10px in from the start edge */
.rf-store div.product.rf-pdp .rf-pdp-summary .single_add_to_cart_button{float:none;width:calc(100% - 10px);margin-inline-start:10px;min-height:48px;border-radius:15px;background:var(--orange-hover);color:#fff;font-family:var(--mfe);font-size:19px;font-weight:700;line-height:18px;border:0;padding:15px;cursor:pointer}

/* gallery: main image + thumbnails row (4 per row, 3 on phones) */
.rf-store div.product.rf-pdp div.images.woocommerce-product-gallery{position:relative;margin:0;width:100%;float:none}
.rf-store div.product.rf-pdp div.images .woocommerce-product-gallery__image img{width:100%;height:auto;border-radius:15px}
.rf-store div.product.rf-pdp div.images .flex-control-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;list-style:none;margin:10px 0 0;padding:0}
.rf-store div.product.rf-pdp div.images .flex-control-thumbs li{width:auto;float:none;margin:0}
.rf-store div.product.rf-pdp div.images .flex-control-thumbs img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:10px;background:#fff;cursor:pointer;opacity:.7}
.rf-store div.product.rf-pdp div.images .flex-control-thumbs img.flex-active,.rf-store div.product.rf-pdp div.images .flex-control-thumbs img:hover{opacity:1}
.rf-pdp-media .woocommerce-product-gallery__trigger{position:absolute;top:12px;inset-inline-start:12px;z-index:2}

/* accordion (nested-accordion 33fde8e9) */
.rf-pdp-acc{margin-top:15px;display:flex;flex-direction:column;gap:12px}
.rf-pdp-acc details{border-radius:15px;background:#EDF0F2}
.rf-pdp-acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px;border-top:1px solid #D5D8DC;border-radius:15px;font-family:var(--mfe);font-size:18px;font-weight:700;color:#1F2124;min-height:57px}
.rf-pdp-acc summary::-webkit-details-marker{display:none}
.rf-pdp-acc summary::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-5px;transition:transform var(--t)} /* physical borders: a chevron that points down in RTL too */
.rf-pdp-acc details[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.rf-pdp-acc-body{padding:0 15px 15px;font-family:var(--mfe);font-size:16px;line-height:1.6;color:var(--text)}
.rf-pdp-acc-body p{margin:0 0 8px}
.rf-pdp-desc img{max-width:100%;height:auto}

/* reviews + recommended logos */
.rf-pdp-reviews{background:var(--peach);padding:100px 50px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:100px}
.rf-pdp-reviews > .rf-store-h2{max-width:525px}
.rf-pdp-ti{width:100%;max-width:1440px;margin:0;background:#fff;border-radius:15px;padding:35px 5px}
/* The two Trustindex blocks render late (script on the first interaction, each widget when it comes into view): hold their final
   height from the start. Without it the page grew by ~450px per block while the reader was already below them: Chrome's scroll
   anchoring then pushed the scroll down and swallowed scrolling up for a few seconds; Safari has no anchoring, so the page jumped
   (Mor, 25.9). Heights = the tallest rendered widget per width range, measured 360–1920 (Trustindex settles in two steps, ~23px
   apart; #reef-reviews-wrap = snippet 7240: heading + widget). A little spare white at some widths, never a jump. */
.rf-pdp-ti{min-height:465px}
#reef-reviews-wrap{min-height:466px}
@media (max-width:1023px){#reef-reviews-wrap{min-height:445px}}
@media (max-width:767px){.rf-pdp-ti{min-height:425px}#reef-reviews-wrap{min-height:445px}}
@media (max-width:480px){.rf-pdp-ti{min-height:468px}#reef-reviews-wrap{min-height:468px}}
@media (max-width:380px){#reef-reviews-wrap{min-height:502px}}

/* 7248's chips and 12-payments box come with the page now (inc/store.php); the snippet's own rules print in the footer, so these
   copies style them from the first paint. The chips sit inline in one row, 10px under the title, as inside the title widget. */
.reef-pdp-oos{display:inline-block;background:#A32D2D;color:#fff;font-weight:700;padding:6px 16px;border-radius:10px;margin:10px 0 2px;font-size:14px;box-shadow:0 2px 8px rgba(163,45,45,.25)}
.reef-pdp-shabbat{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;padding:6px 14px;border-radius:10px;margin:10px 8px 2px 0;background:#E1EEFB;color:#0C447C;border:1px solid #9FC4EC}
.reef-pdp-shabbat.tzomet{background:#0C447C;color:#fff;border-color:#0C447C}
.reef-pdp-inst{display:flex;align-items:center;gap:12px;justify-content:flex-start;background:#FAEEDA;border:1px solid #F0D9A8;border-radius:12px;padding:12px 16px;margin:10px 0}
.reef-pdp-inst .txt{text-align:right}
.reef-pdp-inst .ttl{font-weight:700;color:#7a4d08;font-size:14.5px;line-height:1.3}
.reef-pdp-inst .sub{color:#8a5a12;font-size:13px}
.rf-store div.product.rf-pdp .rf-pdp-summary > .rf-pdp-chips{margin-top:-5px} /* the column's 5px gap + the chips' own 10px = 10px */
/* 7247 puts a 78px 12-payments box under the card photo on desktop (>880px), after the first interaction: keep the room from the start */
@media (min-width:881px){.rf-store ul.products li.rf-pcard.rf-has-inst .rf-pcard-media{min-height:478px}}
/* 7248's payment-logos strip: WP Rocket gives the lazy image width/height attributes (2183×299), so the snippet's height:28px +
   max-width:100% stretched it across the row (Mor, 25.9) — keep its own proportions */
.rf-store .reef-pay-box img{width:auto;height:28px;max-width:100%;object-fit:contain}
.rf-pdp-recw{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;max-width:1440px;padding:10px} /* the kit's default container padding (20c2363 / 1631d88) */
.rf-pdp-rec{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-items:center;align-items:center;gap:10px;width:55%;padding:10px}
.rf-pdp-rec a{display:block;width:200px;max-width:100%;border:1px solid #EEE;border-radius:15px}
.rf-pdp-rec img{display:block;width:100%;height:120px;object-fit:cover;border-radius:15px}

/* related row (loop-carousel e14828e): 4 visible, scroll-snap, arrows */
.rf-pdp-related{padding:100px 0}
.rf-pdp-related > .rf-store-h2{margin:0 50px 100px}
.rf-pdp-related-row{position:relative;max-width:1350px;margin:0 auto}
.rf-store .rf-pdp-related ul.rf-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 75px) / 4);gap:25px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0}
.rf-store .rf-pdp-related ul.rf-row::-webkit-scrollbar{display:none}
.rf-pdp-related ul.rf-row > li{scroll-snap-align:start}
/* the carousel's arrows: 25px light chevrons inside the row, at mid-height (outside it they widened the page by 6px) */
.rf-row-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:flex;align-items:center;justify-content:center;width:25px;height:25px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:rgba(238,238,238,.9);cursor:pointer}
.rf-row-nav svg{width:25px;height:25px}
.rf-row-nav.prev{inset-inline-start:0}
.rf-row-nav.next{inset-inline-end:0}
.rf-row-nav[disabled]{opacity:0;pointer-events:none}

/* question + lead form (4889 f0358e0), 1:1 with the template's CSS: row-reverse, vertically centred, padding 10% / 2% (Elementor puts
   the vertical 10% on the boxed inner, so it is a % of the section's content width), boxed 1440 (kit), two 50% columns that shrink
   the way Elementor's do (the card's 50px padding makes it end up a little wider), gaps 35 (text) and 10 (card = kit default).
   Tablet keeps the two columns, as the template does. */
.rf-pdp-lead{background:var(--peach);padding:0 2%}
.rf-pdp-lead-in{display:flex;flex-direction:row-reverse;align-items:center;justify-content:flex-start;gap:75px;max-width:1440px;margin:0 auto;padding:10% 0}
.rf-pdp-lead-text{flex:0 1 50%;min-width:0;display:flex;flex-direction:column;gap:35px}
/* the two lead headings are Elementor `span` headings: an inline span in a 16px / 1.6 block, whose strut makes each line a little taller
   than the span's own line-height; the same structure here keeps the section's heights identical */
.rf-pdp-lead-text > .rf-pdp-lead-h{margin:0;max-width:525px;font-size:16px;line-height:1.6;color:var(--navy)}
.rf-pdp-lead-h > span{font-family:var(--mfe);font-size:50px;font-weight:400;line-height:55px}
.rf-pdp-lead-text > p:not(.rf-pdp-lead-h){margin:0 0 calc(1em - 15px);font-family:var(--mfe);font-size:1.3rem;font-weight:400;line-height:1.4;color:var(--navy)}
.rf-pdp-checks{list-style:none;margin:0;padding:0}
.rf-pdp-checks li{display:flex;align-items:center;margin:0;padding:0;font-family:var(--mfe);font-size:1.1rem;font-weight:400;line-height:1.6;color:var(--navy)}
.rf-pdp-checks li + li{margin-top:10px}
.rf-pdp-checks svg{width:20px;height:20px;fill:var(--navy);flex:none;margin-inline:5px}
.rf-pdp-lead-form{flex:0 1 50%;min-width:0;background:#fff;padding:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}
.rf-pdp-form-h{margin:0;width:400px;max-width:100%;font-size:16px;line-height:1.6;color:var(--navy)}
.rf-pdp-form-h > span{font-family:var(--mfe);font-size:35px;font-weight:400;line-height:45px}
.rf-pdp-form-sub{margin:0 0 1em;font-family:var(--mfe);font-size:1.3rem;font-weight:400;line-height:1.4;color:var(--navy)}
.rf-pdp-form-sub a{color:inherit;text-decoration:none}
/* Elementor 4889 draws these headings with a 2px navy text stroke (a bolder look than the plain font): product title, the four
   section headings and the two lead headings (1px on the form title on phones) */
.rf-pdp-page .rf-store-h2,.rf-store div.product.rf-pdp .rf-pdp-summary .product_title,.rf-pdp-lead-h > span,.rf-pdp-form-h > span{-webkit-text-stroke:2px var(--navy)}

/* why-us boxes (1aaa1cf) */
.rf-pdp-why{padding:100px 50px} /* 1aaa1cf: 100 / 50, heading 600 wide, 100 to the grid */
.rf-pdp-why > .rf-store-h2{max-width:600px;margin:0 auto 100px}
.rf-pdp-why-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;width:85%;max-width:1224px;margin:0 auto} /* 0fd3c8f: 85% of the boxed 1440 */
.rf-pdp-why-box{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:25px;border:1px solid #E7E7E7;border-radius:15px;background:#fff;text-decoration:none;color:var(--navy)}
.rf-pdp-why-box:last-child{background:#F0955C;border:0} /* a591650: no border */
.rf-pdp-why-ic{padding:5px;line-height:0}
.rf-pdp-why-ic svg{width:40px;height:40px;fill:var(--navy)}
.rf-pdp-why-t{font-family:var(--mfe);font-size:22px;font-weight:600;line-height:1.12;letter-spacing:0;color:#000;margin-bottom:5px} /* + the 10px gap = the title's 15px */
.rf-pdp-why-d{font-family:var(--mfe);font-size:17px;line-height:1.5;color:var(--navy)}

/* ---------- tablet / phone ---------- */
@media (max-width:1023px){.rf-store .rf-pdp-related ul.rf-row{grid-auto-columns:calc((100% - 25px) / 2)}} /* the carousel shows 4 down to 1024px, then 2 */
@media (max-width:1024px){
	.rf-store .rf-store-list ul.products{grid-template-columns:repeat(2,minmax(0,1fr))} /* the loop grid's tablet default: 2 */
	.rf-store-hero .rf-store-crumbs{font-size:20px}
	.rf-store ul.products li.rf-pcard .rf-pcard-btn{width:60%}
	.rf-pdp-reviews{padding:100px 25px 0}
	.rf-pdp-crumbs .rf-store-crumbs{font-size:20px}
}
@media (max-width:767px){
	.rf-store-hero{min-height:150px;padding:0 25px}
	.rf-store-hero .rf-store-crumbs{display:none} /* elementor-hidden-mobile on 00a3cc2 */
	.rf-store .rf-store-h1{max-width:300px;font-size:35px;line-height:1.1}
	.rf-store .rf-store-h2{font-size:35px;line-height:1.1}
	.rf-store .rf-pdp-rec-h{font-size:32px}
	.rf-store-list{padding:35px 15px}
	.rf-store-in{max-width:90%} /* the kit's boxed width on phones */
	.rf-store .rf-store-list ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
	.rf-store ul.products li.product.rf-pcard{padding:5px calc(4.5px + 5%)} /* 5px, then the kit's 90% boxed inner */
	.rf-store ul.products li.rf-pcard .rf-pcard-img img{height:200px}
	.rf-store ul.products li.rf-pcard .rf-pcard-title{font-size:16px;display:block;overflow:visible} /* two columns: full names (up to 4 lines), never cut */
	.rf-store ul.products li.rf-pcard .price{font-size:19px;margin:auto 0 19px}
	.rf-store ul.products li.rf-pcard .rf-pcard-btn{width:100%;font-size:15px;min-height:45px}
	.rf-pdp-grid{flex-direction:column;gap:15px;padding:25px calc(22.5px + 5%)} /* 25px, then the kit's 90% boxed inner */
	.rf-pdp-price{margin:5px 0 0;padding:15px 5px 0} /* 8960a9a on phones: no -25px, 15px on top */
	.rf-pdp-media,.rf-store div.product.rf-pdp div.summary.rf-pdp-summary{flex:none}
	.rf-pdp-crumbs .rf-store-crumbs{font-size:12px;text-align:center}
	.rf-pdp-acc summary{font-size:16px}
	.rf-pdp-acc-body{font-size:15px}
	.rf-store div.product.rf-pdp div.summary.rf-pdp-summary{padding:0}
	.rf-store div.product.rf-pdp .rf-pdp-summary .product_title,.rf-store div.product.rf-pdp .rf-pdp-short{text-align:center} /* Elementor centred title + short description on phones */
	.rf-store div.product.rf-pdp .rf-pdp-summary .reef-pdp-shabbat{align-self:center}
	.rf-store div.product.rf-pdp .rf-pdp-summary > .rf-pdp-chips{text-align:center} /* centred on phones, as the title */
	.rf-store div.product.rf-pdp .rf-pdp-summary .product_title{font-size:35px;line-height:1.1}
	.rf-store div.product.rf-pdp div.images .flex-control-thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}
	.rf-pdp-reviews{padding:50px calc(22.5px + 5%);gap:25px}
	.rf-pdp-ti{padding:15px}
	.rf-pdp-recw{padding:0} /* 20c2363 has no padding on phones */
	.rf-pdp-rec{grid-template-columns:1fr;width:100%}
	.rf-pdp-related{padding:50px 0 100px}
	.rf-pdp-related > .rf-store-h2{margin:0 calc(13.5px + 5%) 50px}
	.rf-pdp-related-row{padding:0 5%}
	.rf-store .rf-pdp-related ul.rf-row{grid-auto-columns:100%} /* one slide, as the carousel */
	.rf-pdp-lead{padding:0 15px}
	.rf-pdp-lead-in{flex-direction:column;align-items:stretch;gap:25px;max-width:90%;padding:75px 0} /* text first, then the card (row + wrap in the template) */
	.rf-pdp-lead-text{flex:none;gap:15px}
	.rf-pdp-lead-text > .rf-pdp-lead-h{max-width:none;text-align:center}
	.rf-pdp-lead-h > span{font-size:28px;line-height:1.1}
	.rf-pdp-lead-text > p:not(.rf-pdp-lead-h){margin-bottom:calc(1em - 5px);font-size:1rem;line-height:1.5;text-align:center}
	.rf-pdp-checks li{font-size:.9rem}
	.rf-pdp-lead-form{flex:none;padding:25px}
	.rf-pdp-form-h{width:100%}
	.rf-pdp-form-h > span{font-size:20px;line-height:1.1;-webkit-text-stroke-width:1px}
	.rf-pdp-form-sub{width:230px;max-width:100%;margin-bottom:calc(1em - 5px);font-size:1rem;line-height:1.5}
	.rf-pdp-why{padding:50px calc(13.5px + 5%)}
	.rf-pdp-why > .rf-store-h2{margin-bottom:50px}
	.rf-pdp-why-grid{grid-template-columns:1fr;gap:35px;width:auto;max-width:none}
	.rf-pdp-why-t{font-size:25px}
}

/* product lead form (Elementor form 88a0f41): 350 wide, 47px pill fields 20px apart, orange pill button (grow on hover), consent line
   under the button. The shared .rf-form card look (white box, padding, grid, 100%-wide checkbox) does not apply here; the page-level
   selectors also outrank the store's 16px phone rule for inputs, as Elementor's did (1.1rem is above 16px, so no iOS zoom). */
.rf-pdp-page .rf-pdp-form.rf-form{width:350px;max-width:100%;margin:0;padding:0;background:none;border-radius:0;box-shadow:none;display:flex;flex-direction:column;gap:20px;text-align:start}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-field{display:block;margin:0}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-field input[name]{display:block;width:100%;height:47px;margin:0;border:1px solid #DBDBDB;border-radius:355px;padding:6px 16px;font-family:var(--mfe);font-size:1.1rem;font-weight:400;line-height:1.4;color:#313745;background:#fff}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-field input[name]::placeholder{color:#313745;opacity:1}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-submit{display:block;width:100%;margin:0;padding:15px 0 12px;border:0;border-radius:35px;background:var(--orange-hover);color:#fff;font-family:var(--mfe);font-size:1.2rem;font-weight:700;line-height:25px;letter-spacing:1px;cursor:pointer;transition:transform .3s}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-submit:hover{transform:scale(1.1)}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-submit[disabled]{opacity:.6;transform:none}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-consents{display:flex;flex-direction:column;gap:2px} /* two consent lines (Mor 24.9) */
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-consent{display:flex;align-items:center;gap:0;margin:0;font-family:var(--mfe);font-size:1.1rem;line-height:1.6;color:#313745}
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-consent span{padding-inline-start:4px;font-size:.9rem;line-height:1.76rem} /* the template's 0.9rem text on a 1.1rem line */
.rf-pdp-page .rf-pdp-form.rf-form .rf-pdp-consent input[type=checkbox]{width:13px;height:13px;margin:3px 3px 3px 4px;padding:0;flex:none;border-radius:0}
.rf-pdp-page .rf-pdp-form.rf-form .rf-form-msg{margin:0;font-size:15px}
.rf-pdp-page .rf-pdp-form.rf-form .rf-form-msg:empty{display:none} /* no reserved line: Elementor shows its message only after sending */
.rf-pdp-page .rf-pdp-form.rf-form .rf-form-msg.err{color:#B42318}

/* LCP: WooCommerce keeps the gallery at opacity 0 (inline style) until its JS runs — show the main photo at once; until flexslider
   wraps the slides (it inserts .flex-viewport between the gallery and the wrapper) only the first photo is shown, so nothing jumps */
.rf-store div.product.rf-pdp div.images.woocommerce-product-gallery{opacity:1!important}
.rf-store div.product.rf-pdp div.images > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:not(:first-child){display:none}
/* …also in the instant after flexslider wraps them in .flex-viewport and widens the track to all the photos, before it sizes and floats
   each one (its inline style): the first photo grew to the whole track (1303px square on a phone) for ~100ms and the summary dropped
   off the screen and back (CLS 0.17 + 0.27, 8.10). Until then each photo is one viewport wide (cqw of .flex-viewport). */
.rf-store div.product.rf-pdp div.images .flex-viewport{container-type:inline-size}
.rf-store div.product.rf-pdp div.images .flex-viewport .woocommerce-product-gallery__image:not([style*="float"]){width:100cqw}
.rf-store div.product.rf-pdp div.images .flex-viewport .woocommerce-product-gallery__image:not(:first-child):not([style*="float"]){display:none}
/* …and room for the thumbnail strip flexslider then adds under the photo. WP Rocket starts that script on the first touch, and the
   strip pushed the whole summary down: Lighthouse mobile CLS 0.55 on the product page (8.10). Reserve = rows × thumb + 10px gaps +
   10px above; rows = photos ÷ columns (4, phones 3); one photo = no strip. It goes in the same frame the strip appears. */
.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(2))::after{content:"";display:block;margin-top:10px;padding-bottom:calc((100% - 30px) / 4)}
.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(5))::after{padding-bottom:calc((100% - 30px) / 2 + 10px)}
.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(9))::after{padding-bottom:calc((100% - 30px) * 3 / 4 + 20px)}
@media (max-width:767px){
	.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(2))::after{padding-bottom:calc((100% - 20px) / 3)}
	.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(4))::after{padding-bottom:calc((100% - 20px) * 2 / 3 + 10px)}
	.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(7))::after{padding-bottom:100%}
	.rf-store div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(10))::after{padding-bottom:calc((100% - 20px) * 4 / 3 + 30px)}
}
/* phones: 7247's installments line inside the card photo is 10.5px — 12px keeps the page under Lighthouse's illegible-text threshold */
@media (max-width:880px){.rf-store .e-loop-item .reef-ov-inst{font-size:12px;line-height:1.35}}

/* category / brand description (above the store bar): 4 lines on desktop, 3 on phones, "קרא עוד" opens the rest */
.rf-store-desc{max-width:980px;margin:0 auto 19px;font-size:16px;line-height:1.7;color:var(--text);text-align:center}
.rf-store-desc-in{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.rf-store-desc.open .rf-store-desc-in{display:block;-webkit-line-clamp:unset;overflow:visible}
.rf-store-desc-in p{margin:0 0 8px}
.rf-store-desc-in h2,.rf-store-desc-in h3{font-family:var(--mfe);font-size:20px;color:var(--navy);margin:14px 0 6px}
.rf-store-desc-in a{color:var(--orange-ink)}
.rf-store-desc-more.is-off{visibility:hidden} /* the line is reserved from the first paint: revealing the button moves nothing (CLS) */
.rf-store-desc-more{margin-top:4px;border:0;background:none;padding:6px 4px;font:inherit;font-weight:700;color:var(--orange-ink);text-decoration:underline;cursor:pointer}
@media (max-width:767px){.rf-store-desc{font-size:15px;margin-bottom:9px}.rf-store-desc-in{-webkit-line-clamp:3}}

/* ===== Cart / checkout / my account (page-store-system.php, phase B deploy 2): the look the Elementor widgets had —
   cart table right + totals left, customer details right + order review left, grey 15px fields, orange order button. ===== */
.rf-woo-page{padding-block:8px 48px;max-width:1000px;margin-inline:auto}
.rf-woo-page .woocommerce-notices-wrapper{grid-column:1/-1}
.rf-woo-page .woocommerce form .form-row .input-text,.rf-woo-page .woocommerce form .form-row textarea,.rf-woo-page .woocommerce form .form-row select,.rf-woo-page .woocommerce .select2-container .select2-selection--single,.rf-woo-page .woocommerce-cart-form .coupon .input-text{background:#F9FAFA;border:0;border-radius:15px;padding:16px;font-size:.9rem;color:var(--slate);font-family:var(--mfe);box-shadow:none}
.rf-woo-page .woocommerce form .form-row input.input-text,.rf-woo-page .woocommerce .select2-container .select2-selection--single,.rf-woo-page .woocommerce-cart-form .coupon .input-text{height:52px;line-height:1.2}
.rf-woo-page .select2-container .select2-selection--single .select2-selection__rendered{line-height:20px;padding:0}
.rf-woo-page .select2-container .select2-selection--single .select2-selection__arrow{height:50px}
.rf-woo-page label{color:var(--slate);font-size:1rem}
.rf-woo-page h2,.rf-woo-page h3{font-family:var(--mfe);font-weight:700;color:var(--slate)}
.rf-woo-page h3{font-size:1.3rem}
.rf-woo-page table.shop_table{border:0;border-radius:5px;border-collapse:collapse}
.rf-woo-page table.shop_table th,.rf-woo-page table.shop_table td{border:0;border-bottom:1px solid #EEF0F4;padding:12px 8px;text-align:start}
.rf-woo-page table.shop_table th{font-weight:400;color:var(--slate)}
/* cart */
@media (min-width:901px){
  .rf-woo-cart>.woocommerce{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:0 40px;align-items:start}
  .rf-woo-cart>.woocommerce>.woocommerce-notices-wrapper,.rf-woo-cart>.woocommerce>.wc-empty-cart-message,.rf-woo-cart>.woocommerce>.return-to-shop,.rf-woo-cart>.woocommerce>.reef-cart-xsell{grid-column:1/-1}
  .rf-woo-cart .cart-collaterals .cart_totals{width:100%;float:none}
}
.rf-woo-cart .cart_totals h2{font-size:1.2rem;padding:0 0 8px}
.rf-woo-cart .woocommerce-cart-form button[name="update_cart"]{display:none!important}
.rf-woo-cart .wc-proceed-to-checkout a.checkout-button{background:#3F9E34;color:#fff;border-radius:15px;font-family:var(--mfe);font-size:1.1rem;font-weight:400;padding:15px;display:block;text-align:center}
.rf-woo-cart .wc-proceed-to-checkout a.checkout-button:hover{background:#358A2B;color:#fff}
.rf-woo-cart .coupon .button,.rf-woo-page .woocommerce-form-coupon .button{background:var(--orange-soft);color:#fff;border-radius:15px;padding:13px 18px;font-family:var(--mfe);font-weight:400}
/* checkout */
@media (min-width:901px){
  .rf-woo-checkout form.checkout{display:grid;grid-template-columns:minmax(0,1.48fr) minmax(0,1fr);grid-template-areas:"customer heading" "customer review";gap:0 40px;align-items:start}
  .rf-woo-checkout #customer_details{grid-area:customer}
  .rf-woo-checkout #order_review_heading{grid-area:heading;margin-top:0}
  .rf-woo-checkout #order_review{grid-area:review}
}
.rf-woo-checkout #customer_details .col-1,.rf-woo-checkout #customer_details .col-2{float:none;width:100%}
.rf-woo-checkout #payment{background:#fff;border:1px solid #D5D8DC;border-radius:15px;padding:15px}
.rf-woo-checkout #payment ul.payment_methods{border-bottom:1px solid #EEF0F4;padding:0 0 12px}
.rf-woo-checkout #payment div.payment_box{background:#F9FAFA;border-radius:12px;color:var(--slate)}
.rf-woo-checkout #payment div.payment_box::before{display:none}
.rf-woo-checkout #place_order{background:var(--orange);color:#fff;border-radius:35px;padding:16px;width:100%;font-family:var(--mfe);font-size:1rem;font-weight:400;float:none}
.rf-woo-checkout #place_order:hover{background:var(--orange-hover)}
/* while an order is on its way (inc/store-system.php): the same label, a spinner, further taps swallowed */
.rf-woo-checkout #place_order.reef-placing{opacity:.75;cursor:wait}
.rf-woo-checkout #place_order.reef-placing::after{content:"";display:inline-block;width:1em;height:1em;margin-inline-start:.6em;vertical-align:-.15em;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:reef-spin .8s linear infinite}
@keyframes reef-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.rf-woo-checkout #place_order.reef-placing::after{animation-duration:2.4s}}
.rf-woo-page .woocommerce-form-coupon-toggle .woocommerce-info{background:#fff;border:1px solid #D5D8DC;border-radius:15px;color:var(--slate)}
/* account */
.rf-woo-account .woocommerce-form-login,.rf-woo-account .woocommerce-form-register{border:1px solid #D5D8DC;border-radius:15px;padding:20px}
.rf-woo-account .woocommerce-form-login .button,.rf-woo-account .woocommerce-form-register .button,.rf-woo-account .woocommerce-Button{background:var(--orange);color:#fff;border-radius:35px;padding:12px 28px;font-family:var(--mfe);font-weight:400}
.rf-woo-account .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.rf-woo-account .woocommerce-MyAccount-navigation li a{display:block;padding:10px 16px;border-radius:12px;background:#F9FAFA;text-decoration:none;color:var(--slate)}
.rf-woo-account .woocommerce-MyAccount-navigation li.is-active a{background:var(--orange);color:#fff}
@media (min-width:901px){.rf-woo-account .woocommerce-MyAccount-navigation,.rf-woo-account .woocommerce-MyAccount-content{float:none;width:100%}}

/* ---------- "איזה מנעול חכם מתאים לדלת שלכם?" (inc/lock-quiz.php): a full-width item of the grid after the first row ---------- */
.rf-store ul.products li.rf-quiz{grid-column:1/-1;list-style:none;margin:0}
/* the grid's rows are 1fr (every row as tall as the tallest card): with the quiz in it, rows follow their content, else the quiz row is a
   717px box with a 100px card in it; cards in a row still match (stretch) */
.rf-store ul.products:has(> li.rf-quiz){grid-auto-rows:auto}
/* WooCommerce's clearfix (.woocommerce .products ul::before {display:table}) reaches this list too and took its first cell */
.rf-store ul.products ul.rf-quiz-picks::before,.rf-store ul.products ul.rf-quiz-picks::after{content:none;display:none}
.rf-quiz-in{background:linear-gradient(135deg,#FFF1E8 0%,#FFE3CF 100%);border-radius:15px;padding:28px 32px;color:var(--navy);text-align:start}
.rf-quiz-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px}
.rf-quiz-h{font-family:var(--mfe);font-size:28px;line-height:1.2;font-weight:700;margin:0;flex:1 1 360px}
.rf-quiz-sub{font-size:17px;line-height:1.5;color:var(--slate);margin:0;flex:1 1 100%;order:3}
.rf-quiz-go,.rf-quiz-opt,.rf-quiz-back{font-family:var(--mfe);cursor:pointer}
.rf-quiz-box{margin-top:16px}
.rf-quiz-go{display:inline-flex;align-items:center;min-height:48px;padding:12px 28px;border:0;border-radius:15px;background:#AE4F14;color:#fff;font-size:18px;line-height:1;list-style:none}
.rf-quiz-go::-webkit-details-marker{display:none}
.rf-quiz-box[open] > .rf-quiz-go{display:none}
.rf-quiz-go:hover{background-image:linear-gradient(292deg,#E85800 0%,#C95F1D 100%)}
.rf-quiz-steps{margin-top:2px}
.rf-quiz-prog{font-size:14px;color:var(--muted);margin:0 0 6px}
.rf-quiz-step{border:0;margin:0;padding:0;min-width:0}
.rf-quiz-q{font-family:var(--mfe);font-size:22px;line-height:1.3;font-weight:700;margin:0 0 12px;padding:0}
.rf-quiz-q:focus{outline:none}
.rf-quiz-q:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.rf-quiz-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.rf-quiz-opt{min-height:56px;padding:12px 16px;background:#fff;border:1.5px solid #E2D3C8;border-radius:12px;color:var(--navy);font-size:17px;line-height:1.35;text-align:center}
.rf-quiz-opt:hover{border-color:var(--orange-ink)}
.rf-quiz-opt[aria-pressed="true"]{border-color:var(--orange-ink);background:var(--orange-tint)}
.rf-quiz-back{margin-top:6px;min-height:44px;padding:10px 0;background:none;border:0;color:var(--navy);font-size:16px;text-decoration:underline;text-underline-offset:3px}
.rf-quiz-res{margin-top:18px}
.rf-quiz-none{font-size:16px;color:var(--slate);margin:-4px 0 12px}
.rf-quiz-picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;margin:0 0 14px;padding:0}
.rf-quiz-pick-a{display:grid;grid-template-columns:96px 1fr;grid-template-rows:auto auto 1fr;column-gap:14px;align-items:start;height:100%;padding:12px;background:#fff;border-radius:12px;color:var(--navy);text-decoration:none}
.rf-store .rf-quiz-pick-a:hover,.rf-store .rf-quiz-pick-a:focus-visible{color:var(--navy)} /* .rf-store a:hover is orange: 2.9:1 on white */
.rf-quiz-pick-a:hover .rf-quiz-pick-t{text-decoration:underline}
.rf-quiz-pick-a img{grid-row:1/4;width:96px;height:96px;object-fit:contain}
.rf-quiz-pick-t{font-size:16px;line-height:1.35;text-transform:capitalize}
.rf-quiz-pick-k{font-size:13px;color:var(--muted);margin-top:2px}
.rf-quiz-pick-p{font-size:19px;font-weight:700;color:var(--orange-ink);align-self:end;margin-top:6px}
.rf-quiz-note{font-size:15px;line-height:1.55;color:var(--slate);margin:0 0 14px}
.rf-quiz-cta{display:flex;flex-wrap:wrap;gap:10px}
.rf-quiz-cta .btn{min-height:48px}
@media (max-width:767px){
	.rf-store ul.products li.rf-quiz{margin:4px 0}
	.rf-quiz-in{padding:20px 16px}
	.rf-quiz-h{font-size:22px;flex-basis:100%}
	.rf-quiz-sub{font-size:16px;order:2}
	.rf-quiz-go{width:100%;justify-content:center}
	.rf-quiz-q{font-size:19px}
	.rf-quiz-opts{grid-template-columns:1fr}
	.rf-quiz-opt{min-height:52px;font-size:16px;text-align:start}
	.rf-quiz-picks{grid-template-columns:1fr}
	.rf-quiz-pick-a{grid-template-columns:72px 1fr}
	.rf-quiz-pick-a img{width:72px;height:72px}
	.rf-quiz-cta .btn{flex:1 1 140px;padding-inline:12px;font-size:17px}
}
/* product page v2 (20.10, staging only until approved): the buy block right under the price, the description under it, the option cards compact */
.rf-pdp-atc-v2 .wcpa_section{padding:10px 12px!important;margin-bottom:8px!important}
.rf-pdp-atc-v2 .wcpa_field_wrap{margin-bottom:0!important}
.rf-pdp-atc-v2 .wcpa_field_wrap>label,.rf-pdp-atc-v2 .wcpa_field_label{margin-bottom:.3rem!important}
.rf-pdp-atc-v2 .wcpa_type_image-group img{width:54px!important;height:54px!important;object-fit:contain}
.rf-pdp-atc-v2 .wcpa_type_radio-group .wcpa_radio,.rf-pdp-atc-v2 .wcpa_type_checkbox-group .wcpa_checkbox{margin:0 0 .2rem!important;padding:0!important;line-height:1.5}
.rf-pdp-atc-v2 .wcpa_price_summary>div{margin-bottom:4px!important}
.rf-pdp-atc-v2 .wcpa_price_summary .wcpa_total{padding:8px 0!important}

/* PDP v3 (20.10) ==========================================================================================================
   staging only until Mor approves (option reef_pdp_v3; main.rf-pdp-v3). v3 = v2's order + a phone first screen that sells
   (photo ≤ a third of the screen, a thumbnail strip, then H1 · price + payments · install line · colours) and, on desktop, the
   WCPA options in two columns + quantity beside the button, so "הוספה לסל" lands in the first screen. Layout only: every text,
   option, price and field of the WCPA form stays as it is (CSS only, nothing moves in its DOM, so its React state and the
   required-field checks are untouched). ======================================================================================= */
/* price row: the price and the 12-payments box side by side; the install line; real review stars only */
.rf-pdp-v3 .rf-pdp3-pricerow{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:8px 24px;margin-top:4px}
.rf-pdp-v3 .rf-pdp3-pricerow .rf-pdp-price{margin:0;padding:0;background:none;position:static}
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-price .price{margin:0;line-height:1.2}
.rf-pdp-v3 .rf-pdp3-pricerow .reef-pdp-inst{margin:0;padding:6px 12px;gap:8px;border-radius:10px}
.rf-pdp-v3 .rf-pdp3-pricerow .reef-pdp-inst svg{width:18px;height:18px}
.rf-pdp-v3 .rf-pdp3-pricerow .reef-pdp-inst .ttl{font-size:14px;line-height:1.25}
.rf-pdp-v3 .rf-pdp3-pricerow .reef-pdp-inst .sub{font-size:13px;line-height:1.3;color:#7a4d08}
.rf-pdp3-inst-line{display:flex;align-items:center;gap:8px;margin:2px 0 0;font-family:var(--mfe);font-size:17px;font-weight:700;line-height:1.4;color:var(--navy)}
.rf-pdp3-inst-line svg{flex:none;color:var(--orange-ink)}
.rf-pdp3-rating{display:flex;align-items:center;gap:8px;margin:0;font-size:15px;color:var(--slate)}
.rf-pdp3-stars{position:relative;display:inline-block;font-size:17px;line-height:1;color:#B9BEC9;white-space:nowrap}
.rf-pdp3-stars::before,.rf-pdp3-stars > span::before{content:"★★★★★"}
.rf-pdp3-stars > span{position:absolute;inset-block:0;inset-inline-start:0;overflow:hidden;color:#C98A00}
/* the buy block: colours first, quantity beside the button */
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap{display:flex;flex-direction:column}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap > .wcpa_section:has(.wcpa_type_image-group){order:-1} /* Linus has the shipping options first in its form */
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary form.cart:not(.variations_form){flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px}
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary form.cart > *{flex:1 1 100%;min-width:0}
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary form.cart > .reef-qty{flex:0 0 auto!important;width:auto!important;display:flex;align-items:center;gap:8px;margin:0!important} /* the quantity snippet's own CSS sets flex-basis 100% with !important */
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary form.cart > .reef-qty .reef-qty-lbl{margin:0!important;width:auto}
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary form.cart > .single_add_to_cart_button{flex:1 1 0;width:auto;margin:0;min-height:48px}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_image_label{font-size:14px;line-height:1.3;white-space:nowrap;text-align:center}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_image{min-width:56px;text-align:center}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_img_wrap{margin-inline:auto}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_form_outer{margin:4px 0 6px!important}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_radio-group .wcpa_radio label{padding:9px 12px!important}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_radio-group .wcpa_field_desc{margin:2px 0 6px!important}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_price_summary{margin-top:6px!important}
.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-atc p.stock{margin:0 0 2px}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_checkbox-group .wcpa_field{gap:4px}
.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_checkbox-group .wcpa_checkbox{margin:0!important}
/* gallery: a one-row thumbnail strip (scrolls sideways when there are more photos) */
.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs{display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding-block-end:2px}
.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs li{flex:0 0 84px}
.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs img{border:1.5px solid var(--line);opacity:.75}
.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs img.flex-active{border-color:var(--navy);opacity:1}
/* the strip's room before flexslider runs (one row now, whatever the number of photos) */
.rf-store.rf-pdp-v3 div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(2))::after{padding-bottom:0;height:86px;margin-top:10px}
@media (min-width:768px){
	.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary .product_title{line-height:1.25}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.summary.rf-pdp-summary{gap:6px;padding-top:0}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_field{gap:8px}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_image{margin:0!important}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_img_wrap{width:58px!important;height:58px!important} /* four colours in one row of a column */
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group img{width:100%!important;height:100%!important}
	/* the price summary on one row */
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_price_summary{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 18px}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_price_summary > div{margin:0!important;display:flex;gap:6px;align-items:baseline;width:auto}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_price_summary .wcpa_total{padding:4px 0!important}
}
@media (min-width:1200px){ /* two WCPA columns need ~600px of summary: under 1200 the options stay in one column */
	/* WCPA in two columns when the form has the shipping choice and something else: colours + add-ons on one side, the
	   shipping / install choice on the other, the price summary across. A second radio group (none today) falls back to full width. */
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap:has(> .wcpa_section .wcpa_type_radio-group):has(> .wcpa_section .wcpa_type_image-group, > .wcpa_section .wcpa_type_checkbox-group){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:10px;row-gap:0;align-items:start;grid-auto-flow:row dense}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap:has(> .wcpa_section .wcpa_type_radio-group) > .wcpa_section{grid-column:1;min-width:0}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap:has(> .wcpa_section .wcpa_type_radio-group) > .wcpa_section:has(.wcpa_type_radio-group){grid-column:2;grid-row:1 / span 6}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap:has(> .wcpa_section .wcpa_type_radio-group) > .wcpa_section:has(.wcpa_type_radio-group) ~ .wcpa_section:has(.wcpa_type_radio-group){grid-column:1 / -1;grid-row:auto}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_wrap > .wcpa_price_summary{grid-column:1 / -1}
}
@media (max-width:767px){
	/* breadcrumbs on one line (the product name is the H1 right below) */
	.rf-pdp-v3 .rf-pdp-crumbs{min-height:0;padding:5px 16px}
	.rf-pdp-v3 .rf-pdp-crumbs .rf-store-crumbs{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start;font-size:13px;line-height:24px}
	.rf-pdp-v3 .rf-pdp-grid{padding:10px 16px 25px;gap:10px}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.summary.rf-pdp-summary{gap:6px}
	/* the photo: at most a third of the screen, the whole product visible (white backgrounds, so contain) */
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .woocommerce-product-gallery__image img{max-height:33vh;max-height:min(33svh,300px);object-fit:contain}
	/* photos: dots over the photo's bottom edge (swipe or tap a dot); each dot is a 24px target, the thumbnail image stays
	   inside it (transparent) because flexslider listens on the image */
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs{position:absolute;inset-inline:0;bottom:2px;z-index:2;justify-content:center;gap:2px;margin:0;padding:0;overflow:visible}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs li{flex:0 0 24px;height:24px;position:relative}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs img{position:absolute;inset:0;width:24px;height:24px;border:0;opacity:0!important}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs li::after{content:"";position:absolute;inset:8px;border-radius:50%;background:#7C8394;pointer-events:none}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images .flex-control-thumbs li:has(img.flex-active)::after{inset:7px;background:var(--navy)}
	.rf-store.rf-pdp-v3 div.product.rf-pdp div.images:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(2))::after{content:none}
	/* H1, chips, price row: start-aligned and tighter */
	.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary .product_title{font-size:24px;line-height:1.22;text-align:start;-webkit-text-stroke-width:1px}
	.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary > .rf-pdp-chips{text-align:start;margin-top:-4px}
	.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary .reef-pdp-shabbat{margin:0;padding:4px 10px;font-size:13px}
	.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-summary .reef-pdp-oos{margin:0 0 0 6px;padding:4px 12px}
	.rf-pdp-v3 .rf-pdp3-pricerow{margin-top:0;gap:6px 14px}
	.rf-pdp-v3 .rf-pdp3-pricerow .reef-pdp-inst{padding:5px 10px}
	.rf-store.rf-pdp-v3 div.product.rf-pdp .rf-pdp-price .price{font-size:25px}
	.rf-pdp-v3 .rf-pdp3-inst-line{font-size:16px;margin:0}
	/* colour swatches: smaller tiles so the first option row sits in the first screen */
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_img_wrap{width:50px!important;height:50px!important}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group img{width:100%!important;height:100%!important}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_field{gap:6px 12px}
	.rf-pdp-v3 .rf-pdp-atc-v2 .wcpa_type_image-group .wcpa_image{margin:0!important}
}

/* 21.10.2026 (F3, conductor delegation): the PDP crumbs line up with the product grid (and the header) on wide screens instead of hugging the page edge. */
@media (min-width:1024px){.rf-pdp-crumbs .rf-store-crumbs{box-sizing:border-box;width:100%;max-width:1470px;margin-inline:auto;padding-inline:15px}}

/* Titles: no one-word last line on phones (growth 22.10, states audit 360-430 on the parking-barrier PDPs and cards; balance also helps the existing products) */
.rf-store div.product.rf-pdp .product_title,.rf-store ul.products li.rf-pcard .rf-pcard-title{text-wrap:balance}

/* PDP lightbox (PhotoSwipe), 28.10.2026: the counter reads "1 / 3" in RTL too (it showed "3 / 1"; plaintext orders the digits
   left to right and keeps its place in the RTL top bar), and the assistant + a11y buttons (z 9980 / 99990, above the lightbox's
   1500) step aside while it is open (display, not visibility: the assistant's label pill sets its own visibility). */
.pswp__counter{unicode-bidi:plaintext}
body:has(.pswp--open) :is(#rf-as,#reef-a11y-trigger,#reef-sticky-cta){display:none!important} /* + the phone add-to-cart bar (conductor 8, 28.10) */