/* סולם הגדלים של העמוד (בנוסף לטוקנים המשותפים) */
:root{--tr-fs-14:14px;--tr-fs-16:16px;--tr-fs-18:18px;--tr-fs-19:19px;--tr-fs-20:20px;--tr-fs-21:21px;--tr-fs-22:22px;--tr-fs-23:23px;--tr-fs-24:24px;--tr-fs-27:27px;--tr-fs-34:34px;--tr-fs-36:36px;--tr-fs-cta:clamp(40px,4.8vw,72px);--tr-fs-hero:clamp(52px,7.5vw,116px);--tr-fs-hero-m:clamp(42px,12.6vw,66px);--tr-fs-long:21px}
/* ================= מגשים לשמחות (tr-) ================= */

/* ---------- 1. פתיחה: במה במרכז ---------- */
.tr-hero{position:relative;display:flex;min-height:max(760px,calc(100svh - 80px));padding:18px 0 var(--tr-foot,100px)}
.tr-hero>.wrap{display:flex;flex-direction:column}
.tr-head{position:relative;z-index:6;text-align:center}
.tr-h1{font-size:var(--tr-fs-hero);line-height:.98;letter-spacing:-.03em;margin:18px 0 0}
.tr-h1 .tr-l{display:block;white-space:nowrap}
.tr-l1{transform:translate3d(calc(var(--sx,0)*80px + 6%),0,0)}
.tr-l2{transform:translate3d(calc(var(--sx,0)*-80px - 6%),0,0)}
.tr-h1 .w{display:inline-block}
.tr-h1 .hl::after{bottom:-.06em}
.tr-ch{display:inline-block}
.tr-stage{position:relative;flex:1;display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr) minmax(0,240px);gap:24px;align-items:end;min-height:430px;margin-top:4px}
.tr-side{position:relative;z-index:6;align-self:center;padding-top:40px}
.tr-lead{font-size:var(--fs-lead);line-height:1.5;color:var(--fade);max-width:23ch;margin-bottom:30px}
.tr-side .ctas{flex-direction:column;align-items:flex-start;gap:18px}
.tr-side .note{margin-top:22px}
.tr-tray{position:relative;z-index:3;justify-self:center;width:min(620px,100%)}
.tr-tray>img{position:relative;z-index:1;width:100%;filter:saturate(1.12) contrast(1.05) brightness(1.03) drop-shadow(0 18px 18px color-mix(in srgb,var(--shade) 30%,transparent))}
.tr-tray::after{content:'';position:absolute;z-index:0;left:6%;right:6%;bottom:-14px;height:34px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--shade) 50%,transparent),transparent)}
.tr-tray .stk{--sz:136px;top:2%;inset-inline-start:-4%;--sr:-12deg}
.tr-tray .stk span{font-size:var(--tr-fs-16)}
.tr-tray .stk b{font-size:var(--tr-fs-36)}
.tr-tray .stamp{--st:146px;bottom:40px;inset-inline-end:-210px;--r:11deg}
.tr-tray .hang{top:-24px;inset-inline-end:-196px;--hr:5deg;--tw:64px}
.tr-tray .hang .htag{white-space:normal;width:170px;padding:30px 16px 16px;font-size:var(--tr-fs-16)}
.tr-tray .hang .htag small{display:block;font-size:var(--fs-small);margin-bottom:2px}
.tr-tray .hang .htag b{display:block;font-weight:800;font-size:var(--tr-fs-20)}
.tr-tray .deco{z-index:2}
/* רצועת קראפט שהמגש עומד עליה (מתחת לקרע של החלק הבא) */
.tr-strip{position:absolute;z-index:-1;left:-60px;right:-60px;bottom:-34px;height:160px;transform:rotate(-1.3deg)}
.tr-strip>.pp{--tz:22px;--amp:7px}

/* ---------- 2. המגשים: נייר ירוק כהה, חוט אחד וסינון ---------- */
.tr-shop{padding:var(--sp-top) 0 var(--sp);color:var(--cream);--hl:var(--pink-soft);--hlu:var(--pink-soft)}
.tr-shop>.pp{--paper:var(--ink);--tz:48px;--amp:14px;--rimc:color-mix(in srgb,var(--green) 36%,var(--cream))}
.tr-shop .head .sub p{color:var(--cream-dim)}
.tr-shop .twine .a{stroke:color-mix(in srgb,var(--kraft) 72%,var(--cream))}
.tr-shop .twine .b{stroke:var(--kraft-dk)}
.tr-shop .note{color:var(--cream);opacity:1}
.tr-shop .link{--ul:var(--mango)}

