/* =====================================================================
   האתר של עו"ד ונוטריון עמית טוכמן · amit-lawfirm.co.il
   מקור: פיגמה 6HGIZznAKY2kJANcyMhW6x · דסקטופ 13:318 (1280) · מובייל 47:495 (393)
   שפה: branding/עמית טוכמן/שפה-עיצובית/שפה-עיצובית-עמית-טוכמן.md

   איך הפריסה עובדת:
   - מובייל (עד 1023px): זרימה רגילה, המרווחים נמדדו מ-47:495.
   - דסקטופ (1024 ומעלה): כל בלוק ממוקם לפי הקואורדינטות של 13:318.
     --t = top בתוך הסקשן, --s = המרחק מהקצה הימני (inline-start), --w = רוחב.
     הכל מוכפל ב---u, שהוא 1px ב-1280 ומעלה ויורד יחסית מתחת (100cqw/1280),
     כך ש-1280 הוא אחד-לאחד ו-1024 הוא הקטנה אחידה של אותו עיצוב.
   ===================================================================== */

/* ---------- גופנים: Fb SingulariHeb (עברית) + SingulariEn (לטינית), woff2 מקומי ----------
   🔴 הפיגמה כתובה ב-Fb ElectronSans Heb, שהקבצים שלו לא קיימים בסביבה (ראה README, פתוחים).
   Singulari הוא הגופן השני של אותו עיצוב, ואותו משתמשת מערכת המשרד. */
@font-face{font-family:'TK';src:url('/fonts/tk-heb-300.woff2') format('woff2');font-weight:300 400;font-display:swap;unicode-range:U+0020-0040,U+005B-0060,U+007B-007E,U+00A0,U+0590-05FF,U+FB1D-FB4F,U+20AA,U+2010-2027,U+200E-200F}
@font-face{font-family:'TK';src:url('/fonts/tk-heb-500.woff2') format('woff2');font-weight:500 900;font-display:swap;unicode-range:U+0020-0040,U+005B-0060,U+007B-007E,U+00A0,U+0590-05FF,U+FB1D-FB4F,U+20AA,U+2010-2027,U+200E-200F}
@font-face{font-family:'TK';src:url('/fonts/tk-en-300.woff2') format('woff2');font-weight:300 400;font-display:swap;unicode-range:U+0041-005A,U+0061-007A,U+0040,U+00C0-00FF}
@font-face{font-family:'TK';src:url('/fonts/tk-en-400.woff2') format('woff2');font-weight:500 900;font-display:swap;unicode-range:U+0041-005A,U+0061-007A,U+0040,U+00C0-00FF}

:root{
  --forest:#0C1E1A;
  --cream:#F3EEE6;
  --sand:#D0B68B;
  /* 🔴 בפיגמה ה-placeholder הוא הזהב ב-34%, ניגודיות 2.1:1. כאן זו תווית אמיתית, ולכן 72% (5.1:1, WCAG AA) */
  --sand-label:rgba(208,182,139,.72);
  --sand-hair:rgba(208,182,139,.28);
  --white:#FFFFFF;
  --font:'TK','Segoe UI',Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--forest);color:var(--cream);font-family:var(--font);font-weight:300;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
h1,h2,h3,p,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit}
address{font-style:normal}

.page{container-type:inline-size;overflow-x:clip}

/* ---------- נגישות ---------- */
/* 🔴 clip ולא left:-9999px: אלמנט מחוץ למסך מרנדר את כל הדף שחור בצילום headless */
.sr-only,.hp{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:absolute;inset-inline-start:16px;top:16px;z-index:100;padding:12px 16px;background:var(--sand);color:var(--forest);
  font-size:18px;font-weight:500;text-decoration:none;border-radius:4px;transform:translateY(-200%);}
.skip:focus{transform:none;outline:3px solid var(--cream);outline-offset:3px}
main:focus,.s-form:focus,.thanks:focus{outline:none}

:focus-visible{outline:3px solid var(--cream);outline-offset:3px}
.sec-cream :focus-visible{outline-color:var(--forest)}

/* ---------- טיפוגרפיה (מובייל) ---------- */
/* 🔴 גדלי הטקסט במובייל מוכפלים גם הם ב-0.8125 מול הפיגמה, מאותה סיבה:
   Singulari רחב מ-ElectronSans, ובלי זה כל כותרת נשברת לשורה נוספת והעמוד
   מתארך בכ-1000px מעבר למסגרת 47:495. */
