@import url("fonts.css");

/* ============================================================
   קמפיין חזק - גיליון סגנון ראשי
   פלטה נעולה: שחור / צהוב / אדום / נייר. פינות חדות בכל האתר.
   ============================================================ */

:root{
  --ink:#0B0B0B;
  --ink-soft:#2A2A28;
  --yellow:#FAD60D;
  --yellow-deep:#E2BE00;
  --red:#B31F1D;
  --red-deep:#8E1614;
  --paper:#FBF8F0;
  --paper-2:#F2EDE1;
  --white:#FFFFFF;
  --line:#0B0B0B;

  --wrap:1240px;
  --gut:clamp(1.15rem,4vw,2.5rem);
  --sec:clamp(3.5rem,9vw,7rem);

  --display:"Heebo","Arial Hebrew","Segoe UI",Arial,sans-serif;
  --body:"Rubik","Heebo","Segoe UI",Arial,sans-serif;

  --dur:.55s;
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  overflow-x:clip;
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:clamp(1rem,.96rem + .25vw,1.125rem);
  line-height:1.75;
  overflow-x:clip;
}

/* גרעין נייר - שכבה קבועה, לא נגררת בגלילה */
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:60;
  pointer-events:none;
  opacity:.32;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

img{max-width:100%;height:auto;display:block}

a{color:inherit}

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:900;
  line-height:1.02;
  letter-spacing:-.02em;
  margin:0;
}

p{margin:0 0 1rem}
p:last-child{margin-bottom:0}

::selection{background:var(--yellow);color:var(--ink)}

:focus-visible{
  outline:3px solid var(--red);
  outline-offset:3px;
}

/* ---------- עזרי פריסה ---------- */

.wrap{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--gut);
}

.sec{padding-block:var(--sec)}
.sec--tight{padding-block:clamp(2.5rem,6vw,4rem)}

.lede{
  font-size:clamp(1.05rem,1rem + .5vw,1.3rem);
  max-width:60ch;
  color:var(--ink-soft);
}

.center{text-align:center}
.mw-60{max-width:60ch}

/* ---------- כותרות ---------- */

.h-xl{font-size:clamp(2.6rem,1.4rem + 6.4vw,6.4rem)}
.h-lg{font-size:clamp(2rem,1.35rem + 3.2vw,4rem)}
.h-md{font-size:clamp(1.5rem,1.25rem + 1.4vw,2.35rem)}
.h-sm{font-size:clamp(1.2rem,1.1rem + .55vw,1.5rem)}

.h-mark{
  background:var(--yellow);
  padding:0 .18em .06em;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}

.h-red{color:var(--red)}

/* קו תחתון עבה מתחת לכותרת סקשן */
.rule{
  display:block;
  width:clamp(56px,9vw,110px);
  height:9px;
  background:var(--red);
  margin-bottom:1.35rem;
}
.rule--yellow{background:var(--yellow)}
.rule--ink{background:var(--ink)}

/* ---------- כפתורים ---------- */

.btn{
  --bg:var(--ink);
  --fg:var(--white);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  white-space:nowrap;
  font-family:var(--display);
  font-weight:800;
  font-size:1.02rem;
  line-height:1;
  padding:1.05rem 1.7rem;
  background:var(--bg);
  color:var(--fg);
  border:3px solid var(--ink);
  text-decoration:none;
  cursor:pointer;
  position:relative;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease),background .2s,color .2s;
  box-shadow:6px 6px 0 var(--ink);
}
.btn:hover{transform:translate(3px,3px);box-shadow:3px 3px 0 var(--ink)}
.btn:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--ink)}

.btn--red{--bg:var(--red);--fg:var(--white);border-color:var(--ink)}
.btn--yellow{--bg:var(--yellow);--fg:var(--ink)}
.btn--paper{--bg:var(--paper);--fg:var(--ink)}
.btn--ghost{
  --bg:transparent;--fg:var(--ink);
  box-shadow:none;
}
.btn--ghost:hover{--bg:var(--ink);--fg:var(--white);transform:none;box-shadow:none}

.btn-row{display:flex;flex-wrap:wrap;gap:.85rem}

