/* =====================================================================
   Ron Ben Zvi – Makeup Landing
   Pixel-perfect CSS rebuilt 1:1 from Figma (frame 460:549, 1600×13100).
   Coordinates are in design pixels; the whole canvas is scaled to the
   viewport by rbz-landing.js.
   ===================================================================== */

:root {
	--rbz-rose:      #aa817d;
	--rbz-gold:      #b29457;
	--rbz-gold-solid:#a99161;
	--rbz-nav-bg:    rgba(232, 197, 193, 0.8); /* #E8C5C1 @ 80% */
	--rbz-ink:       #1e1e1e;
	--rbz-rubik: 'Rubik', 'Noto Sans Hebrew', sans-serif;
	--rbz-noto:  'Noto Sans Hebrew', 'Rubik', sans-serif;
}

/* ---- Canvas / scaling ------------------------------------------------ */
.rbz-viewport {
	position: relative;
	width: 100%;
	overflow: hidden;
	background: #ffffff;
	direction: rtl;
}
.rbz-canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 1600px;
	transform-origin: top left;
	overflow: hidden;
}
.rbz-section {
	position: absolute;
	left: 0;
	width: 1600px;
	overflow: visible;
}

/* Reset inside the design so themes can't leak in */
.rbz-viewport * { box-sizing: border-box; margin: 0; padding: 0; }
.rbz-viewport a { text-decoration: none; }

/* Theme hardening: neutralize host-theme styles that leak onto our elements
   (global img shadows/borders/heights are the usual offenders). */
.rbz-viewport img {
	display: block; max-width: none; box-shadow: none !important;
	border: 0 !important; border-radius: 0; background: transparent; filter: none;
}
.rbz-viewport .rbz-cover    { width: 100% !important; height: 100% !important; object-fit: cover; }
.rbz-viewport .rbz-contain  { width: 100% !important; height: 100% !important; object-fit: contain; }
.rbz-viewport .rbz-curtain-img,
.rbz-viewport .rbz-artist-img { width: 100% !important; height: 100% !important; object-fit: contain; }
/* curtains must never spill past the hero */
.rbz-hero-curtain { overflow: hidden; }

