/*
  KalMarket pre-launch page (kalmarket.co.il). The brand of shared/tokens.css (identity 2026-10, "deep emerald, ink and
  saffron"), copied here as a small subset so this site stands alone. Light theme only (the owner's choice for the site).
  Logical properties throughout, so Hebrew and Arabic (RTL) and English and Russian (LTR) share every rule.
  Motion: the carton opens once on load (transform and opacity only); nothing moves under prefers-reduced-motion.
*/
:root{
  --brand:#073b33; --brand-2:#0b4a40; --brand-deep:#042a24; --brand-glow:#1d7f69;
  --on-brand-2:#c4ddd7; --mint:#5ce0b8; --link-on-brand:#8ee8cf; --focus-on-brand:#5ce0b8;
  --ink:#0b1513; --ink-2:#2f3a40; --muted:#56606b; --line:#dfe3e8; --line-2:#c9d0d8; --line-strong:#7c8691;
  --surface:#ffffff; --surface-2:#f3f5f7; --tonal:#edf0f3; --tonal-hover:#e1e6eb;
  --cta:#ffb800; --cta-top:#ffcb3d; --cta-hover:#ffc21a; --cta-edge:#d99a00; --cta-ledge:#b07c00; --cta-glow:rgb(214 140 0 / .38); --on-cta:#0b1513;
  --link:#0b6878; --link-hover:#074652; --good:#0b7a5c; --good-bg:#e7f5ef; --err:#b42318; --err-bg:#fdeceb;
  --focus:#0f8c74; --cta-soft:#e6f4ef; --sel-line:#9fd3c3; --sell-soft:#fff3d6; --sell-ink:#7a4f00;
  --r-btn:8px; --r:10px; --r-lg:14px;
  --elev-rest:0 1px 2px rgb(11 21 19 / .06),0 3px 8px -2px rgb(11 21 19 / .08);
  --elev-hover:0 2px 4px rgb(11 21 19 / .07),0 16px 32px -12px rgb(11 21 19 / .28);
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 .07 0 0 0 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  --stage:radial-gradient(110% 80% at 50% -30%,rgb(29 127 105 / .45) 0,transparent 70%),linear-gradient(180deg,var(--brand-2),var(--brand) 55%,var(--brand-deep));
  --ease-out:cubic-bezier(.2,.8,.2,1); --dur-2:180ms;
  --font-he:"Heebo","Arial Hebrew",system-ui,sans-serif;
  --font:var(--font-he);
  --font-display:"Rubik","Heebo","Arial Hebrew",system-ui,sans-serif;
  color-scheme:light;
}
html[lang="en"]{--font:"Heebo","Segoe UI",system-ui,sans-serif;--font-display:"Rubik","Heebo","Segoe UI",system-ui,sans-serif}
html[lang="ru"]{--font:system-ui,"Segoe UI",Roboto,Arial,sans-serif;--font-display:"Rubik",system-ui,"Segoe UI",Roboto,Arial,sans-serif}
html[lang="ar"]{--font:"Noto Sans Arabic","Geeza Pro","Segoe UI",Tahoma,system-ui,sans-serif;--font-display:var(--font)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--surface);color:var(--ink);font-family:var(--font);font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}
h1,h2,h3,h4{margin:0;line-height:1.25;text-wrap:balance}
p{margin:0}
a{color:var(--link);text-underline-offset:3px}
a:hover{color:var(--link-hover)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:16px}
@media (min-width:768px){.wrap{padding-inline:32px}}
.narrow{max-width:860px}

.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:20;padding:10px 16px;border-radius:var(--r-btn);background:var(--cta);color:var(--on-cta);font-weight:700;text-decoration:none}
.skip:focus{top:12px}

