@font-face { font-family: RoniAlef; src: url('../_fonts/Alef-Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: RoniAlef; src: url('../_fonts/Alef-Bold.ttf') format('truetype'); font-weight: 700; font-display: swap; }

:root {
  --flour: #FAF6EF;
  --crust: #3B2416;
  --dough: #EED9B7;
  --bake: #C9773A;
  --bake-text: #9a4f1f;
  --sage: #6E7F5C;
  --muted: #6b5546;
  --dough-top: #F4E4C6;
  --dough-bottom: #E3C796;
}

* { box-sizing: border-box; margin: 0; }
html { background: var(--flour); scroll-behavior: smooth; }
html, body { overflow-x: clip; }
body { font-family: RoniAlef, sans-serif; color: var(--crust); background: var(--flour); -webkit-font-smoothing: antialiased; }
b { font-weight: 700; }
.thin { font-weight: 400; color: var(--muted); }
img { display: block; max-width: 100%; }
:focus-visible { outline: 3px solid var(--bake); outline-offset: 3px; }
.skip { position: absolute; top: -40px; right: 16px; background: var(--crust); color: #fff; padding: 8px 14px; z-index: 100; }
.skip:focus { top: 12px; }

h1, h2 { line-height: 1.02; letter-spacing: -0.01em; }
h2 { font-size: clamp(2.3rem, 4.6vw, 4.4rem); }
.kicker { font-size: .95rem; font-weight: 700; color: var(--bake-text); margin-bottom: 16px; }
.lead { font-size: clamp(1.15rem, 1.6vw, 1.4rem); line-height: 1.55; }
.fine { font-size: .9rem; color: var(--muted); margin-top: 12px; }
.btn { display: inline-block; padding: 16px 30px; border-radius: 999px; background: var(--crust); color: var(--flour); text-decoration: none; font: inherit; font-weight: 700; font-size: 1.05rem; border: 0; cursor: pointer; transition: transform .3s, background .3s; }
.btn:hover { background: #5a3822; transform: translateY(-2px); }
.btn.small { padding: 12px 20px; font-size: .95rem; }
.link, .text-link { background: none; border: 0; font: inherit; color: var(--crust); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }

.bar { position: fixed; top: 0; inset-inline: 0; z-index: 20; display: flex; justify-content: space-between; align-items: center; padding: 16px 48px; transition: background .4s, box-shadow .4s; }
.bar.solid { background: rgba(250,246,239,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 1px 0 rgba(59,36,22,.1); }
.bar nav { display: flex; gap: 28px; align-items: center; }
.bar nav a { color: var(--crust); text-decoration: none; font-size: 1rem; font-weight: 700; }
.nav-cta { background: var(--crust); color: var(--flour) !important; padding: 10px 18px; border-radius: 999px; }

/* hero */
.hero { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; gap: 5vw; align-items: center; padding: 110px 48px 60px; }
.hero h1 { font-size: clamp(3.4rem, 7vw, 7rem); margin-bottom: 26px; }
.hero .lead { max-width: 28ch; margin-bottom: 34px; }
.hero-actions { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.hero-art { position: relative; }
.hero-art img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 40% 50%; border-radius: 260px 260px 24px 24px; will-change: transform; }
.hero-art figcaption { margin-top: 14px; font-size: .95rem; color: var(--muted); }

/* proof: הבצק תופח */
.proof { height: 420vh; position: relative; background: #fff; }
.proof-sticky { position: sticky; top: 0; height: 100vh; display: grid; grid-template-columns: 1fr 1fr; gap: 5vw; align-items: center; padding: 90px 48px 40px; }
.stages { list-style: none; padding: 0; margin-top: 34px; display: grid; gap: 4px; }
.stages li { display: grid; grid-template-columns: 54px 1fr; gap: 0 14px; padding: 14px 0; border-top: 1px solid rgba(59,36,22,.12); }
.stages li:not(.on) span, .stages li:not(.on) h3 { color: var(--muted); }   /* נגישות 12.10: במקום שקיפות .35, שלא עמדה בניגודיות */
.stages li span { grid-row: span 2; font-size: 1.8rem; font-weight: 700; color: var(--bake-text); }
.stages li h3 { font-size: 1.45rem; }
.stages li p { font-size: 1.02rem; line-height: 1.55; color: var(--muted); max-height: 0; overflow: hidden; transition: max-height .6s ease; }
.stages li.on { opacity: 1; }
.stages li.on p { max-height: 6em; }
.bowl-wrap { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.bowl { width: min(520px, 90%); overflow: visible; }
.bowl-body { fill: var(--sage); }
.bowl-back { fill: none; stroke: #55653f; stroke-width: 6; }
.bowl-rim { stroke: #55653f; stroke-width: 10; stroke-linecap: round; }
.steam path { fill: none; stroke: var(--bake); stroke-width: 6; stroke-linecap: round; opacity: var(--steam, 0); transition: opacity .6s; }
.bubbles circle { fill: rgba(255,255,255,.55); }
.braid { stroke: #7a4622; stroke-width: 7; stroke-linecap: round; opacity: var(--braid, 0); }
.timer { font-size: 1.05rem; font-weight: 700; padding: 10px 20px; border-radius: 999px; background: var(--flour); }
#stage-num { color: var(--bake-text); }

/* ways */
.ways { padding: 16vh 48px; }
.ways-head { display: grid; grid-template-columns: 1fr 1fr; gap: 5vw; align-items: end; }
.ways-head p:last-child { font-size: 1.15rem; line-height: 1.6; color: var(--muted); max-width: 44ch; }
.ways-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 8vh; }
.way { background: #fff; border-radius: 28px; overflow: hidden; }
.way:nth-child(2) { margin-top: 10vh; }
.way-img { overflow: hidden; aspect-ratio: 4 / 3.4; }
.way-img img { width: 100%; height: 118%; object-fit: cover; will-change: transform; transition: scale .8s cubic-bezier(.2,.8,.2,1); }
.way:hover .way-img img { scale: 1.04; }
.way-text { padding: 26px 30px 32px; }
.way-text span { font-size: .9rem; font-weight: 700; color: var(--bake-text); }
.way-text h3 { font-size: 2rem; margin: 6px 0 10px; }
.way-text p { font-size: 1.05rem; line-height: 1.6; color: var(--muted); }

/* practice */
.practice { padding: 16vh 48px; background: var(--crust); color: var(--flour); }
.practice .kicker { color: #e9a66d; }
.practice .thin { color: #d9c3a8; }
.practice-head p:last-child { margin-top: 16px; font-size: 1.15rem; line-height: 1.6; color: #e8d8c2; max-width: 46ch; }
.board { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; margin-top: 7vh; align-items: start; }
.pick-k { font-weight: 700; margin: 0 0 12px; color: #e9a66d; }
.opts { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 28px; }
.opts button { font: inherit; font-size: 1.1rem; font-weight: 700; color: var(--flour); background: transparent; border: 2px solid rgba(250,246,239,.4); padding: 14px 22px; border-radius: 999px; cursor: pointer; transition: background .3s, color .3s, border-color .3s; }
.opts button:hover:not(:disabled) { border-color: var(--flour); }
.opts button[aria-pressed="true"] { background: var(--flour); color: var(--crust); border-color: var(--flour); }
.opts button:disabled { opacity: .35; cursor: not-allowed; }
.result { background: var(--flour); color: var(--crust); border-radius: 28px; padding: 28px 30px; }
.roll { width: 100%; height: auto; margin-bottom: 14px; }
.roll g { transition: opacity .5s; }
.roll-long, .roll-across { opacity: 0; }
.result.long .roll-whole, .result.across .roll-whole { opacity: 0; }
.result.long .roll-long, .result.across .roll-across { opacity: 1; }
.r-title { font-size: 1.5rem; font-weight: 700; }
#r-text { margin-top: 8px; font-size: 1.08rem; line-height: 1.6; }
.r-next { margin-top: 14px; padding-top: 14px; border-top: 2px dashed rgba(59,36,22,.25); line-height: 1.6; }
.r-actions { display: flex; align-items: center; gap: 16px; margin-top: 18px; flex-wrap: wrap; }
.result.good .r-title { color: #3f6b2f; }
.result.bad .r-title { color: var(--bake-text); }

/* roni */
.roni { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 6vw; align-items: center; padding: 16vh 48px; }
.roni figure img { border-radius: 24px 24px 220px 24px; max-width: 440px; width: 100%; }
.roni-text > p:last-child { font-size: 1.15rem; line-height: 1.65; color: var(--muted); max-width: 46ch; }
.qs { list-style: none; padding: 0; margin: 30px 0; display: flex; flex-direction: column; gap: 10px; }
.qs li { align-self: flex-start; font-size: 1.3rem; font-weight: 700; background: var(--dough); padding: 10px 18px; border-radius: 20px 20px 6px 20px; opacity: 0; transform: translateY(12px); transition: opacity .6s, transform .6s cubic-bezier(.2,.8,.2,1); }
.qs li:nth-child(2) { margin-inline-start: 40px; transition-delay: .15s; }
.qs li:nth-child(3) { margin-inline-start: 14px; transition-delay: .3s; }
.qs.on li { opacity: 1; transform: none; }

.foot { padding: 50px 48px; border-top: 1px solid rgba(59,36,22,.12); display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.foot p { flex: 1; min-width: 240px; color: var(--muted); font-size: .95rem; }
.foot a { color: var(--bake-text); font-weight: 700; }

@media (max-width: 860px) {
  .bar { padding: 12px 16px; }
  .bar .logo { height: 36px; }
  .bar nav a:not(.nav-cta) { display: none; }
  .hero { grid-template-columns: 1fr; padding: 90px 18px 40px; gap: 30px; }
  .hero-art { order: -1; }
  .hero-art img { aspect-ratio: 1 / 1; border-radius: 200px 200px 20px 20px; }
  .hero h1 { font-size: 3.2rem; }
  .proof { height: 380vh; }
  .proof-sticky { grid-template-columns: 1fr; grid-template-rows: auto 1fr; padding: 74px 18px 18px; gap: 6px; align-content: start; }
  .proof-text h2 { font-size: 2.1rem; }
  .proof-text .kicker { display: none; }
  .stages { margin-top: 10px; }
  .stages li { padding: 6px 0; }
  .stages li:not(.on) { display: none; }
  .bowl-wrap { order: -1; }
  .bowl { width: 70%; }
  .ways, .practice, .roni { padding: 12vh 18px; }
  .ways-head, .ways-grid, .board, .roni { grid-template-columns: 1fr; }
  .way:nth-child(2) { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .stages li { opacity: 1; } .stages li p { max-height: none; }
  .qs li { opacity: 1; transform: none; transition: none; }
}

/* לוגו וקטורי: הסמל מצטייר והשם נכנס */
.logo { height: 54px; width: auto; display: block; overflow: visible; }
.foot .logo { height: 48px; }
.lg-draw { stroke-dasharray: 160; stroke-dashoffset: 160; animation: lg-draw 1.1s .15s cubic-bezier(.2,.8,.2,1) forwards; }
.lg-draw.d2 { animation-delay: .45s; }
.lg-pop { transform-box: fill-box; transform-origin: 50% 100%; transform: scale(.4); opacity: 0; animation: lg-pop .7s .1s cubic-bezier(.3,1.5,.5,1) forwards; }
.lg-pop.d2 { animation-delay: .25s; } .lg-pop.d3 { animation-delay: .4s; }
.lg-text { opacity: 0; animation: lg-in .8s .3s ease forwards; } .lg-text.d2 { animation-delay: .5s; }
@keyframes lg-draw { to { stroke-dashoffset: 0; } }
@keyframes lg-pop { to { transform: none; opacity: 1; } }
@keyframes lg-in { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .lg-draw, .lg-pop, .lg-text { animation: none; stroke-dashoffset: 0; opacity: 1; transform: none; } }

.practice-head { position: relative; }
.practice-ill { position: absolute; top: 0; left: 0; width: min(260px, 22vw); background: var(--flour); border-radius: 24px; padding: 18px; }
.result { position: relative; }
.oven { position: absolute; top: 16px; left: 16px; width: 76px; height: 76px; opacity: 0; transform: scale(.7); transition: opacity .4s, transform .4s; }
.result.good .oven { opacity: 1; transform: none; }
@media (max-width: 860px) { .practice-ill { position: static; width: 180px; margin-bottom: 20px; } }
/* התנור נכנס מעל הכותרת כשהחיתוך נכון, בלי לכסות את הגליל */
.oven { position: static; width: 64px; height: 0; overflow: hidden; margin-bottom: 0; transition: height .45s, margin .45s, opacity .4s, transform .4s; }
.result.good .oven { height: 64px; margin-bottom: 6px; }

/* ---------- תפריט: לשוניות כרטיס מתכון ---------- */
.recipe-bar { align-items: flex-end !important; padding-bottom: 0 !important; background: var(--flour); box-shadow: inset 0 -2px 0 rgba(59,36,22,.14); }
.recipe-bar .brand { padding-bottom: 12px; }
.tabs { display: flex; gap: 4px; align-items: flex-end; }
.tabs a { color: var(--crust); text-decoration: none; font-weight: 700; font-size: .95rem; padding: 12px 18px 11px; border-radius: 14px 14px 0 0; background: var(--dough); border: 2px solid transparent; border-bottom: 0; transform: translateY(4px); transition: transform .3s, background .3s; }
.tabs a:hover { transform: translateY(0); }
.tabs a.is-current { background: #fff; border-color: rgba(59,36,22,.14); transform: translateY(2px); }
.tabs .tab-cta { background: var(--crust); color: var(--flour); }
@media (max-width: 860px) {
  .recipe-bar { flex-direction: column; align-items: stretch !important; gap: 8px; padding-top: 10px !important; }
  .recipe-bar .brand { padding-bottom: 0; }
  .tabs { overflow-x: auto; scrollbar-width: none; margin-inline: -16px; padding-inline: 16px; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs a { white-space: nowrap; padding: 10px 14px 9px; font-size: .88rem; }
}

/* ---------- בלוקי תוכן: צבעי תפיחה ---------- */
:root { --b-ink: var(--crust); --b-acc: var(--bake-text); --b-paper: var(--flour); --b-card: #fff; --b-muted: var(--muted); --b-line: #ead9bf; --b-radius: 26px; --b-overlay: rgba(52,30,16,.78); }
/* תפיחה: כרטיסים כמו כרטיסיות מתכון, עם קו מקווקו */
.workshops { background: var(--flour); }
.workshops .svc { border: 1.5px dashed #d8c19c; background: #fffdf8; }
.workshops .svc:nth-child(2) .svc-ic, .workshops .svc:nth-child(4) .svc-ic { background: rgba(110,127,92,.14); color: var(--sage); }
.workshops .svc:nth-child(2) li::before, .workshops .svc:nth-child(4) li::before { background: var(--sage); }
.reviews { background: var(--dough); }
.reviews .rev { border: 0; background: var(--flour); }
.bake-qa { background: var(--flour); }
.contact { background: var(--crust); color: #fff; }
.contact .blk-kicker { color: #f0b98a; }
.contact .contact-lines .ic { background: rgba(240,185,138,.14); color: #f0b98a; }
.pband.soft { --b-paper: var(--flour); }
/* סבב 2 */
.workshops .svc-meta { font-size: .9rem; font-weight: 600; color: var(--sage); }
.expect { background: #fff; }
.expect .tline li::before { border-color: var(--bake); border-style: dashed; }
.dough-tips { background: var(--flour); }
.dough-tips .tip-c { border: 1.5px dashed #d8c19c; background: #fffdf8; }
.voucher-sec { background: var(--flour); }
.voucher-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6vw; align-items: center; }
.voucher-txt h2 { font-size: clamp(2.2rem, 4.4vw, 4rem); line-height: 1.04; letter-spacing: -0.02em; }
.voucher-txt > p { margin: 18px 0 26px; font-size: 1.12rem; line-height: 1.65; color: var(--muted); max-width: 42ch; }
.voucher-txt .fine-v { margin-top: 14px; font-size: .85rem; color: var(--muted); }
.voucher { position: relative; aspect-ratio: 1.75; max-width: 500px; width: 100%; justify-self: center; border-radius: 22px; padding: 30px 34px; display: grid; align-content: space-between; color: var(--crust);
  background: radial-gradient(circle at 0 50%, transparent 0 16px, var(--dough) 17px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 0 16px, var(--dough) 17px) right / 51% 100% no-repeat;
  transform: rotate(-3deg); filter: drop-shadow(0 26px 30px rgba(59,36,22,.22)); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.voucher:hover { transform: rotate(0); }
.voucher .v-k { font-size: .85rem; font-weight: 700; letter-spacing: .05em; color: var(--bake-text); }
.voucher .v-t { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.05; }
.voucher .v-to, .voucher .v-from { font-size: .95rem; color: var(--muted); }
.voucher .v-cut { position: absolute; inset-block: 22px; left: 30%; border-left: 2px dashed rgba(59,36,22,.25); }
@media (max-width: 860px) { .voucher-grid { grid-template-columns: 1fr; } .expect .tline { --n: 1; } }
.v-wrap { justify-self: center; width: 100%; max-width: 500px; filter: drop-shadow(0 26px 30px rgba(59,36,22,.22)); transform: rotate(-3deg); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.v-wrap:hover { transform: rotate(0); }
.v-wrap .voucher { transform: none; filter: none; max-width: none; background: var(--dough);
  -webkit-mask: radial-gradient(circle at 0 50%, transparent 0 16px, #000 17px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 0 16px, #000 17px) right / 51% 100% no-repeat;
          mask: radial-gradient(circle at 0 50%, transparent 0 16px, #000 17px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 0 16px, #000 17px) right / 51% 100% no-repeat; }
.v-wrap .voucher:hover { transform: none; }
.v-wrap .voucher::after { content: ""; position: absolute; left: 5%; top: 50%; width: 20%; aspect-ratio: 1; transform: translateY(-50%) rotate(-8deg); background: url(assets/logo-mark.png) center / contain no-repeat; }

/* =================== סבב 3: בצקלה — תפריט רגיל, בלי רקע אחיד, כרטיסי תמונה =================== */
:root {
  --k-ink: var(--crust); --k-muted: var(--muted); --k-acc: var(--bake-text); --k-acc2: var(--bake); --k-card: #fffdf8; --k-line: rgba(59,36,22,.18);
  --k-btn: linear-gradient(135deg, #D98A4B, var(--bake) 50%, #A85E26); --k-btn-text: #fff;
}
html { background: var(--flour); }
body { background: radial-gradient(900px 700px at 100% 10%, rgba(238,217,183,.7), transparent 60%), radial-gradient(800px 700px at 0% 70%, rgba(110,127,92,.12), transparent 60%), var(--noise), linear-gradient(180deg, #FAF6EF, #F5ECDD 50%, #FAF6EF); background-attachment: fixed; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* תפריט רגיל: לוגו, קישורים, כפתור */
.nav-main { position: fixed; top: 0; inset-inline: 0; z-index: 30; display: flex; align-items: center; gap: 32px; padding: 14px 4vw; transition: background .4s, box-shadow .4s, padding .4s; }
.nav-main.solid { background: linear-gradient(180deg, rgba(250,246,239,.96), rgba(250,246,239,.86)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 1px 0 rgba(59,36,22,.1), 0 14px 30px -26px rgba(59,36,22,.5); padding-block: 8px; }
.nav-main .logo, .nav-main .logo-img { height: 54px; width: auto; display: block; }
.nm-links { display: flex; gap: 28px; margin-inline-start: auto; }
.nm-links a { color: var(--crust); text-decoration: none; font-weight: 700; font-size: 1.02rem; padding: 6px 0; border-bottom: 2px solid transparent; transition: border-color .3s, color .3s; }
.nm-links a:hover, .nm-links a.is-current { border-color: var(--bake); color: var(--bake-text); }
.nm-cta { text-decoration: none; font-weight: 700; padding: 12px 24px; border-radius: 999px; color: #fff; background: linear-gradient(135deg, #D98A4B, var(--bake) 50%, #A85E26); box-shadow: 0 12px 24px -14px rgba(168,94,38,.9); }
.nm-burger { display: none; width: 46px; height: 46px; border-radius: 12px; border: 0; background: var(--crust); cursor: pointer; flex-direction: column; justify-content: center; align-items: center; gap: 5px; }
.nm-burger i { width: 20px; height: 2px; background: var(--flour); border-radius: 2px; }
.nm-menu { display: none; }
.bar { display: none; }

/* פתיחה ושאר הסקשנים: גרדיאנט במקום צבע אחיד */
.hero { background: radial-gradient(50vw 40vw at 80% 40%, rgba(238,217,183,.85), transparent 70%), radial-gradient(40vw 40vw at 10% 90%, rgba(201,119,58,.14), transparent 70%); }
.proof { background: radial-gradient(60vw 50vw at 50% 50%, rgba(255,255,255,.9), rgba(250,246,239,.4) 70%), linear-gradient(180deg, rgba(238,217,183,.3), rgba(250,246,239,0)); }
.voucher-sec { background: radial-gradient(50vw 40vw at 20% 50%, rgba(238,217,183,.7), transparent 70%); }
.kick { display: inline-flex; align-items: center; gap: 12px; font-size: .95rem; font-weight: 700; color: var(--bake-text); margin-bottom: 16px; }
.kick::before { content: ""; width: 30px; height: 2px; border-top: 2px dashed var(--bake); }
.sec-head { max-width: 760px; margin-bottom: 7vh; }
.sec-head.center { margin-inline: auto; text-align: center; }
.sec-head h2, .rc-body h2 { font-size: clamp(2.3rem, 4.8vw, 4.4rem); font-weight: 700; line-height: 1.04; letter-spacing: -0.01em; }
.sec-head h2 em, .rc-body h2 em { display: block; font-style: normal; font-weight: 400; color: var(--bake-text); }
.sec-head p { margin-top: 18px; font-size: 1.15rem; line-height: 1.65; color: var(--muted); max-width: 56ch; }
.sec-head.center p { margin-inline: auto; }

/* סדנאות: כרטיסי תמונה בסגנון כרטיס מתכון */
.ws { padding: 16vh 6vw 10vh; background: radial-gradient(60vw 40vw at 15% 30%, rgba(110,127,92,.12), transparent 70%); }
.ws .sec-head { margin-bottom: 0; }
.ws .cc { border-radius: 26px; border: 1.5px dashed #D8C19C; background: linear-gradient(180deg, #FFFDF8, #FBF3E6); }
.ws .cc-img { margin: 10px 10px 0; border-radius: 20px; overflow: hidden; }
.cc-badge { background: linear-gradient(135deg, #7C8E68, var(--sage)); }
.ws .cc:nth-child(odd) .cc-badge { background: linear-gradient(135deg, #D98A4B, #A85E26); }
.cc-meta { display: block; margin-top: 10px; font-size: .9rem; font-weight: 700; color: var(--sage); }
.cc-nav button { background: linear-gradient(135deg, #F0C48F, var(--dough)); color: var(--crust); }
.hands-band .pband-box { max-width: 560px; }

/* מה לצפות: ציר לאורך */
.expect { padding: 16vh 6vw; background: radial-gradient(50vw 50vw at 50% 50%, rgba(255,255,255,.85), transparent 70%); }
.expect .vtl-node { border-radius: 50% 50% 46% 54% / 56% 50% 50% 44%; }

/* טיפים: כרטיס מתכון עם תמונה */
.recipe { padding: 14vh 6vw; }
.rc-card { position: relative; display: grid; grid-template-columns: .95fr 1.05fr; border-radius: 34px; overflow: hidden; background: linear-gradient(170deg, #FFFDF8, #FBF1E0); box-shadow: 0 40px 80px -40px rgba(59,36,22,.6); border: 1.5px dashed #D8C19C; }
.rc-pic { position: relative; margin: 0; min-height: 520px; }
.rc-pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rc-pic figcaption { position: absolute; bottom: 18px; inset-inline-start: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; font-weight: 700; color: var(--crust); background: rgba(250,246,239,.9); backdrop-filter: blur(6px); }
.rc-pic figcaption svg { width: 22px; height: 22px; color: var(--bake); }
.rc-body { padding: 54px 50px; }
.rc-list { list-style: none; padding: 0; margin-top: 30px; display: grid; gap: 22px; }
.rc-list li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; align-items: start; padding-bottom: 20px; border-bottom: 1.5px dashed rgba(201,119,58,.35); }
.rc-list li:last-child { border-bottom: 0; }
.rc-ic { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #D98A4B, var(--bake) 50%, #A85E26); box-shadow: 0 12px 24px -14px rgba(168,94,38,.9); }
.rc-list li:nth-child(even) .rc-ic { background: linear-gradient(135deg, #8EA078, var(--sage)); }
.rc-ic svg { width: 28px; height: 28px; }
.rc-list b { font-size: 1.25rem; }
.rc-n { color: var(--bake-text); }
.rc-list p { margin-top: 6px; font-size: 1.04rem; line-height: 1.65; color: var(--muted); }

/* המלצות: פתקי מתכון עם תמונה, נעוצים */
.reviews { padding: 14vh 6vw; background: linear-gradient(180deg, rgba(238,217,183,0), rgba(238,217,183,.75) 45%, rgba(238,217,183,0)); }
.revs-note { display: inline-flex; margin-top: 16px; padding: 6px 14px; border-radius: 999px; border: 1px dashed var(--muted); font-size: .85rem; color: var(--muted); }
.brv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; max-width: 1200px; margin: 0 auto; }
.brv { position: relative; margin: 0; padding: 14px 14px 26px; background: linear-gradient(175deg, #FFFDF8, #FBF3E6); box-shadow: 0 30px 60px -36px rgba(59,36,22,.6); transform: rotate(-1.8deg); transition: transform .5s; display: flex; flex-direction: column; gap: 14px; }
.brv:nth-child(2) { transform: rotate(1.6deg) translateY(22px); }
.brv:hover { transform: rotate(0) translateY(-6px); }
.brv-pin { position: absolute; top: -12px; left: 50%; width: 26px; height: 26px; margin-left: -13px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #F0A06A, var(--bake) 60%, #8A4A1C); box-shadow: 0 6px 10px -4px rgba(0,0,0,.4); z-index: 2; }
.brv img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.brv blockquote { padding: 0 10px; font-size: 1.1rem; line-height: 1.7; }
.brv figcaption { padding: 12px 10px 0; display: flex; flex-direction: column; border-top: 1.5px dashed rgba(201,119,58,.35); margin-inline: 10px; }
.brv figcaption span { font-size: .88rem; color: var(--muted); }

.qa-sec { padding: 12vh 6vw; }
.faq-list { max-width: 860px; margin: 0 auto; display: grid; gap: 12px; }
.faq-list details { border-radius: 20px; padding: 20px 26px; background: rgba(255,253,248,.75); border: 1.5px dashed transparent; transition: background .3s, border-color .3s, box-shadow .3s; }
.faq-list details[open] { background: linear-gradient(170deg, #FFFDF8, #FBF1E0); border-color: #D8C19C; box-shadow: 0 20px 40px -30px rgba(59,36,22,.6); }
.faq-list summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: 1.18rem; font-weight: 700; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: rgba(201,119,58,.16); color: var(--bake-text); font-size: 1.4rem; transition: transform .3s; }
.faq-list details[open] summary::after { transform: rotate(45deg); background: var(--bake); color: #fff; }
.faq-list details p { margin-top: 12px; font-size: 1.05rem; line-height: 1.7; color: var(--muted); }
.contact { background: radial-gradient(60vw 40vw at 85% 10%, rgba(201,119,58,.35), transparent 60%), linear-gradient(140deg, #3B2416, #5B3922 60%, #3B2416); }
.foot .logo, .foot .logo-img { height: 50px; width: auto; }

@media (max-width: 960px) {
  .nm-links, .nm-cta { display: none; }
  .nm-burger { display: flex; margin-inline-start: auto; }
  .nm-menu { position: fixed; top: 70px; inset-inline: 12px; z-index: 29; display: grid; gap: 4px; padding: 16px; border-radius: 22px; background: linear-gradient(170deg, #FFFDF8, #FBF1E0); box-shadow: 0 30px 60px -30px rgba(59,36,22,.6); border: 1.5px dashed #D8C19C; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .35s, transform .35s, visibility .35s; max-height: calc(100vh - 82px); max-height: calc(100dvh - 82px); overflow-y: auto; overscroll-behavior: contain; }   /* טלפון לרוחב: התפריט נגלל במקום להיחתך */
  .menu-open .nm-menu { opacity: 1; visibility: visible; transform: none; }
  .nm-menu a { color: var(--crust); text-decoration: none; font-weight: 700; font-size: 1.2rem; padding: 12px 14px; border-radius: 12px; }
  .nm-menu a:last-child { color: #fff; background: linear-gradient(135deg, #D98A4B, var(--bake) 50%, #A85E26); text-align: center; margin-top: 6px; }
}
@media (max-width: 860px) {
  .ws, .expect, .recipe, .reviews, .qa-sec { padding-inline: 20px; }
  .rc-card { grid-template-columns: 1fr; }
  .rc-pic { min-height: 260px; }
  .rc-body { padding: 30px 22px; }
  .brv-grid { grid-template-columns: 1fr; }
  .brv:nth-child(2) { transform: none; }
}
/* ניגודיות: כפתורים עם טקסט לבן — גרדיאנט כהה מספיק */
:root { --k-btn: linear-gradient(135deg, #A85E26, #8E4A1C); }
.nm-cta, .nm-menu a:last-child, .cc-btn, .contact .cform button { background: linear-gradient(135deg, #A85E26, #8E4A1C); }
.ws .cc:nth-child(odd) .cc-badge { background: linear-gradient(135deg, #A85E26, #8E4A1C); }
.cc-badge { background: linear-gradient(135deg, #5E6E4D, #4F5E40); }
.cc-meta { color: #55653F; }
.rc-ic { background: linear-gradient(135deg, #A85E26, #8E4A1C); }
/* לוגו בצקלה: אותיות מבצק + שורת תיאור קטנה */
.logo-wrap { display: inline-flex; align-items: center; gap: 12px; }
.logo-img { height: 60px; width: auto; display: block; filter: drop-shadow(0 6px 10px rgba(59,36,22,.18)); }
.logo-tag { font-size: .88rem; font-weight: 700; color: var(--muted); padding-inline-start: 12px; border-inline-start: 1.5px dashed #D8C19C; line-height: 1.2; }
.foot .logo-img { height: 64px; }
@media (max-width: 960px) { .logo-img { height: 48px; } .logo-tag { display: none; } }
.nav-main .logo-img { height: 76px; }
.nav-main.solid .logo-img { height: 60px; }
.nav-main .logo-img { transition: height .4s; }
@media (max-width: 960px) { .nav-main .logo-img, .nav-main.solid .logo-img { height: 52px; } }

/* =================== סבב 4: רקעים אחידים ועדינים (קמח ובצק), כפתורים בצבע אחד עם צל עדין =================== */
:root {
  --bgA: #FAF6EF;   /* קמח */
  --bgB: #F6ECDD;   /* בצק בהיר */
  --bgW: #FFFDF9;
  --bgAcc: #F3E2C7; /* בצק, לסקשן הקשר */
  --k-btn: #A85E26; --k-btn-text: #FFFFFF; --k-shadow: rgba(168,94,38,.4);
}
html { background: var(--bgA); }
body { background: var(--bgA); background-attachment: scroll; }

/* רקע אחיד לכל סקשן, לסירוגין */
.hero, .ways, .roni, .reviews, .foot { background: var(--bgA); }
.ws, .expect, .voucher-sec { background: var(--bgB); }
.proof, .recipe, .qa-sec { background: var(--bgW); }
.contact { background: var(--bgAcc); color: var(--crust); }
.contact .sec-bg { display: none; }
.contact .blk-kicker { color: var(--bake-text); }
.contact .contact-info > p { opacity: 1; color: var(--muted); }
.contact .contact-lines .ic { background: rgba(255,255,255,.7); color: var(--bake-text); }

/* כפתורים: חום־זהוב אחד + צל עדין */
.btn, .nm-cta, .cc-btn, .contact .cform button, .cc-nav button, .nm-menu a:last-child {
  background: var(--k-btn); color: var(--k-btn-text);
  box-shadow: 0 8px 18px -9px var(--k-shadow);
}
.btn:hover, .nm-cta:hover, .cc-btn:hover, .contact .cform button:hover, .cc-nav button:hover { background: #95521F; box-shadow: 0 12px 22px -9px var(--k-shadow); }

/* אלמנטים: צבע אחיד */
.nav-main.solid { background: rgba(250,246,239,.96); }
.nm-menu { background: var(--bgW); }
.ws .cc { background: var(--bgW); }
.cc-badge { background: #4F5E40; }
.ws .cc:nth-child(odd) .cc-badge { background: var(--k-btn); }
.rc-card { background: var(--bgA); }
.rc-ic { background: var(--k-btn); }
.rc-list li:nth-child(even) .rc-ic { background: #5E6E4D; }
.brv { background: var(--bgW); }
.brv-pin { background: var(--bake); }
.faq-list details { background: var(--bgA); }
.faq-list details[open] { background: var(--bgA); }

/* =================== סבב 5: מהראיון עם רוני =================== */
.hero .lead { max-width: 34ch; }
.roni-sig { margin-top: 24px; padding: 20px 26px; border-radius: 22px; background: var(--bgW); border-inline-start: 6px solid var(--k-btn);
  font-size: 1.3rem; line-height: 1.45; font-weight: 700; color: var(--crust); max-width: 38ch; box-shadow: 0 16px 30px -24px rgba(59,36,22,.45); }

/* מועדים קרובים: כרטיסיות כמו פתק הזמנה, עם קו מנוקב */
.dates { padding: 14vh 6vw; background: var(--bgW); }
.dt-list { list-style: none; padding: 0; margin: 46px auto 0; max-width: 1040px; display: grid; gap: 16px; }
.dt { display: grid; grid-template-columns: 110px 1fr auto auto; align-items: center; gap: 26px; padding: 18px 26px 18px 18px;
  border-radius: 22px; background: var(--bgA); box-shadow: 0 14px 30px -26px rgba(59,36,22,.6); position: relative; }
.dt-day { display: grid; justify-items: center; align-content: center; height: 96px; border-radius: 16px; background: var(--k-btn); color: #fff;
  box-shadow: 0 8px 18px -10px var(--k-shadow); position: relative; }
.dt-day::after { content: ""; position: absolute; inset-block: 6px; inset-inline-end: -14px; border-inline-end: 2px dashed rgba(59,36,22,.22); }
.dt-day b { font-size: 2.4rem; line-height: 1; }
.dt-day span { font-size: .95rem; font-weight: 700; }   /* נגישות 12.10: בלי שקיפות, לניגודיות AA */
.dt-info { padding-inline-start: 8px; }
.dt-when { font-size: .92rem; font-weight: 700; color: var(--bake-text); }
.dt-info h3 { font-size: 1.3rem; margin: 2px 0 4px; color: var(--crust); }
.dt-left { display: inline-flex; align-items: center; gap: 6px; font-size: .92rem; color: #4F5E40; font-weight: 700; }
.dt-left svg { width: 18px; height: 18px; }
.dt-price { text-align: center; }
.dt-price b { display: block; font-size: 1.35rem; color: var(--crust); }
.dt-price small { font-size: .85rem; color: var(--muted); }
.dt-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 999px; text-decoration: none; font-weight: 700;
  background: var(--k-btn); color: var(--k-btn-text); box-shadow: 0 8px 18px -9px var(--k-shadow); transition: background .2s, box-shadow .2s; white-space: nowrap; }
.dt-btn svg { width: 16px; height: 16px; }
.dt-btn:hover { background: #95521F; box-shadow: 0 12px 22px -9px var(--k-shadow); }
.dt-fine { text-align: center; margin-top: 22px; font-size: .9rem; color: var(--muted); }
@media (max-width: 760px) {
  .dates { padding: 11vh 16px; }
  .dt { grid-template-columns: 78px 1fr; gap: 14px 18px; padding: 14px; }
  .dt-day { height: 78px; }
  .dt-day b { font-size: 1.9rem; }
  .dt-price { grid-column: 2; text-align: start; display: flex; gap: 6px; align-items: baseline; }
  .dt-price b { display: inline; font-size: 1.15rem; }
  .dt-btn { grid-column: 1 / -1; justify-content: center; }
}
.roni-text > p:not(.kicker) { font-size: 1.15rem; line-height: 1.65; color: var(--muted); max-width: 46ch; }

/* =================== QA טלפון (11.10): תיקוני באגים =================== */
/* תמונת רוני נטענת בעצלות: שומרים לה מקום מראש, כדי שקישורים לשאלות ולטופס ינחתו במקום הנכון */
.roni figure img { aspect-ratio: 4 / 5; height: auto; object-fit: cover; }
/* קרוסלה: ה־snap הזיז את הכרטיס הראשון ב־6px, ולכן חץ "הקודם" נשאר פעיל בהתחלה */
.cc-row { scroll-padding-inline: 6px; }

@media (max-width: 860px) {
  /* הסטיקי בגובה המסך הקטן (עם סרגלי הדפדפן), והקערה לא גדלה מעבר למה שנכנס במסכים נמוכים */
  .proof-sticky { height: 100svh; }
  .bowl { width: min(70%, max(150px, calc((100vh - 375px) * 1.11))); }
}
@media (max-width: 860px) and (prefers-reduced-motion: no-preference) {
  /* כל השלבים באותה משבצת: הכותרת לא קופצת כשתיאור של שלב ארוך יותר */
  .stages li, .stages li:not(.on) { display: grid; grid-area: 1 / 1; }
  .stages li:not(.on) { visibility: hidden; }
  .stages li p, .stages li.on p { max-height: none; }
}
/* טלפון לרוחב: פריסה בשני טורים, כמו במחשב, כדי שהטקסט של הבצק לא ייצא מהמסך */
@media (max-width: 960px) and (orientation: landscape) and (max-height: 520px) {
  .hero { grid-template-columns: 1fr 1fr; gap: 4vw; padding: 88px 4vw 40px; }
  .hero-art { order: 0; width: min(100%, calc(100vh - 110px)); justify-self: center; }
  .proof-sticky { grid-template-columns: 1fr 1fr; grid-template-rows: none; align-content: start; gap: 4vw; padding: 78px 4vw 12px; }
  .bowl-wrap { order: 0; gap: 10px; }
  .bowl { width: min(90%, calc((100vh - 200px) * 1.11)); }   /* הטיימר נשאר מעל כפתור הוואטסאפ הצף */
}
/* הפחתת תנועה: אין אנימציה בגלילה, אז הבצק לא נעוץ — כל השלבים מוצגים ברצף, בלי גלילה ריקה */
@media (prefers-reduced-motion: reduce) {
  .proof { height: auto; }
  .proof-sticky { position: static; height: auto; }
}