.h{font-weight:500;font-size:32.5px;line-height:1.063;color:var(--cream)}
.sec-cream .h{color:var(--forest)}
.h-sand{color:var(--sand)!important}
.body{font-weight:300;font-size:19.5px;line-height:1.125;color:var(--cream)}
.sec-cream .body{color:var(--forest)}
.body-white{color:var(--white)!important}
.d{display:none}                   /* שבירת שורה של הדסקטופ בלבד */

/* ---------- כפתורים ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:16px;border:0;border-radius:4px;
  font-family:inherit;font-weight:300;font-size:17px;line-height:1.1;text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:filter .15s ease, transform .15s ease}
.btn-sand{background:var(--sand);color:var(--forest)}
.btn-forest{background:var(--forest);color:var(--white)}
.btn:hover{filter:brightness(1.08)}
.btn-forest:hover{filter:brightness(1.6)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{background:rgba(208,182,139,.34);cursor:progress;filter:none}
.btn-sand:focus-visible{outline-color:var(--cream)}
.btn-forest:focus-visible{outline-color:var(--forest)}

/* ---------- כותרת האתר ---------- */
.site-header{background:var(--forest);height:64px;display:flex;align-items:center;padding-inline:24px;position:relative;z-index:5}
.brand{display:inline-block;border-radius:2px}
.brand img{height:28px;width:auto}

/* ---------- סקשנים ---------- */
.sec{position:relative}
.sec-dark{background:var(--forest);color:var(--cream)}
.sec-cream{background:var(--cream);color:var(--forest)}
.media{position:relative;overflow:hidden}
.media img{width:100%;height:100%;object-fit:cover}

/* המובייל: טור הטקסט 289px ב-393 (קצה ימני 341), עד 560px בטאבלט */
.in{width:min(100% - 104px, 560px);margin-inline:auto}

/* ================== מובייל · 47:495 ================== */
.m-hero{height:498px}
.m-hero img{object-position:0% 50%}
.s-hero .in{width:min(100% - 47px, 607px);margin-inline:47px auto;padding-top:37px}
/* 🔴 סטייה מתועדת: Singulari רחב מ-ElectronSans שבפיגמה, ולכן הכותרת ב-40px
   הייתה נשברת לשלוש שורות במקום שתיים. הגודל יורד עם רוחב המסך כדי לשמור
   על מבנה שתי השורות של 47:495. ב-393 זה 33.8px. */
.s-hero .h{font-size:min(32.5px, 7.6vw);white-space:nowrap}
.hero-sub{margin-top:13px;font-size:26px;line-height:1.1;max-width:299px}
.hero-cta{margin-top:27px;min-width:260px;height:51px}

.s-svc .in{width:min(100%, 360px);padding-top:103px;padding-bottom:0}
.svc{display:grid;grid-template-columns:repeat(3,1fr);row-gap:49px}
.svc-i,.pil-i{display:flex;flex-direction:column;align-items:center;text-align:center}
.ico{display:flex;align-items:center;justify-content:center}
.svc .ico{height:35px}
.svc .ico img{width:calc(var(--iw) * .5px);height:calc(var(--ih) * .5px)}
.svc .cap{margin-top:22px;font-size:19.5px;line-height:1.125}

.m-war{margin-top:156px;height:427px}
.m-war img{object-position:38% 50%}
.s-war .in{padding-top:38px}
.s-war .body{margin-top:8px}
.war-cta{margin-top:23px;min-width:260px;height:51px}
.s-war{padding-bottom:104px}

.m-precise{height:323px}
.m-precise img{object-position:0% 50%}
.s-precise .in{padding-top:28px}
.s-precise .body{margin-top:4px;max-width:309px}
.precise-cta{margin-top:28px;min-width:294px;height:58px}
.s-precise{padding-bottom:124px}

.m-why{height:408px}
.m-why img{object-position:86% 50%}
.s-why .in{padding-top:46px}
.s-why .body{margin-top:3px}
.pil{display:grid;grid-template-columns:1fr 1fr;row-gap:62px;margin-top:56px;width:min(100%, 289px)}
.pil .ico{height:47px}
.pil .ico img{width:calc(var(--iw) * .85px);height:calc(var(--ih) * .85px)}
.pil .cap{margin-top:14px;font-size:17px;line-height:1.1}
.why-cta{margin-top:66px;min-width:260px;height:51px}
.s-why{padding-bottom:77px}

