.esp{
  --esp-radius:16px;
  direction:rtl; text-align:right;
  font-family:var(--eddie-font);
  font-size: var(--eddie-body-size); line-height:1.65; color:var(--eddie-ink);
  -webkit-font-smoothing:antialiased;
}
.esp *,.esp *::before,.esp *::after{box-sizing:border-box;}
.esp p{margin:0 0 1em;}
.esp a{color:inherit;}
.esp-inner{max-width:var(--eddie-content-width); margin-inline:auto; padding-inline:var(--eddie-space-desktop);}
.esp-h2{margin:0 0 8px; font-size:var(--eddie-h2-size); font-weight:600; line-height:1.25; color:var(--eddie-ink);}
/* בלי margin בכוונה: .esp p{margin:0 0 1em} גובר בספציפיות (0,1,1 מול 0,1,0),
   כך שהצהרת margin כאן מתה; המרווח הנראה מגיע מ-margin-top של הגריד שמתחת. */
.esp-sub{color:var(--eddie-muted); font-size: var(--eddie-body-size); line-height:1.7;}
.esp-eyebrow{display:inline-block; font-size:13px; font-weight:700; letter-spacing:.14em; color:var(--eddie-brass-deep); margin-bottom:12px;}

/* ---------- HERO עם תמונת רקע ---------- */

/* רצועת ערך לבנה, מתחת להירו */
.esp-values{background:var(--eddie-white); border-bottom:1px solid var(--eddie-line);}
/* רצועה דקה בכוונה — לא סקציה, ולכן לא צורכת את טוקן המרווח האנכי */
.esp-values .esp-inner{padding-block:24px; display:grid; grid-template-columns:repeat(4,1fr); gap:var(--eddie-card-gap);}
.esp-value{display:flex; align-items:center; gap:12px; padding:14px 12px;
  background:var(--eddie-paper-2); border:1px solid var(--eddie-line); border-radius:10px;}
.esp-value:first-child{border-inline-start:0;}
.esp-value svg{flex:0 0 var(--eddie-icon); width:var(--eddie-icon); height:var(--eddie-icon); color:var(--eddie-brass-deep); margin-top:1px;}
.esp-value span{font-size: var(--eddie-body-sm); line-height:1.55; color:var(--eddie-ink);}
a.esp-value{text-decoration:none; transition:opacity .3s ease;}
a.esp-value:hover{opacity:.75;}
.esp-value-g svg{flex:0 0 var(--eddie-icon); width:var(--eddie-icon); height:var(--eddie-icon);}
.esp-value-score{display:inline-block; font-size:17px; font-weight:700; color:var(--eddie-ink); line-height:1;}
.esp-value-stars{color:var(--eddie-brass); font-size:12px; letter-spacing:1px; margin-inline-start:6px;}
.esp-value-c{display:block; font-size:13px; color:var(--eddie-muted); margin-top:3px;}

/* ---------- כפתורים ---------- */
.esp-btn{display:inline-flex; align-items:center; gap:10px; padding:15px 30px;
  font-family:var(--eddie-font); font-size:15px; font-weight:700;
  border-radius:999px; border:2px solid transparent;
  text-decoration:none; cursor:pointer; white-space:nowrap; transition:all .3s ease;}
.esp-btn-primary{background:var(--eddie-brass); color:var(--eddie-ink); border-color:var(--eddie-brass);}
.esp-btn-primary:hover,.esp-btn-primary:focus-visible{background:transparent; color:var(--eddie-white); border-color:var(--eddie-white);}
.esp-btn-outline{background:transparent; color:var(--eddie-white); border-color:rgba(255,255,255,.5);}
.esp-btn-outline:hover,.esp-btn-outline:focus-visible{background:var(--eddie-white); color:var(--eddie-ink); border-color:var(--eddie-white);}