.tr-filter{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:40px;padding-top:50px}
.tr-line{position:absolute;top:50px;left:calc(-1*var(--gutter) + 12px);width:calc(100% + 2*var(--gutter) - 24px);height:20px;overflow:visible;pointer-events:none}
.tr-line path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}
.tr-line .a{stroke:color-mix(in srgb,var(--kraft) 72%,var(--cream));stroke-width:2.6}
.tr-line .b{stroke:var(--kraft-dk);stroke-width:1.2;stroke-dasharray:2.4 3.4}
.tr-line.l2{display:none;top:-8px}
.tr-fgroup{position:relative}
.tr-flbl{position:absolute;bottom:calc(100% + 16px);inset-inline-start:0;font:500 18px/1.2 var(--font);color:var(--cream);white-space:nowrap}
.tr-flbl b{font-weight:800}
.tr-tags{display:flex;gap:18px;padding-inline-start:6px}
.tr-tag{--hr:-3deg;position:relative;display:block;border:0;background:none;padding:34px 0 0;margin:0;cursor:pointer;font-family:inherit;color:var(--ink);transform-origin:50% 0;transform:rotate(var(--hr));transition:transform .55s var(--spring);
  filter:drop-shadow(0 2px 2px color-mix(in srgb,var(--shade) 50%,transparent)) drop-shadow(0 10px 12px color-mix(in srgb,var(--shade) 34%,transparent))}
.tr-tag:nth-child(2){--hr:4deg}.tr-tag:nth-child(3){--hr:-5deg}.tr-tag:nth-child(4){--hr:3deg}
.tr-tag::before{content:'';position:absolute;z-index:3;top:-4px;left:50%;width:9px;height:7px;margin-left:-4.5px;border-radius:50%;background:color-mix(in srgb,var(--kraft) 60%,var(--ink))}
.tr-tag::after{content:'';position:absolute;z-index:3;top:-1px;left:50%;width:2.4px;height:47px;margin-left:-1.2px;border-radius:2px;background:repeating-linear-gradient(to bottom,color-mix(in srgb,var(--kraft) 72%,var(--cream)) 0 4px,var(--kraft-dk) 4px 6px)}
.tr-tg{position:relative;z-index:1;display:block;min-width:104px;padding:32px 16px 13px;text-align:center;background:var(--tex-kraft),var(--kraft);clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 15px,100% 100%,0 100%,0 15px);transition:background .3s}
.tr-tg::before{content:'';position:absolute;top:10px;left:50%;width:11px;height:11px;margin-left:-5.5px;border-radius:50%;background:color-mix(in srgb,var(--shade) 70%,var(--kraft));box-shadow:0 0 0 3px color-mix(in srgb,var(--kraft) 40%,var(--cream)),inset 0 1px 2px color-mix(in srgb,var(--shade) 80%,transparent)}
.tr-tg b{display:block;font:800 19px/1.15 var(--font);white-space:nowrap}
.tr-tg small{display:block;margin-top:4px;font:500 15px/1.2 var(--font);white-space:nowrap}
.tr-tag[aria-checked="true"]{transform:rotate(0deg) translateY(7px)}
.tr-tag[aria-checked="true"] .tr-tg{background:var(--tex-paper),var(--cream)}
.tr-tag:hover:not([aria-checked="true"]){transform:rotate(calc(var(--hr)*-.6))}
.tr-dot{position:absolute;z-index:4;top:30px;inset-inline-end:-12px;width:36px;height:36px;display:grid;place-items:center;transform:rotate(-12deg) scale(0);transition:transform .45s var(--spring)}
.tr-dot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tr-dot i{position:relative;font:800 16px/1 var(--font);font-style:normal;color:var(--cream)}
.tr-tag[aria-checked="true"] .tr-dot{transform:rotate(-12deg) scale(1)}

.tr-budget{flex:none}
.tr-sign{position:relative;isolation:isolate;margin-top:40px;padding:16px 16px 10px;transform:rotate(1.6deg);transform-origin:50% 0;color:var(--ink)}
.tr-sign>.pp{--paper:var(--cream);--tz:10px;--amp:3px;--rimc:var(--cream);--pps:drop-shadow(0 2px 2px color-mix(in srgb,var(--shade) 50%,transparent)) drop-shadow(0 12px 16px color-mix(in srgb,var(--shade) 36%,transparent))}
.tr-sign>i.str{position:absolute;z-index:3;top:-44px;width:2.4px;height:52px;border-radius:2px;background:repeating-linear-gradient(to bottom,color-mix(in srgb,var(--kraft) 72%,var(--cream)) 0 4px,var(--kraft-dk) 4px 6px)}
.tr-sign>i.str::before{content:'';position:absolute;top:-3px;left:50%;width:9px;height:7px;margin-left:-4.5px;border-radius:50%;background:color-mix(in srgb,var(--kraft) 60%,var(--ink))}
.tr-sign>i.str::after{content:'';position:absolute;bottom:-4px;left:50%;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--kraft-dk)}
.tr-sign>i.s1{inset-inline-start:13%}.tr-sign>i.s2{inset-inline-end:13%}
.tr-sign-h{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:0 8px 8px;border-bottom:2px solid var(--ink);font:800 16px/1.2 var(--font)}
.tr-sign-h small{font:500 15px var(--font);color:var(--pink-ink)}
.tr-prices{display:flex}
.tr-price{position:relative;border:0;background:none;margin:0;padding:12px 20px 10px;cursor:pointer;text-align:center;color:var(--ink);font-family:inherit}
.tr-price+.tr-price{border-inline-start:1.5px dashed color-mix(in srgb,var(--ink) 30%,transparent)}
.tr-price small{display:block;font:500 15px/1.2 var(--font)}
.tr-price b{display:block;font:800 30px/1.1 var(--font);letter-spacing:-.015em;white-space:nowrap;font-variant-numeric:tabular-nums}
.tr-price em{display:block;margin-top:2px;font:500 15px/1.2 var(--font);font-style:normal;color:var(--fade);white-space:nowrap}
.tr-circ{position:absolute;inset:2px 4px 0;width:calc(100% - 8px);height:calc(100% - 2px);overflow:visible;pointer-events:none}
.tr-circ path{fill:none;stroke:var(--pink-paper);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 2;stroke-dashoffset:1.05;transition:stroke-dashoffset .6s var(--ease)}
.tr-price[aria-checked="true"] .tr-circ path{stroke-dashoffset:0}
.tr-price[aria-checked="true"] em{color:var(--pink-ink)}