/* ---- Image helpers --------------------------------------------------- */
.rbz-imgbox { overflow: hidden; }
.rbz-cover  { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.rbz-contain{ width: 100%; height: 100%; object-fit: contain; }

.rbz-placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: repeating-linear-gradient(45deg, #f4e9e6, #f4e9e6 14px, #efe0dc 14px, #efe0dc 28px);
	border: 2px dashed var(--rbz-rose);
	color: var(--rbz-rose);
	text-align: center;
	font-family: var(--rbz-noto);
}
.rbz-ph-label { font-weight: 800; font-size: 20px; }
.rbz-ph-note  { font-weight: 500; font-size: 14px; opacity: .7; direction: ltr; }

/* =====================================================================
   HERO  (Figma 460:552)
   ===================================================================== */
.rbz-hero-bg      { position: absolute; left: -1px;   top: 0;      width: 1600px;   height: 900px; }
.rbz-hero-bg .rbz-cover { object-position: center; }

/* Curtains: transparent PNGs anchored to the outer top corners, full height. */
.rbz-hero-curtain { position: absolute; top: 0; height: 900px; width: 430px; }
.rbz-hero-curtain--left  { left: 0; }
.rbz-hero-curtain--right { right: 0; left: auto; }
.rbz-curtain-img { width: 100%; height: 100%; object-fit: contain; }
.rbz-hero-curtain--left  .rbz-curtain-img { object-position: left top; }
.rbz-hero-curtain--right .rbz-curtain-img { object-position: right top; }

/* Artist: transparent cutout shown whole, standing on the hero baseline. */
.rbz-hero-artist { position: absolute; left: -7px; top: 196px; width: 776px; height: 704px; }
.rbz-artist-img  { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }

.rbz-hero-frost {
	position: absolute;
	left: 751px; top: 99px;
	width: 811px; height: 801px;
	background: rgba(217, 217, 217, 0.8);
	border-radius: 100px 0 0 100px;
	filter: blur(48.2px);
	pointer-events: none;
}

.rbz-hero-glow {
	position: absolute;
	left: 756px; top: 466px;
	width: 801px; height: 604px;
	pointer-events: none;
}

/* Headline — gold gradient text, Rubik */
.rbz-hero-h1 {
	position: absolute;
	left: 799px; top: 282px;
	width: 726px; height: 141px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	font-family: var(--rbz-rubik);
	font-weight: 900;
	background: linear-gradient(to right, var(--rbz-rose) 17.308%, var(--rbz-gold) 84.135%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}
.rbz-hero-h1-a { font-size: 55px; line-height: 0.95; }
.rbz-hero-h1-b { font-size: 64px; line-height: 1; }

/* Sub-headline — Rubik ExtraBold */
.rbz-hero-sub {
	position: absolute;
	left: 846px; top: 463px;
	width: 632px; height: 100px;
	display: flex; flex-direction: column; justify-content: center;
	text-align: center;
	font-family: var(--rbz-rubik);
	font-weight: 800;
	font-size: 48px;
	line-height: 1.2;
	color: var(--rbz-rose);
}

/* Small line — Rubik Bold */
.rbz-hero-small {
	position: absolute;
	left: 844px; top: 643px;
	width: 636px;
	text-align: center;
	font-family: var(--rbz-rubik);
	font-weight: 700;
	font-size: 24px;
	line-height: 1.2;
	color: var(--rbz-rose);
}

/* Primary CTA */
.rbz-hero-cta {
	position: absolute;
	left: 1010px; top: 729px;
	width: 293px; height: 77px;
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(to right, var(--rbz-rose) 0%, var(--rbz-gold) 25.962%);
	border-radius: 12px;
	font-family: var(--rbz-noto);
	font-weight: 800;
	font-variation-settings: 'wdth' 100;
	font-size: 32px;
	color: #ffffff;
	white-space: nowrap;
}

/* ---- Top navigation -------------------------------------------------- */
.rbz-nav { position: absolute; left: 0; top: 0; width: 1600px; height: 99px; }
.rbz-nav-shape { position: absolute; left: 1px; top: 0; width: 1600px; height: 99.01px; }

.rbz-nav-item {
	position: absolute;
	top: 40px;
	font-family: var(--rbz-noto);
	font-weight: 700;
	font-variation-settings: 'wdth' 100;
	font-size: 16px;
	line-height: 1.2;
	color: var(--rbz-ink);
	text-align: right;
	white-space: nowrap;
}
.rbz-nav-item-1 { left: 1091px; width: 54px; }              /* גלריה   – right edge 1145 */
.rbz-nav-item-2 { left: 1013px; width: 66px; }              /* המלצות  – right edge 1079 */
.rbz-nav-item-3 { left: 934px;  width: 67px; }              /* התהליך  – right edge 1001 */
.rbz-nav-item-4 { left: 526px;  top: 41px; width: 143px; }  /* ערכת ה-Touchup – right edge 669 */
.rbz-nav-item-5 { left: 444px;  top: 41px; width: 70px; }   /* שאלות   – right edge 514 */
.rbz-nav-item-6 { left: 362px;  top: 41px; width: 70px; }   /* קצת עליי – right edge 432 */

.rbz-nav-cta {
	position: absolute;
	left: 1235px; top: 30px;
	width: 178px; height: 39.6px;
	display: flex; align-items: center; justify-content: center;
	background: var(--rbz-gold-solid);
	border-radius: 8px;
	font-family: var(--rbz-noto);
	font-weight: 900;
	font-variation-settings: 'wdth' 100;
	font-size: 16px;
	color: #ffffff;
	white-space: nowrap;
}

.rbz-logo {
	position: absolute;
	left: 729px; top: 8.91px;
	width: 145px; height: 143.564px;
	display: block;
}
.rbz-logo img, .rbz-logo .rbz-placeholder { border-radius: 50%; }

/* =====================================================================
   Reusable helpers
   ===================================================================== */
.rbz-grad-text {
	background: linear-gradient(to right, var(--rbz-rose) 17%, var(--rbz-gold) 84%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}
.rbz-btn-primary {
	display: flex; align-items: center; justify-content: center;
	background: var(--rbz-gold-solid);
	border-radius: 12px;
	box-shadow: 2px 4px 2px rgba(0, 0, 0, 0.25);
	font-family: var(--rbz-noto);
	font-weight: 800;
	font-variation-settings: 'wdth' 100;
	font-size: 32px;
	color: #ffffff;
	white-space: nowrap;
}

/* =====================================================================
   GALLERY  (Figma 460:580 — frame y 900–3301, section-relative)
   ===================================================================== */
.rbz-gal-bg { position: absolute; left: -1px; top: 0; width: 1600px; height: 2401px; }

.rbz-gal-title {
	position: absolute; left: 0; top: 200px; width: 1600px; height: 58px;
	display: flex; align-items: center; justify-content: center;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; white-space: nowrap;
}

.rbz-gal-grid {
	position: absolute; left: 341px; top: 339px;
	display: grid;
	grid-template-columns: repeat(3, 300px);
	grid-auto-rows: 400px;
	gap: 8px;
	direction: ltr;
}
.rbz-gal-cell { width: 300px; height: 400px; }

.rbz-gal-more {
	position: absolute; left: 642px; top: 2013px; width: 316px; height: 58px;
	display: flex; align-items: center; justify-content: center;
	background: #dda6a0; border-radius: 12px;
	box-shadow: 2px 4px 2px rgba(0, 0, 0, 0.25);
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 32px; color: #ffffff; white-space: nowrap;
}
.rbz-gal-cta { position: absolute; left: 611px; top: 2232px; width: 378.164px; height: 96.133px; }

/* =====================================================================
   TESTIMONIAL VIDEOS  (Figma 460:598 — frame y 3501–4779, section top 3301)
   ===================================================================== */
/* pink fills the whole section top (meets the gallery at the section edge) */
.rbz-vid-bg { position: absolute; left: 0; top: 0; width: 1600px; height: 1418px; }

.rbz-vid-title {
	position: absolute; right: 583px; top: 200px;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
}

/* Carousel */
.rbz-vid-carousel { position: absolute; left: 0; top: 406.87px; width: 1600px; height: 700px; }
.rbz-vid-viewport { position: absolute; left: 193px; top: 0; width: 1214px; height: 700px; overflow: hidden; }
.rbz-vid-track {
	display: flex; gap: 40px; height: 700px; width: max-content; direction: ltr;
	transition: transform 450ms cubic-bezier(0.2, 0.8, 0.2, 1); will-change: transform;
}
.rbz-vid-carousel.is-static .rbz-vid-track { width: 1214px; justify-content: center; }

/* Phone card */
.rbz-vid-card {
	position: relative; flex: 0 0 378px; width: 378px; height: 700px;
	background: transparent; border: 11px solid #ffffff; border-radius: 46px;
	box-shadow: 0 6px 4px rgba(0, 0, 0, 0.25);
}
.rbz-vid-card::after {
	content: ''; position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
	width: 120px; height: 5px; border-radius: 3px; background: #ffffff;
}
.rbz-vid-card::before {
	content: ''; position: absolute; left: -15px; top: 150px;
	width: 4px; height: 30px; border-radius: 3px; background: #ffffff;
	box-shadow: 0 46px 0 #ffffff, 0 92px 0 #ffffff;
}
.rbz-vid-screen { position: absolute; inset: 0; border-radius: 35px; overflow: hidden; }
.rbz-vid-play {
	position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
	background: transparent; border: 0; padding: 0; line-height: 0; z-index: 2; cursor: pointer;
}
span.rbz-vid-play { cursor: default; }
.rbz-vid-play img { height: 96px; width: auto; display: block; pointer-events: none; }

/* Shared carousel arrows (reviews-style) */
.rbz-carousel-arrow {
	position: absolute; top: 320px; width: 60px; height: 60px;
	background: transparent; border: 0; cursor: pointer; padding: 0; z-index: 4;
}
.rbz-carousel-arrow img { position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; transform: translate(-50%, -50%); }
.rbz-vid-arrow--prev { left: 118px; }
.rbz-vid-arrow--next { left: 1422px; }
.rbz-vid-arrow--next img { transform: translate(-50%, -50%) rotate(180deg); }
.rbz-vid-carousel.is-static .rbz-carousel-arrow { display: none; }

.rbz-vid-cta { position: absolute; left: 611px; top: 1171px; width: 378.164px; height: 96.133px; }

/* =====================================================================
   ADVANTAGES  (Figma 460:678 — frame y 4768–5609, section top 4768)
   ===================================================================== */
/* extended up (top -49) so the panel + its aura border the videos section */
.rbz-adv-panel {
	position: absolute; left: 0; top: -49px; width: 1600px; height: 890px;
	background: #e9dfdf;
	box-shadow: 0 0 30px 20px rgba(132, 47, 38, 0.35);
	z-index: 0;
}
.rbz-adv-glow {
	position: absolute; left: 706px; top: 140px; width: 855px; height: 671px;
	background: #e8c5c1; filter: blur(106.1px); border-radius: 100px; z-index: 1;
}
.rbz-adv-blob {
	position: absolute; left: 178.82px; top: 132px; width: 360.489px; height: 620.402px;
	background: rgba(221, 166, 160, 0.9); filter: blur(19.437px); border-radius: 34px; z-index: 1;
}

/* Collage photos. #1 is a plain rectangle (CSS gold border); #2/#3 are
   pre-rotated widgets (border+shadow baked into the PNG) placed at natural size. */
.rbz-adv-photo { position: absolute; z-index: 2; }
.rbz-adv-photo-1 { left: 156.67px; top: 115.38px; width: 349.082px; height: 620.591px;
	border: 7.91px solid var(--rbz-gold); background: #eee; }
.rbz-adv-photo-2 { left: 377.32px; top: 109.25px; width: 296px; height: 342px; }
.rbz-adv-photo-3 { left: 51.89px; top: 431.85px; width: 286px; height: 343px; }
.rbz-adv-photo-2 img, .rbz-adv-photo-3 img { object-fit: contain; }

/* Tape pieces */
.rbz-adv-tape { position: absolute; width: 78px; height: 27px; border-radius: 3px;
	background: rgba(255, 255, 255, 0.42); box-shadow: 0 1px 2px rgba(0,0,0,0.08); z-index: 3; }
.rbz-adv-tape-1 { left: 22.4px;  top: 485.2px; transform: rotate(-45deg); }
.rbz-adv-tape-2 { left: 211.1px; top: 433.45px; transform: rotate(32deg); }
.rbz-adv-tape-3 { left: 578.3px; top: 416.5px; transform: rotate(136.61deg); }
.rbz-adv-tape-4 { left: 402.8px; top: 109.2px; transform: rotate(136.61deg); }

/* Right column */
.rbz-adv-title {
	position: absolute; right: 89px; top: 82px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
}
.rbz-adv-icon { position: absolute; z-index: 4; }
.rbz-adv-icon-1 { left: 1437px; top: 181px; width: 82px; height: 100px; }
.rbz-adv-icon-2 { left: 1440px; top: 341px; width: 76px; height: 100px; }
.rbz-adv-icon-3 { left: 1445px; top: 499px; width: 66px; height: 100px; }
.rbz-adv-icon-4 { left: 1434px; top: 659px; width: 87px; height: 100px; }

.rbz-adv-h {
	position: absolute; right: 189px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 700; font-variation-settings: 'wdth' 100;
	font-size: 24px; line-height: 1.2; color: var(--rbz-rose); text-align: right; white-space: nowrap;
}
.rbz-adv-h-1 { top: 188px; }
.rbz-adv-h-2 { top: 348px; }
.rbz-adv-h-3 { top: 508px; }
.rbz-adv-h-4 { top: 668px; }

.rbz-adv-d {
	position: absolute; right: 189px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 400; font-variation-settings: 'wdth' 100;
	font-size: 20px; line-height: 1.2; color: #000000; text-align: right;
}
.rbz-adv-d-1 { top: 225px; width: 589px; }
.rbz-adv-d-2 { top: 385px; }
.rbz-adv-d-3 { top: 545px; width: 643px; }
.rbz-adv-d-4 { top: 705px; }

/* =====================================================================
   DIFFERENTIATION "חוקי האמנות"  (Figma 460:609 — section top 5809)
   ===================================================================== */
.rbz-diff-card {
	position: absolute; left: 637.68px; top: 0; width: 910.275px; height: 677.983px;
	background: #e9dfdf; border-radius: 30px 20px 20px 30px;
	box-shadow: -5px 4px 4px rgba(0, 0, 0, 0.25); z-index: 1;
}
/* Pre-baked widget (rounded corners + shadow in the PNG), natural size. */
.rbz-diff-photo { position: absolute; left: 56px; top: -24px; width: 512px; height: 726px; z-index: 2; }
.rbz-diff-photo img { object-fit: contain; }
.rbz-diff-deco { position: absolute; z-index: 3; }
.rbz-diff-deco-1 { left: 462.79px; top: 36.83px; width: 381.094px; height: 354.408px; }
.rbz-diff-deco-2 { left: 605px; top: 524.13px; width: 324px; height: 242px;
	box-shadow: 10px 4px 4px rgba(0, 0, 0, 0.25); }

.rbz-diff-title {
	position: absolute; right: 96.26px; top: 37.13px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
}
.rbz-diff-body {
	position: absolute; right: 95.97px; top: 129.15px; width: 821.032px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 400; font-variation-settings: 'wdth' 100;
	font-size: 24px; line-height: 1.2; color: #000000; text-align: right;
}

/* =====================================================================
   PROCESS "הדרך ללוק המושלם"  (Figma 460:616 — section top 6775)
   ===================================================================== */
.rbz-proc-title {
	position: absolute; right: 588px; top: 0.13px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
}
/* Each step lifts as one unit on hover. */
.rbz-proc-step { position: absolute; width: 367px; height: 600px;
	transition: transform 400ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.rbz-proc-step:hover { transform: translateY(-12px); z-index: 6; }

.rbz-proc-card {
	position: absolute; width: 367px; height: 600px;
	background: linear-gradient(to bottom, #a2625b 54.808%, rgba(132, 47, 38, 0.35) 87.019%, rgba(132, 47, 38, 0.35) 100%);
	border-radius: 480px 125px 40px 40px;
	box-shadow: 5px 4px 4px rgba(0, 0, 0, 0.25), inset 5px 4px 4px rgba(0, 0, 0, 0.25);
	z-index: 1; transition: box-shadow 400ms ease;
}
.rbz-proc-step:hover .rbz-proc-card {
	box-shadow: 6px 18px 30px rgba(132, 47, 38, 0.4), inset 5px 4px 4px rgba(0, 0, 0, 0.25);
}
.rbz-proc-frost {
	position: absolute; width: 309px; height: 364px;
	background: rgba(217, 217, 217, 0.2);
	border-radius: 150px 0 0 0;
	filter: blur(12.5px);
	box-shadow: inset 5px 4px 4px rgba(0, 0, 0, 0.25);
	z-index: 2;
}
.rbz-proc-widget { position: absolute; z-index: 3; transition: transform 400ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.rbz-proc-step:hover .rbz-proc-widget { transform: scale(1.06); }
.rbz-proc-num {
	position: absolute; z-index: 4;
	font-family: 'Titan One', var(--rbz-noto); font-weight: 400;
	font-size: 96px; line-height: 1.2; color: #dda6a0; text-align: right;
}
.rbz-proc-h {
	position: absolute; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 900; font-variation-settings: 'wdth' 100;
	font-size: 32px; line-height: 1.2; color: #ffffff; text-align: right; white-space: nowrap;
}
.rbz-proc-d {
	position: absolute; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 400; font-variation-settings: 'wdth' 100;
	font-size: 20px; line-height: 1.2; color: #ffffff; text-align: right;
}
.rbz-proc-cta { position: absolute; left: 611px; top: 802.27px; width: 378.164px; height: 96.133px; z-index: 5; }

/* =====================================================================
   TOUCH-UP KIT  (Figma 460:670 — section top 7873)
   ===================================================================== */
.rbz-touch-bg {
	position: absolute; left: 0; top: 0.4px; width: 1600px; height: 900px;
	box-shadow: 0 0 30px 20px rgba(132, 47, 38, 0.35); z-index: 0;
}
.rbz-touch-frost {
	position: absolute; left: 87px; top: 210.23px; width: 725px; height: 480px;
	background: #e9dfdf; border-radius: 100px; filter: blur(48.2px);
	box-shadow: 5px 7px 4px 2px rgba(0, 0, 0, 0.25); z-index: 1;
}
.rbz-touch-title {
	position: absolute; right: 948px; top: 260.23px; z-index: 2;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
	background: linear-gradient(to right, var(--rbz-rose), var(--rbz-gold));
	-webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
.rbz-touch-sub {
	position: absolute; left: 450px; top: 349.23px; transform: translateX(-50%); z-index: 2;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 32px; line-height: 1.2; color: var(--rbz-rose); text-align: center; white-space: nowrap;
}
.rbz-touch-body {
	position: absolute; left: 449.5px; top: 403.23px; transform: translateX(-50%); width: 571px; z-index: 2;
	font-family: var(--rbz-noto); font-weight: 700; font-variation-settings: 'wdth' 100;
	font-size: 24px; line-height: 1.2; color: var(--rbz-rose); text-align: center;
}

/* =====================================================================
   REVIEWS carousel  (Figma 460:659 — section top 8973)
   ===================================================================== */
.rbz-rev-title {
	position: absolute; left: 816.5px; top: 0.4px; transform: translateX(-50%); z-index: 2;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; color: var(--rbz-rose); text-align: center; white-space: nowrap;
}
.rbz-rev-phone {
	position: absolute; left: 612px; top: 177.36px; width: 378px; height: 700px;
	background: transparent; border: 11px solid #ffffff; border-radius: 46px;
	box-shadow: 0 6px 4px rgba(0, 0, 0, 0.25); z-index: 2;
}
.rbz-rev-phone::after {
	content: ''; position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
	width: 120px; height: 5px; border-radius: 3px; background: #ffffff;
}
.rbz-rev-phone::before {
	content: ''; position: absolute; left: -15px; top: 150px;
	width: 4px; height: 30px; border-radius: 3px; background: #ffffff;
	box-shadow: 0 46px 0 #ffffff, 0 92px 0 #ffffff;
}
.rbz-rev-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 400ms ease; }
.rbz-rev-slide.is-active { opacity: 1; }

.rbz-rev-arrow {
	position: absolute; top: 497.36px; width: 60px; height: 60px;
	background: transparent; border: 0; cursor: pointer; padding: 0; z-index: 4;
}
.rbz-rev-arrow img { position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; transform: translate(-50%, -50%); }
.rbz-rev-arrow--prev { left: 452px; }
.rbz-rev-arrow--next { left: 1089px; }
.rbz-rev-arrow--next img { transform: translate(-50%, -50%) rotate(180deg); }
.rbz-rev-cta { position: absolute; left: 611px; top: 956.36px; width: 378.164px; height: 96.133px; z-index: 4; }

/* =====================================================================
   ABOUT ME "קצת עליי"  (Figma 460:648 — section top 10225)
   ===================================================================== */
.rbz-about-card {
	position: absolute; left: 24px; top: 33.68px; width: 1553px; height: 678px;
	background: #e9dfdf; border-radius: 30px 20px 20px 30px;
	box-shadow: -10px 6px 10px rgba(0, 0, 0, 0.25); z-index: 1;
}
/* Pre-rotated widgets (border+shadow baked into the PNG), placed at natural size. */
.rbz-about-photo { position: absolute; z-index: 2; }
.rbz-about-photo-1 { left: 19.83px;  top: 3.95px;   width: 421px; height: 458px; }
.rbz-about-photo-2 { left: 116.64px; top: 325.64px; width: 340px; height: 391px; }
.rbz-about-photo img { object-fit: contain; }

.rbz-about-tape { position: absolute; width: 79px; height: 28px; border-radius: 3px;
	background: rgba(255, 255, 255, 0.42); box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15); z-index: 3; }
.rbz-about-tape-1 { left: 174.21px; top: 9.63px;   transform: rotate(166deg); }
.rbz-about-tape-2 { left: 384.25px; top: 127.28px; transform: rotate(-105deg); }
.rbz-about-tape-3 { left: 96.61px;  top: 400.75px; transform: rotate(130deg); }
.rbz-about-tape-4 { left: 298.14px; top: 326.39px; transform: rotate(26deg); }

.rbz-about-title {
	position: absolute; right: 106.99px; top: 110.49px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
}
.rbz-about-body {
	position: absolute; right: 107px; top: 214.31px; width: 882px; z-index: 4;
	font-family: var(--rbz-noto); font-weight: 400; font-variation-settings: 'wdth' 100;
	font-size: 24px; line-height: 1.2; color: #030303; text-align: right;
}

/* =====================================================================
   FAQ "שאלות חשובות"  (Figma 460:704 — section top 11137)
   ===================================================================== */
.rbz-faq-title {
	position: absolute; right: 633px; top: 0; z-index: 2;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; text-align: right; white-space: nowrap;
}
.rbz-faq-list { position: absolute; left: 400px; top: 111.63px; width: 800px; display: flex; flex-direction: column; gap: 38px; }

.rbz-faq-item { display: block; }

.rbz-faq-q {
	position: relative; width: 800px; height: 100px;
	background: linear-gradient(to right, var(--rbz-rose) 26.923%, #a2625b 58.173%);
	border: 0; border-radius: 12px; cursor: pointer; padding: 0; display: block;
}
.rbz-faq-icon { position: absolute; left: 30px; top: 26px; width: 48px; height: 48px;
	transition: transform 350ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.rbz-faq-item.is-open .rbz-faq-icon { transform: rotate(135deg); } /* + rolls into × */
.rbz-faq-qt {
	position: absolute; right: 129px; top: 50%; transform: translateY(-50%); width: 534px;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 24px; line-height: 1.2; color: #ffffff; text-align: right;
}
/* Accordion answer: JS sets height for a reliable, smooth expand. */
.rbz-faq-a { overflow: hidden; height: 0; transition: height 400ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.rbz-faq-a-inner:not(:empty) {
	padding: 20px 30px 24px;
	font-family: var(--rbz-noto); font-weight: 400; font-variation-settings: 'wdth' 100;
	font-size: 20px; line-height: 1.4; color: #3a2c2a; text-align: right; direction: rtl;
	background: #f3e7e4; border-radius: 0 0 12px 12px;
}

/* =====================================================================
   CONTACT FORM  (Figma 460:762 — section top 12515)
   ===================================================================== */
.rbz-form-sec { transition: top 400ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.rbz-form-divider { position: absolute; left: 0; top: 0; width: 1600px; height: 1px; background: #cfa9a3; z-index: 0; }
.rbz-form-card {
	position: absolute; left: 208px; top: 11.63px; width: 1184px; height: 498px;
	background: linear-gradient(to right, #a2625b 42.308%, var(--rbz-rose) 83.654%);
	border-radius: 12px; z-index: 1;
}
.rbz-form-logo { position: absolute; left: 978px; top: 31.63px; width: 393px; height: 469px; border-radius: 8px; z-index: 2; }

/* Two headings stacked (right-aligned, left of the logo) — no overlap. */
.rbz-form-title1 {
	position: absolute; right: 648px; top: 55px; z-index: 3;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; color: #ffffff; text-align: right; white-space: nowrap;
}
.rbz-form-title2 {
	position: absolute; right: 648px; top: 120px; z-index: 3;
	font-family: var(--rbz-noto); font-weight: 800; font-variation-settings: 'wdth' 100;
	font-size: 48px; line-height: 1.2; color: #ffffff; text-align: right; white-space: nowrap;
}

.rbz-form { display: contents; }
.rbz-form-field { position: absolute; width: 300px; z-index: 3; }
.rbz-field-name  { left: 638px; top: 188.63px; }
.rbz-field-phone { left: 249px; top: 188.63px; }
.rbz-field-email { left: 638px; top: 327.63px; }
.rbz-field-date  { left: 249px; top: 327.63px; }
.rbz-form-field label {
	display: block; text-align: right; color: #ffffff;
	font-family: var(--rbz-noto); font-weight: 700; font-variation-settings: 'wdth' 100;
	font-size: 24px; line-height: 1.2;
}
.rbz-form-field input {
	display: block; width: 300px; height: 34px; margin-top: 6px;
	background: transparent; border: 0; border-bottom: 1px solid #ffffff;
	color: #ffffff; font-family: var(--rbz-noto); font-size: 18px; text-align: right; outline: none;
}
.rbz-form-field input::placeholder { color: rgba(255, 255, 255, 0.7); }

.rbz-form-submit {
	position: absolute; left: 249px; top: 428.63px; width: 703px; height: 50px; z-index: 3;
	background: rgba(232, 197, 193, 0.8); border: 0; border-radius: 12px; cursor: pointer;
	font-family: var(--rbz-noto); font-weight: 700; font-variation-settings: 'wdth' 100;
	font-size: 28px; color: #ffffff; text-align: center;
}
.rbz-form-submit:hover { background: rgba(232, 197, 193, 0.95); }

.rbz-form-success {
	position: absolute; left: 249px; top: 220px; width: 703px; z-index: 3;
	font-family: var(--rbz-noto); font-weight: 700; font-variation-settings: 'wdth' 100;
	font-size: 30px; color: #ffffff; text-align: center;
}

/* =====================================================================
   Video lightbox (appended to body — not inside the scaled canvas)
   ===================================================================== */
.rbz-lightbox {
	position: fixed; inset: 0; z-index: 99999; background: rgba(30, 20, 20, 0.72);
	display: flex; align-items: center; justify-content: center; padding: 20px;
}
.rbz-lightbox-inner { position: relative; }
/* The isolated player is styled as the phone frame itself (no black box) */
.rbz-lightbox-phone {
	position: relative; width: min(84vw, 372px); height: min(86vh, 662px);
	background: transparent; border: 11px solid #ffffff; border-radius: 46px;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}
.rbz-lightbox-phone::after {
	content: ''; position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
	width: 120px; height: 5px; border-radius: 3px; background: #ffffff;
}
.rbz-lightbox-phone::before {
	content: ''; position: absolute; left: -15px; top: 150px;
	width: 4px; height: 30px; border-radius: 3px; background: #ffffff;
	box-shadow: 0 46px 0 #ffffff, 0 92px 0 #ffffff;
}
.rbz-lightbox-media {
	position: absolute; inset: 0; background: transparent; border-radius: 35px; overflow: hidden;
}
.rbz-lightbox-media iframe, .rbz-lightbox-media video {
	position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; background: transparent;
}
.rbz-lightbox-close {
	position: absolute; top: -6px; right: -54px; width: 42px; height: 42px;
	font-size: 26px; line-height: 40px; text-align: center;
	background: #fff; color: #333; border: 0; border-radius: 50%; cursor: pointer;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* =====================================================================
   Micro-interactions (subtle hovers)
   ===================================================================== */
.rbz-gal-cell img { transition: transform 500ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.rbz-gal-cell:hover img { transform: scale(1.06); }

.rbz-hero-cta, .rbz-btn-primary, .rbz-gal-more, .rbz-nav-cta, .rbz-form-submit {
	transition: transform 250ms ease, filter 250ms ease, box-shadow 250ms ease;
}
.rbz-hero-cta:hover, .rbz-btn-primary:hover, .rbz-gal-more:hover, .rbz-nav-cta:hover, .rbz-form-submit:hover {
	transform: translateY(-2px); filter: brightness(1.05);
}

.rbz-nav-item { transition: color 200ms ease; }
.rbz-nav-item:hover { color: var(--rbz-gold); }

.rbz-faq-q { transition: filter 200ms ease; }
.rbz-faq-q:hover { filter: brightness(1.06); }

.rbz-carousel-arrow img, .rbz-rev-arrow img { transition: transform 200ms ease; }
.rbz-carousel-arrow:hover img,
.rbz-rev-arrow--prev:hover img { transform: translate(-50%, -50%) scale(1.12); }
.rbz-vid-arrow--next:hover img,
.rbz-rev-arrow--next:hover img { transform: translate(-50%, -50%) rotate(180deg) scale(1.12); }

.rbz-vid-play img { transition: transform 250ms ease; }
.rbz-vid-play:hover img { transform: scale(1.1); }

/* Phone cards lift on hover, like the primary buttons */
.rbz-vid-card, .rbz-rev-phone { transition: transform 260ms ease, box-shadow 260ms ease; }
.rbz-vid-card:hover, .rbz-rev-phone:hover {
	transform: translateY(-8px); box-shadow: 0 20px 34px rgba(0, 0, 0, 0.3);
}

/* Reviews screenshots fill the phone screen at its 9:16 shape (crop to fit, no letterbox) */
.rbz-rev-slide, .rbz-rev-slide .rbz-cover, .rbz-rev-slide img {
	width: 100% !important; height: 100% !important; object-fit: cover !important;
}

/* Play button + carousel arrows: hover only, never a click/focus shadow box */
.rbz-vid-play, .rbz-carousel-arrow, .rbz-rev-arrow {
	box-shadow: none !important; outline: none !important; -webkit-tap-highlight-color: transparent;
}
.rbz-vid-play:focus, .rbz-vid-play:active, .rbz-vid-play:focus-visible,
.rbz-carousel-arrow:focus, .rbz-carousel-arrow:active, .rbz-carousel-arrow:focus-visible,
.rbz-rev-arrow:focus, .rbz-rev-arrow:active, .rbz-rev-arrow:focus-visible {
	box-shadow: none !important; outline: none !important; background: transparent !important;
}

@media (prefers-reduced-motion: reduce) {
	.rbz-viewport *, .rbz-lightbox * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* =====================================================================
   Layering (hero)
   ===================================================================== */
.rbz-hero-bg      { z-index: 0; }
.rbz-hero-curtain { z-index: 1; }
.rbz-hero-artist  { z-index: 2; }
.rbz-hero-frost   { z-index: 3; }
.rbz-hero-glow    { z-index: 3; }
.rbz-hero-h1,
.rbz-hero-sub,
.rbz-hero-small,
.rbz-hero-cta     { z-index: 4; }
.rbz-nav          { z-index: 5; }