/* =========================================================
   רונן עובדיה – עורך דין ומגשר מסחרי
   ========================================================= */
@font-face{font-family:"Cooperative";src:url("assets/fonts/Cooperative-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Matritsa";src:url("assets/fonts/FbMatritsaNarrow-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Discovery";src:url("assets/fonts/Discovery_Fs-Light.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Discovery";src:url("assets/fonts/Discovery_Fs-Medium.woff2") format("woff2");font-weight:500;font-display:swap}

:root{
  --ink:#131232;
  --navy:#1C1B45;
  --logo-navy:#202042;
  --logo-blue-light:#6E96F0;
  --navy-2:#24235A;
  --royal:#3157BE;
  --royal-2:#4A70D8;
  --royal-soft:#86A6F5;
  --gold:#B89C5F;
  --gold-soft:#D9C38F;
  --gold-deep:#7C6230;
  --paper:#F5F3EE;
  --paper-2:#ECE8DF;
  --white:#fff;
  --text:#1C1B45;
  --text-soft:#4E4D72;
  --on-dark:#EEF0FA;
  --on-dark-soft:#B4B8D6;
  --line-dark:rgba(255,255,255,.12);
  --line-light:rgba(28,27,69,.12);

  --f-head:"Cooperative","Matritsa","Discovery",Arial,sans-serif;
  --f-body:"Discovery",Arial,"Segoe UI",sans-serif;

  --radius:22px;
  --container:1500px;
  --gutter:clamp(20px,4vw,56px);
  --ease:cubic-bezier(.2,.7,.1,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --header-h:84px;
  --fs-scale:1;
}

*,*::before,*::after{box-sizing:border-box}
html{font-size:calc(100% * var(--fs-scale));scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 12px);-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;font-family:var(--f-body);font-weight:300;font-size:1.0625rem;line-height:1.7;color:var(--text);background:var(--paper);-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-weight:400}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
strong{font-weight:500}
/* no single word alone on the last line (main.js also binds the last two words with a no-break space) */
p,li,summary,figcaption,label,h1,h2,h3,h4{text-wrap:pretty}
button{font:inherit;color:inherit;cursor:pointer}
/* custom cursor: the open swoosh from the logo, blue on light areas and white on dark ones; clickables keep the hand */
body{cursor:url(assets/icons/cursor-blue.svg) 20 20,auto}
.hero,.page-hero,.clients,.pillar-dark,.method,.contact,.site-footer,.site-header,.main-nav,.other-area{cursor:url(assets/icons/cursor-white.svg) 20 20,auto}
.method[data-tone="light"],.site-header.scrolled,.contact-form{cursor:url(assets/icons/cursor-blue.svg) 20 20,auto}
a[href],button,summary,label,select,[role="button"],[role="tab"],input[type="checkbox"],input[type="radio"],input[type="submit"],input[type="button"]{cursor:pointer}
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),textarea{cursor:text}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* focus */
:focus-visible{outline:3px solid var(--royal-2);outline-offset:3px;border-radius:6px}
.skip-link{position:fixed;top:12px;right:12px;z-index:1000;background:#fff;color:var(--navy);padding:12px 20px;border-radius:10px;font-weight:500;transform:translateY(-200%);transition:transform .2s}
.skip-link:focus{transform:none}

/* progress bar */
.progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:120;pointer-events:none}
.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--royal-soft));transform-origin:right;transform:scaleX(var(--p,0))}

/* ---------- buttons ---------- */
/* Buttons: on hover a circle spreads from the point where the cursor entered.
   ::before = resting fill (a hole opens in it), ::after = hover fill (grows as a circle). */
@property --r{syntax:"<length>";inherits:true;initial-value:0px}
.btn{--x:50%;--y:50%;--from-bg:transparent;--to-bg:transparent;--from-bd:transparent;--to-bd:transparent;--from-fg:#fff;--to-fg:#fff;
  position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:.85em 1.5em;border-radius:999px;
  border:1.5px solid var(--from-bd);background:transparent;color:var(--from-fg);font-family:var(--f-body);font-weight:500;font-size:1rem;line-height:1.2;text-decoration:none;
  transition:--r .6s var(--ease-out),transform .35s var(--ease),box-shadow .45s var(--ease),color .4s var(--ease),border-color .4s var(--ease)}