.tr-res{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;margin:40px 0 70px;padding-top:18px;border-top:1.5px dashed color-mix(in srgb,var(--cream) 30%,transparent)}
.tr-count{font:500 19px/1.3 var(--font);color:var(--cream)}
.tr-count b{font-weight:800;color:var(--mango)}
.tr-clear{border:0;background:none;padding:0 0 3px;cursor:pointer;font:500 17px/1.2 var(--font);color:var(--cream)}
.tr-clear[hidden]{display:none}

.tr-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:70px 40px}
.tr-card{flex:0 0 calc((100% - 80px)/3);max-width:calc((100% - 80px)/3)}
.tr-card[hidden],.tr-empty[hidden]{display:none}
.tr-card.tr-wide{flex-basis:calc((100% - 80px)/3*2 + 40px);max-width:none}
.tr-card:nth-child(4n+1){--rot:-.7deg}.tr-card:nth-child(4n+2){--rot:.6deg}.tr-card:nth-child(4n+3){--rot:-.3deg}.tr-card:nth-child(4n+4){--rot:.8deg}
.tr-card{color:var(--ink)}
.tr-card .plate>.pp{--paper:var(--pc,var(--blush));--rimc:var(--cream)}
/* תמונה שחתוכה בצדדים (gift-cups): הקצוות נמוגים לתוך הנייר במקום קו חתוך */
.tr-card.tr-cut .plate img{-webkit-mask:linear-gradient(to right,transparent,var(--ink) 14%,var(--ink) 86%,transparent);mask:linear-gradient(to right,transparent,var(--ink) 14%,var(--ink) 86%,transparent)}
.tr-card .plate img{transition:transform .55s var(--ease)}
.tr-card.tr-wide .plate{height:340px}
.tr-card .stk.tr-long b{font-size:var(--tr-fs-long)}
.tr-body{display:flex;flex-direction:column;flex:1}
.tr-incl{display:flex;align-items:center;gap:9px;margin:-6px 8px 22px;font:500 15px/1.3 var(--font);color:var(--ink)}
.tr-incl svg{flex:none}
.tr-wide .tr-body{flex-direction:row;align-items:center;gap:10px 22px}
.tr-wide .tr-txt{flex:1;min-width:0}
.tr-wide .tr-incl{margin-bottom:6px}
.tr-wide .add{margin:0 8px 0;flex:none;padding-inline:30px}
.tr-badge{position:relative;flex:none;--st:118px;--r:-10deg;color:var(--pink-paper);margin:-26px 0 -30px;opacity:.9}
.tr-card .htag{transform-origin:50% -24px}
@media (hover:hover){
  .tr-card{transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
  .tr-card:hover{transform:translateY(-8px) rotate(0deg);box-shadow:0 1px 1px color-mix(in srgb,var(--shade) 22%,transparent),0 14px 22px color-mix(in srgb,var(--shade) 22%,transparent),0 40px 60px color-mix(in srgb,var(--shade) 28%,transparent)}
  .tr-card:hover .plate img{transform:translateY(-7px) scale(1.025)}
  .tr-card:hover .htag{animation:trSway 1.2s var(--ease)}
}
@keyframes trSway{25%{transform:rotate(7deg)}60%{transform:rotate(-4deg)}85%{transform:rotate(1.5deg)}}

.tr-empty{position:relative;isolation:isolate;flex:0 1 640px;padding:60px 48px 50px;text-align:center;color:var(--ink);transform:rotate(-1deg)}
.tr-empty>.pp{--paper:var(--cream);--tz:18px;--amp:5px;--rimc:var(--cream);--pps:drop-shadow(0 2px 2px color-mix(in srgb,var(--shade) 40%,transparent)) drop-shadow(0 18px 26px color-mix(in srgb,var(--shade) 36%,transparent))}
.tr-empty .tape{top:-14px;left:50%;margin-left:-58px;--tr:2deg}
.tr-empty h3{font-size:var(--tr-fs-34);line-height:1.15;margin-bottom:12px}
.tr-empty p{font-size:var(--tr-fs-20);line-height:1.5;color:var(--fade);max-width:30ch;margin:0 auto 28px}
.tr-empty .ctas{justify-content:center;gap:22px}
.tr-empty .stamp{--st:126px;top:-46px;inset-inline-end:-34px;--r:14deg;color:var(--pink-paper)}
.tr-empty .deco{bottom:-40px;inset-inline-start:-46px}
.tr-empty .link{--ul:var(--pink)}
.tr-foot{display:flex;align-items:center;justify-content:space-between;gap:16px 30px;flex-wrap:wrap;margin-top:76px}

/* ---------- 3. איך זה מגיע: טבע דומם על נייר ורוד ---------- */
.tr-ship{padding:var(--sp-top) 0 calc(var(--sp) + 10px);color:var(--cream);--hl:var(--cream);--hlu:var(--mango)}
.tr-ship>.pp{--paper:var(--pink-paper);--tz:46px;--amp:13px;--rimc:color-mix(in srgb,var(--pink) 16%,var(--cream))}
.tr-ship>.wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6.4fr);gap:clamp(40px,6vw,96px);align-items:center}
.tr-ship h2{font-size:var(--fs-h2);line-height:1.06;margin:20px 0 22px;text-wrap:balance}
.tr-ship .tr-sub{font-size:var(--fs-lead);line-height:1.5;max-width:30ch;margin-bottom:38px}
.tr-facts{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.tr-facts li{display:grid;grid-template-columns:72px 1fr;gap:4px 20px;align-items:start}
.tr-ico{grid-row:1/3;position:relative;width:72px;aspect-ratio:1;transform:rotate(var(--ir,-8deg));filter:drop-shadow(0 1px 1px color-mix(in srgb,var(--shade) 40%,transparent)) drop-shadow(0 5px 8px color-mix(in srgb,var(--shade) 24%,transparent))}
.tr-facts li:nth-child(2) .tr-ico{--ir:7deg}.tr-facts li:nth-child(3) .tr-ico{--ir:-4deg}
.tr-ico svg{width:100%;height:100%;overflow:visible;display:block}
.tr-ico .ic{fill:none;stroke:var(--ink);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}
.tr-facts h3{font-size:var(--tr-fs-23);line-height:1.25;padding-top:6px}
.tr-facts p{font-size:var(--tr-fs-18);line-height:1.5;max-width:34ch}

.tr-still{position:relative;min-height:660px}
.tr-st-tray{position:absolute;z-index:3;top:340px;inset-inline-end:-2%;width:104%;max-width:none}
.tr-st-tray img{width:100%;filter:saturate(1.12) contrast(1.05) brightness(1.03) drop-shadow(0 16px 16px color-mix(in srgb,var(--shade) 34%,transparent))}
.tr-st-tray::after{content:'';position:absolute;z-index:-1;left:5%;right:4%;bottom:-14px;height:34px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--shade) 55%,transparent),transparent)}
.tr-gcard{position:absolute;z-index:1;top:84px;inset-inline:0;width:min(300px,58%);min-height:440px;margin:0 auto;padding:34px 30px 26px;isolation:isolate;color:var(--ink)}
.tr-gcard>.pp{--paper:var(--cream);--tz:12px;--amp:3.4px;--rimc:var(--cream);--pps:drop-shadow(0 2px 2px color-mix(in srgb,var(--shade) 46%,transparent)) drop-shadow(0 20px 26px color-mix(in srgb,var(--shade) 40%,transparent))}
.tr-gcard .tape{top:-14px;inset-inline-start:30%;--tr:-5deg}
.tr-gc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;margin-bottom:6px;border-bottom:1.5px solid color-mix(in srgb,var(--ink) 70%,transparent)}
.tr-gc-top img{height:26px;width:auto}
.tr-gc-top span{font:500 15px var(--font);color:var(--pink-ink)}
.tr-gc-txt{display:grid;font:500 19px/30px var(--font);
  background:repeating-linear-gradient(to bottom,transparent 0 37px,color-mix(in srgb,var(--ink) 18%,transparent) 37px 38px)}