.s-how .in{padding-top:73px}
.steps{margin-top:9px;position:relative}
.step{position:relative;padding-inline-start:31px}
.step + .step{margin-top:24px}
.step::before{content:"";position:absolute;inset-inline-start:0;top:4px;width:14px;height:14px;border-radius:50%;background:var(--forest)}
.step:not(:last-child)::after{content:"";position:absolute;inset-inline-start:6px;top:11px;width:2px;height:calc(100% + 24px);background:var(--forest)}
.step-t{font-weight:500;font-size:19.5px;line-height:1.125;color:var(--forest);max-width:230px}
.step-d{font-weight:300;font-size:19.5px;line-height:1.125;color:var(--forest);max-width:257px}
.how-cta{margin-top:67px;min-width:294px;height:58px}
.s-how{padding-bottom:124px}

.m-time{height:295px}
.s-time .in{padding-top:38px}
.s-time .h{line-height:.969;max-width:238px}
.s-time .body{margin-top:6px;max-width:238px}
.s-time{padding-bottom:81px}
.s-time .h br{display:none}

.s-form{padding-bottom:120px}
.s-form .in{padding-top:59px}
.s-form .body{margin-top:6px;max-width:279px}
.form-col{margin-top:48px}

/* ---------- הטופס ---------- */
.lead-form{display:flex;flex-direction:column}
.field{position:relative}
.field + .field{margin-top:23px}
.field input{display:block;width:100%;height:46px;margin:0;padding:12px 31px 0 16px;border:1px solid var(--sand);border-radius:0;
  background:transparent;color:var(--cream);font-family:inherit;font-weight:300;font-size:17px;line-height:1.1;outline:none;
  box-shadow:none;transition:box-shadow .15s ease}
.field input[type="email"]{text-align:right}
.field label{position:absolute;inset-inline-start:31px;top:50%;transform:translateY(-50%);color:var(--sand-label);
  font-size:17px;line-height:1;pointer-events:none;transition:top .15s ease, font-size .15s ease, transform .15s ease}
.field .opt{font-size:.8em}
.field input:focus{box-shadow:inset 0 0 0 1px var(--sand)}          /* 2px בזהב בפוקוס, בלי קפיצת פריסה */
.field input:focus-visible{outline:2px solid var(--cream);outline-offset:3px}
.field input:focus + label,.field input:not(:placeholder-shown) + label{top:8px;transform:none;font-size:13px;color:var(--sand)}
.field input[aria-invalid="true"]{border-style:dashed;box-shadow:inset 0 0 0 1px var(--sand)}
.f-err{margin-top:6px;font-size:16px;line-height:1.3;color:var(--cream)}
.f-err::before{content:"";display:inline-block;width:8px;height:8px;margin-inline-end:8px;background:var(--sand);transform:rotate(45deg) translateY(-2px)}

.consent{display:flex;align-items:flex-start;gap:12px;margin-top:20px}
.consent + .f-err-consent{margin-top:6px}
.consent input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:0;border:1px solid var(--sand);border-radius:0;
  background:transparent;cursor:pointer;display:grid;place-content:center}
.consent input::after{content:"";width:12px;height:12px;background:var(--sand);transform:scale(0);transition:transform .12s ease}
.consent input:checked::after{transform:scale(1)}
.consent input[aria-invalid="true"]{border-style:dashed;border-width:2px}
.consent label{font-size:16px;line-height:1.4;color:var(--cream);cursor:pointer;padding-top:1px}
.privacy-note{margin-top:14px;font-size:15px;line-height:1.4;color:var(--sand-label)}
.privacy-note a{color:var(--sand)}
.btn-submit{margin-top:24px;width:100%;height:51px}
.form-status{margin-top:16px;padding:12px 16px;border:1px dashed var(--sand);font-size:17px;line-height:1.4;color:var(--cream)}
.btn-retry{margin-top:8px;padding:8px 0;min-height:32px;background:none;border:0;border-bottom:1px solid var(--sand);color:var(--sand);
  font-family:inherit;font-size:17px;font-weight:500;cursor:pointer}