/* ---------- מה כולל השירות ---------- */
.esp-inc{background:var(--eddie-white);}
.esp-inc .esp-inner{padding-block:var(--eddie-section-y);}
.esp-inc-lead{max-width:720px;}
.esp-inc-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:32px;}
.esp-inc-card{border:1px solid var(--eddie-line); border-radius:var(--esp-radius); padding:24px 22px; background:var(--eddie-white);}
.esp-inc-ico{margin-bottom:14px; color:var(--eddie-brass-deep); line-height:0;}
.esp-inc-ico svg{width:var(--eddie-icon); height:var(--eddie-icon); display:block;}
.esp-inc-card h3{margin:0 0 6px; font-size:17px; font-weight:600; color:var(--eddie-ink); line-height:1.35;}
.esp-inc-card p{margin:0; font-size: var(--eddie-body-sm); line-height:1.7; color:var(--eddie-muted);}

/* ---------- הכנה + תהליך, זה לצד זה ---------- */
.esp-scope{background:var(--eddie-white);}
.esp-scope .esp-inner{padding-block:0 var(--eddie-section-y);}
.esp-scope ul{
  list-style:none; margin:26px 0 0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px 26px;
}
.esp-hi{ color:var(--eddie-brass-deep); font-weight:700; }
.esp-scope li{
  display:flex; align-items:flex-start; gap:10px;
  font-size: var(--eddie-body-size); line-height:1.6; color:var(--eddie-ink);
  padding-bottom:11px; border-bottom:1px solid var(--eddie-line);
}
.esp-scope svg{flex:0 0 var(--eddie-icon-sm); width:var(--eddie-icon-sm); height:var(--eddie-icon-sm); color:var(--eddie-brass); margin-top:1px;}
@media (max-width:1024px){
  .esp-duo.esp-trio .esp-inner{grid-template-columns:repeat(2,1fr);} .esp-scope ul{grid-template-columns:repeat(2,1fr);} }
@media (max-width:767px){ .esp-scope ul{grid-template-columns:1fr;} .esp-scope .esp-inner{padding-block:var(--eddie-section-y-mobile);} }

.esp-story{background:var(--eddie-paper-2);}
.esp-story .esp-inner{padding-block:var(--eddie-section-y);}
.esp-story-block{margin-bottom:34px;}
.esp-story-block:last-child{margin-bottom:0;}
.esp-story-block p a.esp-story-more{ display:inline-flex; align-items:center; gap:8px; margin-top:6px; padding:11px 20px; border:2px solid var(--eddie-brass-deep); border-radius:999px; color:var(--eddie-brass-deep); font-weight:700; text-decoration:none; transition:background .18s ease, color .18s ease; }
.esp-story-block p a.esp-story-more:hover,.esp-story-block p a.esp-story-more:focus-visible{ background:var(--eddie-brass-deep); color:var(--eddie-white); }
.esp-story-block h3{
  margin:0 0 10px; font-size:20px; font-weight:600; line-height:1.35;
  color:var(--eddie-ink); padding-inline-start:16px;
  border-inline-start:3px solid var(--eddie-brass);
}
.esp-story-block p{margin:0 0 14px; font-size: var(--eddie-body-size); line-height:1.9; color:var(--eddie-muted);}
.esp-story-block p:last-child{margin-bottom:0;}
.esp-duo{background:var(--eddie-white);}
.esp-duo .esp-inner{ padding-block:var(--eddie-section-y); display:grid; grid-template-columns:repeat(3,1fr); gap:36px; align-items:start; }
.esp-panel{background:var(--eddie-white); border:1px solid var(--eddie-line); border-radius:var(--esp-radius); padding:30px 28px;}
.esp-panel h2{margin:0 0 6px; font-size:20px; font-weight:600; color:var(--eddie-ink);}
.esp-panel > p{margin:0 0 20px; font-size: var(--eddie-body-sm); color:var(--eddie-muted); line-height:1.7;}
.esp-checks{list-style:none; margin:0; padding:0;}
.esp-checks li{display:flex; align-items:flex-start; gap:11px; margin-bottom:13px; font-size: var(--eddie-body-size); line-height:1.6; color:var(--eddie-ink);}
.esp-checks li:last-child{margin-bottom:0;}
.esp-checks svg{flex:0 0 var(--eddie-icon-sm); width:var(--eddie-icon-sm); height:var(--eddie-icon-sm); color:var(--eddie-brass); margin-top:1px;}
.esp-steps{list-style:none; margin:0; padding:0; counter-reset:esp-step;}
.esp-steps li{position:relative; padding-inline-start:46px; padding-bottom:22px;}
.esp-steps li:last-child{padding-bottom:0;}
.esp-steps li::before{counter-increment:esp-step; content:counter(esp-step);
  position:absolute; inset-inline-start:0; top:0;
  width:30px; height:30px; border-radius:50%;
  background:var(--eddie-ink); color:var(--eddie-brass);
  display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700;}