.tr-gc-txt>span{grid-area:1/1}
.tr-gc-ghost{visibility:hidden}
.tr-gc-live::after{content:'';display:inline-block;width:2px;height:.95em;margin-inline-start:2px;vertical-align:-.12em;background:var(--pink-paper);animation:trCaret 1s steps(2) infinite}
.tr-gcard.typed .tr-gc-live::after{opacity:0;animation:none}
@keyframes trCaret{50%{opacity:0}}
.tr-gc-sign{margin-top:8px;font:500 19px var(--font);text-align:end;color:var(--pink-ink)}
.tr-gcard .stamp{--st:132px;bottom:-60px;inset-inline-start:-54px;--r:14deg;color:var(--grape)}
.tr-occ{position:absolute;z-index:5;inset-inline-start:2%;top:0;display:flex;align-items:center;gap:12px 14px;flex-wrap:wrap}
.tr-occ>span{font:500 17px var(--font);color:var(--cream)}
.tr-occ button.label{border:0;cursor:pointer;font:500 16px/1.2 var(--font);color:var(--ink);transition:transform .3s var(--spring)}
.tr-occ button.label:nth-of-type(2){transform:rotate(1.4deg)}
.tr-occ button.label:hover{transform:rotate(0) translateY(-2px)}
.tr-occ button.label[aria-checked="true"]>.pp{--paper:var(--cream);--tex:var(--tex-paper);--rimc:var(--cream)}
.tr-occ button.label[aria-checked="true"]{color:var(--pink-ink);font-weight:800}
.tr-ship .deco.tr-d1{bottom:60px;inset-inline-end:-30px}