.thanks{padding:24px 0 8px;border-top:1px solid var(--sand-hair)}
.thanks-t{font-weight:500;font-size:26px;line-height:1.1;color:var(--sand)}
.thanks-d{margin-top:8px;font-size:22px;line-height:1.3;color:var(--white)}
.thanks-next{margin-top:24px;font-size:20px;line-height:1.4;color:var(--cream)}
.thanks-next a{color:var(--sand);font-weight:500}
.thanks-note{margin-top:4px;font-size:15px;color:var(--sand-label)}

/* ---------- פוטר ---------- */
.site-footer{background:var(--forest);border-top:1px solid var(--sand-hair)}
.foot{width:min(100% - 48px, 1096px);margin-inline:auto;padding:40px 0 48px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.foot-logo{height:32px;width:auto}
.foot-contact{font-size:17px;line-height:1.5;color:var(--cream)}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.foot-nav a{display:inline-flex;align-items:center;min-height:24px;padding:4px 0;font-size:17px;color:var(--sand);text-underline-offset:4px}
.foot-copy{font-size:15px;color:var(--sand-label)}

.m-only{}
@media (max-width:1023px){ .a{position:static} }

/* ================== דסקטופ · 13:318 ================== */
@media (min-width:1024px){
  .page{--u:min(1px, calc(100cqw / 1280))}
  .d{display:inline}
  .m-only{display:none!important}

  /* 🔴 סטייה מתועדת מהפיגמה: Fb ElectronSans (שאין לנו) צר בכ-23% מ-Singulari.
     כל גדלי הטקסט בדסקטופ מוכפלים ב-0.8125, כך שכל בלוק טקסט תופס את אותה
     תיבה כמו בפיגמה ושומר על אותו מבנה שורות. הגאומטריה עצמה נשארת 1:1. */
  .h{font-size:calc(52 * var(--u));line-height:.9615}
  .h-tight{line-height:.876}
  .body{font-size:calc(26 * var(--u));line-height:1.1}
  /* הריפוד מפצה על הטקסט הקטן יותר, כדי לשמור על גובה הכפתור 67 שבפיגמה */
  .btn{font-size:calc(26 * var(--u));padding:calc(19 * var(--u)) calc(16 * var(--u));height:auto;width:auto}
  .btn-submit{width:100%;height:auto}

  .site-header{position:absolute;inset-inline:0;top:0;height:auto;padding:0;background:none;z-index:6}
  .brand{position:absolute;top:calc(48 * var(--u));inset-inline-start:max(calc(92 * var(--u)), calc(50% - 548 * var(--u)))}
  .brand img{height:calc(44 * var(--u))}

  .sec{height:calc(var(--h) * var(--u));overflow:clip;padding:0!important}
  .in{position:relative;width:calc(1280 * var(--u));max-width:none;height:100%;margin-inline:auto;padding:0!important}
  .a{position:absolute;top:calc(var(--t) * var(--u));inset-inline-start:calc(var(--s) * var(--u));margin:0!important}
  .a:not(.btn){padding:0!important}
  .a[style*="--w"]{width:calc(var(--w) * var(--u));max-width:none}
  .nowrap-d{white-space:nowrap}

  .media{position:absolute;top:0;height:100%;margin:0!important}
  /* תמונה בצד שמאל: מהקצה השמאלי של המסך עד 664 (במרכז +24) */
  .m-hero,.m-precise,.m-time{inset-inline-end:0}
  /* תמונה בצד ימין: מ-664 עד הקצה הימני */
  .m-war,.m-why{inset-inline-start:0;width:calc(50% - 24 * var(--u))}

  .s-hero{--h:740}
  .m-hero{top:calc(-10 * var(--u));height:calc(676 * var(--u));width:calc(50% + 36 * var(--u));inset-inline-end:calc(3 * var(--u))}
  .m-hero img{object-position:50% 50%}
  .s-hero .in{width:calc(1280 * var(--u));margin-inline:auto}
  .s-hero .in{padding-top:0}
  .hero-sub{max-width:none}

  .s-svc{--h:419}
  .s-svc .in{width:calc(1280 * var(--u))}
  .svc{display:block;position:absolute;inset:0}
  .svc-i{position:absolute;top:calc(101 * var(--u));inset-inline-start:calc((var(--c) - 90) * var(--u));width:calc(180 * var(--u))}
  .svc .ico{height:calc(71 * var(--u))}
  .svc .ico img{width:calc(var(--iw) * var(--u));height:calc(var(--ih) * var(--u))}
  .svc .cap{margin-top:calc(43 * var(--u));font-size:calc(26 * var(--u));line-height:1.1}

  .s-war{--h:632}
  .m-war img{object-position:0% 50%}

  .s-precise{--h:734}
  .m-precise{width:calc(50% + 24 * var(--u))}
  .m-precise img{object-position:73.2% 0%}

  .s-why{--h:728}
  .m-why img{object-position:80.8% 50%}
  .pil{display:block;position:absolute;inset:0;margin:0;width:auto}
  .pil-i{position:absolute;top:calc(448 * var(--u));inset-inline-start:calc((var(--c) - 70) * var(--u));width:calc(140 * var(--u))}
  .pil .ico{height:calc(53 * var(--u))}
  .pil .ico img{width:calc(var(--iw) * var(--u));height:calc(var(--ih) * var(--u))}
  .pil .cap{margin-top:calc(16 * var(--u));font-size:calc(17 * var(--u));line-height:1.1}

  .s-how{--h:723}
  .step{padding-inline-start:calc(43 * var(--u))}
  .step + .step{margin-top:calc(32 * var(--u))}
  .step::before{top:calc(-2 * var(--u));width:calc(14 * var(--u));height:calc(14 * var(--u))}
  .step:not(:last-child)::after{inset-inline-start:calc(6 * var(--u));top:calc(5 * var(--u));width:calc(2 * var(--u));min-width:2px;height:calc(100% + 32 * var(--u))}
  .step-t{font-size:calc(26 * var(--u));line-height:1.1;max-width:none;white-space:nowrap}
  .step-d{margin-top:calc(4 * var(--u));font-size:calc(26 * var(--u));line-height:1.1;width:calc(var(--w) * var(--u));max-width:none}

  .s-time{--h:501}
  .m-time{width:calc(50% + 28 * var(--u))}
  .s-time .h{max-width:none}
  .s-time .h br{display:inline}
  .s-time .body{max-width:none}

  /* הטופס: בזרימה, כי ההסכמות מוסיפות גובה שלא היה בפיגמה */
  .s-form{height:auto;min-height:calc(643 * var(--u))}
  .s-form .in{height:auto;min-height:calc(643 * var(--u));padding-top:calc(177 * var(--u))!important;padding-bottom:calc(96 * var(--u))!important}
  .form-col{margin:0;margin-inline-start:calc(650 * var(--u));width:calc(499 * var(--u))}
  .field + .field{margin-top:calc(29 * var(--u))}
  .field input{height:calc(56 * var(--u));min-height:48px;padding:calc(14 * var(--u)) calc(63 * var(--u)) 0 calc(16 * var(--u));font-size:calc(18 * var(--u))}
  .field label{inset-inline-start:calc(63 * var(--u));font-size:calc(18 * var(--u))}
  .consent{margin-top:calc(24 * var(--u))}
  .consent label{font-size:max(16px, calc(17 * var(--u)))}
  .btn-submit{margin-top:calc(28 * var(--u))}

  .foot{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 40px;padding:48px 0}
  .foot-logo{height:40px}
}

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

/* ================== עמודי תוכן: נגישות, פרטיות, 404 ================== */
.doc-header{background:var(--forest);height:64px;display:flex;align-items:center;padding-inline:24px;position:relative}
.doc{width:min(100% - 48px, 760px);margin-inline:auto;padding:48px 0 64px;color:var(--cream)}
.doc h1{font-weight:500;font-size:36px;line-height:1.1;color:var(--sand)}
.doc h2{margin-top:32px;font-weight:500;font-size:24px;line-height:1.2;color:var(--cream)}
.doc p{margin-top:12px;font-size:18px;line-height:1.6}
.doc ul{margin-top:12px;padding-inline-start:20px;list-style:disc;font-size:18px;line-height:1.6}
.doc li{margin-top:8px}
.doc li::marker{color:var(--sand)}
.doc a{color:var(--sand);text-underline-offset:4px}
.doc strong{font-weight:500;color:var(--cream)}
.doc-meta{color:var(--sand-label);font-size:16px}
.doc-back{margin-top:40px;padding-top:24px;border-top:1px solid var(--sand-hair);font-size:18px}
@media (min-width:1024px){
  .doc-header{position:relative;height:88px;padding-inline:0;width:min(100% - 48px, 1096px);margin-inline:auto}
  .doc-header .brand{position:static}
  .doc-header .brand img{height:40px}
  .doc{padding:56px 0 80px}
  .doc h1{font-size:44px}
}