/* ============================================================
   זריז שליחויות · page-core.css
   עמוד השירותים (services.html) ועמוד אודות (about.html) בלבד.
   נטען אחרי site.css. טוקנים בלבד: בלי צבעים, גדלים, רדיוסים או גופנים חדשים.
   ============================================================ */

/* כותרת ראשית בשתי שורות: שורה דקה ושורה עבה */
.pc-line { display: block; }

/* ============================================================
   שירותים: תוכן העמוד (קפיצה לשירות)
   ============================================================ */
.svc-index { padding-block: calc(var(--space-group) + var(--sp-4)) var(--space-group); }
.svc-index__list {
  list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--gutter);
}
.svc-index__list a {
  display: grid; align-content: start; gap: var(--sp-1);
  min-block-size: var(--hit); padding-block: var(--sp-4) var(--sp-3);
  box-shadow: inset 0 1px 0 var(--line-hover);
  color: var(--fg-2); font-weight: var(--fw-bold); text-decoration: none;
  transition: color var(--dur-fast) ease, box-shadow var(--dur-base) var(--ease-out);
}
.svc-index__num { font-size: var(--fs-small); font-weight: var(--fw-regular); color: var(--lime-500); font-variant-numeric: tabular-nums; }
.svc-index__list a:active { color: var(--fg-1); }
@media (hover: hover) and (pointer: fine) {
  .svc-index__list a:hover { color: var(--fg-1); box-shadow: inset 0 2px 0 var(--fg-1); }
}
@media (min-width: 48rem) { .svc-index__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 69rem) { .svc-index__list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

/* ============================================================
   שירותים: כל שירות הוא פריסה משלו (לא רשת של כרטיסים זהים)
   מבנה אחיד: מספר + כותרת + שורת משנה (__head), פירוט (__detail), תמונה (__media)
   ============================================================ */
.svc { overflow-x: clip; }
.svc__grid {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--gutter); row-gap: var(--space-group);
}
.svc__media, .svc__head, .svc__detail { grid-column: 1 / -1; min-inline-size: 0; }
.svc__head, .svc__detail { display: grid; justify-items: start; gap: var(--space-in); }

/* טלפון: התמונה מקצה לקצה, נמוכה יותר, ואז הטקסט */
.svc__media.frame { --ratio: 5 / 4; margin-inline: calc(-1 * var(--margin)); border-radius: 0; }

.svc__num {
  display: block; margin-block-end: var(--sp-2);
  font-size: var(--fs-h2); font-weight: var(--fw-black); line-height: 1; letter-spacing: var(--ls-display);
  color: transparent; -webkit-text-stroke: 1px var(--line-control);
  font-variant-numeric: tabular-nums;
}
@supports not (-webkit-text-stroke: 1px black) { .svc__num { color: var(--ink-600); } }
.svc__lede { color: var(--fg-1); max-inline-size: 16em; }
.svc__body { color: var(--fg-2); }
.svc__k { margin-block-start: var(--sp-3); font-size: var(--fs-small); line-height: var(--lh-small); font-weight: var(--fw-bold); color: var(--fg-2); }
.svc__list { list-style: none; display: grid; gap: var(--sp-3); }
.svc__list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-3); align-items: start; max-inline-size: var(--measure); }
.svc__check { inline-size: var(--icon-sm); block-size: var(--icon-sm); margin-block-start: .2em; color: var(--lime-500); }