/* ---------- 4. שאלות: דף אחד מודפס ---------- */
.tr-zone>.pp{--tz:44px;--amp:13px}
.tr-faq{padding:var(--sp-top) 0 calc(var(--sp)*.62);--hl:var(--pink-ink);--hlu:var(--pink)}
.tr-fsheet{position:relative;isolation:isolate;max-width:1140px;margin-inline:auto;padding:clamp(54px,6vw,80px) clamp(26px,5.4vw,84px) clamp(40px,4vw,56px);transform:rotate(-.7deg)}
.tr-fsheet>.pp{--paper:var(--cream);--tz:16px;--amp:4.4px;--rimc:var(--cream);--pps:drop-shadow(0 2px 2px color-mix(in srgb,var(--shade) 34%,transparent)) drop-shadow(0 22px 32px color-mix(in srgb,var(--shade) 24%,transparent))}
.tr-fsheet>.tape.t1{top:-14px;inset-inline-start:-22px;--tr:-6deg}
.tr-fsheet>.tape.t2{top:-12px;inset-inline-end:-20px;--tr:7deg}
.tr-fhead{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:20px 40px;padding-bottom:26px;border-bottom:2px solid var(--ink)}
.tr-fhead::after{content:'';position:absolute;left:0;right:0;bottom:-7px;border-bottom:1px solid var(--ink)}
.tr-fhead h2{font-size:var(--fs-h2);line-height:1.06;margin-top:18px;text-wrap:balance}
.tr-fhead .tr-fmeta{display:flex;flex-direction:column;align-items:flex-end;gap:10px;padding-bottom:6px;text-align:end}
.tr-fhead .tr-fmeta img{height:38px;width:auto}
.tr-fhead .tr-fmeta span{font:500 16px/1.4 var(--font);color:var(--fade);max-width:22ch}
.tr-qs{display:grid;grid-template-columns:1fr 1fr;gap:0 64px;margin-top:14px}
.tr-q{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;padding:28px 0 30px;border-bottom:1.5px dashed color-mix(in srgb,var(--ink) 30%,transparent)}
.tr-q:nth-last-child(-n+2){border-bottom:0}
.tr-qn{grid-row:1/3;min-width:46px;font:800 30px/1.05 var(--font);color:var(--pink-ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tr-q h3{font-size:var(--tr-fs-22);line-height:1.3}
.tr-q p{font-size:var(--tr-fs-18);line-height:1.55;color:var(--fade)}
.tr-ffoot{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:18px;padding-top:20px;border-top:2px solid var(--ink)}
.tr-fsheet .stamp{--st:150px;bottom:-64px;inset-inline-end:38%;--r:-12deg;color:var(--green)}

/* ---------- 5. להזמנה: תווית מתנה ענקית ---------- */
.tr-cta{position:relative;padding:clamp(70px,8vw,110px) 0 clamp(90px,10vw,150px);--hl:var(--ink);--hlu:var(--pink)}
.tr-cta>.wrap{display:grid;grid-template-columns:minmax(0,7.2fr) minmax(0,4.8fr);gap:40px;align-items:center}
.tr-gtag{position:relative;isolation:isolate;padding:64px clamp(80px,8vw,132px) 58px 56px;transform:rotate(-2deg);color:var(--ink)}
.tr-gtag-bg{position:absolute;inset:0;z-index:-1;filter:drop-shadow(0 2px 2px color-mix(in srgb,var(--shade) 34%,transparent)) drop-shadow(0 22px 30px color-mix(in srgb,var(--shade) 26%,transparent))}
.tr-gtag-bg>i{position:absolute;inset:0;background:var(--tex-kraft),var(--kraft);
  clip-path:polygon(0 0,calc(100% - 64px) 0,100% 64px,100% calc(100% - 64px),calc(100% - 64px) 100%,0 100%);
  -webkit-mask:radial-gradient(circle at calc(100% - 50px) 50%,transparent 15px,var(--ink) 15.6px);mask:radial-gradient(circle at calc(100% - 50px) 50%,transparent 15px,var(--ink) 15.6px)}
.tr-ring{position:absolute;z-index:1;top:50%;right:28px;width:44px;height:44px;margin-top:-22px;border-radius:50%;box-shadow:inset 0 0 0 7px color-mix(in srgb,var(--kraft) 42%,var(--cream)),inset 0 0 0 8.5px color-mix(in srgb,var(--kraft-dk) 50%,transparent),0 1px 2px color-mix(in srgb,var(--shade) 30%,transparent)}
.tr-gtag .twine{position:absolute;z-index:2;top:calc(50% - 110px);right:-80px;width:140px;height:260px;overflow:visible}
.tr-gtag .twine path{stroke-width:2.6}
.tr-gtag>.tape{top:-14px;inset-inline-end:-30px;--tr:-38deg}
.tr-fields{display:grid;gap:12px;margin-bottom:30px;max-width:420px}
.tr-fields div{display:flex;align-items:baseline;gap:12px;font:500 17px/1.2 var(--font)}
.tr-fields div span{flex:none}
.tr-fields div em{flex:1;font:500 19px/1.2 var(--font);font-style:normal;padding:0 6px 4px;border-bottom:1.5px dashed color-mix(in srgb,var(--ink) 55%,transparent)}
.tr-gtag h2{font-size:var(--tr-fs-cta);line-height:1.04;margin-bottom:16px;text-wrap:balance}
.tr-gtag p{font:500 var(--fs-lead)/1.45 var(--font);max-width:30ch;margin-bottom:34px}
.tr-gtag .ctas{gap:18px}
.tr-gtag .deco.under{z-index:-2}
.tr-gtag .btn.line{--t:var(--ink)}
.tr-cta-tray{position:absolute;z-index:3;top:50%;margin-top:calc(min(480px,34vw)*-.264 - 33px);inset-inline-end:calc(max(var(--gutter),calc((100% - var(--max))/2)) - 40px);width:min(480px,34vw)}
.tr-cta-tray img{width:100%;filter:saturate(1.12) contrast(1.05) brightness(1.03) drop-shadow(0 18px 18px color-mix(in srgb,var(--shade) 32%,transparent))}
.tr-cta-tray::after{content:'';position:absolute;z-index:-1;left:6%;right:6%;bottom:-12px;height:30px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--shade) 60%,transparent),transparent)}