.esp-steps li:not(:last-child)::after{content:""; position:absolute; inset-inline-start:14px; top:34px; bottom:6px;
  width:2px; background:var(--eddie-line);}
.esp-steps b{display:block; font-size:15.5px; font-weight:600; color:var(--eddie-ink); margin-bottom:3px;}
.esp-steps span{font-size: var(--eddie-body-sm); line-height:1.65; color:var(--eddie-muted);}

/* ---------- שאלות ---------- */
.esp-faq{background:var(--eddie-paper-2);}
.esp-faq .esp-inner{padding-block:var(--eddie-section-y);}
.esp-faq-list{ display:grid; grid-template-columns:repeat(2,1fr); column-gap:0; max-width:1100px; margin:26px auto 0; background:var(--eddie-white); border:1px solid var(--eddie-line); border-radius:22px; overflow:hidden; align-items:start;  box-shadow:0 2px 10px rgba(11,33,67,.06); }
.esp-faq-item{border-bottom:1px solid var(--eddie-line);}
.esp-faq-item:last-child{border-bottom:0;}
.esp-faq-item > summary{display:flex; align-items:flex-start; gap:12px; padding:18px 26px;
  cursor:pointer; list-style:none; font-size:17px; font-weight:600; line-height:1.5;
  color:var(--eddie-ink); transition:background-color .3s ease;}
.esp-faq-item > summary::-webkit-details-marker{display:none;}
.esp-faq-item > summary:hover,.esp-faq-item[open] > summary{background:var(--eddie-paper-2);}
.esp-faq-item > summary:focus-visible{outline:2px solid var(--eddie-brass); outline-offset:-3px;}
.esp-faq-item > summary span{flex:1 1 auto;}

.esp-faq-a{padding:2px 24px 20px; max-width:640px; font-size:18px; line-height:1.8; color:var(--eddie-muted);}
.esp-faq-more{text-align:center; margin-top:24px;}
.esp-faq-more a{font-size:15px; font-weight:700; color:var(--eddie-brass-deep); text-decoration:none;}
.esp-faq-more a:hover{text-decoration:underline;}

/* ---------- מאמרים + שירותים משלימים ---------- */
.esp-more{background:var(--eddie-white);}

.esp-arts{list-style:none; margin:24px 0 0; padding:0;}
.esp-arts li{border-bottom:1px solid var(--eddie-line);}
.esp-arts li:last-child{border-bottom:0;}
.esp-arts a{display:flex; align-items:flex-start; gap:12px; padding:16px 0;
  text-decoration:none; font-size: var(--eddie-body-size); font-weight:600; line-height:1.55;
  color:var(--eddie-ink); transition:color .3s ease;}