/* שורת הפעולה של כל שירות: קישור (לא כפתור ליים), עם הודעה מוכנה משלו */
.svc__act {
  display: inline-flex; align-items: center; gap: var(--sp-3);
  min-block-size: var(--hit); margin-block-start: var(--sp-3);
  color: var(--fg-1); font-weight: var(--fw-bold); text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.svc__act-ico { inline-size: var(--icon-sm); block-size: var(--icon-sm); flex: none; color: var(--fg-2); }
.svc__act:active { opacity: .7; }
@media (hover: hover) and (pointer: fine) {
  .svc__act:hover .link::before { transform: scaleX(1); }
}

@media (min-width: 48rem) {
  .svc__grid { row-gap: var(--sp-5); }
  .svc__num { font-size: var(--fs-display); }
  .svc__head { grid-row: 1; align-self: end; }
  .svc__detail { grid-row: 2; align-self: start; }
  .svc__media.frame { margin-inline: 0; border-radius: var(--r-lg); }

  /* א. מסמכים: טקסט מימין, תמונה גבוהה יוצאת עד קצה המסך משמאל */
  .svc--a .svc__media { grid-column: 7 / -1; grid-row: 1 / span 2; --ratio: 4 / 5; margin-inline-end: calc(-1 * var(--margin)); border-start-end-radius: 0; border-end-end-radius: 0; border-start-start-radius: var(--r-xl); border-end-start-radius: var(--r-xl); }
  .svc--a .svc__head, .svc--a .svc__detail { grid-column: 1 / span 5; }

  /* ב. חבילות: תמונה צרה מימין, מוסטת למטה; הטקסט רחב משמאל */
  .svc--b .svc__media { grid-column: 1 / span 4; grid-row: 1 / span 2; --ratio: 4 / 5; align-self: start; margin-block-start: var(--space-block); }
  .svc--b .svc__head, .svc--b .svc__detail { grid-column: 6 / span 6; }

  /* ג. אוכל: תמונה רחבה כמו פתיחת כתבה, ומתחת שני טורים */
  .svc--c .svc__grid { row-gap: var(--space-group); }
  .svc--c .svc__media { grid-column: 1 / -1; grid-row: 1; --ratio: 16 / 9; }
  .svc--c .svc__head { grid-column: 1 / span 5; grid-row: 2; align-self: start; }
  .svc--c .svc__detail { grid-column: 7 / -1; grid-row: 2; padding-block-start: var(--sp-4); }

  /* ד. בין סניפים: מראה של א. התמונה יוצאת עד קצה המסך מימין */
  .svc--d .svc__media { grid-column: 1 / span 6; grid-row: 1 / span 2; --ratio: 4 / 5; margin-inline-start: calc(-1 * var(--margin)); border-start-start-radius: 0; border-end-start-radius: 0; border-start-end-radius: var(--r-xl); border-end-end-radius: var(--r-xl); }
  .svc--d .svc__head, .svc--d .svc__detail { grid-column: 8 / -1; }

  /* ו. כל השאר: הקופסה עצמה, קטנה ומרובעת, משמאל */
  .svc--f .svc__media { grid-column: 9 / -1; grid-row: 1 / span 2; --ratio: 1 / 1; align-self: center; }
  .svc--f .svc__head, .svc--f .svc__detail { grid-column: 1 / span 6; }
}
@media (min-width: 69rem) {
  .svc--b .svc__head, .svc--b .svc__detail { grid-column: 6 / span 5; }
}

/* ה. דחוף: פס מלא על רקע הלילה, בלי תמונה ממוסגרת */
.svc--e { overflow: clip; padding-block: calc(var(--space-section) * 1.3); }
.svc__bg { position: absolute; inset: 0; z-index: 0; margin: 0; }
.svc__bg picture { display: contents; }
.svc__bg img { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover; object-position: 22% 50%; }
.svc__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(to bottom, var(--bg) 0%, rgb(var(--ink-rgb) / 0) 22%, rgb(var(--ink-rgb) / 0) 78%, var(--bg) 100%),
    linear-gradient(to left, rgb(var(--ink-rgb) / .93) 0%, rgb(var(--ink-rgb) / .8) 48%, rgb(var(--ink-rgb) / .45) 100%);
}
.svc--e .svc__grid { position: relative; z-index: 1; }
.svc--e .svc__list { gap: var(--space-in); }
.svc--e .svc__list li { padding-block-start: var(--sp-4); box-shadow: inset 0 1px 0 var(--line-hover); }
@media (orientation: portrait) {
  .svc__bg::after { background: linear-gradient(to bottom, var(--bg) 0%, rgb(var(--ink-rgb) / .82) 20%, rgb(var(--ink-rgb) / .9) 80%, var(--bg) 100%); }
}
@media (min-width: 48rem) {
  .svc--e .svc__head { grid-column: 1 / span 7; grid-row: 1; }
  .svc--e .svc__detail { grid-column: 1 / -1; grid-row: 2; }
  .svc--e .svc__body { max-inline-size: 30em; }
  .svc--e .svc__list { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gutter); inline-size: 100%; margin-block-start: var(--sp-4); }
}