/* ---------- תנועה (רכה, אחת בכל פעם; .still מכבה) ---------- */
@keyframes trPress{0%{opacity:0;transform:scale(1.9) rotate(-10deg)}55%{opacity:1;transform:scale(.92)}100%{transform:none}}
@keyframes trHang{0%{opacity:0;transform:rotate(calc(var(--hr) - 22deg))}45%{opacity:1}72%{transform:rotate(calc(var(--hr) + 5deg))}100%{transform:rotate(var(--hr))}}
@keyframes trSettle{from{opacity:0;transform:translateY(-40px) rotate(calc(var(--rr) + 6deg))}60%{opacity:1}to{transform:rotate(var(--rr))}}
.js:not(.still) .tr-head .label{animation:riseIn .7s var(--ease) backwards}
.js:not(.still) .tr-h1 .w{animation:wordIn .7s var(--ease) backwards;animation-delay:calc(var(--i)*.13s + .15s)}
.js:not(.still) .tr-ch{animation:trPress .5s var(--ease) backwards;animation-delay:calc(var(--c)*.06s + .5s)}
.js:not(.still) .tr-h1 .hl::after{animation:drawUl .6s var(--ease) backwards 1.15s}
.js:not(.still) .tr-side{animation:riseIn .8s var(--ease) backwards .85s}
.js:not(.still) .tr-tray{animation:riseInT 1s var(--ease) backwards .1s}
.js:not(.still) .tr-tray .stk{animation:slap .7s var(--spring) backwards 1.3s}
.js:not(.still) .tr-tray .stamp{animation:press .6s var(--ease) backwards 1.6s}
.js:not(.still) .tr-tray .hang{animation:swing 1.4s var(--ease) backwards 1.1s}

.js:not(.still) .tr-shop .tr-line{clip-path:inset(0 0 0 100%);transition:clip-path 1.4s var(--ease) .2s}
.js:not(.still) .tr-shop.on .tr-line{clip-path:inset(0)}
.js:not(.still) .tr-shop:not(.on) .tr-tag,.js:not(.still) .tr-shop:not(.on) .tr-sign,.js:not(.still) .tr-shop:not(.on) .tr-card{opacity:0}
.js:not(.still) .tr-shop.on .tr-tag{animation:trHang 1.2s var(--ease) backwards;animation-delay:calc(var(--k)*.12s + .45s)}
.js:not(.still) .tr-shop.on .tr-sign{--hr:1.6deg;animation:trHang 1.3s var(--ease) backwards .95s}
.js:not(.still) .tr-shop.on .tr-card{animation:riseIn .9s var(--ease) backwards;animation-delay:calc(var(--k)*.12s + .3s)}
.js:not(.still) .tr-shop.on .tr-card .stk{animation:slap .65s var(--spring) backwards;animation-delay:calc(var(--k)*.12s + .95s)}
.js:not(.still) .tr-shop.on .tr-card .hang{animation:swing 1.3s var(--ease) backwards;animation-delay:calc(var(--k)*.12s + .7s)}
.js:not(.still) .tr-shop.on .tr-badge{animation:press .6s var(--ease) backwards 1.4s}
.js:not(.still) .tr-shop.on .tr-grid.live .tr-card{animation-delay:calc(var(--k)*.06s)}
.js:not(.still) .tr-shop.on .tr-grid.live .tr-card .stk{animation-delay:calc(var(--k)*.06s + .45s)}
.js:not(.still) .tr-shop.on .tr-grid.live .tr-card .hang{animation-delay:calc(var(--k)*.06s + .25s)}
.js:not(.still) .tr-shop.on .tr-empty:not([hidden]){animation:riseIn .6s var(--ease) backwards}
.js:not(.still) .tr-shop.on .tr-empty:not([hidden]) .stamp{animation:press .6s var(--ease) backwards .35s}