.esp-arts a:hover{color:var(--eddie-brass-deep);}
.esp-arts a::before{content:"←"; color:var(--eddie-brass); font-weight:700; flex:0 0 auto;}
.esp-side h2{ margin:0 0 16px; font-size: var(--eddie-h4-size); font-weight:600; color:var(--eddie-ink); }
.esp-side{ display:flex; flex-direction:column; background:var(--eddie-white); border:1px solid var(--eddie-line); border-radius:var(--esp-radius); padding:30px 28px; }
.esp-rel{ grid-column:1 / -1; background:var(--eddie-white); border:1px solid var(--eddie-line); border-radius:var(--esp-radius); padding:30px 28px; margin-top:4px; }
.esp-rel h2{margin:0 0 16px; font-size: var(--eddie-h4-size); font-weight:600; color:var(--eddie-ink);}
.esp-rel ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.esp-rel li{ margin:0; }
.esp-rel li:last-child{margin-bottom:0;}
.esp-rel a{display:block; background:var(--eddie-white); border:1px solid var(--eddie-line);
  border-radius:10px; padding:13px 16px; text-decoration:none;
  font-size: var(--eddie-body-sm); font-weight:600; color:var(--eddie-ink);
  transition:border-color .3s ease, color .3s ease;}
.esp-rel a:hover{border-color:var(--eddie-brass); color:var(--eddie-brass-deep);}

/* ---------- דירוג + CTA ---------- */
.esp-cta{background:var(--eddie-ink); color:var(--eddie-white);}
.esp-cta .esp-inner{padding-block:var(--eddie-section-y); text-align:center;}
.esp-cta-copy{max-width:620px; margin-inline:auto;}
.esp-cta-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.esp-contacts{display:flex; flex-direction:column; gap:10px; min-width:270px;}
.esp-contact{display:inline-flex; align-items:center; gap:11px; padding:13px 20px;
  border-radius:999px; border:1.5px solid rgba(255,255,255,.28);
  text-decoration:none; font-size:15px; font-weight:700; color:var(--eddie-white); transition:all .3s ease;}
.esp-contact svg{width:var(--eddie-icon-sm); height:var(--eddie-icon-sm); color:var(--eddie-brass); flex:0 0 var(--eddie-icon-sm);}
.esp-contact:hover,.esp-contact:focus-visible{background:var(--eddie-white); color:var(--eddie-ink); border-color:var(--eddie-white);}
.esp-contact:hover svg{color:var(--eddie-brass-deep);}
.esp-num{direction:ltr;}
.esp-cta h2{margin:0 0 8px; font-size:var(--eddie-h2-size); font-weight:600; line-height:1.25; color:var(--eddie-white);}
.esp-cta p{margin:0 0 22px; color:rgba(255,255,255,.72); line-height:1.75;}
.esp-cta-actions{display:flex; gap:12px; flex-wrap:wrap;}

/* ---------- רספונסיבי ---------- */
@media (max-width:1024px){
  .esp-inc-grid{grid-template-columns:repeat(2,1fr);}
  .esp-values .esp-inner{grid-template-columns:repeat(2,1fr); gap:20px 0;}
  .esp-value:nth-child(3){border-inline-start:0;}
  .esp-more .esp-inner{grid-template-columns:1fr; gap:32px;}
}
@media (max-width:767px){
  .esp-rel ul{grid-template-columns:1fr;}
  .esp-duo.esp-trio .esp-inner{grid-template-columns:1fr;}
  .esp-faq-list{grid-template-columns:1fr;}
  .esp-inner{padding-inline:var(--eddie-space-mobile);}
  .esp-values .esp-inner{grid-template-columns:repeat(2,1fr); gap:16px 14px; padding-block:20px;}
  /* סדר בנייד: כל הכרטיסים order:2, הראשון וכרטיס גוגל order:1 — כך גוגל נוחת במשבצת 2.
     בלי זה גוגל צונח לשורה התחתונה. */
  .esp-values .esp-value{order:2;}
  .esp-values .esp-value:first-child{order:1;}
  .esp-values .esp-value-g{order:1;}
  .esp-value{gap:9px;}
  .esp-value span{font-size: var(--eddie-body-sm); line-height:1.45;}
  .esp-inc .esp-inner,.esp-faq .esp-inner,.esp-more .esp-inner{padding-block:var(--eddie-section-y-mobile);}
  /* ONE column on a phone, on purpose. These cards were two-up at 161px wide and
     measured 215px tall - TALLER than the same kind of card at full width on the
     home page. Narrowing a card does not shorten it; it reflows the text and
     lengthens it. Full width plus the .eddie-rowcard row layout is what actually
     shortens it, and it keeps the text readable instead of squeezing it into a
     120px column. */
  .esp-inc-grid{grid-template-columns:1fr; gap:12px;}
  .esp-inc-ico{margin-bottom:12px;}
  
  .esp-inc-card h3{font-size:15px; line-height:1.3;}
  .esp-inc-card p{font-size: var(--eddie-body-sm); line-height:1.6;}
  .esp-story .esp-inner{padding-block:var(--eddie-section-y-mobile);}
  .esp-story-block h3{font-size:18px;}
  .esp-story-block p{line-height:1.8;}
  .esp-duo .esp-inner{grid-template-columns:1fr; gap:18px; padding-block:var(--eddie-section-y-mobile);}
  .esp-panel{padding:24px 20px;}
  .esp-faq-item > summary{padding:16px 18px; font-size:16px;}
  .esp-faq-a{padding:2px 18px 18px;}
  .esp-cta .esp-inner{padding-block:var(--eddie-section-y-mobile);}
  .esp-cta-actions .esp-btn{width:100%; justify-content:center;}
}
/* The blanket reduced-motion rule that used to sit here is now in base.css,
   once, for the whole site. Do not add a page-level copy. */

