/* HOME2: big inviting backgrounds for the home hero and the sign-in page (CSS only; optional admin image) */
.h2-bg{position:relative;isolation:isolate}
.h2-deco{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.h2-bg-aurora{background:linear-gradient(165deg,#effafa 0%,#e2f3f3 42%,#fdf5e8 100%)}
.h2-bg-confetti{background:linear-gradient(180deg,#fffdf8 0%,#f4fbfb 100%)}
.h2-bg-deep{background:linear-gradient(140deg,#0e4f58 0%,#00677a 45%,#2c8f97 100%);color:#fff}
.h2-bg-plain{background:#fff}
.h2-has-img{background:linear-gradient(rgba(10,40,45,.42),rgba(10,40,45,.42)),var(--h2img) center/cover no-repeat,#0e4f58;color:#fff}
.h2-blob{position:absolute;border-radius:50%;filter:blur(48px);opacity:.55;animation:h2float 18s ease-in-out infinite alternate}
.h2-blob.b1{width:46vmax;height:46vmax;left:-14vmax;top:-16vmax;background:radial-gradient(circle,#7cc9cc 0,rgba(124,201,204,0) 70%)}
.h2-blob.b2{width:40vmax;height:40vmax;right:-12vmax;top:8vh;background:radial-gradient(circle,#f3cf8e 0,rgba(243,207,142,0) 70%);animation-duration:22s}
.h2-blob.b3{width:34vmax;height:34vmax;left:28%;bottom:-20vmax;background:radial-gradient(circle,#b9e3d6 0,rgba(185,227,214,0) 70%);animation-duration:26s}
.h2-bg-deep .h2-blob{opacity:.35}.h2-bg-deep .h2-blob.b2{background:radial-gradient(circle,#e7b75f 0,rgba(231,183,95,0) 70%)}
.h2-sp{position:absolute;width:14px;height:14px;color:#d4a54a;opacity:.0;animation:h2tw 5s ease-in-out infinite}
.h2-sp svg{width:100%;height:100%;fill:currentColor;display:block}
.h2-bg-deep .h2-sp{color:#fff}
.h2-sp.s1{left:9%;top:22%;animation-delay:.2s}.h2-sp.s2{left:20%;top:68%;width:10px;height:10px;animation-delay:1.4s}.h2-sp.s3{right:12%;top:18%;width:18px;height:18px;animation-delay:2.1s}
.h2-sp.s4{right:22%;top:62%;animation-delay:3.2s}.h2-sp.s5{left:44%;top:12%;width:9px;height:9px;animation-delay:.9s}.h2-sp.s6{right:6%;bottom:14%;width:11px;height:11px;animation-delay:2.7s}.h2-sp.s7{left:5%;bottom:10%;width:16px;height:16px;animation-delay:3.8s}
.h2-cf{position:absolute;top:-6%;width:9px;height:14px;border-radius:2px;opacity:.8;animation:h2fall 14s linear infinite}
.h2-cf.c1{left:4%;background:#2c8f97}.h2-cf.c2{left:11%;background:#e7b75f;animation-delay:-3s;animation-duration:17s}.h2-cf.c3{left:19%;background:#e98b8b;animation-delay:-7s}
.h2-cf.c4{left:27%;background:#7cc9cc;animation-delay:-11s;animation-duration:19s}.h2-cf.c5{left:35%;background:#b48ad6;animation-delay:-2s}.h2-cf.c6{left:43%;background:#e7b75f;animation-delay:-9s;animation-duration:16s}
.h2-cf.c7{left:52%;background:#2c8f97;animation-delay:-5s;animation-duration:20s}.h2-cf.c8{left:60%;background:#e98b8b;animation-delay:-12s}.h2-cf.c9{left:68%;background:#7cc9cc;animation-delay:-1s;animation-duration:18s}
.h2-cf.c10{left:76%;background:#b48ad6;animation-delay:-8s}.h2-cf.c11{left:84%;background:#e7b75f;animation-delay:-4s;animation-duration:21s}.h2-cf.c12{left:91%;background:#2c8f97;animation-delay:-10s}
.h2-cf.c13{left:97%;background:#e98b8b;animation-delay:-6s;animation-duration:15s}.h2-cf.c14{left:48%;background:#7cc9cc;animation-delay:-13s;animation-duration:23s}
@keyframes h2float{0%{transform:translate(0,0) scale(1)}100%{transform:translate(3vmax,2vmax) scale(1.08)}}
@keyframes h2tw{0%,100%{opacity:0;transform:scale(.6) rotate(0)}50%{opacity:.9;transform:scale(1) rotate(25deg)}}
@keyframes h2fall{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(115vh) rotate(540deg)}}
@media (prefers-reduced-motion:reduce){.h2-blob,.h2-sp,.h2-cf{animation:none}.h2-sp{opacity:.6}.h2-cf{display:none}}
/* home hero */
.home-h.h2-hero .home-cats{border-bottom:0}
.h2-copy{max-width:760px;margin:clamp(6px,2vh,18px) auto clamp(12px,2.6vh,22px);padding:0 12px}
.h2-t{margin:0;font-size:clamp(26px,4.4vw,50px);line-height:1.12;font-weight:800;letter-spacing:-.01em;color:var(--ink,#16323a)}
.h2-s{margin:10px 0 0;font-size:clamp(15px,1.5vw,19px);line-height:1.45;color:var(--muted,#4d6469)}
.h2-bg-deep .h2-t,.h2-has-img .h2-t{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.25)}
.h2-bg-deep .h2-s,.h2-has-img .h2-s{color:rgba(255,255,255,.9)}
.h2-hero form.search{box-shadow:0 14px 44px rgba(0,70,80,.18);border-radius:999px}
.h2-hero .home-cats .ic{background:#fff;box-shadow:0 6px 18px rgba(0,80,90,.12)}
.h2-bg-deep.h2-hero .home-cats a,.h2-has-img.h2-hero .home-cats a{color:#fff}
.h2-bg-deep.h2-hero .hh-top,.h2-has-img.h2-hero .hh-top{color:#fff}
.h2-down{position:absolute;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.75);color:var(--teal,#00677a);box-shadow:0 4px 14px rgba(0,0,0,.1);animation:h2bob 2.4s ease-in-out infinite}
@keyframes h2bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,6px)}}
@media (prefers-reduced-motion:reduce){.h2-down{animation:none}}
@media (max-width:640px){.h2-copy{margin-top:4px}.h2-down{display:none}}
/* sign-in / register without the site bars */
body.h2-authpg{background:#0e4f58}
.fc-auth.h2-auth{min-height:100vh;min-height:100svh;max-width:none;margin:0;box-sizing:border-box;padding:88px 16px 56px;align-content:center}
.h2-abar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px clamp(14px,3vw,36px)}
.h2-alogo{display:inline-flex;align-items:center;background:rgba(255,255,255,.94);border-radius:14px;padding:6px 12px;box-shadow:0 4px 16px rgba(0,0,0,.12);text-decoration:none;color:var(--teal,#00677a)}
.h2-alogo img{height:38px;width:auto;display:block}.h2-alogo b{font-size:1.15rem}
.h2-aright{display:flex;align-items:center;gap:8px}
.h2-alang{display:inline-flex;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.45);border-radius:999px;padding:2px}
.h2-alang button{border:0;background:none;color:inherit;font:inherit;font-size:.85rem;padding:5px 10px;border-radius:999px;cursor:pointer}
.h2-alang button.on{background:#fff;color:var(--teal,#00677a);font-weight:700}
.h2-bg-aurora .h2-alang,.h2-bg-confetti .h2-alang,.h2-bg-plain .h2-alang{background:rgba(0,103,122,.06);border-color:rgba(0,103,122,.25);color:var(--teal,#00677a)}
.h2-bg-aurora .h2-alang button.on,.h2-bg-confetti .h2-alang button.on,.h2-bg-plain .h2-alang button.on{background:var(--teal,#00677a);color:#fff}
.h2-ahome{font-size:.9rem;padding:6px 14px;border-radius:999px;background:#fff;color:var(--teal,#00677a);text-decoration:none;font-weight:600;box-shadow:0 2px 10px rgba(0,0,0,.1)}
.h2-auth .fc-authbox{background:#fff;color:var(--ink,#16323a);border-radius:22px;padding:28px clamp(18px,3vw,34px);box-shadow:0 24px 70px rgba(0,30,40,.3);box-sizing:border-box}
.h2-auth .fc-authbox input{font-size:16px}
.h2-copyr{position:absolute;left:0;right:0;bottom:14px;margin:0;text-align:center;font-size:.8rem;opacity:.8}
.h2-cards{position:relative;width:200px;height:250px;margin:34px auto 0}
.h2-cards i{position:absolute;inset:0;border-radius:14px;background:#fffdf7;border:1px solid rgba(201,162,77,.7);box-shadow:0 16px 40px rgba(0,0,0,.22)}
.h2-cards i:nth-child(1){transform:translateX(-46px) rotate(-11deg);background:#f6efe0}
.h2-cards i:nth-child(2){transform:translateX(46px) rotate(9deg);background:#eef7f6}
.h2-cards i:nth-child(3){background:linear-gradient(#c9a24d,#c9a24d) 50% 22%/58px 2px no-repeat,linear-gradient(rgba(22,50,58,.55),rgba(22,50,58,.55)) 50% 38%/120px 7px no-repeat,linear-gradient(rgba(22,50,58,.3),rgba(22,50,58,.3)) 50% 50%/96px 5px no-repeat,linear-gradient(rgba(22,50,58,.3),rgba(22,50,58,.3)) 50% 58%/110px 5px no-repeat,linear-gradient(rgba(22,50,58,.3),rgba(22,50,58,.3)) 50% 66%/80px 5px no-repeat,linear-gradient(#c9a24d,#c9a24d) 50% 82%/58px 2px no-repeat,#fffdf7;outline:6px double rgba(201,162,77,.55);outline-offset:-14px}
@media (min-width:900px){
 .fc-auth.h2-auth{grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(30px,6vw,90px);padding-inline:max(24px,calc((100vw - 1120px)/2))}
 .h2-auth .fc-auth-side{background:none;border-radius:0;box-shadow:none;min-height:0;align-self:center;color:inherit;flex-direction:column}
 .h2-bg-deep .fc-auth-side,.h2-has-img .fc-auth-side{color:#fff}
 .h2-bg-aurora .fc-auth-side,.h2-bg-confetti .fc-auth-side,.h2-bg-plain .fc-auth-side{color:var(--teal,#00677a)}
 .h2-bg-aurora .fc-side-logo img,.h2-bg-confetti .fc-side-logo img,.h2-bg-plain .fc-side-logo img{filter:none}
 .h2-auth .fc-side-in p{font-size:clamp(1.5rem,2.4vw,2.2rem);font-weight:700;max-width:440px;margin-inline:auto}
 .h2-auth .fc-authbox{justify-self:stretch}
}
@media (max-width:899px){.h2-ahome{display:none}.fc-auth.h2-auth{padding-top:82px}}
/* admin */
.h2-imgrow{display:flex;gap:8px}.h2-imgrow input{flex:1}

/* HOMEX: one-row category icons, auto-gliding rows, admin colours ('' = these rules never match = today's look) */
header.home-h nav.home-cats.hx-row{flex-wrap:nowrap;overflow:hidden;justify-content:center}
header.home-h nav.home-cats.hx-row>a{flex:0 0 auto;max-width:96px;text-align:center}
header.home-h nav.home-cats.hx-row>a>span:last-child{overflow-wrap:anywhere;line-height:1.2}
header.home-h nav.home-cats.hx-row>a.hx-off{display:none!important}
header.home-h nav.home-cats.hx-row.hx-open{flex-wrap:wrap;row-gap:14px}

.h2-bg.hx-hbase{background:linear-gradient(165deg,var(--hx-g1) 0%,var(--hx-g2) 42%,var(--hx-g3) 100%)}
.h2-bg-deep.hx-hbase{background:linear-gradient(140deg,var(--hx-g1) 0%,var(--hx-g2) 45%,var(--hx-g3) 100%)}
.h2-bg.hx-hc1 .h2-blob.b1{background:radial-gradient(circle,var(--hx-c1) 0,transparent 70%)}
.h2-bg.hx-hc2 .h2-blob.b2{background:radial-gradient(circle,var(--hx-c2) 0,transparent 70%)}
.h2-bg.hx-hc3 .h2-blob.b3{background:radial-gradient(circle,var(--hx-c3) 0,transparent 70%)}
.h2-bg.hx-hsp .h2-sp{color:var(--hx-sp)}
.h2-bg.hx-sbg{background:linear-gradient(140deg,var(--hx-s1) 0%,color-mix(in srgb,var(--hx-s1) 50%,var(--hx-s2)) 45%,var(--hx-s2) 100%)}
body.h2-authpg.hx-sbody{background:var(--hx-s1)}
.h2-auth.hx-sbg.hx-sdark,.h2-auth.hx-sbg.hx-sdark .fc-auth-side{color:#fff}
.h2-auth.hx-sbg.hx-slight,.h2-auth.hx-sbg.hx-slight .fc-auth-side{color:var(--teal,#00677a)}
.h2-auth.hx-sbg.hx-slight .h2-alang{background:rgba(0,103,122,.06);border-color:rgba(0,103,122,.25)}
.h2-auth.hx-sbg.hx-slight .h2-alang button.on{background:var(--teal,#00677a);color:#fff}
/* admin colour rows + live swatches */
.hx-colors{margin:14px 0 6px;padding-top:6px;border-top:1px dashed rgba(0,0,0,.12)}
.hx-cgrid{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:16px;align-items:start}
.hx-col{display:flex;align-items:center;gap:8px;margin:6px 0}
.hx-cl{flex:0 0 130px;font-weight:600;font-size:.92rem}
.hx-col input[type=color]{width:42px;height:34px;padding:2px;border:1px solid #cfd8da;border-radius:8px;background:#fff;cursor:pointer;flex:0 0 auto}
.hx-col .hx-hex{width:96px;font-family:ui-monospace,Menlo,monospace;padding:6px 8px;border:1px solid #cfd8da;border-radius:8px}
.hx-col .hx-hex.hx-bad{border-color:#d33;background:#fff4f4}
.hx-col .hx-reset{padding:5px 10px;font-size:.82rem}
.hx-sw{position:relative;isolation:isolate;height:150px;border-radius:14px;overflow:hidden;border:1px solid rgba(0,0,0,.08)}
.hx-sw .h2-blob{animation:none;filter:blur(16px);opacity:.75}
.hx-sw .h2-blob.b1{width:70%;height:90%;left:-18%;top:-28%}.hx-sw .h2-blob.b2{width:62%;height:82%;right:-16%;left:auto;top:18%}.hx-sw .h2-blob.b3{width:56%;height:78%;left:26%;top:auto;bottom:-36%}
.hx-sw.h2-bg-deep .h2-blob{opacity:.5}.hx-sw.h2-bg-plain .h2-blob,.hx-sw.h2-bg-plain .h2-sp{display:none}
.hx-sw .h2-sp{animation:none;opacity:.9}
.hx-sw-pill{position:absolute;left:18%;right:18%;top:44%;height:20px;border-radius:999px;background:#fff;box-shadow:0 6px 18px rgba(0,70,80,.18)}
.hx-sw-card{position:absolute;right:16%;left:auto;top:18%;width:38%;height:64%;border-radius:10px;background:#fff;box-shadow:0 10px 26px rgba(0,30,40,.3)}
[dir=rtl] .hx-sw-card{right:auto;left:16%}
@media (max-width:700px){.hx-cgrid{grid-template-columns:1fr}.hx-cl{flex-basis:110px}}
@media (max-width:700px){header.home-h nav.home-cats.hx-row{gap:6px}header.home-h nav.home-cats.hx-row>a{width:66px;min-width:0;max-width:none;font-size:12.5px}header.home-h nav.home-cats.hx-row>a>span:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:normal}}

/* /HOMEX */

/* ADMINORG CALMSTRIPS: calm, modern Popular / New rows: slow continuous glide (home2.js), soft fade on the edge(s) with hidden cards, a slight lift on hover, a soft first entrance; none of the motion with reduced motion */
@property --hx-fl{syntax:'<length>';inherits:false;initial-value:0px}
@property --hx-fr{syntax:'<length>';inherits:false;initial-value:0px}

/* /ADMINORG CALMSTRIPS */

/* P47 CAROUSEL + tidy grey sections (Shimon 10:07-10:08 AM Oct 15: carousel like the original, "מסודר ויפה וצבעי הרקע האפור") */
main.home{--hx-grey:#f3f5f4}
main.home>section.popular{position:relative;background:var(--hx-grey);box-shadow:0 0 0 100vmax var(--hx-grey);clip-path:inset(0 -100vmax);padding:44px 0 40px;margin:0 0 0}
main.home>section.popular.hx-new{background:#fff;box-shadow:0 0 0 100vmax #fff}
main.home>section.popular>h2{font-size:clamp(24px,3.4vw,34px);font-weight:800;margin:0 0 8px}
main.home>section.popular>p{max-width:640px;margin:0 auto 20px;line-height:1.55}
main.home>section.explore{background:var(--hx-grey);box-shadow:0 0 0 100vmax var(--hx-grey);clip-path:inset(0 -100vmax);padding:40px 0 44px;margin:0}
main.home>section.explore>.cgrid{background:#fff;border-radius:22px;padding:26px 22px;box-shadow:0 6px 24px rgba(16,40,46,.06);max-width:860px;margin-inline:auto}
main.home>section.steps3{padding:36px 0;margin:0}
.hx-carw{position:relative;max-width:820px;margin:0 auto;padding:0 44px}
.pgrid.hx-car{--hxw:clamp(150px,44vw,240px);display:block!important;position:relative;height:calc(var(--hxw)*1.4 + 54px);overflow:hidden;outline:none;touch-action:pan-y;user-select:none;-webkit-user-select:none;padding:0}
.pgrid.hx-car:focus-visible{box-shadow:0 0 0 3px rgba(15,118,110,.35);border-radius:16px}
.pgrid.hx-car>.pcard{position:absolute;top:12px;left:50%;width:var(--hxw);margin-left:calc(var(--hxw) / -2);max-width:none;
  transform:translateX(calc(var(--hxo,0) * var(--hxw) * .78)) scale(.8);transform-origin:50% 50%;opacity:.95;z-index:1;
  transition:transform .55s cubic-bezier(.22,.61,.36,1),opacity .45s ease,filter .45s ease}
.pgrid.hx-car>.pcard canvas{width:100%;height:auto;border-radius:16px;box-shadow:0 8px 22px rgba(16,40,46,.14)}
.pgrid.hx-car>.pcard>span{opacity:0;transition:opacity .3s ease}
.pgrid.hx-car>.pcard.hx-cur{transform:translateX(0) scale(1);z-index:3;opacity:1}
.pgrid.hx-car>.pcard.hx-cur>span{opacity:1}
.pgrid.hx-car>.pcard.hx-cur canvas{box-shadow:0 14px 34px rgba(16,40,46,.22)}
.pgrid.hx-car>.pcard.hx-side{z-index:2;cursor:pointer}
.pgrid.hx-car>.pcard.hx-far{opacity:0;pointer-events:none;transform:translateX(calc(var(--hxo,0) * var(--hxw) * .5)) scale(.6)}
.hx-car-btn{position:absolute;top:calc(50% - 22px);width:40px;height:56px;border:0;background:none;color:#9fb6bd;font-size:52px;line-height:1;cursor:pointer;z-index:4;padding:0;font-family:Arial,sans-serif;transition:color .2s ease,transform .2s ease}
.hx-car-btn:hover,.hx-car-btn:focus-visible{color:var(--teal,#0f766e);transform:scale(1.08)}
.hx-car-l{left:0}.hx-car-r{right:0}
@media (max-width:700px){.hx-carw{padding:0 30px}.pgrid.hx-car{--hxw:clamp(140px,48vw,220px)}.hx-car-btn{width:30px;font-size:42px}
  .pgrid.hx-car>.pcard{transform:translateX(calc(var(--hxo,0) * var(--hxw) * .62)) scale(.78)}
  main.home>section.popular,main.home>section.explore{padding:30px 0 28px}}
@media (prefers-reduced-motion:reduce){.pgrid.hx-car>.pcard{transition:none}}
/* /P47 */

/* P47 LOGOPAD (Shimon 10:47 AM ET Oct 15, tested in DevTools): 20px space under the big hero logo, desktop and phone */
.h2-hero .logo.big img{padding-bottom:20px}

/* grey band, teal pill heading, carousel + text side by side on desktop (RTL mirrors), stacked on phone */
main.home>section.hx-intro{position:relative;background:var(--hx-grey,#f3f4f4);box-shadow:0 0 0 100vmax var(--hx-grey,#f3f4f4);clip-path:inset(0 -100vmax);padding:30px 0 40px;margin:0}
main.home>section.hx-intro+section.popular{background:#fff;box-shadow:0 0 0 100vmax #fff}
.hx-pill{max-width:1000px;margin:0 auto 28px;padding:14px 32px;border-radius:999px;background:linear-gradient(90deg,#4f9ea2,#0b6a72);color:#fff;text-align:center;font-size:clamp(18px,2.5vw,30px);font-weight:800;line-height:1.25}
.hx-intro-in{display:grid;gap:36px;align-items:center;max-width:1120px;margin:0 auto;padding:0 16px}
.hx-intro.hx-nocar .hx-intro-in{grid-template-columns:1fr;max-width:760px;text-align:center}
.hx-intro-tx h3{font-size:clamp(18px,1.8vw,22px);font-weight:800;margin:0 0 12px}
.hx-intro-tx p{margin:0 0 12px;line-height:1.65;color:#444}
.hx-intro section.hx-new{background:none;box-shadow:none;clip-path:none;padding:0;margin:0}
.hx-intro section.hx-new>h2,.hx-intro section.hx-new>p{display:none}
@media (max-width:860px){.hx-intro-in{gap:18px}.hx-intro-tx{text-align:center}.hx-pill{margin:0 12px 20px;padding:12px 18px}}
/* /P47 INTRO */

/* band replaces the old pill+welcome block; big centre card + clearly visible side cards in the band */
main.home.hx-introon>section.pillbanner{display:none}
main.home.hx-introon>section.welcome{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important} /* BUG146: was display:none, which hid the page's only H1 from Google and screen readers; still invisible */
.hx-intro-in{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}
.hx-intro .hx-carw{max-width:none;padding:0 40px}
.hx-intro .pgrid.hx-car{--hxw:clamp(170px,19vw,270px)}
.hx-intro .pgrid.hx-car>.pcard{transform:translateX(calc(var(--hxo,0) * var(--hxw) * .62)) scale(.78)}
.hx-intro .pgrid.hx-car>.pcard.hx-cur{transform:translateX(0) scale(1)}
.hx-intro .pgrid.hx-car>.pcard.hx-far{transform:translateX(calc(var(--hxo,0) * var(--hxw) * .4)) scale(.6)}
@media (max-width:860px){.hx-intro-in{grid-template-columns:1fr}.hx-intro .pgrid.hx-car{--hxw:clamp(150px,46vw,240px)}}
/* /P47 LOOK2 */

/* the big hero logo keeps its proportions; smaller on phone */
.h2-hero .logo.big img{box-sizing:content-box;height:auto;width:auto;max-height:90px;max-width:calc(100% - 0px);object-fit:contain}
@media (max-width:600px){.h2-hero .logo.big img{max-height:56px;max-width:62vw}}
/* /P47 MOBLOGO */