/* על רקע שחור: המסגרת והצל הופכים לבנים כדי לשמור ניגודיות */
.panel .btn{border-color:var(--white);box-shadow:6px 6px 0 var(--white)}
.panel .btn:hover{box-shadow:3px 3px 0 var(--white)}
.panel .btn:active{box-shadow:0 0 0 var(--white)}
.panel .btn--ghost{--fg:var(--white);box-shadow:none}
.panel .btn--ghost:hover{--bg:var(--white);--fg:var(--ink)}

/* ---------- פס עליון ---------- */

.topline{
  background:var(--ink);
  color:var(--paper);
  font-size:.82rem;
  letter-spacing:.01em;
}
.topline .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:38px;
}
.topline a{text-decoration:none;font-weight:700}
.topline a:hover{color:var(--yellow)}
.bh{font-size:.74rem;opacity:.62;letter-spacing:.04em}
.topline-links{display:flex;gap:1.25rem;align-items:center}
@media (max-width:640px){
  .topline-links span.sep,.topline-links .office{display:none}
}

/* ---------- ניווט ---------- */

.nav{
  position:sticky;
  top:0;
  z-index:40;
  background:var(--paper);
  border-bottom:3px solid var(--ink);
}
.nav .wrap{
  display:flex;
  align-items:center;
  gap:1.25rem;
  height:74px;
}
.brand{
  display:flex;
  align-items:center;
  gap:.6rem;
  text-decoration:none;
  flex:0 0 auto;
  margin-inline-end:auto;
}
.brand .brand-cube{height:40px;width:auto}
.brand .brand-wm{height:26px;width:auto}
@media (max-width:420px){
  .brand .brand-cube{height:33px}
  .brand .brand-wm{height:21px}
}

.nav-links{
  display:flex;
  align-items:center;
  gap:1.5rem;
  list-style:none;
  margin:0;
  padding:0;
}
.nav-links a{
  text-decoration:none;
  font-family:var(--display);
  font-weight:700;
  font-size:.98rem;
  padding:.35rem 0;
  position:relative;
  white-space:nowrap;
}
.nav-links a::after{
  content:"";
  position:absolute;
  inset-inline-start:0;
  bottom:0;
  height:4px;
  width:100%;
  background:var(--red);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .28s var(--ease);
}
.nav-links a:hover::after,
.nav-links a[aria-current="page"]::after{transform:scaleX(1)}

/* תת-תפריט שירותים */
.has-sub{position:relative}
.has-sub>button{
  font:inherit;
  font-family:var(--display);
  font-weight:700;
  font-size:.98rem;
  background:none;
  border:0;
  padding:.35rem 0;
  cursor:pointer;
  color:inherit;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}
.has-sub>button svg{transition:transform .25s var(--ease)}
.has-sub[data-open="true"]>button svg{transform:rotate(180deg)}
.sub{
  position:absolute;
  top:calc(100% + 14px);
  inset-inline-end:0;
  min-width:250px;
  background:var(--ink);
  border:3px solid var(--ink);
  padding:.4rem;
  list-style:none;
  margin:0;
  display:none;
  box-shadow:8px 8px 0 rgba(11,11,11,.22);
}
.has-sub[data-open="true"] .sub{display:block}
.sub a{
  display:block;
  color:var(--paper);
  padding:.72rem .9rem;
  font-size:.95rem;
  font-weight:700;
  text-decoration:none;
}
.sub a::after{display:none}
.sub a:hover{background:var(--yellow);color:var(--ink)}

.nav-cta{flex:0 0 auto}
.nav-cta .btn{padding:.78rem 1.25rem;font-size:.95rem;box-shadow:4px 4px 0 var(--ink)}