/* ---------- טיפוגרפיה אחידה לכל עמודי השירות (eddie-svc-prose) ----------
   שתי תקלות שהיו בתבנית מההתחלה:
   1. המאמרים מיושרים ב-justify ועמודי השירות ב-right — שני מראים באותו אתר.
   2. קישורים בתוך טקסט הוצגו בלי קו תחתון — צבע ומשקל בלבד
      אינם מספיקים כדי שקורא יזהה קישור, וזו גם דרישת נגישות. */
/* .esp-inc-card is deliberately NOT in this list.
   Measured at 1400px: its paragraph is 215px wide holding 49-64 characters -
   about four words a line. Every other justified paragraph on the site is 550px
   or wider. Hebrew has no automatic hyphenation, so at four words a line the
   browser can only stretch the word spaces, and the result is the rivers of
   white Eddie spotted in the four-column row.
   The mobile block further down already returned this card to text-align:right -
   someone had seen the same thing at one width and fixed half the cases. */
.esp-story-block p, .esp-hero-lede, .esp-sub{ text-align: justify; text-align-last: right; }
.esp-inc-card p{ text-align: right; }
.esp-story-block a, .esp-inc-card a, .esp-scope a, .esp-faq-a a{
  color: var(--eddie-brass-deep); text-decoration: underline; text-underline-offset: 3px;
  text-decoration-thickness: 1px; font-weight: 600;
}
.esp-story-block a:hover, .esp-inc-card a:hover, .esp-scope a:hover, .esp-faq-a a:hover{
  color: var(--eddie-ink); text-decoration-thickness: 2px;
}
@media (max-width:767px){ .esp-story-block p, .esp-hero-lede, .esp-sub{ text-align: right; } }

  /* רצועת הערכים מתחת להירו: כרטיסים בהירים, זהים לרצועת האמון בעמוד הבית ובעמוד שירותי המשרד */
  
  .esp-values .esp-value svg{color:var(--eddie-brass-deep)}
  .esp-values .esp-value-g svg{color:inherit}
  /* כוכבי הדירוג בצבע המותג של גוגל - הקסה מכוונת, אין טוקן לצבעי גוגל */
  .esp-values .esp-value-g .esp-value-stars{color:#FBBC04}

/* חץ האקורדיון בזהב, אחיד לכל האתר */

  /* חץ אקורדיון זהה לשאר האתר — נבנה ב-CSS במקום SVG */
  
  

/* The emphasised words inside a story paragraph. Same brass as .esp-hi;
   a separate class because this one is a sentence fragment, not a list item. */
.esp-story-block p strong.esp-story-emphasis{ color:var(--eddie-brass-deep); font-weight:700; }

/* The caret lives in base.css as .eddie-caret - one declaration for the site. */