.js:not(.still) .tr-ship:not(.on) .tr-st-tray,.js:not(.still) .tr-ship:not(.on) .tr-gcard,.js:not(.still) .tr-ship:not(.on) .tr-facts li{opacity:0}
.js:not(.still) .tr-ship.on .tr-st-tray{animation:riseIn 1s var(--ease) backwards .15s}
.js:not(.still) .tr-ship.on .tr-gcard{--rr:-1deg;animation:trSettle 1s var(--ease) backwards .55s}
.js:not(.still) .tr-ship.on .tr-gcard .stamp{animation:press .6s var(--ease) backwards 1.5s}
.js:not(.still) .tr-ship.on .tr-facts li{animation:riseIn .8s var(--ease) backwards;animation-delay:calc(var(--k)*.14s + .4s)}
.js:not(.still) .tr-ship.on .tr-facts .tr-ico{animation:slap .6s var(--spring) backwards;--sr:var(--ir);animation-delay:calc(var(--k)*.14s + .7s)}

.js:not(.still) .tr-faq:not(.on) .tr-fsheet{opacity:0}
.js:not(.still) .tr-faq.on .tr-fsheet{--rr:-.7deg;animation:trSettle 1.1s var(--ease) backwards .1s}
.js:not(.still) .tr-faq.on .tr-q{animation:riseIn .7s var(--ease) backwards;animation-delay:calc(var(--k)*.08s + .5s)}
.js:not(.still) .tr-faq.on .tr-fsheet .stamp{animation:press .6s var(--ease) backwards 1.2s}

.js:not(.still) .tr-cta:not(.on) .tr-gtag,.js:not(.still) .tr-cta:not(.on) .tr-cta-tray{opacity:0}
.js:not(.still) .tr-cta.on .tr-gtag{--rr:-2deg;animation:trSettle 1.1s var(--ease) backwards .1s}
.js:not(.still) .tr-cta.on .tr-cta-tray{animation:riseIn 1s var(--ease) backwards .45s}