.burger{
  display:none;
  width:52px;height:52px;
  border:3px solid var(--ink);
  background:var(--paper);
  cursor:pointer;
  padding:0;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
}
.burger span{display:block;width:24px;height:3px;background:var(--ink);transition:transform .3s var(--ease),opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

@media (max-width:1000px){
  .nav-links,.nav-cta{display:none}
  .burger{display:flex}
}

/* תפריט מלא-מסך במובייל */
.sheet{
  position:fixed;
  inset:0;
  z-index:70;
  background:var(--yellow);
  padding:calc(74px + 1.5rem) var(--gut) 2rem;
  overflow-y:auto;
  transform:translateY(-100%);
  transition:transform .42s var(--ease);
  display:flex;
  flex-direction:column;
}
.sheet[data-open="true"]{transform:translateY(0)}
.sheet ul{list-style:none;margin:0;padding:0}
.sheet>ul>li{border-bottom:3px solid var(--ink)}
.sheet a{
  display:block;
  text-decoration:none;
  font-family:var(--display);
  font-weight:900;
  font-size:clamp(1.5rem,7vw,2.1rem);
  padding:.7rem 0;
}
.sheet .sheet-sub a{
  font-size:1.02rem;
  font-weight:700;
  padding:.42rem 0 .42rem 0;
  padding-inline-start:1.1rem;
  border-inline-start:4px solid var(--ink);
  margin-bottom:.35rem;
}
.sheet .sheet-sub{padding-bottom:.9rem}
.sheet-foot{margin-top:auto;padding-top:2rem;display:grid;gap:.75rem}
.sheet-close{
  position:fixed;
  top:calc(38px + 11px);
  inset-inline-start:var(--gut);
  z-index:71;
}

/* ---------- הירו ---------- */

.hero{
  position:relative;
  background:var(--yellow);
  border-bottom:3px solid var(--ink);
  padding-block:clamp(2.4rem,5vw,4rem) clamp(2.4rem,5vw,4rem);
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  inset-block:0;
  inset-inline-end:-12%;
  width:58%;
  background:var(--ink);
  transform:skewX(-9deg);
  opacity:.055;
}
.hero-grid{
  position:relative;
  display:grid;
  gap:clamp(2rem,5vw,3.5rem);
  grid-template-columns:1.55fr .55fr;
  align-items:center;
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-art{order:-1;max-width:150px;justify-self:start}
}

.kicker{
  display:inline-block;
  font-family:var(--display);
  font-weight:800;
  font-size:.9rem;
  letter-spacing:.06em;
  background:var(--ink);
  color:var(--yellow);
  padding:.42rem .85rem;
  margin-bottom:1.1rem;
}

.hero h1{margin-bottom:1.15rem}

/* טיפוגרפיה בתנועה */
.kin{display:block;overflow:hidden;padding-bottom:.06em}
.kin>span{
  display:block;
  transform:translateY(110%);
  animation:kinUp .85s var(--ease) forwards;
}
.kin:nth-of-type(2)>span{animation-delay:.1s}
.kin:nth-of-type(3)>span{animation-delay:.2s}
@keyframes kinUp{to{transform:translateY(0)}}

.hero-sub{
  font-size:clamp(1.05rem,1rem + .55vw,1.3rem);
  font-weight:500;
  max-width:46ch;
  margin-bottom:1.9rem;
}

.hero-art{position:relative;justify-self:center;max-width:min(250px,100%);width:100%}
@media (max-width:900px){.hero-art{max-width:130px;justify-self:start;margin-bottom:.5rem}}
.hero-art img{
  width:100%;
  filter:drop-shadow(8px 10px 0 rgba(11,11,11,.14));
  animation:floaty 7s ease-in-out infinite;
}
@keyframes floaty{
  0%,100%{transform:translateY(0) rotate(0)}
  50%{transform:translateY(-14px) rotate(-2deg)}
}

/* ---------- מרקיזה ---------- */

.marq{
  background:var(--ink);
  color:var(--paper);
  border-block:3px solid var(--ink);
  overflow:hidden;
  padding-block:.9rem;
}
.marq-track{
  display:flex;
  width:max-content;
  gap:2.5rem;
  animation:marq 26s linear infinite;
}
.marq span{
  font-family:var(--display);
  font-weight:900;
  font-size:clamp(1.25rem,3.4vw,2rem);
  letter-spacing:-.01em;
  white-space:nowrap;
  display:flex;
  align-items:center;
  gap:2.5rem;
}
.marq span::after{
  content:"";
  width:14px;height:14px;
  background:var(--yellow);
  transform:rotate(45deg);
  flex:0 0 auto;
}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(50%)}}

