/* RANCO — ORI product page, a lighter way to choose (local copy). The site's language: Rubik (the only font the site loads, weights 300-600), black on white, radius 12, no orange.
   Desktop: the gallery column (the photo) stays on screen; the panel in the summary column shows every section.
   Mobile (≤1024): the panel = the photo pinned under the header + tabs + one short section + a black price bar at the bottom. */
.rc-copy-tag{position:fixed;top:10px;left:10px;z-index:99999;background:#141414;color:#fff;font:500 12px Rubik,sans-serif;border-radius:6px;padding:4px 10px;pointer-events:none}
.rc-hide{display:none !important}

/* ================= the line under the title: SKU · category · tag, then wishlist and compare as icons — one row ================= */
.rc-strip.ranco-pm-strip{display:flex !important;align-items:center;gap:14px;flex-wrap:nowrap !important;margin:6px 0 0 !important;padding:9px 0 !important;
  border-top:1px solid #EEECE8;border-bottom:1px solid #EEECE8;font-family:Rubik,sans-serif;direction:rtl}
.rc-strip > *{margin:0 !important;padding:0 !important;flex:none;width:auto !important;max-width:none !important}
.rc-strip.ranco-pm-strip > * + *::before{content:none !important;display:none !important}   /* the site's '|' dividers */
.rc-strip.ranco-pm-strip > :first-child{flex:1 1 0 !important;min-width:0 !important;width:auto !important}
.rc-strip .product_meta{display:flex !important;align-items:center;gap:0;flex-wrap:nowrap;margin:0 !important;padding:0 !important;border:0 !important;
  font-size:13px !important;line-height:1.4;color:#76716A;white-space:nowrap;overflow:hidden}
.rc-strip .product_meta > span{display:inline-flex !important;align-items:center;gap:4px;margin:0 !important;padding:0 !important;flex:none}
.rc-strip .product_meta > span + span::before{content:'·';margin:0 9px;color:#BDB7AE}
.rc-strip .product_meta > span:last-child{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.rc-strip .meta-label{color:#9A958D;font-weight:400 !important}
.rc-strip .product_meta a,.rc-strip .sku{color:#3a3a3a !important;font-weight:400 !important;text-decoration:none}
.rc-strip .wd-action-btn > a{display:inline-grid !important;place-items:center;width:32px;height:32px;padding:0 !important;border:1px solid #E6E3DE;border-radius:50%;color:#141414 !important;background:#fff}
.rc-strip .wd-action-btn > a:hover{border-color:#141414}
.rc-strip .wd-action-text{display:none !important}
.rc-strip .wd-action-icon{margin:0 !important}
/* the short description under it */
.rc-about{margin:14px 0 4px;font-family:Rubik,sans-serif;direction:rtl}
.rc-about p{margin:0;font-size:14.5px;line-height:1.7;color:#3a3a3a;max-width:620px}
/* the four icons (#ranco-dvs-features), smaller, in one row */
.rc-on #ranco-dvs-features{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:0 !important;margin:14px 0 6px !important;padding:0 !important;
  border:1px solid #EEECE8 !important;border-radius:12px !important;overflow:hidden;width:100% !important;max-width:none !important;background:#fff}
.rc-on #ranco-dvs-features .rofi-cell{display:flex !important;flex-direction:column;align-items:center;gap:2px;padding:9px 4px !important;min-height:0 !important;
  border:0 !important;border-inline-start:1px solid #EEECE8 !important;text-align:center}
.rc-on #ranco-dvs-features .rofi-cell:first-child{border-inline-start:0 !important}
.rc-on #ranco-dvs-features .rofi-icon{width:18px !important;height:18px !important;margin:0 0 2px !important}
.rc-on #ranco-dvs-features .rofi-icon svg{width:18px !important;height:18px !important}
.rc-on #ranco-dvs-features .rofi-value{font-size:13px !important;font-weight:600;line-height:1.25;white-space:nowrap}
.rc-on #ranco-dvs-features .rofi-label{font-size:11px !important;color:#8a857e;line-height:1.25;white-space:nowrap}

.rc-cfg{--ink:#141414;--ink-2:#3a3a3a;--mute:#76716A;--line:#E8E6E1;--soft:#F6F5F2;font-family:Rubik,sans-serif;direction:rtl;color:var(--ink);text-align:right}
.rc-cfg *{box-sizing:border-box}
/* the theme's own labels (NEW, sale) and its 360 button sit on the photo: on these pages the photo is ours */
.rc-on .product-labels,.rc-on .product-360-button{display:none !important}
/* "דגם חדש": a black corner label with a small star (the same on the home page card and banner) */
.rc-new{position:absolute;top:14px;right:14px;z-index:5;display:inline-flex;align-items:center;gap:5px;padding:7px 11px 7px 12px;border-radius:999px;
  background:#141414;color:#fff;font:500 12px/1 Rubik,sans-serif;letter-spacing:.02em;box-shadow:0 4px 14px rgba(20,18,15,.18);pointer-events:none}
.rc-new svg{width:11px;height:11px;flex:none}
/* the product template's column is a wrapping flex column on a phone (--flex-wrap-mobile): Chrome then sizes the panel short and
   the bar spills over the next line (seen on Daniel). The column that holds the panel does not wrap. */
.rc-cfg,.rc-gal,.rc-spec,.rc-about{flex-shrink:0}
.rc-on .e-con:has(> .rc-cfg){flex-wrap:nowrap !important}
/* the theme paints every <button>: reset ours */
.rc-cfg button,.rc-photo button{font:inherit;color:inherit;background:none;border:0;margin:0;padding:0;min-height:0;min-width:0;line-height:1.3;text-transform:none;letter-spacing:0;box-shadow:none;border-radius:0;cursor:pointer;text-align:inherit}
.rc-cfg button:focus-visible,.rc-cfg select:focus-visible{outline:1.5px solid #141414;outline-offset:2px}

/* ================= the photo ================= */
.rc-photo{position:relative;width:100%;aspect-ratio:3/2;direction:ltr}
.rc-canv{position:absolute;inset:0;overflow:hidden}   /* the photo is cropped to the shared frame; the ring labels may stick out */
.rc-photo canvas{position:absolute;inset:0;width:100%;height:100%;display:block;max-width:none}
.rc-prev,.rc-glow{pointer-events:none;opacity:0}
.rc-glow.on{animation:rcGlow .9s ease-out}
@keyframes rcGlow{0%{opacity:0}25%{opacity:1}100%{opacity:0}}
.rc-photo.is-hot{cursor:pointer}
.rc-load{position:absolute;inset:0;display:grid;place-items:center;font:13px Rubik,sans-serif;color:#8a8a8a}
.rc-photo.is-ready .rc-load{display:none}
.rc-busy{position:absolute;top:10px;left:10px;width:18px;height:18px;border-radius:50%;border:2px solid rgba(20,20,20,.15);border-top-color:#141414;opacity:0;transition:opacity .2s;animation:rcSpin .8s linear infinite}
.rc-photo.is-busy .rc-busy{opacity:1}
@keyframes rcSpin{to{transform:rotate(360deg)}}
.rc-photo .rc-dot{position:absolute;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.92) !important;box-shadow:0 1px 4px rgba(0,0,0,.25);opacity:0;transition:opacity .3s}
.rc-rings .rc-photo.is-ready .rc-dot{opacity:1}
.rc-photo .rc-dot[hidden]{display:none}
.rc-dot::before{content:'';position:absolute;inset:6px;border-radius:50%;background:#141414;transform:scale(.55);transition:transform .2s}
.rc-dot::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(255,255,255,.95);animation:rcPulse 1.8s ease-out infinite}
.rc-dot.on::before{transform:scale(1)}
.rc-dot.on::after{animation:none;border-color:transparent}
.rc-dot span{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);white-space:nowrap;direction:rtl;font:500 12px/1.3 Rubik,sans-serif;color:#141414;
  background:#fff;border-radius:6px;padding:3px 8px;box-shadow:0 1px 4px rgba(0,0,0,.14);opacity:0;transition:opacity .2s;pointer-events:none}
.rc-dot.on span,.rc-dot:hover span{opacity:1}
@keyframes rcPulse{0%{transform:scale(.6);opacity:.95}100%{transform:scale(1.5);opacity:0}}
/* desktop: the first slide of the gallery */
.rc-slide{position:relative}
.rc-gallery{position:absolute;inset:0;z-index:2;background:#fff;display:flex;align-items:center;justify-content:center}
/* the theme's small photos under the main photo: not needed, the gallery under the panel has them all */
.rc-galcol .wd-gallery-thumb{display:none !important}

/* ================= the panel ================= */
.rc-cfg{margin:22px 0 26px;border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}
.rc-mphoto,.rc-bar,.rc-panel-head,.rc-hint{display:none}
.rc-dock,.rc-panel{display:contents}   /* desktop: the sections sit in the column as they are */
.rc-body{padding:4px 22px 0}
.rc-sec{padding:18px 0 20px;border-top:1px dashed #E2DFD9}
.rc-sec:first-child{border-top:0}
.rc-h{display:flex;align-items:center;gap:10px;margin:0 0 14px;font:600 16px/1.2 Rubik,sans-serif;color:var(--ink)}
.rc-n{width:24px;height:24px;border-radius:50%;border:1.5px solid #141414;display:grid;place-items:center;font-size:12.5px;font-weight:600;flex:none}
.rc-lbl{margin:0 0 8px;font-size:13px;color:var(--mute)}
.rc-note{margin:10px 0 0;font-size:12.5px;line-height:1.5;color:var(--mute)}
.rc-note[hidden],.rc-explain[hidden],[data-dim-friend][hidden],.rc-fmat[hidden],.rc-part[hidden]{display:none}
.rc-next{display:none}
.rc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* size: one select, like the stepper, and the measures under it */
.rc-select{position:relative;display:block}
.rc-select::after{content:'';position:absolute;left:16px;top:50%;width:8px;height:8px;border-left:1.5px solid #141414;border-bottom:1.5px solid #141414;transform:translateY(-70%) rotate(-45deg);pointer-events:none}
.rc-cfg select{appearance:none;-webkit-appearance:none;width:100%;height:50px;margin:0;padding:0 16px 0 44px;border:1px solid #141414;border-radius:12px;background:#fff;
  font:500 16px Rubik,sans-serif;color:#141414;direction:rtl;cursor:pointer;box-shadow:none}
.rc-dims{display:flex;margin:12px 0 0;padding:12px 0;border:1px solid #EEECE8;border-radius:12px;background:var(--soft)}
.rc-dims div{flex:1;padding:0 14px;border-inline-start:1px solid #E6E3DE;display:flex;flex-direction:column;gap:3px;min-width:0}
.rc-dims div:first-child{border-inline-start:0}
.rc-dims dt{font-size:11.5px;color:var(--mute)}
.rc-dims dd{margin:0;font-size:14px;font-weight:500;white-space:nowrap}
/* segmented control */
.rc-cfg .rc-seg{display:flex;background:rgba(20,20,20,.055);border-radius:10px;padding:3px;gap:2px}
.rc-cfg .rc-seg button{flex:1;display:flex;flex-direction:column;align-items:center;gap:0;font-size:14px;font-weight:400;color:#4a4a4a;padding:7px 8px;border-radius:8px;transition:background .18s,color .18s}
.rc-cfg .rc-seg button small{font-size:11px;color:var(--mute)}
.rc-cfg .rc-seg button:hover{color:#141414}
.rc-cfg .rc-seg button[aria-pressed="true"]{background:#fff;color:#141414;font-weight:500;box-shadow:0 1px 2px rgba(0,0,0,.10),0 0 0 .5px rgba(0,0,0,.06)}
/* cards (under the bed), each with its picture */
.rc-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rc-cfg .rc-cards button{position:relative;display:flex;flex-direction:column;gap:2px;border:1px solid #E6E3DE;border-radius:12px;padding:8px 10px 10px;transition:border-color .18s}
.rc-cfg .rc-cards button:hover{border-color:#C9C4BC}
.rc-cards img{display:block;width:78%;height:52px;object-fit:contain;margin:0 auto 4px;background:#fff}   /* small: a hint of the picture, not a poster */
.rc-cfg .rc-cards b{font-size:14px;font-weight:500}
.rc-cfg .rc-cards small{font-size:12px;color:var(--mute)}
.rc-cfg .rc-cards button[aria-pressed="true"]{border-color:#141414;box-shadow:inset 0 0 0 .5px #141414}
.rc-cfg .rc-cards button[aria-pressed="true"]::after{content:'';position:absolute;top:8px;left:8px;width:17px;height:17px;border-radius:50%;
  background:#141414 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-4.9' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/10px no-repeat}
.rc-explain{display:flex;gap:14px;align-items:center;margin-top:12px;padding:12px;border-radius:12px;background:var(--soft)}
.rc-explain img{width:34%;flex:none;border-radius:8px;background:#fff;display:block}
.rc-explain p{margin:0;font-size:13px;line-height:1.6;color:var(--ink-2)}
.rc-explain b{color:var(--ink);font-weight:600}
/* colours: one row per part — its name and tone on the right, five fine swatches on the left */
.rc-parts{display:flex;flex-direction:column;gap:2px}
.rc-part{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 10px;margin:0 -10px;border-radius:10px;transition:background .18s}
.rc-part.on{background:var(--soft)}
.rc-cfg .rc-part-name{display:flex;flex-direction:column;gap:1px;font-size:14px;font-weight:500;min-width:0}
.rc-cfg .rc-part-name small{font-size:12px;font-weight:400;color:var(--mute)}
.rc-sw{display:flex;gap:11px;flex:none}
.rc-cfg .rc-sw button{width:22px;height:22px;border-radius:50%;border:.5px solid rgba(0,0,0,.18);transition:box-shadow .18s,transform .18s}
.rc-cfg .rc-sw button.is-wood{background:linear-gradient(135deg,#f0dba8 0%,#d9b875 55%,#ecd2a0 100%)}
.rc-cfg .rc-sw button:hover{transform:scale(1.1)}
.rc-cfg .rc-sw button[aria-checked="true"]{box-shadow:0 0 0 2.5px #fff,0 0 0 3.5px #141414}
/* check boxes (the mattress, the terms) */
.rc-check{display:flex;align-items:flex-start;gap:12px;cursor:pointer;padding:12px 14px;border:1px solid #E6E3DE;border-radius:12px;transition:border-color .18s}
.rc-check:hover{border-color:#C9C4BC}
.rc-check input{position:absolute;opacity:0;pointer-events:none}
.rc-box{width:20px;height:20px;flex:none;margin-top:1px;border-radius:6px;border:1.5px solid #BDB7AE;transition:background .15s,border-color .15s}
.rc-check input:checked + .rc-box{border-color:#141414;background:#141414 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-4.9' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.rc-check input:focus-visible + .rc-box{outline:1.5px solid #141414;outline-offset:2px}
.rc-check:has(input:checked){border-color:#141414}
.rc-check-t{display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.45}
.rc-check-t b{font-weight:500}
.rc-check-t small{font-size:12.5px;color:var(--mute)}
.rc-check a{color:#141414;text-decoration:underline;text-underline-offset:3px}
.rc-fmat{margin-top:16px}
.rc-agree{margin-top:12px}
.rc-agree.rc-nudge{animation:rcNudge .6s ease}
@keyframes rcNudge{0%,100%{transform:none}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
/* summary: the receipt */
.rc-receipt{display:flex;flex-direction:column;gap:7px;font-size:13.5px;padding:12px 14px;border-radius:12px;background:var(--soft)}
.rc-receipt div{display:flex;justify-content:space-between;gap:10px;color:var(--ink-2)}
.rc-receipt div span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums}
.rc-receipt .tot{border-top:1px solid #E6E3DE;padding-top:7px;color:var(--ink);font-weight:600}
/* the price: a black card at the foot of the panel */
.rc-buy{position:relative;background:#141414;color:#F4F2EE;padding:16px 22px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.rc-total{display:flex;align-items:baseline;gap:10px}
.rc-total small{font-size:12.5px;color:#A7A29A}
.rc-total b{font-size:28px;font-weight:500;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.rc-cfg .rc-cart{background:#fff;color:#141414;border-radius:10px;padding:13px 24px;font-size:15.5px;font-weight:500;white-space:nowrap;transition:background .2s,opacity .2s}
.rc-cfg .rc-cart:hover{background:#ECEAE6}
.rc-cfg .rc-cart[aria-disabled="true"]{opacity:.55}
.rc-toast{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);background:#141414;color:#fff;font:14px Rubik,sans-serif;border-radius:10px;padding:10px 18px;opacity:0;transition:opacity .25s;pointer-events:none;z-index:99999;white-space:nowrap}
.rc-toast.on{opacity:1}
/* the gallery: every ORI photo in the same square, one at a time on a phone (three on a desktop), a soft dark veil, a counter
   with the time to the next photo; a tap enlarges */
.rc-gal{direction:rtl;margin:34px 0 26px;padding:0 29px;box-sizing:border-box;font-family:Rubik,sans-serif}
.rc-gal-frame{position:relative}
.rc-gal-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;border-radius:14px}
.rc-gal-track::-webkit-scrollbar{display:none}
.rc-gal-slide{position:relative;flex:0 0 calc((100% - 24px) / 3);aspect-ratio:1/1;margin:0;scroll-snap-align:start;border-radius:14px;overflow:hidden;background:#F3F2EF}
.rc-gal-slide img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in;transition:transform .6s ease}
.rc-gal-slide::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(20,20,20,.42) 0%,rgba(20,20,20,.10) 38%,rgba(20,20,20,.06) 100%)}   /* the soft veil */
.rc-gal-slide figcaption{position:absolute;right:16px;bottom:16px;z-index:1;color:#fff;font-size:14.5px;font-weight:500;line-height:1.3;text-shadow:0 1px 6px rgba(0,0,0,.35);pointer-events:none}
.rc-gal-count{position:absolute;left:14px;bottom:14px;z-index:2;display:flex;align-items:center;gap:8px;direction:ltr;color:#fff;font-size:13px;font-variant-numeric:tabular-nums;
  background:rgba(20,20,20,.46);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;padding:7px 12px 7px 13px;pointer-events:none}
.rc-gal-count b{font-weight:600}
.rc-gal-count i{width:14px;height:1px;background:rgba(255,255,255,.6)}
.rc-gal-count span{opacity:.75}
.rc-gal-prog{position:relative;width:34px;height:2px;margin-left:4px;border-radius:2px;background:rgba(255,255,255,.28);overflow:hidden}
.rc-gal-prog u{position:absolute;inset:0;width:100%;background:#fff;transform-origin:left;transform:scaleX(0)}
.rc-gal.is-seen .rc-gal-prog u{animation:rcProg 4.5s linear forwards}
@keyframes rcProg{to{transform:scaleX(1)}}
.rc-gal-arrow{position:absolute;top:50%;z-index:2;width:42px;height:42px;margin:-21px 0 0;padding:0;min-height:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.92);color:#141414;font:400 26px/1 Rubik,sans-serif;box-shadow:0 2px 10px rgba(0,0,0,.15)}
.rc-gal-arrow[data-gal="-1"]{right:12px}
.rc-gal-arrow[data-gal="1"]{left:12px}
/* every text the page adds is Rubik, as the site (a font the site does not load falls back to the system's) */
.rc-cfg,.rc-cfg *,.rc-gal,.rc-gal *,.rc-spec,.rc-spec *,.rc-zoom,.rc-about,.rc-about *,.rc-toast,.rc-photo .rc-dot span{font-family:Rubik,sans-serif !important}

/* the measures: a title that says what this is, the four heights that matter, and one card for each view of the drawing */
.rc-spec{direction:rtl;margin:6px 0 44px;padding:0 29px;color:#141414}
.rc-spec-head{margin:0 0 18px}
.rc-spec-kicker{margin:0 0 4px;font-size:12.5px;font-weight:400;letter-spacing:.06em;color:#8A847D}
.rc-spec-head h3{margin:0;font-size:24px;font-weight:500;line-height:1.25;color:#141414;letter-spacing:0}
.rc-spec-intro{margin:6px 0 0;font-size:15px;font-weight:300;line-height:1.6;color:#57524C;max-width:620px}
.rc-spec-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 18px;padding:0;border:1px solid #EEECE8;border-radius:12px;background:#FAFAF8;overflow:hidden}
.rc-spec-facts div{display:flex;flex-direction:column;gap:3px;padding:14px 18px;border-inline-start:1px solid #EEECE8;min-width:0}
.rc-spec-facts div:first-child{border-inline-start:0}
.rc-spec-facts dd{order:-1;margin:0;font-size:22px;font-weight:500;line-height:1.1;color:#141414;font-variant-numeric:tabular-nums}
.rc-spec-facts dd small{margin-inline-start:4px;font-size:13px;font-weight:400;color:#57524C}
.rc-spec-facts .is-long dd{font-size:19px}
.rc-spec-facts dt{margin:0;font-size:13px;font-weight:300;line-height:1.35;color:#6E6862}
.rc-spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rc-spec .rc-spec-card{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;height:100%;margin:0;padding:0;min-height:0;border:0;border-radius:14px;overflow:hidden;
  background:#fff;cursor:zoom-in;text-align:right;color:inherit;text-transform:none;letter-spacing:0;line-height:1.3;
  box-shadow:0 1px 2px rgba(20,18,15,.04),0 8px 22px -10px rgba(20,18,15,.10);transition:transform .25s ease,box-shadow .25s ease}
.rc-spec .rc-spec-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(20,18,15,.05),0 14px 28px -12px rgba(20,18,15,.16)}
.rc-spec .rc-spec-card:focus-visible{outline:1.5px solid #141414;outline-offset:3px}
.rc-spec-img{display:block;width:100%;aspect-ratio:16/10;overflow:hidden;background:#fff;border-bottom:1px solid #F0EEEA}
.rc-spec-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .5s ease}
.rc-spec .rc-spec-card:hover .rc-spec-img img{transform:scale(1.03)}
.rc-spec-cap{display:flex;align-items:center;gap:14px;width:100%;box-sizing:border-box;margin-top:auto;padding:14px 18px}
.rc-spec-n{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #D9D5CF;font-size:12px;font-weight:500;color:#141414;font-variant-numeric:tabular-nums}
.rc-spec-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rc-spec-t strong{font-size:15.5px;font-weight:500;color:#141414}
.rc-spec-t em{font-style:normal;font-size:13px;font-weight:300;color:#6E6862}
.rc-spec-zoom{flex:none;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:#F3F1EE;font-size:12.5px;font-weight:400;color:#141414}
.rc-spec-zoom svg{width:15px;height:15px}
.rc-zoom{position:fixed;inset:0;z-index:100000;background:rgba(20,20,20,.92);display:none;align-items:center;justify-content:center}
.rc-zoom.on{display:flex}
.rc-zoom img{max-width:94vw;max-height:84vh;object-fit:contain;border-radius:8px;background:#fff}
.rc-zoom button{position:absolute;border:0;margin:0;min-height:0;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font:400 28px/1 Rubik,sans-serif;cursor:pointer;padding:0}
.rc-zoom [data-z="x"]{top:16px;right:16px}
.rc-zoom [data-z="p"]{right:12px;top:50%;margin-top:-22px}
.rc-zoom [data-z="n"]{left:12px;top:50%;margin-top:-22px}
.rc-zoom.one [data-z="p"],.rc-zoom.one [data-z="n"]{display:none}
html.rc-zoomed{overflow:hidden}
.rc-note-plus{color:#141414;background:var(--soft,#F6F5F2);border-radius:10px;padding:8px 12px}
/* desktop: the gallery column stays on screen while the customer goes through the panel */
@media (min-width:1025px){
  .rc-galcol{position:sticky !important;top:90px;align-self:flex-start}
}

/* ================= mobile ================= */
@media (max-width:1024px){
  .rc-gal{margin:22px -10px 6px;padding:0 !important}
  .rc-spec{margin:30px 0 10px;padding:0 10px !important}
  .rc-spec-head h3{font-size:21px}
  .rc-spec-intro{font-size:14px}
  /* the four heights in one row: small, centred, the label may take two lines */
  /* phone: small and light (Ran: the heights read too heavy) */
  .rc-spec-facts div{align-items:center;text-align:center;gap:3px;padding:10px 3px}
  .rc-spec-facts dd{font-size:15px;font-weight:400;white-space:nowrap}
  .rc-spec-facts dd small{margin-inline-start:2px;font-size:10px;font-weight:300}
  .rc-spec-facts dt{font-size:10.5px;line-height:1.3}
  .rc-spec-facts .is-long dd{font-size:12.5px}   /* a value like 196/95 keeps inside its quarter */
  .rc-spec-grid{grid-template-columns:1fr;gap:14px}
  .rc-spec-img{aspect-ratio:4/3}
  .rc-spec-card.is-wide .rc-spec-img{aspect-ratio:2/1}
  .rc-spec-cap{padding:12px 14px;gap:12px}
  .rc-spec-zoom span{display:none}
  .rc-spec-zoom{padding:8px}
  /* the theme's price and its empty short description were left alone between the photos and the tabs: the price is on the photo and in the summary */
  .rc-on [data-widget_type^="wd_single_product_price"],.rc-on [data-widget_type^="wd_single_product_short_description"]{display:none !important}
  .rc-gal-track{gap:0;border-radius:0}
  .rc-gal-slide{flex-basis:100%;border-radius:0}
  .rc-gal-arrow{display:none}
  .rc-strip.ranco-pm-strip{gap:8px;padding:7px 0 !important}
  .rc-strip .product_meta{font-size:12px !important}
  .rc-strip .product_meta > span + span::before{margin:0 6px}
  .rc-strip .posted_in .meta-label,.rc-strip .tagged_as .meta-label{display:none}   /* a phone keeps the values: O-102 · מיטות ילדים מעץ · אורי */
  .rc-strip .wd-action-btn > a{width:30px;height:30px}
  .rc-about{margin:12px 0 0}
  .rc-about p{font-size:13.5px;line-height:1.65}
  .rc-on #ranco-dvs-features .rofi-cell{padding:7px 2px !important}
  .rc-on #ranco-dvs-features .rofi-value{font-size:12px !important}
  .rc-on #ranco-dvs-features .rofi-label{font-size:10px !important}
  .rc-on #ranco-dvs-features .rofi-icon,.rc-on #ranco-dvs-features .rofi-icon svg{width:16px !important;height:16px !important}
  .rc-galcol{display:none !important}

  /* the photo: big and clear, full width, under the title */
  /* the line, the description, the icons and the photos keep the title's right edge (the column's text inset is 10 px more) */
  .rc-strip.ranco-pm-strip,.rc-about,.rc-on #ranco-dvs-features{margin-right:10px !important;margin-left:10px !important}
  .rc-on #ranco-dvs-features{width:auto !important}
  .rc-strip.ranco-pm-strip{margin-top:0 !important}   /* the column's own gap (20px) is the space under the bar */
  .rc-cfg{margin:4px -10px 0;border:0;border-radius:0;overflow:visible;width:auto;background:none}
  .rc-mphoto{display:block;position:relative;background:#fff;padding:22px 2px 18px}   /* white, as the desktop photo (Ran)*/
  .rc-mphoto .rc-canv{mix-blend-mode:multiply}   /* the white of the render melts into the grey */
  .rc-pill{position:absolute;top:10px;left:12px;z-index:3;font:600 14px/1 Rubik,sans-serif;color:#141414;background:#fff;border-radius:8px;padding:7px 10px;
    box-shadow:0 1px 2px rgba(0,0,0,.06),0 4px 12px rgba(20,20,20,.08);font-variant-numeric:tabular-nums}
  /* the bar: right under the photo, five steps on a white rectangle with small corners; the open step's choices under it */
  .rc-dock{display:block;padding:12px 12px 8px}
  /* the hint: a small black label over the bar with an arrow that bounces down to it, and the first step pulsing, until the first
     touch of the bar (then never again on this browser) */
  .rc-dock{position:relative}
  .rc-hint{position:absolute;left:50%;top:-6px;z-index:4;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:0;
    pointer-events:none;animation:rcHintIn .4s ease-out .6s both}
  .rc-hint span{display:block;white-space:nowrap;background:#141414;color:#fff;font-size:12.5px;font-weight:400;line-height:1;padding:8px 12px;border-radius:999px;
    box-shadow:0 4px 14px rgba(20,18,15,.18)}
  .rc-hint svg{width:18px;height:18px;margin-top:1px;color:#141414;animation:rcHintBob 1.3s ease-in-out infinite}
  .rc-cfg:not(.rc-hinted) .rc-bar [data-tab]:first-child{animation:rcHintPulse 1.8s ease-out infinite}
  .rc-cfg.rc-hinted .rc-hint{display:none}
  @keyframes rcHintIn{from{opacity:0;transform:translate(-50%,-80%)}to{opacity:1;transform:translate(-50%,-100%)}}
  @keyframes rcHintBob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
  @keyframes rcHintPulse{0%{box-shadow:0 0 0 0 rgba(20,20,20,.22)}70%{box-shadow:0 0 0 9px rgba(20,20,20,0)}100%{box-shadow:0 0 0 0 rgba(20,20,20,0)}}
  @media (prefers-reduced-motion:reduce){ .rc-hint,.rc-hint svg,.rc-cfg .rc-bar [data-tab]:first-child{animation:none !important} }
  .rc-bar{display:grid;grid-template-columns:repeat(var(--rc-n,5),minmax(0,1fr));gap:2px;padding:5px;border-radius:12px;background:#fff;
    border:0;box-shadow:0 1px 2px rgba(20,18,15,.04),0 8px 22px -10px rgba(20,18,15,.10)}
  .rc-cfg .rc-bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 2px 7px;border-radius:8px;color:#6E6862;
    transition:background .18s,color .18s;min-width:0}
  .rc-bar svg{width:21px;height:21px;display:block;stroke-width:1.35}
  .rc-bar span{font-size:11.5px;font-weight:400;line-height:1.1;white-space:nowrap;letter-spacing:.01em}
  .rc-cfg .rc-bar button[aria-selected="true"]{background:#F3F1EE;color:#141414}
  .rc-cfg .rc-bar button[aria-selected="true"] span{font-weight:500}
  .rc-panel{display:none;flex-direction:column;margin-top:10px;background:#fff;border-radius:12px;overflow:hidden;
    border:0;box-shadow:0 1px 2px rgba(20,18,15,.04),0 8px 22px -10px rgba(20,18,15,.10);animation:rcDown .2s ease-out}
  .rc-cfg.is-open .rc-panel{display:flex}
  @keyframes rcDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  .rc-panel-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 4px 10px;flex:none}
  .rc-panel-head b{font-size:15px;font-weight:500}
  .rc-cfg .rc-close{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;color:#141414;background:#F3F2EF}
  .rc-close svg{width:18px;height:18px;transform:rotate(180deg)}
  .rc-body{padding:0 14px 12px}
  .rc-sec{display:none;border:0;padding:6px 0 4px}
  .rc-sec.is-open{display:block}
  .rc-h{display:none}
  .rc-cfg .rc-next{display:block;width:100%;margin-top:12px;border:1px solid #D9D5CF;border-radius:10px;padding:10px;text-align:center;font-size:14px;font-weight:400}
  /* the price and the cart: inside the summary step */
  .rc-buy{display:none;margin:0 10px 10px;border-radius:12px;padding:10px 12px 10px 14px;flex:none}
  .rc-cfg.on-sum .rc-buy{display:flex}
  .rc-total b{font-size:21px}
  .rc-total small{display:none}
  .rc-cfg .rc-cart{padding:11px 18px;font-size:15px}

  /* the choices, compact */
  .rc-cfg select{height:46px;font-size:15.5px}
  .rc-dims div{padding:0 10px}
  .rc-dims dd{font-size:13px}
  .rc-cards{gap:6px}
  .rc-cfg .rc-cards button{padding:6px 7px 8px}
  .rc-cards img{height:40px;width:84%}
  .rc-cfg .rc-cards b{font-size:13px}
  .rc-cfg .rc-cards small{font-size:11px}
  .rc-explain{gap:10px;padding:10px;align-items:flex-start}
  .rc-explain img{width:32%}
  .rc-explain p{font-size:12.5px;line-height:1.55}
  .rc-part{padding:6px 8px;margin:0 -8px}
  .rc-cfg .rc-part-name{font-size:13.5px}
  .rc-sw{gap:10px}
  .rc-cfg .rc-sw button{width:24px;height:24px}
  .rc-note{font-size:12px;margin-top:8px}
}