/* ---------- רספונסיבי ---------- */
@media (max-width:1240px){
  .tr-stage{grid-template-columns:minmax(0,270px) minmax(0,1fr) minmax(0,150px)}
  .tr-tray .hang{inset-inline-end:-150px}
  .tr-tray .stamp{inset-inline-end:-150px;--st:126px}
  .tr-tags{gap:12px}
  .tr-tg{min-width:94px;padding-inline:12px}
  .tr-price{padding-inline:14px}
}
@media (max-width:1040px){
  .tr-stage{grid-template-columns:minmax(0,250px) minmax(0,1fr)}
  .tr-tray .hang{display:none}
  .tr-tray .stamp{inset-inline-end:-10px;bottom:auto;top:-20px;--st:120px}
  .tr-filter{flex-direction:column;gap:96px}
  .tr-budget{align-self:stretch}
  .tr-sign{width:max-content;max-width:100%}
  .tr-line.l2{display:block}
  .tr-card{flex-basis:calc((100% - 40px)/2);max-width:calc((100% - 40px)/2)}
  .tr-card.tr-wide{flex-basis:100%}
  .tr-ship>.wrap{grid-template-columns:1fr}
  .tr-still{max-width:720px;width:100%;margin-inline:auto}
  .tr-qs{gap:0 40px}
  .tr-cta>.wrap{grid-template-columns:1fr}
  .tr-cta{padding-bottom:calc(min(460px,80vw)*.53 + 70px)}
  .tr-cta-tray{width:min(460px,80vw);inset-inline-end:auto;left:50%;top:auto;bottom:16px;margin-top:0;margin-left:calc(min(460px,80vw)/-2)}
}
@media (max-width:860px){
  .tr-hero{min-height:0;padding:8px 0 74px}
  .tr-h1{font-size:var(--tr-fs-hero-m);margin-top:16px}
  .tr-l1,.tr-l2{transform:none}
  .tr-stage{display:block;min-height:0;margin-top:0}
  .tr-side{padding-top:18px;text-align:center}
  .tr-lead{margin:0 auto 24px;font-size:var(--tr-fs-19)}
  .tr-side .ctas{align-items:center;gap:14px}
  .tr-side .note{margin-top:16px}
  .tr-tray{width:100%;margin-top:44px}
  .tr-tray .stk{--sz:100px;top:-14%;inset-inline-start:-2px}
  .tr-tray .stk b{font-size:var(--tr-fs-27)}
  .tr-tray .stk span{font-size:var(--tr-fs-14)}
  .tr-tray .stamp{--st:96px;top:-22%;inset-inline-end:-4px}
  .tr-strip{height:120px;bottom:-30px;left:-30px;right:-30px}
  .tr-filter{gap:84px;padding-top:44px}
  .tr-line{top:44px}
  .tr-tags{gap:7px;padding:0}
  .tr-tag{--hr:-2deg}
  .tr-tag:nth-child(2){--hr:2.5deg}.tr-tag:nth-child(3){--hr:-3deg}.tr-tag:nth-child(4){--hr:2deg}
  .tr-tg{min-width:0;width:80px;padding:30px 4px 11px;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%,0 12px)}
  .tr-tg b{font-size:var(--tr-fs-16)}
  .tr-tg small{font-size:var(--tr-fs-14)}
  .tr-dot{width:30px;height:30px;inset-inline-end:-8px}
  .tr-sign{width:auto;margin-top:40px;padding:14px 8px 8px}
  .tr-price{flex:1;padding:10px 4px 8px}
  .tr-price b{font-size:var(--tr-fs-22)}
  .tr-price small,.tr-price em{font-size:var(--tr-fs-14)}
  .tr-res{margin:34px 0 58px}
  .tr-card,.tr-card.tr-wide{flex-basis:100%;max-width:100%}
  .tr-grid{gap:64px}
  .tr-wide .tr-body{flex-direction:column;align-items:stretch}
  .tr-wide .add{margin:auto 8px 0}
  .tr-badge{position:absolute;top:44px;left:50%;margin:0 0 0 -48px;--st:96px}
  .tr-card .plate{height:240px;margin-bottom:18px}
  .tr-card.tr-wide .plate{height:250px}
  .tr-card .stk{--sz:88px;top:30px}
  .tr-empty{padding:52px 22px 40px}
  .tr-empty h3{font-size:var(--fs-h3)}
  .tr-empty .stamp{--st:96px;top:-38px;inset-inline-end:-6px}
  .tr-empty .ctas .btn{width:100%}
  .tr-still{display:flex;flex-direction:column;min-height:0;padding-bottom:30px}
  .tr-st-tray{position:relative;order:1;top:0;inset-inline-end:0;width:100%;margin-top:-130px}
  .tr-gcard{position:relative;top:0;inset:auto;width:min(300px,88%);min-height:360px;margin:0 auto;padding:28px 22px 140px}
  .tr-gc-txt{font-size:var(--tr-fs-18);line-height:28px}
  .tr-occ{order:-1;position:relative;inset:auto;margin:0 0 30px;gap:12px 10px}
  .tr-occ>span{flex-basis:100%}
  .tr-facts li{grid-template-columns:60px 1fr;gap:2px 16px}
  .tr-ico{width:60px}
  .tr-facts h3{font-size:var(--tr-fs-21);padding-top:2px}
  .tr-fhead{flex-direction:column;align-items:flex-start}
  .tr-fhead .tr-fmeta{align-items:flex-start;text-align:start}
  .tr-qs{grid-template-columns:1fr}
  .tr-q:nth-last-child(2){border-bottom:1.5px dashed color-mix(in srgb,var(--ink) 30%,transparent)}
  .tr-qn{font-size:var(--tr-fs-24);min-width:34px}
  .tr-q h3{font-size:var(--tr-fs-20)}
  .tr-fsheet .stamp{--st:104px;bottom:-40px}
  .tr-gtag{padding:56px 66px 44px 24px;transform:rotate(-1.2deg)}
  .tr-gtag-bg>i{clip-path:polygon(0 0,calc(100% - 40px) 0,100% 40px,100% calc(100% - 40px),calc(100% - 40px) 100%,0 100%);
    -webkit-mask:radial-gradient(circle at calc(100% - 30px) 50%,transparent 11px,var(--ink) 11.6px);mask:radial-gradient(circle at calc(100% - 30px) 50%,transparent 11px,var(--ink) 11.6px)}
  .tr-ring{right:13px;width:34px;height:34px;margin-top:-17px;box-shadow:inset 0 0 0 6px color-mix(in srgb,var(--kraft) 42%,var(--cream)),inset 0 0 0 7.2px color-mix(in srgb,var(--kraft-dk) 50%,transparent)}
  .tr-gtag .twine{right:-16px;width:50px;height:93px;top:calc(50% - 39px)}
  .tr-gtag>.tape{inset-inline-end:-16px;width:90px}
  .tr-gtag .ctas .btn{width:100%}
  .tr-cta{padding-top:64px}
}
@media (max-width:400px){
  .tr-tg{width:76px}
}
/* 320px: שתי שורות למסננים, כדי שכל האפשרויות ייראו (נגישות, 18.10.2026) */
@media (max-width:380px){
  .tr-tags{flex-wrap:wrap;row-gap:46px;justify-content:flex-start}
  .tr-prices{flex-wrap:wrap}
  .tr-price{flex:1 1 45%}
  .tr-price+.tr-price{border-inline-start:0}
}