/* ---------- בלוק שחור ---------- */

.panel{
  background:var(--ink);
  color:var(--paper);
}
.panel h2,.panel h3{color:var(--white)}
.panel .lede{color:#CFCBC1}
.panel--yellow{background:var(--yellow);color:var(--ink)}
.panel--yellow h2,.panel--yellow h3{color:var(--ink)}
.panel--yellow .lede{color:var(--ink-soft)}

/* ---------- כרטיסי שירות ---------- */

.svc{
  display:grid;
  gap:0;
  grid-template-columns:repeat(2,1fr);
  border:3px solid var(--ink);
  background:var(--ink);
}
.svc>*{background:var(--paper)}
.svc{gap:3px}
@media (max-width:760px){.svc{grid-template-columns:1fr}}

.svc-item{
  display:flex;
  flex-direction:column;
  gap:.7rem;
  padding:clamp(1.6rem,3.4vw,2.4rem);
  text-decoration:none;
  position:relative;
  overflow:hidden;
  transition:background .3s var(--ease),color .3s var(--ease);
}
.svc-item .num{
  font-family:var(--display);
  font-weight:900;
  font-size:1rem;
  color:var(--red);
  transition:color .3s;
}
.svc-item h3{font-size:clamp(1.35rem,1.15rem + .9vw,1.85rem)}
.svc-item p{font-size:.98rem;color:var(--ink-soft);transition:color .3s;margin:0}
.svc-item .go{
  margin-top:auto;
  padding-top:.9rem;
  font-family:var(--display);
  font-weight:800;
  font-size:.95rem;
  display:inline-flex;
  align-items:center;
  gap:.45rem;
}
.svc-item .go svg{transition:transform .28s var(--ease)}
.svc-item:hover{background:var(--ink);color:var(--paper)}
.svc-item:hover h3{color:var(--white)}
.svc-item:hover p{color:#CFCBC1}
.svc-item:hover .num{color:var(--yellow)}
.svc-item:hover .go svg{transform:translateX(-6px)}

/* פריט ראשון רחב */
.svc-item--wide{grid-column:1/-1;background:var(--yellow)}
.svc-item--wide p{color:var(--ink-soft);max-width:62ch}
.svc-item--wide .num{color:var(--red)}
/* סימן המותג ממלא את החצי הפנוי של הכרטיס הרחב */
.svc-item--wide::before{
  content:"";
  position:absolute;
  inset-block:-14%;
  inset-inline-start:4%;
  width:clamp(150px,20vw,270px);
  background:url("../img/logo-cube.png") center/contain no-repeat;
  opacity:.14;
  transform:rotate(-8deg);
  pointer-events:none;
}
@media (max-width:760px){.svc-item--wide::before{display:none}}
.svc-item--wide:hover::before{opacity:.22}

/* ---------- שלבי עבודה ---------- */

.steps{
  display:grid;
  gap:clamp(1.25rem,3vw,2rem);
  grid-template-columns:repeat(4,1fr);
  counter-reset:s;
}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.step{
  border-top:8px solid var(--yellow);
  padding-top:1.15rem;
}
.step:nth-child(2){border-color:var(--red)}
.step:nth-child(3){border-color:var(--ink)}
.step:nth-child(4){border-color:var(--yellow-deep)}
.step h3{font-size:1.2rem;margin-bottom:.45rem}
.step p{font-size:.96rem;color:var(--ink-soft);margin:0}
.panel .step p{color:#BFBBB2}

/* ---------- מספרים ---------- */

.figs{
  display:grid;
  gap:3px;
  grid-template-columns:repeat(3,1fr);
  background:var(--ink);
  border:3px solid var(--ink);
}
@media (max-width:700px){.figs{grid-template-columns:1fr}}
.fig{
  background:var(--paper);
  padding:clamp(1.4rem,3vw,2.1rem);
}
.fig b{
  display:block;
  font-family:var(--display);
  font-weight:900;
  font-size:clamp(2.4rem,1.6rem + 3.4vw,3.6rem);
  line-height:1;
  color:var(--red);
  margin-bottom:.4rem;
}
.fig span{font-size:.98rem;color:var(--ink-soft);font-weight:500}

/* ---------- הצעת מחיר / הדגשה ---------- */

.pricebar{
  display:grid;
  grid-template-columns:1fr auto;
  gap:clamp(1.25rem,3vw,2.5rem);
  align-items:center;
  background:var(--yellow);
  border:3px solid var(--ink);
  padding:clamp(1.5rem,4vw,2.6rem);
  box-shadow:10px 10px 0 var(--ink);
}
@media (max-width:820px){.pricebar{grid-template-columns:1fr}}
.pricebar .price{
  font-family:var(--display);
  font-weight:900;
  font-size:clamp(1.7rem,1.2rem + 2.4vw,2.7rem);
  line-height:1.1;
  margin-bottom:.35rem;
}
.pricebar p{font-size:1rem;margin:0;max-width:56ch}

/* ---------- תוכן פנימי לעמודי שירות ---------- */

.split{
  display:grid;
  gap:clamp(2rem,5vw,4rem);
  grid-template-columns:1fr 1fr;
  align-items:start;
}
@media (max-width:860px){.split{grid-template-columns:1fr}}

/* עמודת טקסט שנשארת מול טופס ארוך */
@media (min-width:861px){
  .split--sticky>div:first-child{position:sticky;top:110px}
}

.inclist{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.inclist li{
  display:flex;
  gap:.85rem;
  align-items:flex-start;
  padding:.85rem 0;
  border-bottom:1px solid rgba(11,11,11,.14);
}
.inclist li:last-child{border-bottom:0}
.panel .inclist li{border-color:rgba(255,255,255,.16)}
.inclist .tick{
  flex:0 0 auto;
  width:22px;height:22px;
  background:var(--red);
  margin-top:.28rem;
  clip-path:polygon(14% 44%,0 58%,40% 100%,100% 22%,86% 8%,38% 70%);
}
.panel .inclist .tick{background:var(--yellow)}
.inclist b{font-family:var(--display);font-weight:800;display:block;font-size:1.05rem}
.inclist span.d{color:var(--ink-soft);font-size:.96rem}
.panel .inclist span.d{color:#BFBBB2}

/* בלוק ציטוט / הבטחה */
.claim{
  border-inline-start:10px solid var(--red);
  padding-inline-start:clamp(1.1rem,3vw,1.9rem);
  font-family:var(--display);
  font-weight:800;
  font-size:clamp(1.3rem,1.1rem + 1.2vw,2rem);
  line-height:1.25;
}

/* ---------- מסגרות תיק עבודות ---------- */

.folio{
  display:grid;
  gap:clamp(1.1rem,2.6vw,1.8rem);
  grid-template-columns:repeat(3,1fr);
}
@media (max-width:900px){.folio{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.folio{grid-template-columns:1fr}}

.frame{
  border:3px solid var(--ink);
  background:var(--paper-2);
  aspect-ratio:4/5;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.7rem;
  text-align:center;
  padding:1.4rem;
  position:relative;
  overflow:hidden;
}
.frame--wide{grid-column:span 2;aspect-ratio:16/10}
@media (max-width:560px){.frame--wide{grid-column:span 1;aspect-ratio:4/5}}
.frame::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(45deg,rgba(11,11,11,.05) 25%,transparent 25%,transparent 50%,rgba(11,11,11,.05) 50%,rgba(11,11,11,.05) 75%,transparent 75%);
  background-size:16px 16px;
}
.frame>*{position:relative}
.frame .tag{
  font-family:var(--display);
  font-weight:900;
  font-size:1.1rem;
}
.frame .hint{font-size:.88rem;color:#6C675E}
.frame .box{
  width:44px;height:44px;
  border:3px solid var(--ink);
  background:var(--yellow);
  transform:rotate(45deg);
}

/* ---------- לוחות הדבקה ---------- */

.cities{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
  list-style:none;
  margin:0;
  padding:0;
}
.cities li{
  font-family:var(--display);
  font-weight:800;
  font-size:1rem;
  background:var(--paper);
  border:3px solid var(--ink);
  padding:.6rem 1.05rem;
}
.panel .cities li{background:transparent;border-color:var(--paper);color:var(--paper)}

/* ---------- שאלות נפוצות ---------- */

.faq{border-top:3px solid var(--ink)}
.faq details{border-bottom:3px solid var(--ink)}
.faq summary{
  cursor:pointer;
  list-style:none;
  padding:1.35rem 0;
  font-family:var(--display);
  font-weight:800;
  font-size:clamp(1.05rem,1rem + .5vw,1.3rem);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";
  flex:0 0 auto;
  width:20px;height:20px;
  background:var(--ink);
  clip-path:polygon(42% 0,58% 0,58% 42%,100% 42%,100% 58%,58% 58%,58% 100%,42% 100%,42% 58%,0 58%,0 42%,42% 42%);
  transition:transform .3s var(--ease);
}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--red)}
.faq .a{padding:0 0 1.5rem;max-width:70ch;color:var(--ink-soft)}

/* ---------- טופס ---------- */

.formwrap{
  background:var(--paper);
  border:3px solid var(--ink);
  padding:clamp(1.4rem,4vw,2.4rem);
  box-shadow:10px 10px 0 var(--ink);
}
.panel .formwrap{box-shadow:10px 10px 0 var(--yellow)}

.field{display:grid;gap:.42rem;margin-bottom:1.15rem}
.field label{
  font-family:var(--display);
  font-weight:800;
  font-size:.98rem;
  color:var(--ink);
}
.field .help{font-size:.85rem;color:#6C675E}
.field input,.field select,.field textarea{
  font:inherit;
  font-size:1rem;
  color:var(--ink);
  background:var(--white);
  border:3px solid var(--ink);
  padding:.85rem 1rem;
  width:100%;
  transition:box-shadow .18s var(--ease);
}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;
  box-shadow:0 0 0 4px var(--yellow);
}
.field input::placeholder,.field textarea::placeholder{color:#8A857B}
.field .err{
  font-size:.88rem;
  font-weight:700;
  color:var(--red-deep);
  display:none;
}
.field[data-invalid="true"] input,
.field[data-invalid="true"] textarea,
.field[data-invalid="true"] select{border-color:var(--red-deep)}
.field[data-invalid="true"] .err{display:block}

.form-note{font-size:.88rem;color:#6C675E;margin-top:1rem}

.form-state{
  display:none;
  border:3px solid var(--ink);
  padding:1.1rem 1.3rem;
  font-weight:700;
  margin-bottom:1.25rem;
}
.form-state[data-show="ok"]{display:block;background:var(--yellow)}
.form-state[data-show="err"]{display:block;background:var(--red);color:var(--white);border-color:var(--red-deep)}

.form-alt{
  margin-top:1.5rem;
  padding-top:1.35rem;
  border-top:3px solid var(--ink);
}

/* ---------- כרטיסי קשר ---------- */

.contacts{
  display:grid;
  gap:3px;
  grid-template-columns:repeat(3,1fr);
  background:var(--ink);
  border:3px solid var(--ink);
}
@media (max-width:760px){.contacts{grid-template-columns:1fr}}
.contact-card{
  background:var(--paper);
  padding:clamp(1.4rem,3vw,2rem);
  text-decoration:none;
  display:block;
  transition:background .25s var(--ease),color .25s var(--ease);
}
.contact-card b{
  display:block;
  font-family:var(--display);
  font-weight:900;
  font-size:1.05rem;
  margin-bottom:.3rem;
}
.contact-card .val{
  font-family:var(--display);
  font-weight:900;
  font-size:clamp(1.35rem,1.1rem + 1.1vw,1.9rem);
  direction:ltr;
  unicode-bidi:embed;
  display:block;
}
.contact-card .val--rtl{direction:rtl}
.contact-card .sub{font-size:.92rem;color:var(--ink-soft);display:block;margin-top:.3rem}
.contact-card:hover{background:var(--yellow)}
.contact-card:hover .sub{color:var(--ink)}

/* ---------- עדויות (שלד למילוי) ---------- */

.quotes{
  display:grid;
  gap:clamp(1.1rem,2.6vw,1.6rem);
  grid-template-columns:repeat(3,1fr);
}
@media (max-width:900px){.quotes{grid-template-columns:1fr}}
.quote{
  border:3px solid var(--ink);
  padding:clamp(1.3rem,3vw,1.9rem);
  background:var(--paper);
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.quote .mark{
  font-family:var(--display);
  font-weight:900;
  font-size:3rem;
  line-height:.6;
  color:var(--yellow-deep);
}
.quote p{font-size:1.02rem;margin:0}
.quote .who{
  margin-top:auto;
  padding-top:.9rem;
  border-top:1px solid rgba(11,11,11,.16);
  font-size:.92rem;
  color:#6C675E;
}

/* ---------- קריאה לפעולה סוגרת ---------- */

.endcta{
  background:var(--red);
  color:var(--white);
  border-block:3px solid var(--ink);
  text-align:center;
}
.endcta h2{color:var(--white);margin-bottom:1rem}
.endcta p{color:#F6DEDE;max-width:52ch;margin-inline:auto;margin-bottom:1.9rem}
.endcta .btn-row{justify-content:center}
.endcta .btn{border-color:var(--ink)}

/* ---------- פוטר ---------- */

.foot{
  background:var(--ink);
  color:#B8B4AC;
  border-top:3px solid var(--ink);
  font-size:.95rem;
}
.foot-grid{
  display:grid;
  gap:clamp(1.8rem,4vw,3rem);
  grid-template-columns:1.3fr 1fr 1fr;
  padding-block:clamp(2.5rem,6vw,4rem);
}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
.foot-logo{display:flex;align-items:center;gap:.65rem;margin-bottom:1.1rem}
.foot-logo img:first-child{height:46px;width:auto}
.foot-logo img:last-child{height:30px;width:auto}
.foot h4{
  color:var(--white);
  font-size:1rem;
  margin-bottom:.9rem;
  letter-spacing:.02em;
}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.foot a{text-decoration:none}
.foot a:hover{color:var(--yellow)}
.foot .tel{
  font-family:var(--display);
  font-weight:900;
  color:var(--yellow);
  font-size:1.35rem;
  direction:ltr;
  unicode-bidi:embed;
  display:inline-block;
}
.foot-bar{
  border-top:1px solid rgba(255,255,255,.14);
  padding-block:1.1rem;
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  justify-content:space-between;
  font-size:.84rem;
  color:#8C887F;
}

/* ---------- סרגל פעולה במובייל ---------- */

.actionbar{
  position:fixed;
  inset-inline:0;
  bottom:0;
  z-index:50;
  display:none;
  border-top:3px solid var(--ink);
}
.actionbar a{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:1rem .5rem;
  text-decoration:none;
  font-family:var(--display);
  font-weight:900;
  font-size:1rem;
}
.actionbar .call{background:var(--ink);color:var(--white)}
.actionbar .wa{background:var(--yellow);color:var(--ink)}
@media (max-width:1000px){
  .actionbar{display:flex}
  body{padding-bottom:60px}
}

/* ---------- חשיפה בגלילה ---------- */

.rev{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.rev[data-in="true"]{opacity:1;transform:none}
.rev[data-d="1"]{transition-delay:.08s}
.rev[data-d="2"]{transition-delay:.16s}
.rev[data-d="3"]{transition-delay:.24s}

/* ---------- דילוג לתוכן ---------- */

/* מוסתר בלי לייצר גלילה אופקית ב-RTL: כיווץ במקום הזזה החוצה */
.skip{
  position:absolute;
  top:0;
  inset-inline-start:0;
  z-index:100;
  width:1px;height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  background:var(--ink);
  color:var(--white);
  padding:.8rem 1.2rem;
  font-weight:700;
}
.skip:focus{
  width:auto;height:auto;
  clip-path:none;
  overflow:visible;
}

/* ---------- העדפת תנועה מופחתת ---------- */

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .kin>span{transform:none}
  .rev{opacity:1;transform:none}
  .hero-art img{animation:none}
  .marq-track{animation:none}
}

/* ---------- הדפסה ---------- */

@media print{
  body::after,.nav,.actionbar,.sheet,.topline{display:none}
  body{background:#fff}
  .panel,.endcta{background:#fff;color:#000}
}