/* ---- the top bar, over the emerald stage ---- */
.top{position:absolute;top:0;left:0;right:0;z-index:5;color:#fff}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:68px}
.brand{display:inline-flex;align-items:center;gap:10px;color:#fff}
.brand .tile{width:34px;height:34px;flex:none}
.brand .word{width:122px;height:20px}
.langs{display:flex;gap:2px;padding:3px;border-radius:10px;background:rgb(255 255 255 / .08);border:1px solid rgb(255 255 255 / .18)}
.langs button{min-width:40px;min-height:36px;padding:0 8px;border:0;border-radius:7px;background:transparent;color:#fff;font:inherit;font-size:.875rem;font-weight:700;line-height:1;cursor:pointer}
.langs button:hover{background:rgb(255 255 255 / .14)}
.langs button[aria-pressed="true"]{background:#fff;color:var(--brand)}
.top :focus-visible,.stage :focus-visible{outline-color:var(--focus-on-brand);outline-offset:3px}
@media (max-width:380px){.brand .word{width:104px;height:17px}.brand .tile{width:30px;height:30px}.langs button{min-width:36px;padding:0 6px}}

/* ---- the hero: the deep emerald stage, the message and the carton ---- */
.stage{position:relative;background:var(--noise),var(--stage);color:#fff;overflow:hidden}
.hero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding-top:104px;padding-bottom:72px}
.ey{display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;color:var(--link-on-brand);font-weight:700;font-size:.9375rem;letter-spacing:.02em}
.ey .dot{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgb(92 224 184 / .18)}
h1{font-family:var(--font-display);font-weight:800;font-size:clamp(2.25rem,1.3rem + 3.8vw,4rem);line-height:1.05;letter-spacing:-.02em}
.h1b{display:block;margin-top:12px;font-size:clamp(1.25rem,.95rem + 1.3vw,1.875rem);font-weight:700;line-height:1.25;letter-spacing:-.01em;color:var(--cta-top)}
.lead{margin-top:18px;max-width:34em;font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);color:var(--on-brand-2)}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.note{margin-top:12px;font-size:.875rem;color:var(--on-brand-2)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border:0;border-radius:var(--r-btn);font:inherit;font-size:1.0625rem;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;
  transition:transform var(--dur-2) var(--ease-out),background-color var(--dur-2) var(--ease-out)}
.btn .bi{width:22px;height:22px;flex:none}
.btn.cta{background:linear-gradient(180deg,var(--cta-top),var(--cta));color:var(--on-cta);box-shadow:inset 0 -2px 0 var(--cta-edge),0 3px 0 var(--cta-ledge),0 12px 26px -10px var(--cta-glow)}
.btn.cta:hover{background:var(--cta-hover);color:var(--on-cta)}
.btn.cta:active{transform:translateY(2px);box-shadow:inset 0 -1px 0 var(--cta-edge),0 1px 0 var(--cta-ledge)}
.btn.ghost{background:rgb(255 255 255 / .06);color:#fff;box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .6)}
.btn.ghost:hover{background:rgb(255 255 255 / .15);color:#fff}
.btn.tonal{background:var(--tonal);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn.tonal:hover{background:var(--tonal-hover)}
.btn[disabled]{cursor:progress;opacity:.75;transform:none}
.btn.wide{width:100%}

/* the carton (art/art.js Madaf.art.carton, drawn once into the page) on its own 440x250 grid; the logo tile rises out of
   it between the back layer and the front layer */
.art{position:relative;isolation:isolate;justify-self:center;width:100%;max-width:580px;aspect-ratio:600/380}
.box{position:absolute;left:4%;right:4%;bottom:0;aspect-ratio:440/250}
.km-carton{position:absolute;inset:0;pointer-events:none}
.km-carton-back,.km-carton-front{position:absolute;inset:0;width:100%;height:100%;display:block}
.km-carton-back{z-index:0}
.km-carton-front{z-index:3}
.rise{position:absolute;z-index:2;left:36%;width:30%;top:-6%;rotate:-6deg;transform-origin:50% 100%}
.rise svg{display:block;width:100%;height:auto;filter:drop-shadow(0 22px 26px rgb(0 0 0 / .5))}
.sp{position:absolute;z-index:1;width:6%;aspect-ratio:1;color:var(--cta-top)}
.sp1{left:16%;top:-2%}.sp2{left:76%;top:-12%;width:5%;color:var(--mint)}.sp3{left:84%;top:14%;width:3.5%}
.kc-fb{transform-origin:245px 92px}.kc-fl{transform-origin:76px 102px}.kc-fr{transform-origin:376px 102px}.kc-ff{transform-origin:210px 112px}
@media (prefers-reduced-motion:no-preference){
  .kc-flap{animation:.52s var(--ease-out) .35s backwards}
  .kc-fb{animation-name:kc-open-b}.kc-fl{animation-name:kc-open-l}.kc-fr{animation-name:kc-open-r}.kc-ff{animation-name:kc-open-f}
  .kc-lid{animation:kc-lid .36s ease-in .3s backwards}
  .kc-glow,.kc-fs{animation:kc-fade .8s ease-out .5s backwards}
  .rise{animation:rise .8s cubic-bezier(.2,.9,.3,1.12) .62s backwards}
  .sp{animation:kc-fade .6s ease-out 1.15s backwards}
}
@keyframes kc-open-b{from{transform:scaleY(.1)}}
@keyframes kc-open-l{from{transform:rotate(62deg) scale(.85)}}
@keyframes kc-open-r{from{transform:rotate(-62deg) scale(.85)}}
@keyframes kc-open-f{from{transform:scaleY(-.5)}}
@keyframes kc-lid{0%,30%{opacity:1}to{opacity:0}}
@keyframes kc-fade{from{opacity:0}}
@keyframes rise{from{transform:translateY(58%) scale(.72);opacity:0}}

@media (max-width:899px){
  .hero-in{grid-template-columns:minmax(0,1fr);gap:12px;padding-top:88px;padding-bottom:40px}
  .art{max-width:400px;margin-top:4px}
}
@media (max-width:480px){
  .ctas .btn{flex:1 1 100%}
}

/* ---- sections ---- */
.sec-h{font-family:var(--font-display);font-weight:800;font-size:clamp(1.625rem,1.2rem + 1.6vw,2.25rem);letter-spacing:-.015em;text-align:center;margin-bottom:32px}
.ben{padding-top:64px;padding-bottom:64px}
.ben-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
@media (max-width:860px){.ben-grid{grid-template-columns:minmax(0,1fr)}}
.card{display:flex;flex-direction:column;padding:28px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--elev-rest)}
@media (max-width:480px){.card{padding:22px 18px}}
.card-h{display:flex;align-items:center;gap:12px;margin-bottom:22px;font-family:var(--font-display);font-size:1.375rem;font-weight:800}
.card-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--brand);color:#fff}
.sell .card-ic{background:var(--cta);color:var(--on-cta)}
.card-ic svg{width:22px;height:22px}
.list{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.list li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:start}
.ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--cta-soft);color:var(--brand)}
.sell .ic{background:var(--sell-soft);color:var(--sell-ink)}
.ic svg{width:24px;height:24px}
.list h4{font-size:1.0625rem;font-weight:700;line-height:1.35}
.list p{margin-top:4px;color:var(--ink-2)}
.more{margin-top:auto;padding-top:24px}
.go{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700}
.go svg{width:18px;height:18px}
[dir="ltr"] .go svg{transform:scaleX(-1)}

/* ---- sign-up ---- */
.join{padding-top:64px;padding-bottom:72px;background:var(--surface-2);border-block:1px solid var(--line)}
.join .sec-h{margin-bottom:8px}
.sub{margin-bottom:28px;text-align:center;color:var(--muted)}
.pcard{border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--elev-hover);overflow:hidden}
.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px;background:var(--tonal);border-bottom:1px solid var(--line)}
.tabs [role="tab"]{display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;padding:6px 10px;border:0;border-radius:14px;background:transparent;color:var(--ink-2);font:inherit;font-size:1.0625rem;font-weight:700;line-height:1.2;cursor:pointer}
.tabs [role="tab"]:hover{background:var(--tonal-hover)}
.tabs [role="tab"][aria-selected="true"]{background:var(--brand);color:#fff;box-shadow:0 8px 18px -10px rgb(7 59 51 / .7)}
.tabs svg{width:22px;height:22px;flex:none}
@media (max-width:420px){.tabs [role="tab"]{font-size:.9688rem;gap:6px}.tabs svg{width:18px;height:18px}}
.panel{padding:28px 32px 32px}
@media (max-width:600px){.panel{padding:20px 16px 24px}}

.founding{margin-bottom:24px;padding:18px 20px;border:1px solid var(--sel-line);border-radius:14px;background:linear-gradient(180deg,#f2fbf7,var(--cta-soft))}
.founding h3{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-family:var(--font-display);font-size:1.1875rem;font-weight:800;color:var(--brand)}
.founding h3 svg{width:20px;height:20px;flex:none;color:var(--cta-edge)}
.founding .fine{margin-top:8px;font-size:.875rem;color:var(--muted)}

.form{display:grid;gap:20px}
.req-note{font-size:.875rem;color:var(--muted)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}
@media (max-width:640px){.grid2{grid-template-columns:minmax(0,1fr)}}
.f{display:flex;flex-direction:column;gap:6px;min-width:0}
fieldset{margin:0;padding:0;border:0;min-width:0}
legend{padding:0;margin-bottom:8px}
.f label,legend{font-weight:700;font-size:.9688rem;color:var(--ink)}
.opt{font-weight:400;font-size:.875rem;color:var(--muted)}
input[type="text"],input[type="email"],input[type="tel"],select,textarea{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line-strong);border-radius:var(--r-btn);background:#fff;color:var(--ink);font:inherit;font-size:1rem;line-height:1.4}
[dir="rtl"] input[dir="ltr"]{text-align:right}
textarea{min-height:100px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:var(--ink-2)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:1px;border-color:var(--focus)}
[aria-invalid="true"]{border-color:var(--err)!important;box-shadow:inset 0 0 0 1px var(--err)}
.sel{position:relative}
.sel select{appearance:none;-webkit-appearance:none;padding-inline-end:42px;cursor:pointer}
.chev{position:absolute;inset-inline-end:12px;top:50%;width:20px;height:20px;translate:0 -50%;color:var(--ink-2);pointer-events:none}
.hint{font-size:.875rem;color:var(--muted)}
.err{display:flex;align-items:flex-start;gap:6px;font-size:.875rem;font-weight:500;color:var(--err)}
.err svg{flex:none;width:16px;height:16px;margin-top:3px}
fieldset>.hint{margin:-4px 0 10px}

.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border:1px solid var(--line-2);border-radius:999px;background:#fff;font-weight:500;cursor:pointer;line-height:1.3}
.pill:hover{border-color:var(--ink-2)}
.pill input{width:18px;height:18px;margin:0;flex:none;accent-color:var(--brand)}
.pill:has(input:checked){border-color:var(--brand);background:var(--cta-soft);box-shadow:inset 0 0 0 1px var(--brand)}
.pill:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.pill input:focus-visible{outline:none}

.consent{display:grid;grid-template-columns:24px minmax(0,1fr);gap:4px 12px;align-items:start;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.consent input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--brand);cursor:pointer}
.consent label{font-weight:500;line-height:1.5;cursor:pointer}
.consent .hint,.consent .err{grid-column:2}
.consent:has([aria-invalid="true"]){border-color:var(--err);background:var(--err-bg)}

.hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.msg{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid rgb(180 35 24 / .3);border-radius:var(--r);background:var(--err-bg);color:var(--err);font-weight:500}
.msg svg{flex:none;width:18px;height:18px;margin-top:3px}
.pnote{font-size:.875rem;color:var(--muted);text-align:center}

.ok{padding:28px 8px 12px;text-align:center}
.ok-ic{display:grid;place-items:center;width:68px;height:68px;margin:0 auto 16px;border-radius:50%;background:var(--good-bg);color:var(--good)}
.ok-ic svg{width:34px;height:34px}
.ok h3{margin-bottom:10px;font-family:var(--font-display);font-size:1.5rem;font-weight:800}
.ok h3:focus{outline:none}
.ok h3:focus-visible{outline:3px solid var(--focus);outline-offset:4px;border-radius:4px}
.ok p{max-width:32em;margin:0 auto 22px;color:var(--ink-2)}

/* ---- privacy ---- */
.priv{padding-top:64px;padding-bottom:64px}
.priv dl{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:16px 28px;max-width:880px;margin:0 auto}
.priv dt{font-weight:700}
.priv dd{margin:0;color:var(--ink-2)}
@media (max-width:640px){.priv dl{grid-template-columns:minmax(0,1fr);gap:2px}.priv dd{margin-bottom:14px}}
.contact{max-width:880px;margin:20px auto 0}

/* ---- footer ---- */
.foot{padding-block:36px 28px;background:var(--brand-deep);color:var(--on-brand-2);font-size:.9375rem}
.foot a{color:var(--link-on-brand)}
.foot a:hover{color:#fff}
.foot :focus-visible{outline-color:var(--focus-on-brand)}
.a11y h2{margin-bottom:6px;font-family:var(--font-display);font-size:1.125rem;font-weight:800;color:#fff}
.a11y p{max-width:60em}
.a11y .contact{margin:8px 0 0}
.foot-end{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:24px;padding-top:20px;border-top:1px solid rgb(255 255 255 / .14)}
.foot-end nav{display:flex;gap:20px}
.foot-end nav a{display:inline-flex;align-items:center;min-height:44px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}