/* ---------- בכל משלוח: ארבע ההתחייבויות על קו מסלול אחד ---------- */
.promise__route { block-size: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); margin-block: var(--space-group) var(--sp-5); }
.promise__list { list-style: none; display: grid; gap: var(--space-group) var(--gutter); }
.promise__item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-3); align-items: start; }
.promise__item p { color: var(--fg-2); }
.pc-note-title { font-size: var(--fs-body); font-weight: var(--fw-bold); line-height: var(--lh-body); }
.pc-check { inline-size: var(--icon-md); block-size: var(--icon-md); margin-block-start: .15em; color: var(--lime-500); }
@media (min-width: 48rem) { .promise__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 69rem) { .promise__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ============================================================
   אודות
   ============================================================ */
.ab-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: var(--space-group); }
.ab-grid > * { grid-column: 1 / -1; min-inline-size: 0; }

/* 1. למה לבד: כותרת מימין, הסיפור משמאל, ומתחת השרשרת */
.ab-story__text { display: grid; gap: var(--space-in); }
.ab-story__text p:first-child { color: var(--fg-1); }
.ab-story__text p + p { color: var(--fg-2); }
@media (min-width: 48rem) {
  .ab-story__title { grid-column: 1 / span 5; }
  .ab-story__text { grid-column: 7 / -1; padding-block-start: var(--sp-3); }
}

/* השרשרת: הדרך הרגילה מול הדרך שלי */
.chain { margin: var(--space-block) 0 0; display: grid; gap: var(--space-group); }
.chain__row { display: grid; gap: var(--sp-3); }
.chain__label { color: var(--fg-3); }
.chain__track { position: relative; }
.chain__nodes { list-style: none; position: relative; z-index: 1; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--sp-2) var(--sp-1); }
.chain__node {
  display: inline-flex; align-items: center; gap: .4em;
  padding: .45em 1em; border-radius: var(--r-pill);
  background: var(--bg); box-shadow: inset 0 0 0 1px var(--line-hover);
  font-size: var(--fs-small); line-height: var(--lh-small); color: var(--fg-2); white-space: nowrap;
}
.chain__track--old::before {
  content: ""; position: absolute; inset-inline: 1rem; top: 50%;
  border-block-start: 1.5px dashed var(--line-control);
}
.chain__line {
  position: absolute; inset-inline: 1rem; top: 50%; block-size: 2px; margin-block-start: -1px;
  background: var(--lime-500); border-radius: 2px;
}
.chain__track--me .chain__node { color: var(--fg-1); font-weight: var(--fw-bold); box-shadow: inset 0 0 0 1.5px var(--line-control); }
.chain__track--me .chain__node--me { box-shadow: inset 0 0 0 1.5px var(--fg-1); }
.chain__mark { inline-size: 1.1em; block-size: 1.1em; flex: none; color: var(--lime-500); }
@media (max-width: 30rem) {
  .chain__node { padding: .4em .65em; }
}

/* 2. מה זה אומר בשבילכם: שלוש שורות ליד הקופסה */
.ab-means__list { list-style: none; display: grid; }
.ab-means__list li { display: grid; gap: var(--sp-2); padding-block: var(--sp-5); box-shadow: inset 0 1px 0 var(--line); }
.ab-means__list li:last-child { box-shadow: inset 0 1px 0 var(--line), inset 0 -1px 0 var(--line); }
.ab-means__list p { color: var(--fg-2); }
.ab-means__media.frame { --ratio: 1 / 1; }
@media (min-width: 48rem) {
  .ab-means__title { grid-column: 1 / span 6; grid-row: 1; align-self: end; }
  .ab-means__list { grid-column: 1 / span 6; grid-row: 2; }
  .ab-means__media.frame { grid-column: 8 / -1; grid-row: 1 / span 2; align-self: center; }
}

/* 3. אני מאמין: משפט אחד גדול על רקע האספלט */
.ab-belief { overflow: clip; padding-block: calc(var(--space-section) * 1.3); }
.ab-belief__bg { position: absolute; inset: 0; z-index: 0; }
.ab-belief__bg img { inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover; object-position: 70% 50%; }
.ab-belief__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to bottom, var(--bg) 0%, rgb(var(--ink-rgb) / .78) 30%, rgb(var(--ink-rgb) / .9) 65%, var(--bg) 100%);
}
.ab-belief__in { position: relative; z-index: 1; display: grid; gap: var(--space-group); }
.ab-belief__title { max-inline-size: 12em; }
.ab-belief__in p { color: var(--fg-2); }
.ab-mark { position: relative; display: inline-block; }
.ab-mark::after {
  content: ""; position: absolute; inset-inline: 0; bottom: .04em; block-size: 3px; border-radius: 2px;
  background: var(--lime-500);
  transform: scaleX(1); transform-origin: calc(50% - 50% * var(--dir)) 50%;
  transition: transform var(--dur-scene) var(--ease-expo);
}
html.fx .ab-mark:not(.is-on)::after { transform: scaleX(0); }