.btn::before,.btn::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none}
.btn::before{background:var(--from-bg);-webkit-mask:radial-gradient(circle at var(--x) var(--y),transparent var(--r),#000 calc(var(--r) + 1px));mask:radial-gradient(circle at var(--x) var(--y),transparent var(--r),#000 calc(var(--r) + 1px))}
.btn::after{background:var(--to-bg);-webkit-mask:radial-gradient(circle at var(--x) var(--y),#000 var(--r),transparent calc(var(--r) + 1px));mask:radial-gradient(circle at var(--x) var(--y),#000 var(--r),transparent calc(var(--r) + 1px))}
.btn:hover,.btn:focus-visible{--r:var(--rmax,320px);color:var(--to-fg);border-color:var(--to-bd)}
.btn svg{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.btn svg.fill{fill:currentColor;stroke:none}
.btn:hover svg,.btn:focus-visible svg{transform:translateX(-4px)}
.btn:hover svg.fill,.btn:focus-visible svg.fill{transform:none}
/* on dark backgrounds: logo blue <-> white outline */
.btn-primary{--from-bg:var(--royal);--from-bd:var(--royal);--to-bd:#fff;box-shadow:0 10px 30px -12px rgba(49,87,190,.8)}
.btn-primary:hover,.btn-primary:focus-visible{box-shadow:none}
.btn-ghost{--to-bg:var(--royal);--from-bd:#fff;--to-bd:var(--royal)}
/* on light backgrounds: dark -> light logo blue */
/* כפתורים על רקע בהיר: חלול בכחול הכהה של הלוגו, בריחוף מתמלא בכחול כהה עם טקסט לבן */
.btn-dark,.pillar-light .pillar-link,.site-header.scrolled .btn-primary{--from-bg:transparent;--from-bd:var(--logo-navy);--from-fg:var(--logo-navy);--to-bg:var(--logo-navy);--to-bd:var(--logo-navy);--to-fg:#fff;box-shadow:none}
.faq .btn-dark{margin-top:2rem}
.btn-lg{font-size:1.08rem;padding:1.05em 1.8em}
.btn-small{padding:.6em 1.2em;font-size:.95rem}
.btn-block{width:100%}

.eyebrow{display:inline-flex;align-items:center;gap:.7em;font-weight:500;font-size:.9rem;letter-spacing:.02em;color:#fff}
.eyebrow::before{content:"";flex:none;width:2.1em;aspect-ratio:266/99.5;background:url(assets/icons/swoosh-white.svg) center/contain no-repeat} /* הצורה הפתוחה מהלוגו */
.eyebrow-dark::before{background-image:url(assets/icons/swoosh-navy.svg)}
.eyebrow-dark{color:var(--logo-navy)}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(184,156,95,0)}100%{box-shadow:0 0 0 0 rgba(184,156,95,0)}}

.section-head{margin-bottom:clamp(40px,6vw,80px)}
.section-title{font-family:var(--f-head);font-size:clamp(2.6rem,5.6vw,5.4rem);line-height:.98;letter-spacing:-.005em;margin-top:.35em;color:var(--navy)}
.section-title.light{color:#fff}
.section-title .muted{color:var(--royal)}
.section-title.light .muted{color:var(--royal-soft)}
.section-head-split{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:end}
.section-sub{color:var(--on-dark-soft);font-size:1.12rem;max-width:36ch}

/* ---------- header ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:100;height:var(--header-h);transition:background-color .4s,box-shadow .4s,height .4s,transform .45s var(--ease)}
.header-inner{max-width:1780px;height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px}
.brand{position:relative;display:block;width:170px;flex:none}
.brand img{width:100%;height:auto;transition:opacity .4s}
.brand .brand-color{position:absolute;inset:0;opacity:0}
.main-nav{justify-self:center}
.main-nav ul{display:flex;align-items:center;gap:clamp(18px,2.2vw,34px)}
.main-nav a{position:relative;display:block;text-decoration:none;color:var(--on-dark);font-weight:500;font-size:.98rem;padding:6px 0;transition:color .3s}
.main-nav a::after{content:"";position:absolute;inset:auto 0 0 0;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease-out)}
.main-nav a:hover::after,.main-nav a[aria-current="true"]::after,.main-nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav-cta-mobile{display:none}
.header-actions{grid-column:3;display:flex;align-items:center;gap:18px;justify-self:end}
.brand{justify-self:start}
.header-inner>.btn:last-child{grid-column:3;justify-self:end}
.header-phone{display:flex;align-items:center;gap:8px;color:var(--on-dark);text-decoration:none;font-weight:500;font-size:.98rem}
.header-phone svg{width:18px;height:18px;fill:var(--gold-soft)}
.nav-toggle{display:none;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:transparent;position:relative}
.nav-toggle span{position:absolute;right:13px;left:13px;height:1.5px;background:currentColor;color:#fff;transition:transform .35s var(--ease),top .35s}
.nav-toggle span:first-child{top:18px}.nav-toggle span:last-child{top:26px}
.nav-toggle[aria-expanded="true"] span:first-child{top:22px;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:last-child{top:22px;transform:rotate(-45deg)}

.site-header.scrolled{background:rgba(245,243,238,.9);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 1px 0 var(--line-light);height:72px}
.site-header.scrolled .brand-white{opacity:0}
.site-header.scrolled .brand-color{opacity:1}
.site-header.scrolled .main-nav a,.site-header.scrolled .header-phone{color:var(--navy)}
.site-header.scrolled .header-phone svg{fill:var(--royal)}
.site-header.scrolled .nav-toggle{border-color:var(--line-light)}
.site-header.scrolled .nav-toggle span{background:var(--navy)}


/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;background:var(--ink);color:var(--on-dark);overflow:hidden;display:flex;align-items:flex-end}
.hero-bg{position:absolute;inset:0}
.hero-photo-bg{position:absolute;inset:-4%;background:url("assets/back.jpg") center/cover no-repeat;opacity:.55;transform:scale(1.08);animation:bgIn 2.4s var(--ease-out) forwards}
@keyframes bgIn{to{transform:scale(1)}}
.hero-bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(to left, rgba(19,18,50,.92) 0%, rgba(19,18,50,.55) 55%, rgba(19,18,50,.25) 100%),
  linear-gradient(to top, var(--ink) 0%, transparent 35%)}
.hero-glow{position:absolute;width:62vw;height:62vw;left:-8vw;top:8vh;background:radial-gradient(closest-side,rgba(49,87,190,.55),rgba(49,87,190,0));z-index:1;will-change:transform;animation:glow 9s ease-in-out infinite alternate}
@keyframes glow{to{transform:translate(4vw,-3vh) scale(1.08)}}
.grain{position:absolute;inset:0;z-index:2;opacity:.09;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.hero-grid{position:relative;z-index:3;max-width:1780px;display:grid;grid-template-columns:1fr;align-items:center;min-height:100svh;padding-top:var(--header-h)}
.hero-copy{position:relative;z-index:5;max-width:min(580px,44%);padding-block:clamp(24px,5vh,56px) clamp(64px,10vh,110px)}
.hero-h1{margin:0;font-weight:400}
.hero-title{display:block;font-family:var(--f-head);font-size:clamp(3.4rem,min(7.4vw,12vh),8rem);line-height:.9;letter-spacing:-.01em;margin:0;color:#fff}
.hero-sub{display:block;font-family:var(--f-body);letter-spacing:0;margin-top:clamp(18px,2.6vh,28px);font-weight:500;font-size:clamp(1.3rem,1.75vw,1.7rem);line-height:1.3;color:var(--royal-soft)}
.hero-sub span{color:var(--on-dark-soft);margin-inline:.2em}
.hero-title .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero-title .line>span{display:inline-block;transform:translateY(105%);transition:transform 1.2s var(--ease-out)}
.hero-title .line:nth-child(2)>span{transition-delay:.12s}
.hero-title .line:nth-child(3)>span{transition-delay:.24s}
.hero-title em{font-style:normal;color:var(--royal-soft)}
.hero-lead{max-width:42ch;margin-top:clamp(16px,2.4vh,26px);font-size:clamp(1.05rem,1.25vw,1.22rem);color:var(--on-dark-soft)}
.hero-lead strong{color:#fff}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(28px,4.4vh,44px)}

/* staged intro */
.hero-sub,.hero-lead,.hero-ctas{opacity:0;transform:translateY(24px);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out)}
.is-loaded .hero-title .line>span{transform:none}
.is-loaded .hero-sub{opacity:1;transform:none;transition-delay:.4s}
.is-loaded .hero-lead{opacity:1;transform:none;transition-delay:.55s}
.is-loaded .hero-ctas{opacity:1;transform:none;transition-delay:.65s}

.hero-visual{position:absolute;left:clamp(0px,4vw,110px);bottom:0;height:calc(100% - var(--header-h) - 10px);max-height:1000px;display:flex;align-items:flex-end;justify-content:flex-start;pointer-events:none}
.hero-visual .seal-wrap{pointer-events:auto}
.portrait{position:relative;height:100%;aspect-ratio:538/964;transform:translate3d(var(--mx,0),var(--my,0),0);transition:transform .8s var(--ease-out)}
.portrait-img{position:absolute;z-index:2;bottom:0;left:50%;height:100%;width:100%;width:auto;max-width:none;transform:translate(-50%,40px);opacity:0;transition:opacity 1.4s var(--ease-out) .15s,transform 1.6s var(--ease-out) .15s;filter:drop-shadow(0 30px 50px rgba(0,0,0,.45))}
.is-loaded .portrait-img{opacity:1;transform:translate(-50%,0)}
/* blink: eye-strip sprite (12 frames) laid exactly over the eyes; left/top are image coordinates, not reading direction */
.portrait-blink{position:absolute;z-index:3;left:35.316%;top:11.929%;width:30.669%;height:6.224%;background:url(assets/ronen-blink.webp) 0 0/1200% 100% no-repeat;opacity:0;pointer-events:none}
.is-loaded .portrait-blink.is-blinking{opacity:1;animation:ro-blink .4s steps(12,jump-none) forwards}
@keyframes ro-blink{from{background-position:0 0}to{background-position:100% 0}}
html.no-motion .portrait-blink{display:none}
.orbit{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.orbit-back{z-index:1}
.orbit-front{z-index:3}
.orbit .draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--ease-out)}
.orbit-back .draw{transition-delay:.7s}
.orbit-back .d2{transition-delay:1s;transition-duration:2.2s}
.orbit-front .draw{transition-delay:1.25s}
.is-loaded .orbit .draw{stroke-dashoffset:0}

.seal-wrap{position:absolute;z-index:4;top:34%;left:calc(100% + 6vw);width:clamp(120px,10.5vw,210px)}
.seal{width:100%;height:auto;opacity:0;transform:scale(2.4) rotate(-40deg);filter:drop-shadow(0 12px 22px rgba(0,0,0,.4))}
.seal-ripple{position:absolute;inset:6%;border-radius:50%;border:2px solid var(--gold-soft);opacity:0}
.is-loaded .seal{animation:stamp .7s cubic-bezier(.5,0,.75,0) 1.9s forwards, float 6s ease-in-out 2.8s infinite}
.is-loaded .seal-ripple{animation:ripple 1.1s var(--ease-out) 2.55s forwards}
@keyframes stamp{0%{opacity:0;transform:scale(2.4) rotate(-40deg)}60%{opacity:1}100%{opacity:1;transform:scale(1) rotate(-10deg)}}
@keyframes ripple{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.9)}}
@keyframes float{0%,100%{opacity:1;transform:scale(1) rotate(-10deg) translateY(0)}50%{opacity:1;transform:scale(1) rotate(-6deg) translateY(-8px)}}

.scroll-cue{position:absolute;z-index:4;bottom:26px;left:50%;transform:translateX(-50%);width:26px;height:42px;border:1.5px solid rgba(255,255,255,.4);border-radius:20px}
.scroll-cue span{position:absolute;top:8px;left:50%;width:3px;height:8px;margin-left:-1.5px;border-radius:3px;background:var(--gold-soft);animation:cue 1.8s var(--ease) infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* ---------- CLIENTS ---------- */
.clients{background:var(--ink);color:var(--on-dark);padding:clamp(48px,7vw,84px) 0 clamp(56px,8vw,96px);border-top:1px solid var(--line-dark);position:relative}
.clients-head{display:flex;justify-content:center;text-align:center;margin-bottom:40px}
.clients-title{font-family:var(--f-head);font-size:clamp(1.8rem,3vw,2.6rem);color:#fff}
.clients-foot{display:flex;justify-content:center;margin-top:28px}
.marquee-toggle{display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line-dark);border-radius:999px;padding:6px 13px;color:var(--on-dark-soft);font-size:.8rem;transition:border-color .3s,color .3s}
.marquee-toggle:hover{border-color:var(--gold-soft);color:#fff}
.i-pause{width:9px;height:11px;border-inline:3px solid currentColor}
.marquee-toggle[aria-pressed="true"] .i-pause{border:0;width:0;height:0;border-block:5.5px solid transparent;border-right:9px solid currentColor}
.marquee{position:relative;overflow:hidden;direction:ltr;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee-track{display:flex;width:max-content;animation:marquee 42s linear infinite}
.marquee:hover .marquee-track,.marquee.paused .marquee-track{animation-play-state:paused}
.marquee-list{display:flex;align-items:center;gap:clamp(56px,7vw,110px);padding-inline:clamp(28px,3.5vw,55px)}
.marquee-list li{flex:none;display:flex;align-items:center;height:84px}
.marquee-list img{height:52px;width:auto;max-width:230px;object-fit:contain;opacity:.62;transition:opacity .4s,transform .4s var(--ease)}
.marquee-list img.wide{height:40px}
.marquee-list img.tall{height:78px}
.marquee-list li:hover img{opacity:1;transform:scale(1.06)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- BRIDGE ---------- */
.bridge{position:relative;height:230vh;background:var(--paper)}
.bridge-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.bridge-inner{text-align:center;display:flex;flex-direction:column;align-items:center}
.bridge-title{font-family:var(--f-head);font-size:clamp(2.8rem,7vw,7rem);line-height:1;color:var(--navy);margin-top:.3em}
.bridge-title .side{display:inline-block;transition:transform .2s linear}
.bridge-title .side{white-space:nowrap}
.bridge-title .side-a{transform:translateX(calc(var(--split,1) * 14vw));opacity:calc(1 - var(--split,1) * .6)}
.bridge-title .side-b{transform:translateX(calc(var(--split,1) * -14vw));opacity:calc(1 - var(--split,1) * .6);color:var(--royal)}
.bridge-line{position:relative;width:100%;max-width:1100px;height:90px;margin:clamp(24px,5vh,56px) 0;display:flex;align-items:center}
.bl{flex:1;height:2px;background:linear-gradient(to left,var(--navy),var(--royal));transform:scaleX(var(--bl,0))}
.bl-r{transform-origin:right}
.bl-l{transform-origin:left;background:linear-gradient(to right,var(--navy),var(--royal))}
.bridge-knot{flex:none;width:90px;height:90px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 20px 50px -20px rgba(28,27,69,.45),0 0 0 1px var(--line-light);transform:scale(var(--knot,0)) rotate(calc((1 - var(--knot,0)) * -90deg))}
.bridge-knot img{width:62%;height:auto}
.bridge-text{max-width:30ch;font-family:var(--f-head);font-size:clamp(1.7rem,3.3vw,3rem);line-height:1.15;color:var(--navy)}
.bridge-text .w{opacity:.14;transition:opacity .35s}
.bridge-text .w.on{opacity:1}

.pattern{position:absolute;inset:0;z-index:0;pointer-events:none;background:var(--navy);opacity:.06;
  -webkit-mask-image:url("assets/pattern-mark.png"),radial-gradient(ellipse 75% 70% at 50% 50%,transparent 20%,#000 75%);
  mask-image:url("assets/pattern-mark.png"),radial-gradient(ellipse 75% 70% at 50% 50%,transparent 20%,#000 75%);
  -webkit-mask-size:300px 300px,100% 100%;mask-size:300px 300px,100% 100%;
  -webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;
  -webkit-mask-position:0 calc(var(--pat,0) * -240px),0 0;mask-position:0 calc(var(--pat,0) * -240px),0 0;
  -webkit-mask-composite:source-in;mask-composite:intersect}
.bridge-inner{position:relative;z-index:1}
.pattern-top{bottom:auto;height:min(760px,90%);opacity:.06;
  -webkit-mask-image:url("assets/pattern-mark.png"),linear-gradient(#000 0%,transparent 100%);
  mask-image:url("assets/pattern-mark.png"),linear-gradient(#000 0%,transparent 100%)}
.expertise{position:relative}
.expertise>.container{position:relative;z-index:1}

/* ---------- EXPERTISE ---------- */
.expertise{padding:clamp(80px,11vw,150px) 0 clamp(70px,9vw,120px);background:var(--paper)}
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,32px);align-items:stretch}
.pillar{position:relative;border-radius:var(--radius);padding:clamp(28px,3.6vw,52px);display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
.pillar-light{background:#fff;box-shadow:0 30px 70px -40px rgba(28,27,69,.35),0 0 0 1px var(--line-light)}
.pillar-dark{background:var(--navy);color:var(--on-dark)}
.pillar-dark::before{content:"";position:absolute;z-index:-1;width:520px;height:520px;left:-200px;bottom:-220px;background:radial-gradient(closest-side,rgba(49,87,190,.55),transparent);transition:transform 1.2s var(--ease-out)}
.pillar-dark:hover::before{transform:translate(60px,-40px)}
.pillar-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}
.pillar-index{font-family:var(--f-head);font-size:1.25rem;color:var(--gold-deep)}
.pillar-dark .pillar-index{color:var(--gold-soft)}
.pillar-icon{width:64px;height:64px;fill:none;stroke:var(--royal);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pillar-dark .pillar-icon{stroke:var(--royal-soft)}
.pillar-icon .sig{stroke:var(--gold)}
.pillar-icon-art{stroke-width:15} /* contract.svg and negotiation.svg are drawn on a 512 grid */
/* האייקון מצויר פעם אחת, אחרי שהמלבן עמד ישר (stood נקבע ב-main.js); החתימה הזהובה אחרונה */
.pillar-icon *{stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 1.8s var(--ease-out) .15s}
.pillar-icon .sig{transition-delay:1.1s}
.pillar.stood .pillar-icon *{stroke-dashoffset:0}
html.no-motion .pillar-icon *{stroke-dashoffset:0;transition:none}
.pillar-title{font-family:var(--f-head);font-size:clamp(2.2rem,3.6vw,3.4rem);line-height:1;color:var(--navy)}
.pillar-dark .pillar-title{color:#fff}
.pillar-lead{margin-top:14px;color:var(--text-soft);max-width:44ch}
.pillar-dark .pillar-lead{color:var(--on-dark-soft)}
.services{margin-top:30px;border-top:1px solid var(--line-light);flex:1}
.pillar-dark .services{border-color:var(--line-dark)}
.services li{position:relative;padding:18px 0 18px 36px;border-bottom:1px solid var(--line-light);transition:padding .45s var(--ease-out)}
.pillar-dark .services li{border-color:var(--line-dark)}
.services li::before{content:"";position:absolute;right:0;top:0;height:2px;width:100%;background:var(--royal);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease-out)}
.pillar-dark .services li::before{background:var(--gold)}
.services li::after{content:"";position:absolute;left:4px;top:28px;width:10px;height:10px;border-top:1.5px solid currentColor;border-left:1.5px solid currentColor;transform:rotate(-45deg);opacity:.35;transition:transform .45s var(--ease-out),opacity .3s}
.services li:hover{padding-inline-start:12px}
.services li:hover::before{transform:scaleX(1)}
.services li:hover::after{opacity:1;transform:translateX(-6px) rotate(-45deg)}
.services h4{font-family:var(--f-body);font-weight:500;font-size:1.14rem;color:var(--navy)}
.pillar-dark .services h4{color:#fff}
.services p{font-size:.98rem;color:var(--text-soft);margin-top:2px}
.pillar-dark .services p{color:var(--on-dark-soft)}
/* תחומי עיסוק: כפתור חלול שמתמלא במעבר עכבר, בצבע של המלבן */
.pillar-link{margin-top:28px;align-self:flex-start;--from-fg:var(--royal);--from-bd:var(--royal);--to-bg:var(--royal);--to-bd:var(--royal);--to-fg:#fff}
.pillar-dark .pillar-link{--from-fg:#fff;--from-bd:#fff;--to-bg:#fff;--to-bd:#fff;--to-fg:var(--navy)}

/* ---------- QUOTE ---------- */
.quote{background:var(--paper);padding:0 0 clamp(80px,10vw,140px)}
.quote-fig{margin:0;position:relative;padding:clamp(40px,6vw,80px) 0 0;border-top:1px solid var(--line-light);text-align:center}
.quote-mark{position:absolute;top:-.12em;left:50%;transform:translateX(-50%);font-family:Georgia,serif;font-size:9rem;line-height:1;color:var(--gold);background:var(--paper);padding:0 .15em;height:.6em;overflow:hidden}
.quote blockquote{margin:0}
.quote blockquote p{font-family:var(--f-head);font-size:clamp(2rem,4.4vw,4.2rem);line-height:1.08;color:var(--navy)}
.quote em{font-style:normal;position:relative;color:var(--royal)}
.quote em::after{content:"";position:absolute;right:-4%;left:-4%;top:52%;height:3px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .9s var(--ease-out) .9s}
.quote-fig.in em::after{transform:scaleX(1)}
.quote figcaption{margin-top:22px;font-weight:500;color:var(--text-soft);letter-spacing:.04em}

/* ---------- METHOD ---------- */
/* גובה מסך מלא; הרקע נצבע לכחול כהה כשהאזור ממלא את המסך (data-tone="light" מחוץ לו, נקבע ב-main.js) */
/* האזור נעוץ במסך עד שהקו מגיע לשלב 4, ורק אז הגלילה ממשיכה */
.method{position:relative;height:260vh;background:var(--navy);color:var(--on-dark);transition:background-color .7s var(--ease-out),color .7s}
.method-sticky{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;padding:clamp(56px,9vh,120px) 0;overflow:hidden}
.method .reveal{transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out),color .7s,border-color .7s}
.method .muted,.method .step h3,.method .step p{transition:color .7s}
.method .eyebrow::before,.method .steps-rail{transition:background .7s}
.method[data-tone="light"]{background:var(--paper);color:var(--navy)}
/* בטלפון ובטאבלט השלבים מסודרים בטורים בלי קו, ולכן אין נעיצה */
@media (max-width:960px){.method{height:auto}.method-sticky{position:relative;height:auto;min-height:100svh}}
.method[data-tone="light"] .section-title.light,.method[data-tone="light"] .step h3{color:var(--navy)}
.method[data-tone="light"] .section-title.light .muted{color:var(--royal)}
.method[data-tone="light"] .eyebrow{color:var(--logo-navy)}
.method[data-tone="light"] .eyebrow::before{background-image:url(assets/icons/swoosh-navy.svg)}
.method[data-tone="light"] .section-sub,.method[data-tone="light"] .step p{color:var(--text-soft)}
.method[data-tone="light"] .step-num{-webkit-text-stroke-color:rgba(28,27,69,.35)}
.method[data-tone="light"] .step-dot{background:var(--paper)}
.method[data-tone="light"] .steps-rail{background:var(--line-light)}
.method[data-tone="light"] .step{border-color:var(--line-light)}
.method .container{position:relative}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,36px);position:relative;z-index:1}
.step{position:relative;padding-top:56px}
.step-dot{position:absolute;top:13px;right:0;width:16px;height:16px;border-radius:50%;background:var(--navy);border:2px solid var(--royal-soft);transition:background-color .4s,border-color .4s,box-shadow .4s}
.step.lit .step-dot{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 7px rgba(184,156,95,.18)}
.step-num{font-family:var(--f-head);font-size:3.6rem;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.35);display:block;margin-bottom:14px;transition:color .5s,-webkit-text-stroke-color .5s}
.step.lit .step-num{color:var(--royal-soft);-webkit-text-stroke-color:transparent}
.step h3{font-family:var(--f-head);font-size:clamp(1.7rem,2.2vw,2.1rem);color:#fff;line-height:1.1}
.step p{margin-top:8px;color:var(--on-dark-soft);font-size:1rem}
.steps-rail{position:absolute;top:20px;right:0;left:0;height:2px;background:var(--line-dark)}
.steps-rail span{position:absolute;inset:0;background:linear-gradient(to left,var(--gold),var(--royal-soft));transform-origin:right;transform:scaleX(var(--rail,0))}
.method .section-head{margin-bottom:clamp(50px,7vw,96px)}
.method .steps{margin-top:0}
.method .steps-wrap{position:relative}

/* ---------- ABOUT ---------- */
.about{background:var(--paper);padding:clamp(80px,11vw,150px) 0;overflow:hidden}
.about-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center}
.about-text{margin-top:30px;display:grid;gap:18px;font-size:1.12rem;color:var(--text-soft);max-width:58ch}
.about-sign{font-family:var(--f-head);font-size:1.9rem;color:var(--navy);line-height:1.1;margin-top:6px}
.values{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;border-top:1px solid var(--line-light);padding-top:28px}
.values strong{display:block;font-family:var(--f-head);font-weight:400;font-size:1.6rem;color:var(--royal);line-height:1.1}
.values span{display:block;font-size:.95rem;color:var(--text-soft);margin-top:6px}
.about-visual{position:relative;display:flex;flex-direction:column;align-items:center}
.about-photo{position:relative;margin:0;width:min(100%,560px);aspect-ratio:440/560;display:flex;align-items:flex-end;justify-content:center}
.about-img{position:absolute;z-index:1;bottom:0;left:50%;transform:translateX(-50%);width:auto;height:100%;max-width:none;filter:drop-shadow(0 24px 30px rgba(28,27,69,.22))}
.about-seal{position:absolute;z-index:2;width:clamp(120px,11vw,160px);height:auto;top:30%;right:-9%;transform:rotate(-10deg);filter:drop-shadow(0 14px 22px rgba(28,27,69,.35));transition:transform .8s var(--ease-out)}
.about-visual:hover .about-seal{transform:rotate(4deg) scale(1.05)}
.trust-card{position:relative;z-index:3;margin-top:-56px;background:#fff;border-radius:var(--radius);padding:28px 34px;width:min(94%,520px);text-align:center;box-shadow:0 30px 60px -36px rgba(28,27,69,.45),0 0 0 1px var(--line-light)}
.trust-card h3{font-family:var(--f-head);font-size:2.1rem;line-height:1.05;color:var(--navy)}
.trust-card p{margin-top:10px;color:var(--text-soft);font-size:1.12rem}

/* ---------- FAQ ---------- */
.faq{background:var(--paper-2);padding:clamp(80px,11vw,150px) 0}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,6vw,100px);align-items:start}
.faq .section-head{position:sticky;top:120px;margin:0}
.faq-list details{border-bottom:1px solid var(--line-light)}
.faq-list details:first-child{border-top:1px solid var(--line-light)}
.faq-list summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;cursor:pointer;font-weight:500;font-size:1.2rem;color:var(--navy);transition:color .3s}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:hover{color:var(--royal)}
.plus{position:relative;flex:none;width:36px;height:36px;border-radius:50%;border:1px solid var(--navy);background:var(--navy);color:#fff;transition:background-color .3s,transform .5s var(--ease-out),border-color .3s}
.plus::before,.plus::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:currentColor}
.plus::after{transform:rotate(90deg);transition:transform .4s var(--ease-out)}
details[open] .plus{background:var(--royal);border-color:var(--royal);color:#fff;transform:rotate(180deg)}
details[open] .plus::after{transform:rotate(0)}
.faq-a{padding:0 0 26px;color:var(--text-soft);max-width:62ch;font-size:1.05rem}
details[open] .faq-a{animation:faqIn .5s var(--ease-out)}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px)}}

/* ---------- CONTACT ---------- */
.contact{position:relative;background:var(--ink);color:var(--on-dark);padding:clamp(80px,11vw,150px) 0;overflow:hidden;overflow:clip}
.contact-bg{position:absolute;inset:0;background:
  radial-gradient(60vw 60vw at 85% 10%,rgba(49,87,190,.45),transparent 60%),
  linear-gradient(rgba(19,18,50,.82),rgba(19,18,50,.92)),url("assets/back.jpg") center/cover}
.contact-grid{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:start}
.contact-copy{position:sticky;top:calc(var(--header-h) + 32px)}
.contact-title{font-family:var(--f-head);font-size:clamp(3rem,6.6vw,6.6rem);line-height:.95;color:#fff;margin-top:.3em}
.contact-lead{margin-top:22px;font-size:1.15rem;color:var(--on-dark-soft);max-width:40ch}
.contact-ways{margin-top:36px;display:grid;gap:14px;max-width:420px}
.contact-ways a{display:flex;align-items:center;gap:16px;padding:14px 18px;border:1px solid var(--line-dark);border-radius:16px;text-decoration:none;transition:border-color .3s,background-color .3s,transform .4s var(--ease-out)}
.contact-ways a:hover{border-color:var(--gold-soft);background:rgba(255,255,255,.04);transform:translateX(-6px)}
.contact-ways .ico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(134,166,245,.14)}
.contact-ways svg{width:20px;height:20px;fill:var(--royal-soft)}
.contact-ways small{display:block;font-size:.82rem;color:var(--on-dark-soft)}
.contact-ways a>span:last-child{font-weight:500;font-size:1.12rem;color:#fff}

.contact-form{background:rgba(255,255,255,.97);color:var(--text);border-radius:calc(var(--radius) + 4px);padding:clamp(26px,3.4vw,46px);box-shadow:0 50px 100px -40px rgba(0,0,0,.6)}
.form-title{font-family:var(--f-head);font-size:2.3rem;color:var(--navy);line-height:1}
.form-note{font-size:.88rem;color:var(--text-soft);margin:6px 0 20px}
.form-privacy{max-height:3.4em;max-height:2lh;overflow-y:auto;padding-inline-end:8px;scrollbar-width:thin;scrollbar-color:var(--royal) transparent}
.field{position:relative;margin-bottom:16px;display:flex;flex-direction:column;gap:6px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field label{font-weight:500;font-size:.95rem;color:var(--navy)}
.req{color:#B3261E}
.field input,.field select,.field textarea{font:inherit;font-weight:300;font-size:1rem;color:var(--text);background:var(--paper);border:1.5px solid transparent;border-radius:12px;padding:13px 16px;transition:border-color .3s,background-color .3s,box-shadow .3s;width:100%}
.field textarea{resize:vertical;min-height:92px}
.field input[dir="ltr"]{text-align:right}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--line-light)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--royal);background:#fff;box-shadow:0 0 0 4px rgba(49,87,190,.15)}
.field [aria-invalid="true"]{border-color:#B3261E;background:#FFF6F5}
.err{font-size:.86rem;color:#B3261E;min-height:0}
.err:empty{display:none}
.field.check{flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:10px}
.field.check input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:var(--royal)}
.field.check label{flex:1;font-weight:300;color:var(--text-soft)}
.field.check label a{color:var(--royal);font-weight:500;text-underline-offset:3px}
.field.check .err{flex-basis:100%}
/* מעבר צבע כמו בתהליך העבודה: האזור בהיר עד שהוא מגיע לאמצע המסך, ואז נצבע לכחול כהה ונשאר כך (data-tone="light" נקבע ב-main.js) */
.contact{transition:background-color .7s var(--ease-out),color .7s}
.contact-bg{transition:opacity .7s var(--ease-out)}
.contact .reveal{transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out),color .7s,box-shadow .7s}
.contact-ways small,.contact-ways a>span:last-child{transition:color .7s}
.contact-ways a{transition:border-color .7s,background-color .3s,transform .4s var(--ease-out)}
.contact-ways .ico{transition:background-color .7s}
.contact-ways svg{transition:fill .7s}
.contact[data-tone="light"]{background:var(--paper);color:var(--navy);cursor:url(assets/icons/cursor-blue.svg) 20 20,auto}
.contact[data-tone="light"] .contact-bg{opacity:0}
.contact[data-tone="light"] .contact-title{color:var(--navy)}
.contact[data-tone="light"] .contact-lead,.contact[data-tone="light"] .contact-ways small{color:var(--text-soft)}
.contact[data-tone="light"] .eyebrow{color:var(--logo-navy)}
.contact[data-tone="light"] .eyebrow::before{background-image:url(assets/icons/swoosh-navy.svg)}
.contact[data-tone="light"] .contact-ways a{border-color:var(--line-light)}
.contact[data-tone="light"] .contact-ways a>span:last-child{color:var(--navy)}
.contact[data-tone="light"] .contact-ways .ico{background:rgba(49,87,190,.1)}
.contact[data-tone="light"] .contact-ways svg{fill:var(--royal)}
.contact[data-tone="light"] .contact-form{box-shadow:0 30px 70px -40px rgba(28,27,69,.35),0 0 0 1px var(--line-light)}
.contact-form .btn{margin-top:8px}
/* כפתור הטופס: נשאר בצבעים המקוריים (מלא בכחול כהה, בריחוף כחול בהיר), עם התנועה של שאר הכפתורים */
.contact-form .btn-dark{--from-bg:var(--navy);--to-bg:var(--royal-soft);--from-bd:var(--navy);--to-bd:var(--royal-soft);--from-fg:#fff;--to-fg:var(--navy)}
.form-success{margin-top:16px;font-weight:500;color:#1D6B3A}
.form-success:empty{display:none}

/* ---------- FOOTER ---------- */
.site-footer{background:var(--ink);color:var(--on-dark-soft);padding:56px 0 28px;border-top:1px solid var(--line-dark)}
.footer-grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.footer-logo{width:190px;height:auto}
.footer-grid>nav{flex:1 1 0;min-width:0}
.footer-links{display:grid;grid-template-columns:repeat(4,auto);justify-content:center;gap:12px 32px}
.footer-links a{text-decoration:none;color:var(--on-dark);transition:color .3s}
.footer-links a:hover{color:var(--gold-soft)}
/* social: one row, no frame. On hover the gold copy (.soc-fill, cloned in main.js) spreads from the cursor like the buttons */
.footer-social{display:flex;gap:22px;list-style:none;margin:0;padding:0}
.footer-social a{--x:50%;--y:50%;position:relative;display:block;width:26px;height:26px;color:var(--on-dark);transition:--r .6s var(--ease-out)}
.footer-social a:hover,.footer-social a:focus-visible{--r:var(--rmax,40px)}
.footer-social svg{display:block;width:100%;height:100%;fill:currentColor}
.footer-social .soc-fill{position:absolute;inset:0;color:var(--logo-blue-light);clip-path:circle(var(--r) at var(--x) var(--y))}
.footer-social svg.stroke{fill:none;stroke:currentColor;stroke-width:2}
.footer-social svg .dot{fill:currentColor;stroke:none}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:40px;padding-top:22px;border-top:1px solid var(--line-dark);font-size:.88rem}

/* ---------- FABs ---------- */
.fab-wa{position:fixed;z-index:90;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#1FA855;box-shadow:0 14px 30px -8px rgba(31,168,85,.6);transition:transform .4s var(--ease-out)}
.fab-wa:hover{transform:scale(1.08) rotate(-6deg)}
.fab-wa svg{width:30px;height:30px;fill:#fff}
.fab-wa::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #1FA855;animation:waPulse 2.6s infinite}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.6);opacity:0}}
.mobile-cta{display:none}

/* ---------- A11Y widget ---------- */
.a11y{position:fixed;z-index:95;left:22px;bottom:22px}
.a11y-toggle{width:54px;height:54px;border-radius:50%;border:0;background:var(--royal);display:grid;place-items:center;box-shadow:0 14px 30px -8px rgba(49,87,190,.7);transition:transform .3s var(--ease-out)}
.a11y-toggle:hover{transform:scale(1.06)}
.a11y-toggle svg{width:28px;height:28px;fill:#fff}
.a11y-panel{position:absolute;left:0;bottom:66px;width:300px;max-width:calc(100vw - 44px);background:#fff;color:var(--text);border-radius:18px;padding:20px;box-shadow:0 30px 70px -20px rgba(0,0,0,.45),0 0 0 1px var(--line-light)}
.a11y-panel[hidden]{display:none}
.a11y-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.a11y-head h2{font-family:var(--f-head);font-size:1.6rem;color:var(--navy)}
.a11y-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line-light);background:transparent;font-size:1.4rem;line-height:1}
.a11y-font{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--paper);border-radius:12px;padding:6px}
.a11y-font button{width:48px;height:40px;border:0;border-radius:9px;background:#fff;font-weight:500;color:var(--navy)}
.a11y-font span{font-weight:500}
.a11y-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.a11y-opts button{border:1.5px solid var(--line-light);background:#fff;border-radius:12px;padding:12px 8px;font-size:.92rem;font-weight:500;color:var(--navy);transition:background-color .2s,border-color .2s}
.a11y-opts button[aria-pressed="true"]{background:var(--royal);border-color:var(--royal);color:#fff}
.a11y-reset{width:100%;margin-top:10px;border:0;background:var(--paper);border-radius:12px;padding:11px;font-weight:500;color:var(--navy)}
.a11y-statement{display:block;margin-top:12px;text-align:center;font-size:.9rem;color:var(--royal)}

/* a11y modes */
html.a11y-contrast body{background:#000!important;color:#fff!important}
html.a11y-contrast :is(section,header,footer,.pillar,.trust-card,.contact-form,.site-header.scrolled){background:#000!important;color:#fff!important;box-shadow:none!important}
html.a11y-contrast :is(h1,h2,h3,h4,p,li,span,label,summary,strong,small,figcaption,blockquote p,.section-title .muted,.muted){color:#fff!important;-webkit-text-stroke:0!important}
html.a11y-contrast :is(a,button:not(.a11y-toggle)){color:#FFE600!important}
html.a11y-contrast :is(input,select,textarea){background:#000!important;color:#fff!important;border-color:#fff!important}
html.a11y-contrast .hero-bg,html.a11y-contrast .contact-bg,html.a11y-contrast .grain{display:none}
html.a11y-contrast .a11y-panel{background:#000;border:2px solid #fff}
html.a11y-contrast .btn{border:2px solid #FFE600!important;background:#000!important}
html.a11y-contrast .btn::before,html.a11y-contrast .btn::after{display:none}
html.a11y-contrast .bridge-text .w{opacity:1}
html.a11y-mono{filter:grayscale(1)}
html.a11y-links a{text-decoration:underline!important;text-underline-offset:3px;outline:1px dashed currentColor;outline-offset:2px}
html.a11y-readable body,html.a11y-readable :is(h1,h2,h3,h4,.section-title,.hero-title,.bridge-title,.bridge-text,.contact-title,.pillar-title,.step h3,.quote blockquote p,.form-title,.about-sign,.values strong){font-family:Arial,"Segoe UI",sans-serif!important;letter-spacing:0!important}
html.a11y-cursor,html.a11y-cursor *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 10-7 1.5 4 8-3 1.5-4-8L4 20z' fill='%23000' stroke='%23fff' stroke-width='1.3'/%3E%3C/svg%3E") 4 2,auto!important}

/* reveal */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out)}
.btn.reveal{transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out),--r .6s var(--ease-out),color .4s var(--ease),border-color .4s var(--ease)}
.reveal.in{opacity:1;transform:none}
.steps .step:nth-child(2){transition-delay:.1s}.steps .step:nth-child(3){transition-delay:.2s}.steps .step:nth-child(4){transition-delay:.3s}
.pillars .pillar:nth-child(2){transition-delay:.12s}
/* תחומי עיסוק: המלבנים נוטים לאחור ומתרוממים קדימה עד שהם עומדים ישר, צמוד לגלילה (--flip נקבע ב-main.js) */
.expertise{overflow-x:clip}
.pillars{perspective:1600px}
.pillars .pillar.reveal,.pillars .pillar.reveal.in{--k:calc(1 - var(--flip,0));opacity:calc(.1 + .9 * var(--flip,0));transform:rotateX(calc(55deg * var(--k))) translateY(calc(70px * var(--k)));transform-origin:50% 100%;transition:none}
html.no-motion .pillars .pillar.reveal{opacity:1;transform:none}

/* ---------- motion off ---------- */
html.no-motion *,html.no-motion *::before,html.no-motion *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
html.no-motion .reveal{opacity:1;transform:none;filter:none}
html.no-motion .marquee-track{animation:none}
html.no-motion .marquee{overflow-x:auto}
html.no-motion .seal{opacity:1;transform:rotate(-10deg)}
html.no-motion .bridge{height:auto}
html.no-motion .bridge-sticky{position:relative;height:auto;padding:120px 0}
html.no-motion .method{height:auto}
html.no-motion .contact[data-tone]{background:var(--ink)}
html.no-motion .method-sticky{position:relative;height:auto;min-height:100svh}
html.no-motion .bridge-title .side{transform:none}
html.no-motion .bl{transform:none}
html.no-motion .bridge-knot{transform:none}
html.no-motion .bridge-text .w{opacity:1}
html.no-motion .portrait{transform:none}
html.a11y-contrast .pattern{display:none}
html.no-motion .steps-rail span{transform:none}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .main-nav ul{gap:18px}
  .header-phone span{display:none}
}
@media (max-width:960px){
  :root{--header-h:72px}
  .brand{width:140px}
  .nav-toggle{display:block}
  .header-actions .btn-small{display:none}
  .header-phone{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);justify-content:center}
  .site-header.scrolled .header-phone{border-color:var(--line-light)}
  .main-nav{position:fixed;inset:0;z-index:-1;background:var(--ink);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
  .main-nav.open{opacity:1;visibility:visible}
  .main-nav ul{flex-direction:column;align-items:center;gap:22px}
  .main-nav a,.site-header.scrolled .main-nav a{font-family:var(--f-head);font-size:2.4rem;color:#fff;font-weight:400}
  .nav-cta-mobile{display:block}
  .nav-cta-mobile a{color:var(--gold-soft)!important}
  .main-nav.open li{animation:navIn .6s var(--ease-out) both}
  .main-nav.open li:nth-child(2){animation-delay:.05s}.main-nav.open li:nth-child(3){animation-delay:.1s}.main-nav.open li:nth-child(4){animation-delay:.15s}.main-nav.open li:nth-child(5){animation-delay:.2s}.main-nav.open li:nth-child(6){animation-delay:.25s}
  body.nav-open .site-header{background:transparent;box-shadow:none;backdrop-filter:none}
  body.nav-open .brand-white{opacity:1}body.nav-open .brand-color{opacity:0}
  body.nav-open .nav-toggle span{background:#fff}
  body.nav-open .header-phone{color:#fff}

  .hero-grid{align-items:start}
  .hero-copy{max-width:none;padding-bottom:0;padding-top:28px}
  .hero-visual{position:relative;left:auto;width:100%;height:auto;margin-top:28px}
  .portrait{height:auto;width:min(72%,340px);margin-inline:auto}
  .seal-wrap{left:auto!important;right:-14%;top:30%;width:clamp(96px,26vw,130px)}
  .scroll-cue{display:none}
  .hero-bg::after{background:linear-gradient(to bottom, rgba(19,18,50,.85), rgba(19,18,50,.5) 60%, var(--ink))}

  .section-head-split{grid-template-columns:1fr;gap:18px}
  .pillars{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr;row-gap:40px}
  .steps-rail{display:none}
  .step{padding-top:0;padding-right:34px;border-right:1px solid var(--line-dark)}
  .step-dot{top:6px;right:-8px}
  .about-grid,.faq-grid,.contact-grid{grid-template-columns:1fr}
  .about-visual{margin-top:40px}
  .faq .section-head{position:static;margin-bottom:30px}
  .contact-copy{position:static}
  .bridge-title .side{display:block}
  .bridge-title .side-a{transform:translateX(calc(var(--split,1) * 30vw))}
  .bridge-title .side-b{transform:translateX(calc(var(--split,1) * -30vw))}
}
@media (max-width:640px){
  body{font-size:1rem;padding-bottom:70px}
  .hero-title{font-size:clamp(3.1rem,15vw,4.6rem)}
  .hero-ctas .btn{flex:1 1 100%}
    .hero-ctas{margin-top:1.6rem}
  .hero-ctas .btn-lg{padding:.9em 1.4em}
  .marquee-list img{height:40px}.marquee-list img.tall{height:60px}.marquee-list img.wide{height:30px}
  .steps{grid-template-columns:1fr}
  .values{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
  .footer-grid{flex-direction:column;align-items:flex-start}
  .footer-grid>nav{flex:none}
  .footer-links{grid-template-columns:repeat(2,auto);justify-content:start}
  .fab-wa{display:none}
  .a11y{bottom:84px;left:14px}
  .a11y-toggle{width:48px;height:48px}
  .mobile-cta{display:grid;grid-template-columns:1fr 1.6fr;gap:8px;position:fixed;z-index:92;inset:auto 0 0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(19,18,50,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transform:translateY(110%);transition:transform .5s var(--ease-out)}
  .mobile-cta.show{transform:none}
  .mobile-cta a{display:flex;align-items:center;justify-content:center;height:50px;border-radius:14px;text-decoration:none;font-weight:500}
  .mc-call{border:1px solid rgba(255,255,255,.3);color:#fff}
  .mc-main{background:var(--royal);color:#fff}
  .about-seal{right:-1%}
}
@keyframes navIn{from{opacity:0;transform:translateY(24px)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* =========================================================
   Service pages (agreements.html hub, negotiation.html and the 8 deal pages)
   ========================================================= */
.page-hero{position:relative;background:var(--ink);color:var(--on-dark);padding:calc(var(--header-h) + clamp(48px,8vh,96px)) 0 clamp(56px,8vh,96px);overflow:hidden}
.page-hero .hero-photo-bg{opacity:.35;animation:none;transform:none}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to left,rgba(19,18,50,.95),rgba(19,18,50,.6))}
.page-hero .container{position:relative;z-index:2}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:.9rem;color:var(--on-dark-soft);margin-bottom:22px}
.crumbs a{color:var(--on-dark-soft);text-decoration:none}
.crumbs a:hover{color:#fff;text-decoration:underline}
.crumbs li+li::before{content:"‹";margin-inline-end:8px;opacity:.6}
.page-hero h1{font-family:var(--f-head);font-weight:400;font-size:clamp(3rem,7vw,6.4rem);line-height:.95;color:#fff;max-width:14ch}
.page-hero .lead{margin-top:22px;max-width:52ch;font-size:clamp(1.05rem,1.4vw,1.25rem);color:var(--on-dark-soft)}
.page-hero .btn{margin-top:30px}

.svc-page{background:var(--paper);padding:clamp(56px,8vw,110px) 0;position:relative}
.svc-layout{display:grid;grid-template-columns:260px 1fr;gap:clamp(32px,5vw,80px);align-items:start;position:relative;z-index:1}
.svc-layout.no-toc{grid-template-columns:1fr}
/* עסקאות קרובות ומה שאחריהן: בטור התוכן, בלי התפריט הצידי (התפריט נעצר בסוף השאלות) */
.svc-tail .svc-content{grid-column:2}
/* דפי שירות: טור ריק בצד שמאל בגודל התפריט, כדי שהתוכן יישב באמצע. רוחב כמו הכותרת, כך שהתפריט בקו של הלוגו */
@media (min-width:1280px){
  .page-svc .svc-layout:not(.no-toc){max-width:1780px;grid-template-columns:260px minmax(0,1fr) 260px}
}
.toc{position:sticky;top:100px;border-inline-start:2px solid var(--line-light);padding-inline-start:18px}
.toc h2{font-family:var(--f-body);font-weight:500;font-size:.9rem;color:var(--gold-deep);margin-bottom:10px}
.toc ol{display:grid;gap:4px}
.toc a{display:block;text-decoration:none;color:var(--text-soft);padding:5px 0;transition:color .3s}
.toc a:hover,.toc a[aria-current]{color:var(--royal)}
.toc a[aria-current]{font-weight:500}

.tldr{background:#fff;border-radius:var(--radius);padding:clamp(22px,3vw,36px);box-shadow:0 0 0 1px var(--line-light),0 30px 60px -44px rgba(28,27,69,.4);margin-bottom:clamp(40px,6vw,72px);border-inline-start:4px solid var(--royal)}
.tldr h2{font-family:var(--f-body);font-weight:500;font-size:.95rem;color:var(--royal);margin-bottom:8px}
.tldr p{font-size:1.12rem;color:var(--navy)}

.svc{padding-bottom:clamp(40px,5vw,64px);margin-bottom:clamp(40px,5vw,64px);border-bottom:1px solid var(--line-light);scroll-margin-top:110px}
.svc:last-of-type{border-bottom:0}
.svc .num{font-family:var(--f-head);color:var(--gold-deep);font-size:1.3rem}
.svc h2{font-family:var(--f-head);font-weight:400;font-size:clamp(2.2rem,4vw,3.4rem);line-height:1;color:var(--navy);margin:.15em 0 .45em}
.svc p{color:var(--text-soft);font-size:1.08rem;max-width:66ch}
.svc p+p{margin-top:12px}
.svc h3{font-family:var(--f-body);font-weight:500;font-size:1.12rem;color:var(--navy);margin:26px 0 10px}
.svc ul.points{display:grid;gap:10px;max-width:66ch}
.svc ul.points li{position:relative;padding-inline-start:30px;color:var(--text-soft);font-size:1.04rem}
.svc ul.points li::before{content:"";position:absolute;inset-inline-start:0;top:.3em;top:calc(.5lh - 11px * 99.5 / 266);width:22px;aspect-ratio:266/99.5;background:url(assets/icons/swoosh-navy.svg) center/contain no-repeat} /* הפאביקון - ה-O הפתוח בכחול כהה */
.svc ul.points strong{color:var(--navy)}
/* centred sections: text in the middle, each point starts with its swoosh right before the label */
.svc-center{text-align:center}
.svc-center>p,.svc-center ul.points{margin-inline:auto}
.svc-center ul.points li{padding-inline-start:0}
.svc-center ul.points li::before{position:static;display:inline-block;vertical-align:middle;margin-inline-end:8px;translate:0 -.1em}
/* לשוניות אנכיות (הסכמי הפצה: מה לסגור לפני בלעדיות) - הצד הימני בגוון מעט בהיר מהרקע, הפאנל בכחול כהה */
.ex-tabs{display:grid;grid-template-columns:minmax(220px,36%) 1fr;border-radius:var(--radius);overflow:hidden;background:var(--navy);margin-top:8px}
.ex-tabs [role=tablist]{display:flex;flex-direction:column;background:#FAF9F6;border:1px solid var(--line-light);border-inline-end:0;border-start-start-radius:var(--radius);border-end-start-radius:var(--radius)}
.ex-tabs [role=tab]{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:14px;padding:17px 22px;cursor:pointer;color:var(--navy);font-weight:500;font-size:1.06rem;border-bottom:1px solid var(--line-light);transition:background-color .25s,color .25s}
.ex-tabs [role=tab]:last-child{border-bottom:0}
.ex-tabs [role=tab] .n{font-family:var(--f-head);font-size:1.3rem;color:var(--royal);width:1.6em;flex:none}
.ex-tabs [role=tab]:hover{background:var(--paper-2)}
.ex-tabs [role=tab][aria-selected=true]{background:var(--navy);color:#fff}
.ex-tabs [role=tab][aria-selected=true] .n{color:var(--royal-soft)}
.ex-tabs [role=tab]:focus-visible{outline:3px solid var(--royal);outline-offset:-3px}
.ex-panels{display:grid}
.ex-tabs [role=tabpanel]{padding:clamp(28px,4vw,52px);color:#fff;display:flex;flex-direction:column;justify-content:center;gap:16px;min-height:340px}
.ex-tabs [role=tabpanel][hidden]{display:none}
.ex-tabs [role=tabpanel]:focus-visible{outline:3px solid var(--royal-soft);outline-offset:-6px}
.ex-tabs .k{font-size:.9rem;letter-spacing:.06em;color:var(--royal-soft);font-weight:500}
.svc .ex-tabs h3{font-family:var(--f-head);font-weight:400;font-size:clamp(2.2rem,4vw,3.6rem);line-height:1;color:#fff;margin:0}
.svc .ex-tabs p{color:var(--on-dark);font-size:1.12rem;max-width:44ch}
.ex-tabs [role=tabpanel] h3,.ex-tabs [role=tabpanel] p{animation:ex-in .5s var(--ease-out)}
@keyframes ex-in{from{opacity:0;transform:translateY(10px)}}
@media (prefers-reduced-motion:reduce){.ex-tabs [role=tabpanel] h3,.ex-tabs [role=tabpanel] p{animation:none}}
@media (max-width:760px){.ex-tabs{grid-template-columns:1fr}.ex-tabs [role=tablist]{border-inline-end:1px solid var(--line-light);border-radius:var(--radius) var(--radius) 0 0}.ex-tabs [role=tabpanel]{min-height:0}}
.svc .note{margin-top:20px;padding:16px 20px;background:rgba(49,87,190,.07);border-radius:14px;color:var(--navy);font-size:1rem;max-width:66ch}
/* stage stack (business sale): white sheets that stick and pile up while scrolling. Each margin is set so all sheets let go together once sheet 5 lands */
.stage-stack{--step:16px;--hold:22vh;display:flow-root;margin-top:clamp(26px,3vw,40px)} /* flow-root keeps the last margin inside, so sheet 5 lands before the pile lets go */
.stage-stack li{position:sticky;top:calc(var(--header-h) + 18px + var(--i)*var(--step));margin-bottom:calc(var(--hold) + (4 - var(--i))*var(--step));min-height:280px;display:grid;grid-template-columns:auto fit-content(58ch);justify-content:center;align-content:center;gap:clamp(18px,3vw,44px);align-items:start;padding:clamp(36px,5vw,68px) clamp(24px,3.6vw,46px);background:#fff;border:1px solid var(--line-light);border-radius:6px;box-shadow:0 22px 44px -32px rgba(28,27,69,.55);transform-origin:50% 0;transform:scale(var(--s,1))}
.stage-stack .n{font-family:var(--f-head);font-size:clamp(4rem,8vw,6.6rem);line-height:.78;color:transparent;-webkit-text-stroke:1.5px var(--navy)}
.stage-stack .k{display:block;font-size:.88rem;letter-spacing:.06em;color:var(--royal);font-weight:500;margin-bottom:6px}
.svc .stage-stack h3{font-family:var(--f-head);font-weight:400;font-size:clamp(1.9rem,3.2vw,2.6rem);line-height:1;color:var(--navy);margin:0 0 .35em}
.svc .stage-stack p{color:var(--text-soft);max-width:none}
@media (max-width:640px){.stage-stack{--step:12px;--hold:18vh}.stage-stack li{grid-template-columns:minmax(0,1fr);gap:8px;min-height:340px}}
.no-motion .stage-stack li{transform:none}
.svc .stage-stack+.note{margin-top:calc(28px - 22vh);background:none;padding:0;border-radius:0} /* pulled up into the space the pile keeps for itself, so it reads as part of the stages */
@media (max-width:640px){.svc .stage-stack+.note{margin-top:calc(24px - 18vh)}}
/* on a tall enough desktop screen the whole area (title, text, sheets and the last line) stops on screen; the sheets rise into the pile while the empty run under it scrolls, then everything leaves together */
.stack-run{display:none}
.stack-stage.is-pin{position:sticky}
.stack-stage.is-pin+.stack-run{display:block;height:240vh}
.stack-stage.is-pin .stage-stack{display:grid;padding-bottom:calc(4*var(--step))}
.stack-stage.is-pin .stage-stack li{grid-area:1/1;position:relative;top:auto;margin:0;min-height:0;padding-block:clamp(28px,3.4vw,48px);transform:translateY(calc(var(--i)*var(--step) + var(--y,0px))) scale(var(--s,1));will-change:transform}
.svc .stack-stage.is-pin .stage-stack+.note{margin-top:24px;opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-out),transform .6s var(--ease-out)} /* the last line shows up once sheet 5 has landed */
.svc .stack-stage.is-pin .stage-stack+.note.on{opacity:1;transform:none}
.svc .stack-stage.is-tight h2{font-size:clamp(2.6rem,9vh,6rem)!important;margin-bottom:.4em}
.stack-stage.is-tight .stage-stack{margin-top:24px}
.stack-stage.is-tight .stage-stack li{padding-block:22px}
.stack-stage.is-tight .stage-stack .n{font-size:clamp(3.4rem,8vh,5rem)}
/* buying a business: a checklist; a blue pen ticks each box as its row comes in */
.checklist{display:grid;margin-top:clamp(26px,3vw,40px)}
.checklist li{display:grid;grid-template-columns:40px minmax(0,12em) minmax(0,1fr);gap:clamp(14px,2.4vw,30px);align-items:baseline;padding-block:clamp(18px,2.4vw,26px)}
.checklist li+li{border-top:1px solid var(--line-light)}
.checklist .box{position:relative;align-self:start;width:30px;height:30px;border:1.5px solid var(--navy);border-radius:4px;margin-top:2px}
.checklist .box svg{position:absolute;inset:-8px -6px -2px -2px;width:40px;height:40px;overflow:visible}
.checklist .box path{fill:none;stroke:var(--royal);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.checklist li.in .box path{transition:stroke-dashoffset .45s cubic-bezier(.6,.1,.3,1) .45s;stroke-dashoffset:0}
html.no-motion .checklist .box path,html.ro-edit .checklist .box path{stroke-dashoffset:0}
.svc .checklist h3{font-family:var(--f-head);font-weight:400;font-size:1.7vw;line-height:1.05;color:var(--navy);margin:0}
.svc .checklist p{margin:0;max-width:none}
.svc p.check-tail{margin-top:clamp(22px,3vw,34px);color:var(--navy);padding-inline-start:calc(40px + clamp(14px,2.4vw,30px));max-width:none}
.check-tail b{font-weight:500;background:linear-gradient(transparent 62%,rgba(134,166,245,.45) 62%)}
@media (max-width:960px){.svc .checklist h3{font-size:var(--fs-h3)}}
@media (max-width:700px){.checklist li{grid-template-columns:34px minmax(0,1fr);row-gap:6px}.checklist li p{grid-column:2}.svc p.check-tail{padding:0}}
/* selling a business: the preparation box stays put on the side while the 4 decisions scroll past it */
.sell-split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,60px);align-items:start;margin-top:clamp(26px,3vw,40px)}
.sell-side{position:sticky;top:calc(var(--header-h) + 24px)}
.sell-prep{background:var(--logo-navy);border-radius:14px;padding:clamp(22px,2.6vw,34px)}
.svc .sell-prep h3{font-family:var(--f-head);font-weight:400;font-size:1.7vw;line-height:1.05;color:#fff;margin:0 0 .45em}
.svc .sell-prep p{color:var(--on-dark-soft);margin:0}
.sell-list li{padding-block:clamp(26px,5vh,52px);border-top:1px solid var(--line-light)}
.sell-list li:first-child{border-top:0;padding-top:0}
.sell-list small{display:block;font-size:var(--fs-small);letter-spacing:.04em;color:var(--royal);font-weight:500;margin-bottom:8px}
.svc .sell-list h3{font-family:var(--f-head);font-weight:400;font-size:1.7vw;line-height:1.05;color:var(--navy);margin:0 0 .4em}
.svc .sell-list p{margin:0}
/* desktop: the title stays at the top and the decisions slide under it; margins set by main.js make everything let go together when the last decision is in view */
@media (min-width:961px){
  .sell-head{position:sticky;top:var(--header-h);z-index:3;padding-block:12px 14px;margin-bottom:var(--hm,0px)}
  /* once stuck, the big title fades out and a one-line copy, a little bigger than the small titles, fades in.
     the paper behind it runs up under the header too, so nothing shows above it */
  .sell-head h2{transition:opacity .35s var(--ease-out)}
  .sell-pin.is-stuck .sell-head h2{opacity:0}
  .svc .sell-head .sell-mini{display:block;position:absolute;inset-inline:0;top:12px;margin:0;max-width:none;text-align:center;font-family:var(--f-head);font-size:calc(1.7vw * 1.3);line-height:1.05;color:var(--navy);opacity:0;transition:opacity .35s var(--ease-out);pointer-events:none}
  .sell-pin.is-stuck .sell-head .sell-mini{opacity:1}
  .sell-head::before,.sell-head::after{content:"";position:absolute;inset-inline:0;pointer-events:none;opacity:0;transition:opacity .3s}
  .sell-head::before{top:calc(var(--header-h) * -1);height:calc(var(--hs,100%) + var(--header-h));background:var(--paper);z-index:-1}
  .sell-head::after{top:var(--hs,100%);height:28px;background:linear-gradient(var(--paper),rgba(245,243,238,0))}
  .sell-pin.is-stuck .sell-head::before,.sell-pin.is-stuck .sell-head::after{opacity:1}
  .sell-head+.sell-split{margin-top:calc(clamp(10px,1.5vw,24px) - var(--hm,0px))}
  .sell-side{top:var(--st,calc(var(--header-h) + 24px));margin-bottom:var(--sm,0px)}
}
.sell-mini{display:none}
@media (max-width:960px){.sell-split{grid-template-columns:minmax(0,1fr)}.sell-side{position:static;order:2}.svc .sell-prep h3,.svc .sell-list h3{font-size:var(--fs-h3)}}

.svc-faq{margin-top:clamp(20px,4vw,40px)}
.svc-faq>h2{font-family:var(--f-head);font-weight:400;font-size:clamp(2.2rem,4vw,3.4rem);color:var(--navy);margin-bottom:18px}
.svc-faq details{border-bottom:1px solid var(--line-light)}
.svc-faq details:first-of-type{border-top:1px solid var(--line-light)}
.svc-faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;cursor:pointer;font-weight:500;font-size:1.12rem;color:var(--navy)}
.svc-faq summary::-webkit-details-marker{display:none}
.svc-faq .faq-a{padding:0 0 22px}

.other-area{margin-top:clamp(40px,6vw,72px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;background:var(--navy);color:var(--on-dark);border-radius:var(--radius);padding:clamp(24px,3vw,40px)}
.other-area p{font-family:var(--f-head);font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.1;color:#fff}
.other-area small{display:block;font-family:var(--f-body);font-size:.95rem;color:var(--on-dark-soft);margin-top:6px}

/* deal cards: the agreements hub and "related deals" on each service page */
.deal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.8vw,22px);margin-top:26px}
.deal-card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:18px;padding:clamp(20px,2.4vw,28px);box-shadow:0 0 0 1px var(--line-light),0 24px 50px -40px rgba(28,27,69,.45);transition:transform .45s var(--ease-out),box-shadow .45s var(--ease-out)}
.deal-card::before{content:"";position:absolute;top:0;right:24px;left:24px;height:2px;background:var(--royal);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease-out)}
.deal-card:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--line-light),0 30px 60px -36px rgba(28,27,69,.55)}
.deal-card:hover::before{transform:scaleX(1)}
.deal-num{font-family:var(--f-head);color:var(--gold-deep);font-size:1.15rem}
.svc .deal-card h3,.related .deal-card h3{font-family:var(--f-body);font-weight:500;font-size:1.16rem;color:var(--navy);margin:4px 0 6px}
.svc .deal-card p,.related .deal-card p{font-size:.98rem;color:var(--text-soft)}
.deal-more{margin-top:auto;padding-top:14px;font-size:.92rem;font-weight:500;color:var(--royal)}
.deal-card a.stretch{color:inherit;text-decoration:none}
.deal-card a.stretch::after{content:"";position:absolute;inset:0;border-radius:inherit}
.deal-card a.stretch:focus-visible{outline:none}
.deal-card:has(a.stretch:focus-visible){outline:3px solid var(--royal-2);outline-offset:4px}
.related{margin-top:clamp(40px,6vw,72px)}
.related>h2{font-family:var(--f-head);font-weight:400;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1;color:var(--navy)}
.related .deal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
/* related cards carry the linked page's hero photo under a navy veil */
.related .deal-card[style*="--img"]{overflow:hidden;isolation:isolate;min-height:230px;background:var(--navy) var(--img) center/cover no-repeat;box-shadow:0 24px 50px -36px rgba(28,27,69,.6)}
.related .deal-card[style*="--img"]::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(19,18,50,.94) 20%,rgba(28,27,69,.74) 60%,rgba(28,27,69,.64));transition:background .5s var(--ease-out)}
.related .deal-card[style*="--img"]:hover::after{background:linear-gradient(to bottom,rgba(19,18,50,.92) 20%,rgba(28,27,69,.64) 60%,rgba(28,27,69,.52))}
.related .deal-card[style*="--img"]::before{background:var(--gold);z-index:1}
.related .deal-card[style*="--img"] h3{color:#fff}
.related .deal-card[style*="--img"] p{color:rgba(255,255,255,.86)}
.related .deal-card[style*="--img"] .deal-more{color:#fff;text-shadow:0 1px 8px rgba(19,18,50,.9)}
html.a11y-contrast .related .deal-card[style*="--img"]::after{background:#000}
html.a11y-contrast .deal-card{background:#000!important;color:#fff!important;box-shadow:0 0 0 1px #fff!important}
html.a11y-contrast .deal-card :is(h3,p,.deal-more,.deal-num){color:#fff!important}
@media (max-width:700px){
  .deal-grid,.related .deal-grid{grid-template-columns:1fr}
}

/* service rows on the home page link to their section */
.services li a.stretch{color:inherit;text-decoration:none}
.services li a.stretch::before{content:"";position:absolute;inset:0}
.services li a.stretch:focus-visible{outline:none}
.services li:has(a.stretch:focus-visible){outline:3px solid var(--royal-2);outline-offset:4px;border-radius:6px}
.pillar-more{display:inline-block;margin-top:14px;font-size:.95rem;color:var(--text-soft)}
.pillar-dark .pillar-more{color:var(--on-dark-soft)}

@media (max-width:960px){
  .svc-layout{grid-template-columns:1fr}
  .svc-tail .svc-content{grid-column:auto}
  .toc{position:static;border:0;padding:0;margin-bottom:8px}
  .toc ol{display:flex;flex-wrap:wrap;gap:8px}
  .toc a{padding:6px 12px;border:1px solid var(--line-light);border-radius:999px;font-size:.92rem;background:#fff}
}

/* ================= גדלי טקסט קבועים (15.10.2026) =================
   שש רמות לכל האתר. מובייל (עד 960px): גודל קבוע. מחשב: גדל עם רוחב המסך (vw) ונעצר בגודל של מסך 1500px.
   הגדלים ב-rem כדי שהגדלת הטקסט בתפריט הנגישות תמשיך לעבוד (1rem = 16px). */
:root{
  --fs-h1:3rem;        /* כותרת ראשית: 48px */
  --fs-h2:2.25rem;     /* כותרת אזור: 36px */
  --fs-h3:1.5rem;      /* כותרת משנה: 24px */
  --fs-btn:1.25rem;    /* כפתורים ותפריט: 20px */
  --fs-body:1.125rem;  /* טקסט רץ: 18px */
  --fs-small:1rem;     /* הערות ותיאורים: 16px */
}
@media (min-width:961px){
  :root{
    /* דינמי: vw, בין מינימום למקסימום (בפיקסלים: 1rem = 16px) */
    --fs-h1:clamp(3rem,8vw,7.5rem);          /* 8vw, 48-120px */
    --fs-h2:clamp(2.25rem,7vw,6.3125rem);    /* 7vw, 36-101px */
    --fs-h3:clamp(1.125rem,2vw,1.875rem);    /* 2vw, 18-30px */
    --fs-btn:clamp(.875rem,1.3vw,1.25rem);   /* 1.3vw, 14-20px */
    --fs-body:clamp(.875rem,.9vw,1.25rem);   /* 0.9vw, 14-20px */
    --fs-small:clamp(.8125rem,.8vw,1rem);    /* 0.8vw, 13-16px */
  }
}
.hero-title,.page-hero h1{font-size:var(--fs-h1)}
.section-title,.clients-title,.bridge-title,.contact-title,.svc h2,.svc-faq>h2,.related>h2{font-size:var(--fs-h2)}
.hero-sub,.pillar-title,.step h3,.trust-card h3,.form-title,.other-area p,.services h4,.svc h3,.svc .deal-card h3,.related .deal-card h3{font-size:var(--fs-h3)}
.btn,.btn-lg,.btn-small,.main-nav a,.header-phone{font-size:var(--fs-btn)}
body,.hero-lead,.section-sub,.services p,.step p,.about-text,.trust-card p,.faq-list summary,.faq-a,.contact-lead,.contact-ways a>span:last-child,
.field input,.field select,.field textarea,.page-hero .lead,.tldr p,.svc p,.svc ul.points li,.svc .note,.svc-faq summary,
.svc .deal-card p,.related .deal-card p,.footer-links a{font-size:var(--fs-body)}
@media (min-width:961px){
  /* מרווח שורות בטקסט הרץ במחשב */
  body,.hero-lead,.section-sub,.services p,.step p,.about-text,.trust-card p,.faq-list summary,.faq-a,.contact-lead,.contact-ways a>span:last-child,
  .field input,.field select,.field textarea,.page-hero .lead,.tldr p,.svc p,.svc ul.points li,.svc .note,.svc-faq summary,
  .svc .deal-card p,.related .deal-card p,.footer-links a,.doc-body p,.doc-body li{line-height:1.3}
}
.eyebrow,.crumbs,.form-note,.field label,.err,.contact-ways small,.other-area small,.footer-bottom,.toc h2,.tldr h2,.toc a,
.deal-more,.values span{font-size:var(--fs-small)}
/* תחומי עיסוק: הקישורים לדפים הפנימיים בגודל טקסט רץ, משקל מדיום */
.pillar-more{font-size:var(--fs-body);font-weight:500}
@media (max-width:960px){
  /* התפריט הנפתח במובייל נשאר בגודל הגדול שלו */
  .main-nav a,.site-header.scrolled .main-nav a{font-size:2.4rem}
}

/* ---------- intro: logo animation on entry (once per visit) ---------- */
.intro{display:none}
html.intro-on .intro{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding-inline:16px;background:var(--paper);animation:introUp .8s 2.5s cubic-bezier(.7,0,.2,1) forwards}
html.intro-on .intro.is-leaving{animation:introUp .7s cubic-bezier(.7,0,.2,1) forwards}
.intro-logo{width:min(80vw,560px);height:auto;overflow:visible}
.intro-logo g{transform-box:fill-box}
.intro-logo .i-r path{stroke:#202042;stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;fill-opacity:0;animation:introDraw 1.3s cubic-bezier(.5,0,.3,1) forwards,introFill .5s 1.15s forwards}
.intro-logo .i-swoosh{animation:introWipe .9s .35s var(--ease-out) both}
.intro-logo .i-name path{transform-box:fill-box;animation:introRise .55s calc(1.2s + var(--i)*45ms) var(--ease-out) both}
.intro-logo .i-sub{animation:introFade .6s 1.8s both}
.intro-skip{position:absolute;inset-block-end:24px;inset-inline-start:24px;border:1.5px solid var(--text-soft);background:transparent;color:var(--text);border-radius:999px;padding:.45em 1.2em;font:500 .95rem var(--f-body);cursor:pointer}
.intro-skip:hover{background:var(--royal);border-color:var(--royal);color:#fff}
.intro-skip:focus-visible{outline:3px solid var(--royal);outline-offset:3px}
@keyframes introUp{to{transform:translateY(-100%);visibility:hidden}}
@keyframes introDraw{to{stroke-dashoffset:0}}
@keyframes introFill{to{fill-opacity:1;stroke-opacity:0}}
@keyframes introWipe{from{clip-path:inset(-10% 0 -10% 100%)}to{clip-path:inset(-10% 0 -10% 0)}}
@keyframes introRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes introFade{from{opacity:0}to{opacity:1}}
html.no-motion .intro{display:none!important}

/* ---------- תפריט נגלל: עסקאות וחוזים ---------- */
.main-nav .has-sub{position:relative;display:flex;align-items:center;gap:2px}
.sub-toggle{display:grid;place-items:center;width:24px;height:24px;padding:0;border:0;background:transparent;color:var(--on-dark);cursor:pointer;transition:color .3s}
.sub-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease)}
.site-header.scrolled .sub-toggle{color:var(--navy)}
.has-sub.open .sub-toggle svg{transform:rotate(180deg)}
.main-nav .sub-menu{position:absolute;top:100%;inset-inline-start:-18px;display:block;min-width:280px;margin:0;padding:10px;list-style:none;background:var(--paper);border-radius:16px;box-shadow:0 18px 40px -12px rgba(19,18,50,.35),0 0 0 1px var(--line-light);opacity:0;visibility:hidden;translate:0 8px;transition:opacity .3s var(--ease),translate .3s var(--ease),visibility .3s}
/* גשר שקוף בין הקישור לתפריט, כדי שהעכבר לא "ייפול" בדרך */
.main-nav .sub-menu::before{content:"";position:absolute;inset:-14px 0 auto;height:14px}
.has-sub.open .sub-menu{opacity:1;visibility:visible;translate:0 0}
@media (hover:hover) and (min-width:961px){
  .has-sub:not(.hover-off):hover .sub-menu{opacity:1;visibility:visible;translate:0 0}
  .has-sub:not(.hover-off):hover .sub-toggle svg{transform:rotate(180deg)}
}
.main-nav .sub-menu a{display:block;padding:10px 14px;border-radius:10px;color:var(--navy);font-size:.95rem;white-space:nowrap;transition:background-color .25s,color .25s}
.main-nav .sub-menu a::after{display:none}
.main-nav .sub-menu a:hover,.main-nav .sub-menu a:focus-visible{background:var(--paper-2);color:var(--royal)}
.main-nav .sub-menu a[aria-current="page"]{background:var(--paper-2);color:var(--royal)}
html.a11y-contrast .main-nav .sub-menu{background:#000!important;box-shadow:0 0 0 2px #fff!important}

@media (max-width:960px){
  .main-nav{overflow-y:auto;padding-block:calc(var(--header-h) + 16px) 40px}
  .main-nav>ul{margin:auto}
  .main-nav .has-sub{flex-wrap:wrap;justify-content:center;gap:6px}
  .sub-toggle,.site-header.scrolled .sub-toggle{width:44px;height:44px;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:50%}
  .sub-toggle svg{width:20px;height:20px}
  .main-nav .sub-menu{position:static;flex-basis:100%;display:none;min-width:0;padding:8px 0 0;background:transparent;box-shadow:none;opacity:1;visibility:visible;translate:none;transition:none}
  .main-nav .sub-menu::before{display:none}
  .has-sub.open .sub-menu{display:flex;flex-direction:column;align-items:center;gap:2px}
  .site-header .main-nav .sub-menu a,.site-header.scrolled .main-nav .sub-menu a{font-family:var(--f-body);font-size:1.15rem;font-weight:300;color:var(--on-dark-soft);padding:8px 14px;white-space:normal;text-align:center}
  .site-header .main-nav .sub-menu a:hover,.site-header .main-nav .sub-menu a[aria-current="page"]{background:transparent;color:var(--gold-soft)}
}

/* ---------- באנר עם תמונה (עסקאות וחוזים): שכבה כחולה כהה כדי שהטקסט והכפתור יבלטו ---------- */
.page-hero-photo .hero-photo-bg{inset:0;opacity:1;background-position:center 60%}
.page-hero-photo::after{background:linear-gradient(to left,rgba(19,18,50,.94) 0%,rgba(19,18,50,.86) 45%,rgba(28,27,69,.68) 100%)}
@media (max-width:960px){
  .page-hero-photo::after{background:rgba(19,18,50,.88)}
}

/* ---------- "בקצרה" כפס לבן מתחת לבאנר (עסקאות וחוזים) ---------- */
.tldr.tldr-strip{background:#fff;border-radius:0;box-shadow:none;border:0;border-block-end:1px solid var(--line-light);padding:0;margin:0}
.tldr-strip .container{padding-block:22px}
.tldr-strip p{color:var(--text-soft)}
.tldr-strip b{font-weight:500;color:var(--navy)}

/* ---------- page reveal: every page load except the home-page intro (top to bottom) ---------- */
html.page-in::after{content:"";position:fixed;inset:0;z-index:10000;background:var(--ink);pointer-events:none;animation:pageReveal .75s .05s cubic-bezier(.7,0,.2,1) forwards}
@keyframes pageReveal{to{transform:translateY(100%);visibility:hidden}}
html.no-motion.page-in::after{display:none}

/* ---------- כל דפי השירות: יותר אוויר בין האזורים (כמו בעסקאות וחוזים) ---------- */
.page-svc .svc-page{padding-block:clamp(72px,10vw,140px)}
.page-svc .svc{padding-bottom:clamp(64px,8vw,112px);margin-bottom:clamp(64px,8vw,112px)}
.page-svc .svc h2,.page-svc .svc-faq>h2,.page-svc .related>h2{margin-block:0 .6em}
.page-svc .svc .deal-grid{margin-top:clamp(36px,4vw,52px)}
.page-svc .svc-faq{margin-top:0}
.page-svc .svc-faq>h2{margin-bottom:clamp(28px,3vw,40px)}
.page-svc .related{margin-top:clamp(64px,8vw,112px)}
.page-svc .other-area{margin-top:clamp(72px,9vw,120px)}
/* התפריט הצידי נצמד באותו גובה שבו נעצרת כותרת האזור אחרי לחיצה (וגם הקו שמסמן את האזור הפעיל ב-main.js נמצא ב-30%) */
.page-svc{--toc-line:30vh}
.page-svc .toc{top:var(--toc-line)}
.page-svc .svc-content>[id]{scroll-margin-top:calc(var(--toc-line) - var(--header-h) - 12px)} /* פחות ה-scroll-padding של html */

/* ---------- 8 סוגי עסקאות: הכרטיסים מתהפכים פנימה כשהם נכנסים למסך ---------- */
.flip-ready{perspective:1200px}
.flip-ready .deal-card{transform-origin:top center}
.flip-ready .deal-card:not(.flip-in){opacity:0;transform:rotateX(-75deg)}
.flip-ready .deal-card.flip-in{animation:dealFlip .9s var(--d,0ms) cubic-bezier(.2,.8,.2,1.15) backwards}
@keyframes dealFlip{from{opacity:0;transform:rotateX(-75deg)}60%{opacity:1}to{opacity:1;transform:none}}
html.no-motion .flip-ready .deal-card{opacity:1!important;transform:none!important;animation:none!important}
/* מלבן שמתהפך אחרי הכרטיסים (data-flip-follow) */
.flip-ready[data-flip-follow]{transform-origin:top center}
.flip-ready[data-flip-follow]:not(.flip-in){opacity:0;transform:perspective(1200px) rotateX(-75deg)}
.flip-ready[data-flip-follow].flip-in{animation:followFlip .9s var(--d,0ms) cubic-bezier(.2,.8,.2,1.15) backwards}
@keyframes followFlip{from{opacity:0;transform:perspective(1200px) rotateX(-75deg)}60%{opacity:1}to{opacity:1;transform:none}}
html.no-motion .flip-ready[data-flip-follow]{opacity:1!important;transform:none!important;animation:none!important}

/* ---------- כרטיסים חלולים עם קו מתאר בכחול הכהה של הלוגו (חוזים: הסעיפים שקובעים את הכסף) ---------- */
.deal-navy .deal-card{background:#FBFAF7;box-shadow:inset 0 0 0 1px transparent,0 18px 34px -24px rgba(32,32,66,.38)}
.deal-navy .deal-card:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 1px var(--logo-navy),0 30px 50px -26px rgba(32,32,66,.5)}
.deal-navy .deal-card::before{display:none}
.deal-navy .deal-num{color:var(--logo-navy)}
.svc .deal-navy .deal-card h3{color:var(--logo-navy)}
/* מלבן "סעיף חסר": כחול כהה, טקסט לבן, המשפט הראשון בגודל כותרות הכרטיסים */
.svc .note.note-navy{max-width:none;background:var(--logo-navy);color:#fff;padding:clamp(22px,3vw,32px) clamp(22px,3vw,36px);margin-top:clamp(20px,2vw,28px)}
.svc .note.note-navy .note-lead{display:block;font-weight:500;font-size:var(--fs-h3);line-height:1.3;color:#fff;margin-bottom:8px}

/* ---------- כל דפי השירות: ריווח בין האזורים כמו בעסקאות וחוזים (בלי קו מפריד, רווח פתוח גדול) ---------- */
.page-svc:not(.page-agreements) .svc{border-bottom:0;padding-bottom:0;margin-bottom:clamp(120px,17vw,260px)}
.page-svc:not(.page-agreements) .related{margin-top:clamp(120px,17vw,260px)}

/* ---------- עסקאות וחוזים: המספרים בכחול הכהה של הלוגו ---------- */
.page-agreements .deal-num,.page-agreements .svc .num{color:var(--logo-navy)}

/* ---------- כותרות: המילים עולות מאחורי קו כשהכותרת נכנסת למסך ---------- */
.rise-word{display:inline-block;overflow:hidden;vertical-align:top;padding-block:.1em;margin-block:-.1em}
.rise-word>span{display:inline-block;transform:translateY(110%)}
.rise-in .rise-word>span{animation:wordRise .8s calc(var(--i)*90ms) var(--ease-out) forwards}
@keyframes wordRise{to{transform:none}}
html.no-motion .rise-word>span{transform:none!important;animation:none!important}

/* ---------- עסקאות וחוזים: 8 סוגי עסקאות כגלריית אקורדיון (רקע: התמונה מהבאנר של כל דף) ---------- */.acc{display:flex;gap:10px;height:clamp(420px,52vh,520px);margin-top:clamp(36px,4vw,52px)}
.acc-item{position:relative;flex:1 1 0;min-width:0;border-radius:18px;overflow:hidden;background:var(--navy) var(--img) center/cover no-repeat;cursor:pointer;transition:flex-grow .7s var(--ease-out),box-shadow .4s}
.acc-item.is-open{flex-grow:5;cursor:default}
.acc-item::before{content:"";position:absolute;inset:0;background:rgba(28,27,69,.82);transition:background .6s}
.acc-item.is-open::before{background:linear-gradient(to top,rgba(19,18,50,.96) 22%,rgba(28,27,69,.55) 70%,rgba(28,27,69,.35))}
.acc-item:not(.is-open):hover::before{background:rgba(28,27,69,.7)}
.acc-num{position:absolute;z-index:1;inset-block-start:20px;inset-inline-start:0;inset-inline-end:0;text-align:center;font-family:var(--f-head);color:var(--gold-soft);font-size:1.3rem;transition:inset-inline-start .5s,text-align .5s}
.acc-item.is-open .acc-num{text-align:start;inset-inline-start:28px}
.acc-vert{position:absolute;z-index:1;top:64px;left:50%;translate:-50% 0;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;color:#fff;font-weight:500;font-size:1.3rem;letter-spacing:.01em;transition:opacity .35s}
.acc-item.is-open .acc-vert{opacity:0;pointer-events:none}
.acc-body{position:absolute;z-index:1;inset-inline:28px;inset-block-end:28px;opacity:0;transform:translateY(14px);transition:opacity .4s,transform .5s var(--ease-out);pointer-events:none;max-width:46ch}
.acc-item.is-open .acc-body{opacity:1;transform:none;transition-delay:.25s;pointer-events:auto}
.acc-body h3{font-family:var(--f-head);font-weight:400;font-size:clamp(1.8rem,2.6vw,2.4rem);line-height:1.05;color:#fff;margin-block-end:10px}
.acc-body h3 a{color:inherit;text-decoration:none}
.acc-body h3 a::after{content:"";position:absolute;inset:-400px -28px -28px;z-index:2}
.acc-body p{color:#fff;font-size:var(--fs-body);text-wrap:balance}
.acc-more{display:inline-block;margin-block-start:14px;color:var(--royal-soft);font-weight:500;font-size:var(--fs-body)}
.acc-item:focus-within{box-shadow:0 0 0 3px var(--royal-2)}
.acc-item a:focus-visible{outline:none}
@media (max-width:760px){
  .acc{flex-direction:column;height:auto;gap:8px}
  .acc-item{flex:none;height:76px;transition:height .6s var(--ease-out)}
  .acc-item.is-open{height:340px}
  .acc-num{inset-block-start:50%;translate:0 -50%;inset-inline-start:20px;inset-inline-end:auto;text-align:start}
  .acc-item.is-open .acc-num{inset-block-start:22px;translate:none;inset-inline-start:22px}
  .acc-vert{writing-mode:horizontal-tb;transform:none;top:50%;left:20px;right:66px;translate:0 -50%;white-space:normal}
  .acc-body{inset-inline:22px;inset-block-end:22px}
}
@media (prefers-reduced-motion:reduce){.acc-item,.acc-item::before,.acc-body,.acc-vert,.acc-num{transition:none!important}}
html.no-motion .acc-item,html.no-motion .acc-item::before,html.no-motion .acc-body{transition:none!important}

/* ---------- מובייל: כותרות במרכז, סדר אזורים (18.10.2026) ---------- */
.mobile-only{display:none}
@media (max-width:960px){
  .desk-only{display:none!important}
  .mobile-only{display:revert}
  /* כל כותרות האזורים בגודל של כותרת אודות: 42px */
  :root{--fs-h2:2.625rem}
  /* כל הכותרות במרכז */
  .hero-h1,.section-head,.section-title,.clients-head,.clients-title,.contact-title,.form-title,.page-hero h1,
  .svc h2,.svc-faq>h2,.related>h2{text-align:center}
  .section-head .eyebrow,.contact-copy .eyebrow,.page-hero .eyebrow{display:flex;justify-content:center}
  .page-hero h1{max-width:none}
  /* באנר דף הבית: כותרת גדולה יותר, ובשורת השם בלי הנקודה (השם ותיאור התפקיד בשתי שורות) */
  .hero-title{font-size:3.75rem}
  .hero-sub>span[aria-hidden]{display:block;height:0;overflow:hidden}
  /* תחומי עיסוק: אייקון וכותרת במרכז, כותרת המלבן מעט גדולה יותר */
  .pillar-top{justify-content:center}
  .pillar-title{text-align:center;font-size:1.875rem}
  /* אודות: קו באמצע בין תכנון, ישירות ודיסקרטיות, בחצי מרוחב הקו שמעליהם */
  .values{gap:0}
  .values li{padding-block:18px}
  .values li:first-child{padding-top:0}
  .values li+li{position:relative}
  .values li+li::before{content:"";position:absolute;inset-block-start:0;inset-inline-start:25%;width:50%;border-top:1px solid var(--line-light)}
  /* שאלות: הכפתור אחרי השאלות */
  .faq-more{margin-top:2rem;justify-self:start}
  .faq-split .faq-more.mobile-only{display:inline-flex}
  /* צור קשר: הטופס לפני הטלפון, הוואטסאפ והאימייל */
  .contact-ways-after{margin-top:0;max-width:none}
  /* מפת אתר: האייקונים של הרשתות במרכז */
  .footer-social{align-self:center}
}

/* ---------- מובייל: הדר. המבורגר מימין, לוגו באמצע, שפופרת משמאל; תפריט מסך מלא בדיסקברי מדיום (18.10.2026) ---------- */
.header-call{display:none}
@media (max-width:960px){
  .header-inner{grid-template-columns:1fr auto 1fr;gap:12px}
  .header-actions{display:contents}
  .nav-toggle{grid-row:1;grid-column:1;justify-self:start;color:#fff}
  .brand{grid-row:1;grid-column:2;justify-self:center}
  .header-call{grid-row:1;grid-column:3;justify-self:end;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--royal);background:var(--royal);color:#fff;box-shadow:0 10px 30px -12px rgba(49,87,190,.8);transition:border-color .4s,color .4s,background-color .4s}
  .header-call svg{width:20px;height:20px;fill:currentColor}
  .header-call:focus-visible,.nav-toggle:focus-visible{outline:3px solid var(--royal-2);outline-offset:3px}
  /* אותה צבעוניות כמו הכפתור במחשב: כחול מלא על רקע כהה, חלול בכחול הכהה של הלוגו אחרי גלילה */
  .site-header.scrolled .header-call{background:transparent;border-color:var(--logo-navy);color:var(--logo-navy);box-shadow:none}
  body.nav-open .header-call{background:var(--royal);border-color:var(--royal);color:#fff}
  .main-nav{justify-self:stretch;align-self:stretch;width:100%;background:rgba(19,18,50,.95)}
  .main-nav>ul{width:100%;padding-inline:16px;gap:12px}
  .main-nav a,.site-header.scrolled .main-nav a{font-family:var(--f-body);font-weight:500}
}

/* ---------- עסקאות וחוזים: "למי זה מתאים" כפס כהה שמתחלף לכחול כשמגיעים אליו ---------- */
.svc-page{overflow-x:clip}
.fit-band{position:relative;isolation:isolate;border-bottom:0;padding:clamp(40px,5vw,72px) clamp(28px,4vw,56px);--fit-t:.8s}
.fit-band::before{content:"";position:absolute;inset-block:0;inset-inline:-100vw;z-index:-1;background:transparent;transition:background-color var(--fit-t) var(--ease)}
.fit-band h2,.fit-band p,.fit-band .hl,.fit-cols>p+p{transition:color var(--fit-t) var(--ease),border-color var(--fit-t) var(--ease)}
.fit-band .hl{font-weight:inherit;color:var(--navy)}
.fit-cols{display:grid;grid-template-columns:1fr 1fr;margin-top:6px}
.fit-cols>p{margin:0;max-width:none;padding-inline:0 clamp(20px,3vw,36px)}
.fit-cols>p+p{margin:0;border-inline-start:1px solid var(--line-light);padding-inline:clamp(20px,3vw,36px) 0}
.fit-cta{margin-top:clamp(28px,3vw,40px)}
.fit-band.is-dark::before{background:var(--logo-navy)}
.fit-band.is-dark h2{color:#fff}
.fit-band.is-dark p{color:#fff}
.fit-band.is-dark .hl{color:var(--on-dark-soft)}
.fit-band.is-dark .fit-cols>p+p{border-color:var(--on-dark-soft)}
.fit-band.is-dark .btn-dark{--from-bd:#fff;--from-fg:#fff;--to-bg:#fff;--to-bd:#fff;--to-fg:var(--logo-navy)}
@media (max-width:700px){
  .fit-band{padding-inline:0}
  .fit-cols{grid-template-columns:1fr}
  .fit-cols>p{padding:0}
  .fit-cols>p+p{border-inline-start:0;border-top:1px solid var(--line-light);padding:22px 0 0;margin-top:22px}
}
html.no-motion .fit-band{--fit-t:0s}
/* "למי זה מתאים": יותר אוויר מסביב לפס ובתוכו, ובלי הקו שמעליו */
.svc:has(+ .fit-band){border-bottom:0}
.svc.fit-band,.page-agreements .svc.fit-band{margin-block:clamp(48px,6vw,88px) clamp(80px,10vw,140px);padding-block:clamp(64px,7vw,112px)}
.svc.fit-band h2,.page-agreements .svc.fit-band h2{margin-bottom:clamp(28px,3vw,44px)}
.fit-cta{margin-top:clamp(36px,4vw,56px)}

/* ---------- צבעי טקסט מממשק העריכה (tools/editor.js): צבעי האתר בלבד ---------- */
.tc-logo-navy{color:var(--logo-navy)}
.tc-royal{color:var(--royal)}
.tc-logo-blue{color:var(--logo-blue-light)}
.tc-royal-soft{color:var(--royal-soft)}
.tc-on-dark-soft{color:var(--on-dark-soft)}
.tc-text-soft{color:var(--text-soft)}
.tc-gold-deep{color:var(--gold-deep)}
.tc-gold{color:var(--gold)}
.tc-gold-soft{color:var(--gold-soft)}
.tc-white{color:#fff}
html.a11y-contrast [class^="tc-"],html.a11y-contrast [class*=" tc-"]{color:inherit!important}

/* "למי זה מתאים": הסמל של רונן ברקע הפס הכחול, עדין, כמו באזור "הגישה" בדף הבית */
.fit-band::after{content:"";position:absolute;inset-block:0;inset-inline:-100vw;z-index:-1;pointer-events:none;background:#fff;opacity:0;
  -webkit-mask-image:url("assets/pattern-mark.png"),radial-gradient(ellipse 55vw 75% at 50% 50%,transparent 25%,#000 85%);
  mask-image:url("assets/pattern-mark.png"),radial-gradient(ellipse 55vw 75% at 50% 50%,transparent 25%,#000 85%);
  -webkit-mask-size:300px 300px,100% 100%;mask-size:300px 300px,100% 100%;
  -webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;
  -webkit-mask-position:0 60px,0 0;mask-position:0 60px,0 0;
  -webkit-mask-composite:source-in;mask-composite:intersect;
  transition:opacity var(--fit-t) var(--ease),-webkit-mask-position 1.6s var(--ease-out),mask-position 1.6s var(--ease-out)}
.fit-band.is-dark::after{opacity:.07;-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0}
html.a11y-contrast .fit-band::after{display:none}
html.no-motion .fit-band::after{transition:none}

/* ===== שאלות נפוצות: כותרת צמודה בצד, שאלות ברשימה (דף עסקאות וחוזים) ===== */
.svc-faq.faq-split{display:grid;grid-template-columns:minmax(260px,44%) 1fr;gap:clamp(32px,5vw,80px);align-items:start}
.faq-split .faq-side{position:sticky;top:calc(var(--header-h) + 24px)}
.page-svc .svc-faq.faq-split .faq-side>h2{font-family:var(--f-head);font-weight:400;color:var(--navy);font-size:var(--fs-h2);line-height:1;margin-bottom:0;text-align:start}
.faq-split .faq-side p{color:var(--text-soft);margin-top:18px;max-width:34ch}
.faq-split .faq-ask{margin-top:2rem}
.faq-split summary{padding-block:26px;font-size:1.18rem}
.faq-split summary:focus-visible{outline:2px solid var(--royal);outline-offset:4px;border-radius:4px}
.faq-split .faq-a{padding:0 0 28px}
@media (max-width:820px){
  .svc-faq.faq-split{grid-template-columns:1fr;gap:28px}
  .faq-split .faq-side{position:static}
}
/* הסמל קטן יותר, וזז מעט אחרי העכבר (main.js מעדכן את --mx ו---my) */
.fit-band::after{-webkit-mask-size:170px 170px,100% 100%;mask-size:170px 170px,100% 100%;
  transition:opacity var(--fit-t) var(--ease),-webkit-mask-position .9s var(--ease-out),mask-position .9s var(--ease-out)}
.fit-band.is-dark::after{-webkit-mask-position:calc(var(--mx,0) * -18px) calc(var(--my,0) * -18px),0 0;mask-position:calc(var(--mx,0) * -18px) calc(var(--my,0) * -18px),0 0}
html.no-motion .fit-band::after{transition:none}

/* מסגרת "תחום נוסף" בסוף דפי השירות: כותרת בפונט הגוף, במשקל בינוני ובגודל של טקסט רץ */
.other-area p{font-family:var(--f-body);font-weight:500;font-size:var(--fs-body);line-height:1.4}
.other-area p small{font-weight:400}
/* במחשב: הגדלים שנקבעו בבאנר של עסקאות וחוזים, לכל דפי השירות */
@media (min-width:961px){
  .other-area p{font-size:1.205vw;line-height:1.05}
  .other-area p small{font-size:.828vw}
}

/* ---------- דפי שירות: אזור שלבים כמו "4 שלבים" בדף הבית (רקע כחול כהה כשהאזור במרכז המסך, בר תהליך שמתמלא בגלילה) ---------- */
.page-svc .svc.svc-method{position:relative;isolation:isolate;padding-block:clamp(80px,9vw,140px);color:var(--on-dark);text-align:center;transition:color .7s}
.svc-method::before{content:"";position:absolute;inset-block:0;inset-inline:-100vw;z-index:-1;background:var(--navy);transition:background-color .7s var(--ease-out)}
.svc-method[data-tone="light"]::before{background:var(--paper)}
.page-svc .toc{z-index:2}
.svc-method h2[id]{margin-inline:auto!important;text-align:center;color:#fff;transition:color .7s}
.svc-method p{margin-inline:auto;transition:color .7s}
.svc.svc-method .sm-intro,.svc-method .sm-intro{color:var(--on-dark-soft);margin-top:clamp(20px,2.4vw,32px)}
.svc-method .sm-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:clamp(20px,3vw,44px);max-width:760px;margin:clamp(22px,2.6vw,34px) auto 0;text-align:center}
.svc-method .sm-pair::before{content:"";grid-column:2;grid-row:1;width:1px;align-self:stretch;background:var(--gold)}
.svc-method .sm-opt:first-child{grid-column:1;grid-row:1}
.svc-method .sm-opt:last-child{grid-column:3;grid-row:1}
.svc.svc-method .sm-opt{color:#fff;margin:0;max-width:none}
.svc-method .sm-n{display:block;font-family:var(--f-head);font-size:2.6rem;line-height:1;margin-bottom:10px;color:var(--gold-soft)}
.svc.svc-method .sm-verdict{font-weight:500;color:#fff;margin-top:clamp(26px,3vw,40px)}
.svc.svc-method .sm-h3{color:#fff;margin:clamp(56px,6vw,88px) 0 clamp(30px,3.4vw,48px);transition:color .7s}
.svc-method .steps-wrap{position:relative}
.svc-method .steps{grid-template-columns:repeat(3,1fr);text-align:start}
.svc-method .step h4{font-family:var(--f-head);font-weight:400;font-size:var(--fs-h3);line-height:1.1;color:#fff;transition:color .7s}
.svc.svc-method .step p{color:var(--on-dark-soft);max-width:none}
.svc.svc-method .sm-outro{color:var(--on-dark-soft);margin-top:clamp(40px,4.6vw,64px)}
.svc-method .reveal{transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out),color .7s,border-color .7s}
/* מצב בהיר: לפני שהאזור מגיע למרכז המסך ואחרי שהוא עובר */
.svc-method[data-tone="light"]{color:var(--navy)}
.svc-method[data-tone="light"] h2[id],.svc.svc-method[data-tone="light"] .sm-h3,.svc-method[data-tone="light"] .step h4,.svc.svc-method[data-tone="light"] .sm-opt,.svc.svc-method[data-tone="light"] .sm-verdict{color:var(--navy)}
.svc.svc-method[data-tone="light"] :is(.sm-intro,.sm-outro),.svc.svc-method[data-tone="light"] .step p{color:var(--text-soft)}
.svc-method[data-tone="light"] .sm-n{color:var(--gold-deep)}
.svc-method[data-tone="light"] .step-num{-webkit-text-stroke-color:rgba(28,27,69,.35)}
.svc-method[data-tone="light"] .step-dot{background:var(--paper)}
.svc-method[data-tone="light"] .steps-rail{background:var(--line-light)}
.svc-method[data-tone="light"] .step{border-color:var(--line-light)}
@media (max-width:960px){.svc-method .steps{grid-template-columns:1fr}}
@media (max-width:600px){.svc-method .sm-pair{grid-template-columns:1fr;gap:18px}.svc-method .sm-pair::before{grid-column:1;grid-row:2;width:60px;height:1px;justify-self:center}.svc-method .sm-opt:last-child{grid-column:1;grid-row:3}}
html.a11y-contrast .svc-method::before{background:#000!important}
/* התפריט הצידי כשהוא עומד מעל הרקע הכהה */
.toc h2,.toc a,.toc{transition:color .5s,border-color .5s}
body.toc-dark .toc{border-color:var(--line-dark)}
body.toc-dark .toc h2{color:var(--gold-soft)}
body.toc-dark .toc a{color:var(--on-dark-soft)}
body.toc-dark .toc a:hover,body.toc-dark .toc a[aria-current]{color:#fff}

/* ---------- חוזים מסחריים: "איפה נכנס המשא ומתן" - "לא" נמחק, "אלא:" וכרטיסי חלופות, הכל ממורכז ---------- */
.svc.neg{text-align:center}
.svc.neg>p{margin-inline:auto}
.neg-no{position:relative;display:block;width:fit-content;margin-inline:auto;font-family:var(--f-head);font-size:clamp(6rem,16vw,12rem);line-height:1.15;color:transparent;-webkit-text-stroke:1.5px var(--navy);margin-block:16px 0}
.neg-no svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none} /* the click goes to the word itself, so the editor selects the text */
.neg-no path{fill:none;stroke:var(--royal);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.neg-no.in path{animation:neg-pen .6s .5s cubic-bezier(.6,.1,.3,1) forwards}
@keyframes neg-pen{to{stroke-dashoffset:0}}
.svc .neg-but{font-family:var(--f-head);font-size:clamp(1.8rem,3vw,2.4rem);line-height:1.1;color:var(--royal);margin:0 auto 22px}
.neg-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;background:var(--line-light);border:1px solid var(--line-light)}
.neg-cards li{grid-column:span 2;background:var(--paper);padding:24px 22px 28px;color:var(--text-soft);font-size:var(--fs-body);transition:background .3s}
.neg-cards li:nth-child(n+4){grid-column:span 3}
.neg-cards-4 li{grid-column:span 3} /* 4 cards: two rows of two */
.neg-cards li:hover{background:#fff}
.neg-cards b{display:block;font-family:var(--f-head);font-weight:400;font-size:1.6rem;line-height:1.1;color:var(--navy);margin-bottom:8px}
.svc p.neg-note{max-width:none;margin-top:30px;color:var(--navy)}
.neg-note strong{font-weight:500}
@media (max-width:700px){.neg-cards{grid-template-columns:1fr}.neg-cards li,.neg-cards li:nth-child(n+4){grid-column:auto}}
@media (prefers-reduced-motion:reduce){.neg-no path{stroke-dashoffset:0;animation:none!important}}
html.no-motion .neg-no path{stroke-dashoffset:0;animation:none!important}

/* ---------- חוזים מסחריים: לקוח גדול - אזור אחד רציף ----------
   למעלה: מימין "יש 2 תגובות" ושתי התגובות, משמאל המסקנה.
   מתחת, ברווח קצר: סדר העבודה ממורכז, הקו מעיגול 1 עד עיגול 3, והמשפט האחרון מתחתיו.
   במחשב סדר העבודה נעצר במסך עד שהקו מתמלא, בלי מסך ריק סביבו. */
.svc-method .sm-split{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(28px,5vw,64px);align-items:center;margin-top:clamp(36px,4vw,56px);text-align:start}
.svc.svc-method .sm-side .sm-intro{margin:0 0 12px;font-weight:500;color:var(--on-dark-soft)}
.svc.svc-method .sm-split .sm-verdict{margin:0;font-size:clamp(1.4rem,2vw,1.8rem);line-height:1.35;color:#fff}
.svc-method .sm-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.25);transition:border-color .7s}
.svc.svc-method .sm-list .sm-opt{display:grid;grid-template-columns:3em 1fr;gap:10px;align-items:baseline;padding-block:18px;border-bottom:1px solid rgba(255,255,255,.25);font-family:var(--f-body);font-weight:300;font-size:1.1rem;color:#fff}
.svc-method .sm-list .sm-n{display:inline;margin:0;font-family:var(--f-head);font-size:2rem;line-height:1;color:var(--royal-soft);transition:color .7s}
.svc-method[data-tone="light"] .sm-list,.svc-method[data-tone="light"] .sm-list .sm-opt{border-color:var(--line-light)}
.svc-method[data-tone="light"] .sm-list .sm-n{color:var(--royal)}
@media (max-width:760px){.svc-method .sm-split{grid-template-columns:1fr}}
/* המסקנה במסגרת חלולה מעוגלת, בקו דק כמו הקווים של הרשימה. במחשב המסגרת בגובה הרשימה בדיוק: מהקו העליון עד התחתון */
.svc.svc-method .sm-split .sm-verdict{display:flex;flex-direction:column;justify-content:center;padding:18px clamp(24px,3vw,44px);border-radius:var(--radius);border:1px solid rgba(255,255,255,.25);background:none;
  transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out),color .7s,border-color .7s}
.svc.svc-method[data-tone="light"] .sm-split .sm-verdict{border-color:var(--line-light)}
.svc.svc-method .sm-split .sm-verdict>br{display:none} /* the two spans already stack; the break between them would add an empty line inside the flex frame */
@media (min-width:761px){
  .svc-method .sm-split{grid-template-rows:auto auto;row-gap:0}
  .svc-method .sm-split .sm-side{display:contents}
  .svc.svc-method .sm-split .sm-side .sm-intro{grid-column:1;grid-row:1;align-self:end}
  .svc-method .sm-split .sm-list{grid-column:1;grid-row:2;align-self:start}
  /* the row is as tall as the list; the frame takes that height and its content never pushes it taller */
  .svc.svc-method .sm-split .sm-verdict{grid-column:2;grid-row:2;align-self:stretch;justify-self:start;padding-block:0;height:0;min-height:100%}
}

.svc-method .sm-pin{margin-top:clamp(48px,5vw,72px)}
.svc.svc-method .sm-pin .sm-h3{margin:0 0 clamp(26px,3vw,40px)}
.svc.svc-method .sm-pin .sm-outro{margin:clamp(28px,3vw,40px) auto 0}
.svc-method .steps-wrap{--sg:clamp(18px,2.4vw,36px)}
.svc-method .steps{gap:var(--sg)}
@media (min-width:961px){
  /* the steps in the middle of their columns, the rail from the centre of dot 1 to the centre of dot 3 */
  .svc-method .steps{text-align:center}
  .svc-method .step-dot{right:50%;transform:translateX(50%)}
  .svc-method .steps-rail{right:calc((100% - 2 * var(--sg)) / 6);left:calc((100% - 2 * var(--sg)) / 6)}
  /* the whole area stays on screen as one block (its top is set by main.js) while the rail fills and the steps
     come in one by one; .sm-run after it is the length of that scroll. Then the page goes on */
  .svc-method .sm-stage{position:sticky;top:72px}
  .svc-method .sm-run{height:60vh}
  .svc-method .step{transition:opacity .5s var(--ease-out),transform .6s var(--ease-out)}
  .svc-method .steps .step:not(.lit){opacity:.18;transform:translateX(24px)}
}
.svc-method .sm-run{display:none}
@media (min-width:961px){.svc-method .sm-run{display:block}}
html.no-motion .svc-method .sm-run{display:none}
html.no-motion .svc-method .sm-stage{position:static}
html.no-motion .svc-method .steps .step{opacity:1;transform:none}

/* ---------- דפי שירות: "למי זה מתאים" כמו בעסקאות וחוזים - כותרת וכפתור באמצע ---------- */
.page-svc:not(.page-agreements) .fit-band h2{text-align:center}
.page-svc:not(.page-agreements) .fit-cta{text-align:center}
.page-svc:not(.page-agreements) .svc.fit-band{padding-block:clamp(110px,11vw,190px)}
/* דפים שיש בהם רק "למי זה מתאים": פסקה אחת באמצע, ברוחב של שני הטורים */
.fit-band p.fit-one{max-width:62ch;margin-inline:auto}

/* ---------- הסכמי הפצה: "איפה נכנס המשא ומתן" - המבנים על ציר חיי ההסכם, הקו מתמלא בגלילה ---------- */
.dist-neg h3,.neg-line .when{color:var(--logo-navy)}
.neg-line{list-style:none;margin:0;padding:44px 0 0;position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;--tl:0}
/* הקו: מקווקו דק, ומעליו מילוי בכחול כהה של הלוגו שמתקדם בגלילה. העיגול רץ בקצה המילוי */
.neg-line::before{content:"";position:absolute;top:14px;inset-inline:0;height:2px;background:linear-gradient(var(--logo-navy),var(--logo-navy)) 100% 0/calc(var(--tl) * 100%) 100% no-repeat,repeating-linear-gradient(to left,rgba(32,32,66,.5) 0 7px,transparent 7px 13px) 0 50%/100% 1.5px no-repeat}
.neg-line::after{content:"";position:absolute;top:15px;right:calc(var(--tl) * 100%);width:14px;height:14px;border-radius:50%;background:var(--logo-navy);box-shadow:0 0 0 4px var(--paper);transform:translate(50%,-50%)}
.neg-line li{margin:0;padding:0}
.neg-line li::before{content:none}
.neg-line .when{display:block;font-size:var(--fs-small);font-weight:500;margin-bottom:8px}
.neg-line strong{display:block;font-family:var(--f-head);font-weight:400;font-size:clamp(1.3rem,1.55vw,1.65rem);line-height:1.05;color:var(--royal);margin-bottom:8px}
.neg-line[data-reveal] li{opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease-out),transform .7s var(--ease-out)} /* כל שלב מופיע כשהעיגול על הקו עובר מעליו */
.neg-line[data-reveal] li.on{opacity:1;transform:none}
.neg-line .t{display:block;color:var(--text-soft);font-size:var(--fs-body)}
.svc p.neg-line-note{max-width:none;margin-top:40px;color:var(--navy);font-weight:500}
/* במחשב: כל האזור נעצר במרכז המסך, הקו מתקדם בזמן שגוללים על פני .neg-run, ואז הדף ממשיך לעלות */
.neg-stage{position:sticky;top:20vh}
.neg-stage.is-pin .neg-line-note{opacity:0;transition:opacity .6s var(--ease-out)} /* המשפט האחרון מופיע במקומו כשהקו מגיע לסוף */
.neg-stage.is-pin .neg-line-note.on{opacity:1}
.neg-run{height:90vh}
/* רוחב שווה לכל תיבה ורווחים שווים ביניהן לאורך הקו */
@media (min-width:821px){
  .neg-line{display:flex;justify-content:space-between;gap:0}
  .neg-line li{flex:0 0 auto;width:min(10vw,22%)}
}
html.no-motion .neg-stage,html.ro-edit .neg-stage{position:static}
html.no-motion .neg-run,html.ro-edit .neg-run{display:none}
@media (max-width:820px){
  .neg-line{grid-template-columns:1fr;padding:0;padding-inline-start:34px;gap:28px}
  .neg-line::before{top:0;bottom:0;height:auto;width:2px;inset-inline:5px auto;background:linear-gradient(var(--logo-navy),var(--logo-navy)) 0 0/100% calc(var(--tl) * 100%) no-repeat,repeating-linear-gradient(to bottom,rgba(32,32,66,.5) 0 7px,transparent 7px 13px) 50% 0/1.5px 100% no-repeat}
  .neg-line::after{display:none}
  .neg-stage{position:static}
  .neg-run{display:none}
}

/* ---------- הסכם מייסדים: "3 רגעים" - שלושה שלבים על ציר החיים של השותפות ----------
   אותו מנגנון של הסכמי הפצה (.neg-stage / .neg-run / data-timeline): האזור נעצר במרכז המסך,
   הקו מתמלא מימין לשמאל, כל שלב מופיע כשהקו מגיע לעיגול שלו, והמשפט האחרון מופיע בסוף */
.mo-line{list-style:none;margin:clamp(10px,2vw,24px) 0 0;padding:46px 0 0;position:relative;display:flex;justify-content:space-between;gap:24px;--tl:0;text-align:start}
/* הקו לכל רוחב האזור */
.mo-line::before{content:"";position:absolute;top:13px;inset-inline-start:8px;inset-inline-end:0;height:2px;background:linear-gradient(var(--royal),var(--royal)) 100% 0/calc(var(--tl) * 100%) 100% no-repeat,var(--line-light)}
/* כל שלב ברוחב הטקסט שלו (ולא יותר מ-30%), כך שהרווחים בין שלושת השלבים שווים */
.mo-line li{position:relative;flex:0 0 auto;width:auto;max-width:30%;margin:0;padding:0;text-align:start}
.mo-line li:nth-child(2){width:30%}
.mo-line.is-spread{justify-content:flex-start;gap:0} /* main.js מפזר את השלבים ברווחים שווים */
.mo-line li::before{content:none}
/* עיגול בתחילת כל שלב, מעל הטקסט המיושר לימין; המרווחים בין העיגולים שווים */
.mo-line .tl-dot{position:absolute;top:-41px;inset-inline-start:0;width:16px;height:16px;border-radius:50%;background:var(--paper);border:2px solid var(--navy);transition:background .3s,border-color .3s}
.mo-line li.on .tl-dot{background:var(--royal);border-color:var(--royal)}
.mo-line .when{display:block;font-size:var(--fs-small);font-weight:500;color:var(--royal);margin-bottom:8px}
.mo-line strong{display:block;font-family:var(--f-head);font-weight:400;font-size:clamp(1.3rem,1.7vw,2.2rem);line-height:1.05;color:var(--navy);margin-bottom:.35em}
.mo-line .t{display:block;color:var(--text-soft);font-size:var(--fs-body)}
.mo-line[data-reveal] li>:not(.tl-dot){opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease-out),transform .7s var(--ease-out)}
.mo-line[data-reveal] li.on>:not(.tl-dot){opacity:1;transform:none}
@media (max-width:820px){
  .mo-line{flex-direction:column;gap:28px;padding:0;padding-inline-start:34px}
  .mo-line::before{top:0;bottom:0;height:auto;width:2px;inset-inline:7px auto;background:linear-gradient(var(--royal),var(--royal)) 0 0/100% calc(var(--tl) * 100%) no-repeat,var(--line-light)}
  .mo-line li,.mo-line li:nth-child(2){width:auto;max-width:none}
  .mo-line .tl-dot{top:4px;inset-inline:-34px auto}
  .mo-line strong{font-size:1.6rem}
}

/* ---------- הסכם מייסדים: "מה חייב להיות כתוב" - דף נייר של עיקרי ההסכם, עם חתימות ---------- */
.agr{position:relative;isolation:isolate;max-width:760px;margin:clamp(14px,2.4vw,30px) auto 12px;text-align:start}
.agr-sheet{position:relative;background:#fffdf8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .4 0 0 0 0 .3 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");padding:clamp(28px,4.4vw,60px) clamp(22px,4.4vw,60px) clamp(26px,3.6vw,46px);box-shadow:0 1px 1px rgba(28,27,69,.08),0 2px 6px rgba(28,27,69,.05),0 28px 50px -34px rgba(28,27,69,.5)}
/* דף שני מאחור, קצת עקום */
.agr::before{content:"";position:absolute;inset:6px -4px -6px 4px;z-index:-1;background:#f6f1e6;rotate:-1.4deg;box-shadow:0 18px 34px -28px rgba(28,27,69,.5)}
/* פינה מקופלת */
.agr-sheet::after{content:"";position:absolute;top:0;left:0;width:34px;height:34px;background:linear-gradient(135deg,var(--paper) 50%,#ebe4d4 50%);box-shadow:3px 3px 6px -3px rgba(28,27,69,.3)}
.agr-t{font-family:var(--f-body);font-weight:500;font-size:var(--fs-h3);line-height:1.1;color:var(--navy);text-align:center;padding-bottom:16px;border-bottom:3px double var(--navy);margin:0 0 22px}
.svc .agr ol{list-style:none;counter-reset:cl;display:grid;gap:14px;margin:0;padding:0}
.svc .agr li{counter-increment:cl;display:grid;grid-template-columns:2.2em minmax(0,1fr);margin:0;padding:0;font-size:var(--fs-body);color:var(--text-soft)}
.svc .agr li::before{content:counter(cl) ".";position:static;width:auto;height:auto;background:none;font-weight:500;color:var(--royal)}
.agr li b{font-weight:500;color:var(--navy)}
.agr-sign{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,80px);padding-top:56px;margin-top:clamp(18px,3vw,34px)}
.agr-sign div{position:relative;border-top:1px solid var(--navy);padding-top:8px;font-size:var(--fs-small);color:var(--text-soft)}
.agr-sign svg{position:absolute;bottom:calc(100% + 4px);inset-inline-start:10%;width:70%;height:44px;overflow:visible}
.agr-sign path{fill:none;stroke:var(--royal);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.agr-sign.in div:nth-child(1) path{transition:stroke-dashoffset 1s cubic-bezier(.5,.1,.3,1) .4s;stroke-dashoffset:0}
.agr-sign.in div:nth-child(2) path{transition:stroke-dashoffset 1s cubic-bezier(.5,.1,.3,1) 1.3s;stroke-dashoffset:0}
@media (max-width:560px){.agr::before{inset:4px -2px -4px 2px}.agr-sheet::after{width:24px;height:24px}}

/* ---------- הסכם השקעה: "לפני שחותמים" - מסמך תנאים על נייר, עם חותמת ועט ---------- */
.ts-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;border-bottom:3px double var(--navy);padding-bottom:16px;margin-bottom:6px}
.ts-head.reveal{opacity:1;transform:none}
.ts-t{font-family:var(--f-body);font-weight:500;font-size:var(--fs-h3);line-height:1.1;color:var(--navy);margin:0}
.ts-t small{display:block;font-size:var(--fs-small);font-weight:400;letter-spacing:.08em;color:var(--text-soft);margin-top:6px;text-align:end}
.ts-stamp{border:2px solid var(--royal);color:var(--royal);font-weight:500;font-size:var(--fs-small);padding:6px 12px;rotate:-6deg;white-space:nowrap;opacity:0;scale:1.6;transition:opacity .3s .2s,scale .45s cubic-bezier(.3,1.6,.5,1) .2s}
.ts-head.in .ts-stamp{opacity:1;scale:1}
.ts-list{display:grid;margin:0}
.ts-list>div{display:grid;grid-template-columns:minmax(0,12em) minmax(0,1fr);gap:clamp(12px,3vw,30px);padding-block:14px;border-bottom:1px dotted rgba(28,27,69,.3)}
.ts-list dt{font-weight:500;color:var(--navy);font-size:var(--fs-body)}
.ts-list dd{margin:0;color:var(--text-soft);font-size:var(--fs-body)}
.ts-circled.reveal{opacity:1;transform:none}
.ts-lbl{position:relative;display:inline-block;z-index:0}
.ts-ring{position:absolute;top:-12px;inset-inline-start:-16px;width:calc(100% + 32px);height:calc(100% + 24px);max-width:none;overflow:visible;pointer-events:none;z-index:-1}
.ts-ring path{fill:none;stroke:var(--royal);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.ts-circled.in .ts-ring path{transition:stroke-dashoffset 1s cubic-bezier(.5,.1,.3,1) .6s;stroke-dashoffset:0}
.ts-pen{display:block;margin-top:8px;font-family:var(--f-head);font-size:1.35rem;line-height:1.05;color:var(--royal);opacity:0;transition:opacity .5s 1.5s}
.ts-circled.in .ts-pen{opacity:1}
.svc p.ts-foot{max-width:none;margin-top:clamp(24px,3vw,34px);padding-top:16px;border-top:3px double var(--navy);color:var(--navy)}
.ts-foot b{font-weight:500}
html.no-motion .ts-stamp,html.no-motion .ts-pen{opacity:1;scale:1;transition:none}
html.no-motion .ts-ring path{stroke-dashoffset:0;transition:none}
@media (prefers-reduced-motion:reduce){.ts-stamp,.ts-pen{opacity:1;scale:1;transition:none}.ts-ring path{stroke-dashoffset:0;transition:none}}
@media (max-width:640px){.ts-list>div{grid-template-columns:1fr;gap:4px}.ts-head{flex-direction:column;align-items:flex-start}.ts-t small{text-align:start}}

/* ---------- הסכם השקעה: "SAFE, הלוואה המירה או מניות?" - טבלת השוואה ---------- */
.trk{width:100%;max-width:880px;margin:clamp(14px,2.4vw,30px) auto 0;border-collapse:collapse;table-layout:fixed;text-align:start}
.trk th,.trk td{text-align:start;vertical-align:top;padding:16px clamp(10px,1.6vw,18px);border-bottom:1px solid var(--line-light)}
.trk thead th{font-family:var(--f-head);font-weight:400;font-size:var(--fs-h3);line-height:1;color:var(--navy);border-bottom:2px solid var(--navy);padding-top:0}
.trk thead td{width:22%;border-bottom:2px solid var(--navy)}
.trk tbody th{font-weight:500;color:var(--royal);font-size:var(--fs-small)}
.trk td{color:var(--text-soft);font-size:var(--fs-body)}
.trk tbody tr{transition:background .3s}
.trk tbody tr:hover{background:rgba(49,87,190,.05)}
.trk-lvl{display:flex;gap:4px;margin-bottom:6px}
.trk-lvl i{width:22px;height:6px;border-radius:3px;background:var(--line-light)}
.trk-lvl i.on{background:var(--royal)}
.svc p.trk-tail{margin-top:clamp(26px,3vw,40px);color:var(--navy)}
@media (max-width:700px){
  .trk,.trk tbody,.trk tr,.trk td,.trk tbody th{display:block;width:100%}
  .trk thead{display:none}
  .trk tr{background:#fff;border:1px solid var(--line-light);border-radius:14px;padding:16px 18px;margin-bottom:12px}
  .trk tbody th{padding:0 0 6px;border:0;font-family:var(--f-head);font-weight:400;font-size:var(--fs-h3);color:var(--navy)}
  .trk td{border:0;padding:6px 0}
  .trk td::before{content:attr(data-l);display:block;font-weight:500;color:var(--royal);font-size:var(--fs-small)}
}

/* ---------- הסכם מייסדים: "שותף נכנס לעסק קיים" - הכניסה המדורגת כ-3 מדרגות ---------- */
.np-stairs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:6px;max-width:760px;margin:clamp(70px,6vw,90px) auto 0;text-align:start}
.np-step{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:var(--h);padding:18px 18px 20px;border-radius:10px 10px 0 0;background:var(--navy);color:#fff;transform:scaleY(0);transform-origin:bottom;transition:transform .7s var(--ease-out)}
.np-step:nth-child(1){--h:clamp(130px,11vw,170px)}
.np-step:nth-child(2){--h:clamp(190px,15.5vw,235px);background:#2a3f8f}
.np-step:nth-child(3){--h:clamp(250px,20vw,300px);background:var(--royal)}
.np-stairs.in .np-step{transform:none}
.np-stairs.in .np-step:nth-child(2){transition-delay:.25s}
.np-stairs.in .np-step:nth-child(3){transition-delay:.5s}
.np-step b{font-family:var(--f-body);font-weight:500;font-size:var(--fs-h3);line-height:1.1}
.np-step span{margin-top:6px;font-size:var(--fs-body);color:rgba(255,255,255,.85)}
.np-flag{position:absolute;bottom:100%;inset-inline-start:18px;width:34px;height:46px;opacity:0;transition:opacity .4s 1.1s}
.np-stairs.in .np-flag{opacity:1}
.np-flag path{fill:none;stroke:var(--navy);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.np-flag .f{fill:var(--royal);stroke:var(--royal)}
.np-base{max-width:760px;height:3px;background:var(--navy);margin:0 auto clamp(26px,3vw,40px)}
.svc p.np-tail{color:var(--navy)}
.np-tail b{font-weight:500}
@media (max-width:560px){.np-step{padding:12px 10px 14px}.np-step:nth-child(1){--h:160px}.np-step:nth-child(2){--h:215px}.np-step:nth-child(3){--h:270px}}

@media (prefers-reduced-motion:reduce){.agr-sign path{stroke-dashoffset:0!important;transition:none!important}.np-step{transform:none;transition:none}.np-flag{opacity:1;transition:none}}
html.no-motion .agr-sign path,html.ro-edit .agr-sign path{stroke-dashoffset:0!important;transition:none!important}
html.no-motion .np-step,html.ro-edit .np-step{transform:none;transition:none}
html.no-motion .np-flag,html.ro-edit .np-flag{opacity:1;transition:none}

/* commercial lease: what to check before signing, as cards that tick themselves */
.lease-ticks{list-style:none;margin:clamp(20px,2.4vw,28px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.lease-ticks li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;margin:0;background:#fff;border:1px solid var(--line-light);border-radius:14px;padding:18px 20px;box-shadow:0 10px 24px -16px rgba(28,27,69,.3)}
.lease-ticks li:last-child{grid-column:1/-1}
.lease-ticks .box{width:26px;height:26px;border:2px solid var(--navy);border-radius:7px;display:grid;place-items:center;margin-top:2px;transition:background .3s .3s,border-color .3s .3s}
.lease-ticks .box svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.lease-ticks .box path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .4s .45s}
.lease-ticks li.in .box{background:var(--royal);border-color:var(--royal)}
.lease-ticks li.in .box path{stroke-dashoffset:0}
.svc .lease-ticks h3{font-family:var(--f-head);font-weight:400;font-size:var(--fs-h3);line-height:1.05;color:var(--navy);margin:0 0 .3em}
.svc .lease-ticks p{margin:0;max-width:none}
.svc .note.lease-note{max-width:none;margin-top:14px;background:var(--logo-navy);color:#fff;padding:20px 24px;box-shadow:0 10px 24px -16px rgba(28,27,69,.45)}
@media (max-width:640px){.lease-ticks{grid-template-columns:1fr}}
/* commercial lease: the business in 3 years, three questions with signs */
.lease-qs{list-style:none;margin:clamp(18px,2.2vw,26px) 0 0;padding:0;display:grid;border-top:2px solid var(--navy)}
.lease-qs li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:clamp(14px,2.4vw,26px);align-items:center;margin:0;padding-block:20px;border-bottom:1px solid var(--line-light)}
.lease-qs .ico{width:56px;height:56px;border-radius:50%;background:var(--royal);display:grid;place-items:center;transform:scale(.6);opacity:0;transition:transform .5s var(--ease-out) .3s,opacity .4s .3s}
.lease-qs li.in .ico{transform:none;opacity:1}
.lease-qs .ico svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.svc .lease-qs h3{font-family:var(--f-head);font-weight:400;font-size:var(--fs-h3);line-height:1.05;color:var(--navy);margin:0 0 .25em}
.svc .lease-qs p{margin:0;max-width:none}
.svc p.lease-qs-tail{margin-top:clamp(22px,3vw,34px);color:var(--navy);max-width:none}
.lease-qs-tail b{font-weight:500;background:linear-gradient(transparent 62%,rgba(134,166,245,.45) 62%)}
html.no-motion .lease-ticks .box,html.ro-edit .lease-ticks .box{background:var(--royal);border-color:var(--royal)}
html.no-motion .lease-ticks .box path,html.ro-edit .lease-ticks .box path{stroke-dashoffset:0}
html.no-motion .lease-qs .ico,html.ro-edit .lease-qs .ico{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.lease-ticks .box path{stroke-dashoffset:0}.lease-ticks .box{background:var(--royal);border-color:var(--royal)}.lease-qs .ico{transform:none;opacity:1}}

/* ---------- הסכם זכיינות: מצטרפים לרשת כדף הסכם עם פתק, המספרים כמחזור מול רווח, בונים רשת כ-10 סניפים ---------- */
.fr-agr{margin-bottom:clamp(70px,8vw,110px)}
.fr-agr .agr-sheet{padding-bottom:clamp(110px,11vw,150px)}
.fr-agr .agr-t{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 16px}
.fr-stamp{font-family:var(--f-body);font-weight:500;font-size:var(--fs-small);letter-spacing:.04em;color:var(--text-soft);border:1.5px solid currentColor;border-radius:6px;padding:2px 10px;rotate:-4deg;opacity:.8}
.fr-postit{position:absolute;inset-inline-end:clamp(-24px,-2vw,-8px);bottom:clamp(-60px,-5vw,-36px);width:min(340px,80%);z-index:2;text-align:start;padding:26px 24px 28px;rotate:2.5deg;color:var(--navy);
  background:linear-gradient(170deg,rgba(255,255,255,.35),transparent 40%),linear-gradient(to top left,rgba(120,90,20,.14),transparent 22%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .4 0 0 0 0 .3 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),#f4e3a8;
  box-shadow:0 1px 1px rgba(28,27,69,.08),0 22px 30px -20px rgba(28,27,69,.55)}
.fr-postit::before{content:"";position:absolute;top:-11px;inset-inline-start:50%;translate:50% 0;rotate:-3deg;width:96px;height:24px;background:rgba(255,255,255,.55);box-shadow:0 1px 2px rgba(28,27,69,.12)}
.svc .fr-postit h3{font-family:var(--f-body);font-weight:500;font-size:var(--fs-h3);line-height:1.1;color:var(--navy);margin:0 0 8px}
.svc .fr-postit p{margin:0;max-width:none;color:var(--navy)}
@media (max-width:560px){.fr-agr{margin-bottom:12px}.fr-agr .agr-sheet{padding-bottom:30px}.fr-postit{position:relative;inset:auto;width:auto;margin:-16px 12px 0;rotate:1.5deg}}

.fr-bars{max-width:760px;margin:clamp(22px,3vw,34px) auto 0;display:grid;gap:18px;text-align:start}
.fr-row{display:grid;grid-template-columns:6.5em minmax(0,1fr);gap:14px;align-items:center}
.fr-row>b{font-weight:500;color:var(--navy);font-size:var(--fs-body)}
.fr-track{position:relative;height:48px}
.fr-bar{position:absolute;inset-block:0;inset-inline-start:0;width:0;border-radius:6px;display:flex;align-items:center;padding-inline:14px;color:#fff;font-weight:500;font-size:var(--fs-body);white-space:nowrap;overflow:hidden;transition:width 1.1s cubic-bezier(.5,.1,.3,1)}
.fr-t1 .fr-bar{background:var(--navy)}
.fr-t2 .fr-bar{background:#86a6f5}
.fr-roy{position:absolute;inset-block:0;inset-inline-start:0;width:0;background:var(--royal);border-radius:0 6px 6px 0;transition:width .9s cubic-bezier(.5,.1,.3,1) 1.4s}
.fr-bars.in .fr-t1 .fr-bar{width:100%}
.fr-bars.in .fr-t2 .fr-bar{width:12%;transition-delay:.5s}
.fr-bars.in .fr-roy{width:7.2%}
.fr-lab{position:absolute;inset-block:0;inset-inline-start:calc(12% + 14px);display:flex;align-items:center;gap:8px;color:var(--navy);font-size:var(--fs-body);opacity:0;transition:opacity .5s 2.2s}
.fr-bars.in .fr-lab{opacity:1}
.fr-lab i{flex:none;width:14px;height:14px;border-radius:3px;background:var(--royal)}
.svc p.fr-ex{margin:0;max-width:none;font-size:var(--fs-small);color:var(--text-soft)}
.svc p.fr-big{max-width:none;margin-top:clamp(26px,3vw,40px);font-family:var(--f-head);font-size:var(--fs-h3);line-height:1.1;color:var(--navy)}
.svc p.fr-big+p{margin-top:12px}
@media (max-width:560px){.fr-row{grid-template-columns:1fr;gap:6px}.fr-lab{font-size:var(--fs-small)}}

.fr-shops{max-width:760px;margin:clamp(26px,3vw,40px) auto clamp(26px,3vw,40px)}
.fr-row10{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:clamp(4px,1vw,12px);align-items:end;padding-bottom:12px;border-bottom:2px solid var(--navy)}
.fr-row10 svg{width:100%;height:auto;opacity:0;transform:translateY(14px) scale(.9);transition:opacity .35s,transform .45s cubic-bezier(.3,1.5,.5,1)}
.fr-row10 path,.fr-row10 rect{fill:none;stroke:var(--navy);stroke-width:2;stroke-linejoin:round}
.fr-row10 .aw{fill:rgba(49,87,190,.15);stroke:none}
.fr-row10 svg:last-child path,.fr-row10 svg:last-child rect{stroke:var(--royal);stroke-width:2.6}
.fr-row10 svg:last-child .aw{fill:var(--royal)}
.fr-shops.in svg{opacity:1;transform:none}
.fr-shops.in svg:nth-child(2){transition-delay:.12s}.fr-shops.in svg:nth-child(3){transition-delay:.24s}.fr-shops.in svg:nth-child(4){transition-delay:.36s}.fr-shops.in svg:nth-child(5){transition-delay:.48s}.fr-shops.in svg:nth-child(6){transition-delay:.6s}.fr-shops.in svg:nth-child(7){transition-delay:.72s}.fr-shops.in svg:nth-child(8){transition-delay:.84s}.fr-shops.in svg:nth-child(9){transition-delay:.96s}.fr-shops.in svg:nth-child(10){transition-delay:1.25s}
.svc p.fr-cap{display:flex;justify-content:space-between;max-width:none;margin:8px 0 0;font-size:var(--fs-small);color:var(--text-soft)}
.fr-cap b{color:var(--royal);font-weight:500}
.fr-bars.reveal,.fr-shops.reveal{opacity:1;transform:none}
html.no-motion .fr-bars .fr-bar,html.ro-edit .fr-bars .fr-bar{transition:none}
html.no-motion .fr-t1 .fr-bar,html.ro-edit .fr-t1 .fr-bar{width:100%}
html.no-motion .fr-t2 .fr-bar,html.ro-edit .fr-t2 .fr-bar{width:12%}
html.no-motion .fr-roy,html.ro-edit .fr-roy{width:7.2%;transition:none}
html.no-motion .fr-lab,html.ro-edit .fr-lab,html.no-motion .fr-row10 svg,html.ro-edit .fr-row10 svg{opacity:1;transform:none;transition:none}
@media (prefers-reduced-motion:reduce){.fr-t1 .fr-bar{width:100%}.fr-t2 .fr-bar{width:12%}.fr-roy{width:7.2%}.fr-bar,.fr-roy{transition:none}.fr-lab,.fr-row10 svg{opacity:1;transform:none;transition:none}}

/* ---------- סטארטאפים: "מה חשוב בכל שלב" - מסלול אנכי שמתמלא בגלילה, ממורכז בעמוד ---------- */
.st-path{position:relative;max-width:640px;margin:clamp(14px,2.4vw,30px) auto 0;padding-inline-start:clamp(52px,6vw,70px);text-align:start;--p:0}
.st-path::before,.st-path .st-fill{content:"";position:absolute;top:10px;bottom:10px;inset-inline-start:clamp(17px,2vw,21px);width:2px;background:var(--line-light)}
.st-path .st-fill{background:var(--royal);transform-origin:top;transform:scaleY(var(--p))}
.st-path ol{list-style:none;margin:0;padding:0;display:grid;gap:clamp(26px,3.4vw,40px)}
.st-path li{position:relative;margin:0;padding:0}
.st-path li::before{content:attr(data-n);position:absolute;top:-2px;inset-inline-start:calc(-1 * clamp(52px,6vw,70px));width:clamp(36px,4vw,44px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font-size:var(--fs-small);font-weight:500;background:var(--paper);color:var(--navy);border:2px solid var(--navy);transition:background .3s,color .3s,border-color .3s}
.st-path li.on::before{background:var(--royal);border-color:var(--royal);color:#fff}
.st-path .when{display:block;font-size:var(--fs-small);font-weight:500;color:var(--royal);margin-bottom:4px}
.st-path strong{display:block;font-family:var(--f-head);font-weight:400;font-size:clamp(1.5rem,1.9vw,2.2rem);line-height:1.05;color:var(--navy);margin-bottom:.3em}
.st-path li:last-child strong{color:var(--royal)}
.st-path .t{display:block;color:var(--text-soft);font-size:var(--fs-body)}

/* ---------- סטארטאפים: "הקוד שייך לחברה" - מוקדם מול מאוחר, עם פס לחץ ---------- */
.ip-vs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,20px);max-width:760px;margin:clamp(22px,3vw,34px) auto 0;text-align:start}
.ip-side{border-radius:14px;padding:clamp(22px,3vw,36px);display:flex;flex-direction:column;gap:10px}
.ip-side .when{font-size:var(--fs-small);font-weight:500}
.ip-side strong{font-family:var(--f-head);font-weight:400;font-size:clamp(1.8rem,2.6vw,2.7rem);line-height:1}
.ip-side .t{font-size:var(--fs-body)}
.ip-early{background:#fff;border:1px solid var(--line-light)}
.ip-early .when{color:var(--royal)}.ip-early strong{color:var(--navy)}.ip-early .t{color:var(--text-soft)}
.ip-late{background:var(--logo-navy)}
.ip-late .when{color:#86a6f5}.ip-late strong{color:#fff}.ip-late .t{color:var(--on-dark-soft)}
.ip-bar{display:block;height:6px;border-radius:3px;background:var(--line-light);overflow:hidden;margin-top:auto}
.ip-late .ip-bar{background:rgba(255,255,255,.14)}
.ip-bar i{display:block;height:100%;width:0;background:var(--royal);transition:width 1.2s var(--ease-out) .5s}
.ip-late .ip-bar i{background:#e86a5a}
.ip-vs.in .ip-early .ip-bar i{width:25%}.ip-vs.in .ip-late .ip-bar i{width:92%}
.ip-bar-l{font-size:var(--fs-small);color:var(--text-soft)}.ip-late .ip-bar-l{color:var(--on-dark-soft)}
@media (max-width:640px){.ip-vs{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.ip-bar i{transition:none}}
html.no-motion .st-path .st-fill,html.ro-edit .st-path .st-fill{transform:none}
html.no-motion .st-path li::before,html.ro-edit .st-path li::before{background:var(--royal);border-color:var(--royal);color:#fff}
html.no-motion .ip-early .ip-bar i,html.ro-edit .ip-early .ip-bar i{width:25%;transition:none}
html.no-motion .ip-late .ip-bar i,html.ro-edit .ip-late .ip-bar i{width:92%;transition:none}
/* commercial lease: a faint drawing of office buildings in the empty space beside the questions */
.lease-qs-wrap{position:relative}
.lease-city{position:absolute;inset-inline-end:4%;bottom:1px;height:74%;width:auto;max-width:42%;object-fit:contain;object-position:bottom;opacity:.32;pointer-events:none}
@media (max-width:900px){.lease-city{display:none}}
.svc p.lease-intro{max-width:none} /* the second line starts at "לפני שחותמים" and stays one line */

/* ---------- משא ומתן: "מה מתכננים לפני השולחן" - דף נייר של הכנה לפגישה, עם סימני וי ---------- */
.np-pad .agr-sheet.reveal{opacity:1;transform:none}
.np-pad-h{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding-bottom:16px;border-bottom:3px double var(--navy);margin-bottom:6px}
.svc .np-pad-h h3{font-family:var(--f-body);font-weight:500;font-size:var(--fs-h3);line-height:1.1;color:var(--navy);margin:0}
.np-pad-h span{font-family:var(--f-body);font-weight:500;font-size:var(--fs-small);color:var(--royal)}
.np-ticks{display:grid;margin:0;padding:0;list-style:none}
.svc .agr .np-ticks li{counter-increment:none;display:grid;grid-template-columns:26px minmax(0,1fr);gap:16px;align-items:start;padding:14px 0;margin:0;border-bottom:1px dotted rgba(28,27,69,.3);font-size:var(--fs-body);color:var(--text-soft)}
.svc .agr .np-ticks li::before{content:none;display:none}
.svc .agr .np-ticks li:last-child{border-bottom:0}
.np-ticks strong{font-weight:500;color:var(--navy)}
.np-box{width:24px;height:24px;margin-top:.15em;overflow:visible}
.np-box rect{fill:none;stroke:var(--navy);stroke-width:1.6}
.np-box path{fill:none;stroke:var(--royal);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.np-pad .in .np-box path{transition:stroke-dashoffset .35s var(--ease-out);stroke-dashoffset:0}
.np-pad .in li:nth-child(2) .np-box path{transition-delay:.25s}.np-pad .in li:nth-child(3) .np-box path{transition-delay:.5s}.np-pad .in li:nth-child(4) .np-box path{transition-delay:.75s}.np-pad .in li:nth-child(5) .np-box path{transition-delay:1s}.np-pad .in li:nth-child(6) .np-box path{transition-delay:1.25s}
.svc p.np-gap{margin-top:clamp(26px,3vw,40px);font-size:var(--fs-body);color:var(--navy)}
.np-gap b{display:block;margin-top:6px;font-family:var(--f-body);font-weight:500;font-size:var(--fs-h3);line-height:1.25;color:var(--royal)}
html.no-motion .np-box path,html.ro-edit .np-box path{stroke-dashoffset:0;transition:none}
@media (prefers-reduced-motion:reduce){.np-box path{stroke-dashoffset:0;transition:none}}

/* ---------- משא ומתן: "ליד השולחן או מאחורי הקלעים" - מתג ושלוש דמויות שזזות ---------- */
.np-switch{max-width:760px;margin:clamp(18px,2.6vw,30px) auto 0}
.np-sw{display:inline-flex;flex-wrap:wrap;justify-content:center;border:1px solid var(--line-light);border-radius:999px;padding:4px}
.np-sw button{all:unset;cursor:pointer;padding:10px 22px;border-radius:999px;font-weight:500;font-size:var(--fs-body);color:var(--navy);transition:background .25s,color .25s}
.np-sw button[aria-pressed=true]{background:var(--logo-navy);color:#fff}
.np-sw button:focus-visible{outline:2px solid var(--royal);outline-offset:2px}
.np-stage{position:relative;display:block;height:200px;margin-top:10px}
.np-ln{position:absolute;top:84px;height:0;border-top:3px solid var(--royal)}
.np-ln.a{inset-inline-start:calc(14% + 50px);width:calc(36% - 100px);border-top-style:dashed;border-top-color:var(--royal-soft)}
.np-ln.b{inset-inline-start:calc(50% + 50px);width:calc(36% - 100px)}
.np-ln span{position:absolute;top:10px;inset-inline:0;text-align:center;font-size:var(--fs-small);font-weight:500;color:var(--royal);white-space:nowrap}
.np-who{position:absolute;top:34px;inset-inline-start:calc(var(--x) - 50px);width:100px;height:100px;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:500;font-size:var(--fs-small);line-height:1.1;transition:inset-inline-start .7s var(--ease-out),scale .7s var(--ease-out)}
.np-who.you{background:var(--royal);color:#fff}
.np-who.law{background:var(--logo-navy);color:#fff}
.np-who.other{background:var(--paper);color:var(--navy);box-shadow:inset 0 0 0 2px var(--navy);--x:86%}
.np-stage[data-mode=table] .you{--x:14%}.np-stage[data-mode=table] .law{--x:50%}
.np-stage[data-mode=back] .you{--x:50%}.np-stage[data-mode=back] .law{--x:14%;scale:.82}
.np-cap{position:absolute;bottom:4px;inset-inline:0;text-align:center;font-size:var(--fs-small);color:var(--text-soft)}
.np-say{min-height:4.4em;margin-top:8px}
.svc .np-say p{margin:0 auto;font-size:var(--fs-body);color:var(--navy)}
.np-say strong{font-weight:500}
.np-say p:not([hidden]){animation:ex-in .45s var(--ease-out)}
.svc-center .note.note-navy{text-align:start;max-width:760px;margin-inline:auto;font-size:var(--fs-body)}
html.no-motion .np-who,html.ro-edit .np-who{transition:none}
@media (prefers-reduced-motion:reduce){.np-who{transition:none}.np-say p:not([hidden]){animation:none}}
@media (max-width:560px){
  .np-stage{height:170px}
  .np-who{width:74px;height:74px;inset-inline-start:calc(var(--x) - 37px);top:30px;font-size:.8rem}
  .np-ln{top:66px}
  .np-ln.a{inset-inline-start:calc(14% + 37px);width:calc(36% - 74px)}.np-ln.b{inset-inline-start:calc(50% + 37px);width:calc(36% - 74px)}
  .np-ln span{display:none}
}

/* ---------- משא ומתן: "שלב אחר שלב" - מעגל שחוזר לעסקה הבאה ---------- */
.np-cyc{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;max-width:880px;margin:clamp(18px,2.6vw,30px) auto clamp(26px,3vw,40px);text-align:start}
.np-cyc.reveal{opacity:1;transform:none}
.np-cyc svg{width:100%;height:auto;overflow:visible}
.np-track{fill:none;stroke:var(--line-light);stroke-width:2}
.np-back{fill:none;stroke:var(--royal);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.np-head{fill:none;stroke:var(--royal);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.np-lbl{font-family:var(--f-body);font-size:15px;font-weight:500;fill:var(--royal);opacity:0}
.np-dot circle{fill:#fff;stroke:var(--navy);stroke-width:2;transition:fill .35s,stroke .35s}
.np-dot text{font-family:var(--f-head);font-size:18px;fill:var(--navy);text-anchor:middle;dominant-baseline:central;transition:fill .35s}
.np-cyc.in .np-dot circle{fill:var(--logo-navy);stroke:var(--logo-navy)}
.np-cyc.in .np-dot text{fill:#fff}
.np-cyc.in .np-dot:nth-of-type(2) *{transition-delay:.25s}.np-cyc.in .np-dot:nth-of-type(3) *{transition-delay:.5s}.np-cyc.in .np-dot:nth-of-type(4) *{transition-delay:.75s}.np-cyc.in .np-dot:nth-of-type(5) *{transition-delay:1s}
.np-cyc.in .np-back{transition:stroke-dashoffset .8s var(--ease-out) 1.35s;stroke-dashoffset:0}
.np-cyc.in .np-head,.np-cyc.in .np-lbl{transition:opacity .3s 2s;opacity:1}
.np-cyc ol{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.np-cyc li{display:grid;grid-template-columns:2.2em minmax(0,1fr);gap:10px;align-items:baseline}
.np-cyc li>span{font-family:var(--f-head);font-size:var(--fs-h3);line-height:1;color:var(--royal)}
.svc .np-cyc li p{margin:0;max-width:none;font-size:var(--fs-body)}
.np-cyc li strong{font-weight:500;color:var(--navy)}
html.no-motion .np-back,html.ro-edit .np-back{stroke-dashoffset:0;transition:none}
html.no-motion .np-head,html.no-motion .np-lbl,html.ro-edit .np-head,html.ro-edit .np-lbl{opacity:1;transition:none}
@media (prefers-reduced-motion:reduce){.np-back{stroke-dashoffset:0;transition:none}.np-head,.np-lbl{opacity:1;transition:none}}
@media (max-width:700px){.np-cyc{grid-template-columns:minmax(0,1fr)}.np-cyc svg{max-width:260px;justify-self:center}}

/* ---------- משא ומתן: "קיבלתם טיוטה" - מסמנים את 3 השאלות לפני שעונים ---------- */
.np-check{max-width:760px;margin:clamp(18px,2.6vw,30px) auto 0;border:0;background:#fff;border-radius:14px;box-shadow:0 0 0 1px var(--line-light);padding:clamp(10px,1.6vw,16px) clamp(16px,2.6vw,28px);text-align:start}
.np-check-h{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-bottom:2px solid var(--navy);font-weight:500;font-size:var(--fs-h3);line-height:1.2;color:var(--navy)}
.np-check-h output{font-size:var(--fs-small);color:var(--royal);white-space:nowrap}
.np-check label{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;align-items:start;padding-block:16px;border-bottom:1px solid var(--line-light);cursor:pointer;color:var(--navy);font-size:var(--fs-body)}
.np-check label:last-child{border-bottom:0}
.np-check input{appearance:none;width:26px;height:26px;margin:1px 0 0;border:2px solid var(--navy);border-radius:7px;display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s}
.np-check input::after{content:"";width:12px;height:6px;border-inline-start:3px solid #fff;border-bottom:3px solid #fff;rotate:-45deg;translate:0 -2px;scale:0;transition:scale .2s cubic-bezier(.3,1.6,.5,1)}
.np-check input:checked{background:var(--royal);border-color:var(--royal)}
.np-check input:checked::after{scale:1}
.np-check input:focus-visible{outline:2px solid var(--royal);outline-offset:3px}
.np-ready{max-width:760px;margin:clamp(20px,3vw,30px) auto 0;border-radius:14px;padding:clamp(18px,2.6vw,28px);background:rgba(49,87,190,.07);color:var(--navy);text-align:start;transition:background .5s,color .5s}
.np-ready strong{display:block;font-weight:500;font-size:var(--fs-h3);line-height:1.2;margin-bottom:.3em;color:var(--royal);transition:color .5s}
.svc .np-ready p{margin:0;max-width:none;color:inherit;font-size:var(--fs-body)}
.np-ready.go{background:var(--royal);color:#fff}
.np-ready.go strong{color:#fff}
html.ro-layout .lease-city{pointer-events:auto;z-index:2} /* the layout editor can pick and resize the drawing */