/* 4. ככה אני עובד: שש התחייבויות */
.ab-how__list { list-style: none; display: grid; gap: var(--space-group) var(--gutter); }
.ab-how__list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-3); align-items: start; padding-block-start: var(--sp-5); box-shadow: inset 0 1px 0 var(--line); }
.ab-how__list p { color: var(--fg-2); }
.ab-how__foot { margin-block-start: var(--space-block); color: var(--fg-2); }
@media (min-width: 48rem) { .ab-how__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 69rem) { .ab-how__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* 5. איפה אני רוכב: הטקסט מימין, העיר בלילה יוצאת עד קצה המסך משמאל */
.ab-area__line { color: var(--fg-2); }
.ab-area__line + .ab-area__line { margin-block-start: var(--space-in); }
.ab-cities { list-style: none; margin-block: var(--space-group); display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-5); font-weight: var(--fw-light); }
.ab-cities li { display: inline-flex; align-items: center; gap: .4em; }
.ab-cities li::before { content: ""; inline-size: .32em; block-size: .32em; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--on-ink-3); flex: none; }
.ab-area__media { position: relative; margin: 0 calc(-1 * var(--margin)); overflow: hidden; aspect-ratio: 4 / 3; }
.ab-area__media-in { position: absolute; inset: -8% 0; }
.ab-area__media img { inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover; }
@media (min-width: 48rem) {
  .ab-area__grid { align-items: center; }
  .ab-area__text { grid-column: 1 / span 5; }
  .ab-area__media {
    grid-column: 6 / -1; margin: 0; margin-inline-end: calc(-1 * var(--margin));
    aspect-ratio: 16 / 11;
    border-start-start-radius: var(--r-xl); border-end-start-radius: var(--r-xl);
  }
}

/* 6. עסק חדש: הדף החם היחיד בעמוד, כמו פתק מהשליח */
.ab-note__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: var(--space-group); }
.ab-note__grid > * { grid-column: 1 / -1; }
.ab-note__text { display: grid; gap: var(--space-in); }
.ab-note__text p { color: var(--fg-2); }
.ab-note__sign { display: inline-flex; align-items: center; gap: var(--sp-2); font-weight: var(--fw-bold); color: var(--fg-1); }
.ab-note__sign svg { inline-size: 24px; block-size: 24px; color: var(--fg-1); }
@media (min-width: 48rem) {
  .ab-note__title { grid-column: 1 / span 5; }
  .ab-note__text { grid-column: 7 / -1; }
}

/* ---------- ניגודיות ומצבים מיוחדים ---------- */
@media (prefers-contrast: more) {
  .svc__bg::after, .ab-belief__bg::after { background: rgb(var(--ink-rgb) / .9); }
}
@media (forced-colors: active) {
  .chain__node { border: 1px solid CanvasText; }
  .chain__line { background: Highlight; }
}

/* ============================================================
   אודות: פתיחה. הרוכב והארגז הבוהק לא יושבים מאחורי הטקסט.
   מסך לאורך (טלפון, טאבלט לאורך): התמונה למעלה, נמסה לפחם, והטקסט מתחתיה על פחם.
   מסך לרוחב: הטקסט נגמר לפני הרוכב.
   ============================================================ */
.pc-hero--about { --pc-media-h: min(56vw, 46svh); }
.pc-hero--about .page-hero__sub { max-inline-size: 32ch; }
@media (orientation: portrait) {
  .pc-hero--about { padding-block-start: calc(var(--header-h) + var(--pc-media-h)); }
  .pc-hero--about .page-hero__media { inset: 0 0 auto 0; block-size: calc(var(--header-h) + var(--pc-media-h) + var(--sp-6)); }
  .pc-hero--about .page-hero__sub { max-inline-size: 30em; }
  .pc-hero--about .page-hero__scrim {
    background: linear-gradient(to bottom,
      rgb(var(--ink-rgb) / .7) 0,
      rgb(var(--ink-rgb) / 0) calc(var(--header-h) + var(--sp-6)),
      rgb(var(--ink-rgb) / 0) calc(var(--header-h) + var(--pc-media-h) - var(--sp-8)),
      var(--ink-900) calc(var(--header-h) + var(--pc-media-h) + var(--sp-4)));
  }
}