/* "קו המסע" — שפת V2, נגזרת אחת-לאחת מהלנדינג החי. עיצוב: Fable. */

* { box-sizing: border-box; min-width: 0; }
html, body { margin: 0; padding: 0; }
/* מיכל הגלילה של החלון הוא html — העיגון חייב להתנטרל שם, לא רק ב-body */
html { overflow-anchor: none; }
body { background: var(--paper); color: var(--ink); font-family: var(--font);
  font-size: var(--fs-body); line-height: 1.6; overflow-x: hidden;
  /* עיגון-הגלילה של הדפדפן נאבק בשחזור שלנו אחרי רינדור מחדש וגורם
     לקפיצה מעלה בלחיצת "הציגו עוד". מנוטרל — keepScroll שומר את המיקום. */
  overflow-anchor: none;
  -webkit-font-smoothing: antialiased; }
b, strong { font-weight: 600; }
h1, h2, h3 { margin: 0; font-weight: 800; letter-spacing: -.022em; line-height: 1.15; }
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
[hidden] { display: none !important; }
.wrap  { max-width: var(--wrap); margin-inline: auto; padding-inline: var(--s4); }
.lwrap { max-width: var(--wrap-hero); margin-inline: auto; padding-inline: var(--s5); }
.hint { font-size: var(--fs-hint); color: var(--muted); font-weight: 600; }

/* ═══ כרום: רצועה עליונה אחת, וניווט מקטעים בקצה השני ═══════════
   שלוש רצועות דביקות אכלו 173 פיקסלים בנייד — 20 אחוז מהמסך. המחקר
   מצא שאף מוצר נסיעות שנבדק אינו מחזיק יותר מרצועה אחת בנייד, ואף
   אחד לא שם מחוון התקדמות בכרום. ─────────────────────────────── */
:root {
  --top-h: 56px;
  --top-h-sm: 48px;
  --nav-h: 56px;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --chrome-b: calc(var(--nav-h) + var(--safe-b));
  --stick-t: var(--top-h);
}
html[data-scroll="down"], html[data-scroll="up"] { --top-h: var(--top-h-sm); }

/* מיקוד לא נחסם מאחורי כרום דביק — WCAG 2.4.11 */
html { scroll-padding-top: calc(var(--stick-t) + var(--s2));
       scroll-padding-bottom: calc(var(--chrome-b) + var(--s2)); }
body { padding-block-end: var(--chrome-b); }

.skip { position: fixed; inset-inline-start: var(--s2); top: var(--s2); z-index: 100;
  transform: translateY(-250%); background: var(--panel); color: var(--ink);
  padding: 10px 18px; min-height: var(--tap); display: inline-flex;
  align-items: center; border: 1px solid var(--line-2);
  border-radius: var(--radius); box-shadow: var(--shadow-lg);
  font-weight: 800; font-size: var(--fs-small); text-decoration: none;
  transition: transform .15s ease; }
.skip:focus { transform: translateY(0); }

/* ── header ── */
.top { position: sticky; top: 0; z-index: 30; background: var(--paper);
  border-bottom: 1px solid var(--line); transform: translateY(0);
  transition: transform .28s ease, box-shadow .18s ease; }
@supports (backdrop-filter: blur(14px)) {
  .top { background: rgba(255,249,242,.94); backdrop-filter: blur(14px); }
}
.top .in { display: flex; align-items: center; gap: var(--s2);
  min-height: var(--top-h); transition: min-height .18s ease; }
html[data-scroll="down"] .top { transform: translateY(-100%); }
html[data-scroll="up"] .top { transform: translateY(0); box-shadow: var(--shadow); }
/* מיקוד מקלדת מחזיר את הרצועה גם כשהיא מוסתרת */
.top:focus-within { transform: translateY(0) !important; }

.top .desk-only { display: none; }

/* פקד היעד: סמל, שם, וחץ — לחיצה אחת מחליפה יעד */
.top-dest { flex: 1; min-width: 0; display: inline-flex; align-items: center;
  gap: var(--s2); min-height: var(--tap); padding: var(--s1) var(--s3) var(--s1) 6px;
  background: none; border: 0; border-radius: var(--radius-pill);
  color: var(--ink); text-align: start; transition: background .15s ease; }
.top-dest:hover { background: var(--paper-2); }
.top-dest img { width: 24px; height: 24px; flex: none;
  border-radius: var(--radius-sm); display: block; }
.td-name { min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; font-size: var(--fs-h3); font-weight: 700;
  line-height: 1.35; letter-spacing: 0; }
.td-caret { flex: none; font-size: 13px; line-height: 1; color: var(--accent-ink); }

/* כיפ השלבים — הרמז היחיד בכרום */
.top-steps { flex: none; display: inline-flex; align-items: center; gap: 6px;
  min-height: var(--tap); min-width: var(--tap); padding-inline: 10px;
  background: var(--panel); border: 1px solid var(--line-2);
  border-radius: var(--radius-pill); color: var(--ink); }
.top-steps[disabled] { opacity: .5; }
.top-steps .ring { width: 22px; height: 22px; flex: none; display: block; }
.top-steps .ring circle { fill: none; stroke-width: 2.5; }
.top-steps .ring .bg { stroke: var(--line-2); }
.top-steps .ring .fg { stroke: var(--teal); stroke-linecap: round;
  transform: rotate(-90deg); transform-origin: 50% 50%;
  transition: stroke-dashoffset .3s ease; }
.ts-count { font-size: var(--fs-hint); font-weight: 800; color: var(--ink);
  letter-spacing: 0; }
.ts-label { display: none; }

/* ── ניווט מקטעים: תחתון בנייד ── */
.secnav { position: fixed; inset-inline: 0; bottom: 0; z-index: 40;
  display: grid; grid-template-columns: repeat(5, 1fr); background: var(--paper);
  border-top: 1px solid var(--line); padding-block-end: var(--safe-b); }
@supports (backdrop-filter: blur(12px)) {
  .secnav { background: rgba(255,249,242,.97); backdrop-filter: blur(12px); }
}
.secnav .sec { position: relative; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 2px;
  min-height: var(--nav-h); padding: var(--s2) 2px; color: var(--ink-2);
  text-decoration: none; font-size: var(--fs-tag); font-weight: 600;
  line-height: 1.2; letter-spacing: 0; -webkit-tap-highlight-color: transparent; }
.sec-ic { font-size: 20px; line-height: 20px; }
.sec-tx { max-width: 100%; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.secnav .sec[aria-current="page"] { color: var(--ink); font-weight: 800; }
/* מיקום לוגי בלבד: inset-inline עם margin אוטומטי מרכז בשני הכיוונים */
.secnav .sec[aria-current="page"]::before { content: ""; position: absolute;
  inset-block-start: 0; inset-inline: 0; width: 24px; margin-inline: auto;
  height: 3px; border-radius: 0 0 3px 3px; background: var(--accent); }
/* הצבע אינו הסימן היחיד: המשקל והפס משתנים יחד */

.brand { display: flex; align-items: center; gap: 10px; font-weight: 800;
  font-size: 18px; color: var(--ink); white-space: nowrap; }
.brand img { width: 28px; height: 28px; border-radius: var(--radius-sm); display: block; }
.tag-preview { font-size: var(--fs-tag); font-weight: 800; color: var(--accent-ink);
  background: var(--accent-soft); padding: 4px 12px; border-radius: var(--radius-pill);
  white-space: nowrap; }
.top-links { margin-inline-start: auto; display: flex; align-items: center;
  gap: var(--s5); }
.top-links a, .top-links button { background: none; border: 0; padding: 0;
  color: var(--ink-2); font-size: var(--fs-small); font-weight: 600;
  text-decoration: none; }
.top-links a:hover, .top-links button:hover { color: var(--accent-ink); }
.sep { width: 1px; height: 22px; background: var(--line-2); flex: none; }
.top-title { flex: 1; min-width: 0; font-size: var(--fs-h3); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }

/* ── כפתורים ── */
.btn { min-height: var(--ctl); padding: 12px 22px; border-radius: var(--radius);
  border: 1px solid var(--accent); background: var(--accent); color: var(--on-accent);
  font-weight: 800; font-size: var(--fs-body);
  transition: transform .15s ease, box-shadow .15s ease; box-shadow: var(--shadow); }
.btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-lg); }
.btn.ghost { background: var(--panel); border: 1.5px solid var(--line-2);
  color: var(--ink); box-shadow: none; }
.btn.small { min-height: 38px; padding: 6px 14px; font-size: var(--fs-small); }
.more-btn { margin-inline-start: auto; background: none; border: 0;
  color: var(--accent-ink); font-weight: 800; font-size: var(--fs-small);
  min-height: var(--tap); padding: var(--s2) var(--s3); }

/* ── מסך כניסה ── */
.enter-hero { position: relative; overflow: hidden; padding: var(--s8) 0 var(--s6); }
.enter-hero::before { content: ""; position: absolute; width: 300px; height: 300px;
  border-radius: 50%; background: rgba(47,143,131,.10); filter: blur(60px);
  inset-inline-start: 4%; bottom: 0; }
.enter-hero::after { content: ""; position: absolute; width: 250px; height: 250px;
  border-radius: 50%; background: rgba(242,138,100,.11); filter: blur(55px);
  inset-inline-end: 6%; top: -4%; }
.enter-hero .in { position: relative; z-index: 1; display: grid;
  grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 7px; font-size: var(--fs-tag);
  font-weight: 800; color: var(--accent-ink); background: var(--accent-soft);
  padding: 7px 14px; border-radius: var(--radius-pill); }
.eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent); }
.enter-hero h1 { font-size: var(--fs-h1); letter-spacing: -.035em; line-height: 1.06;
  margin: 14px 0 12px; }
.hl { color: var(--accent); }
.enter-hero .sub { font-size: 17px; color: var(--ink-2); line-height: 1.6;
  max-width: 440px; margin: 0 0 var(--s5); }
.trust { font-size: var(--fs-hint); color: var(--muted); font-weight: 600;
  margin: var(--s3) 0 0; }

.startbox { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); padding: 14px; box-shadow: var(--shadow-lg);
  max-width: 460px; }
.sb-row { display: flex; gap: var(--s2); }
.field { position: relative; flex: 1; min-width: 0; }
.field input { width: 100%; min-height: var(--ctl); padding: 12px 15px;
  border: 1px solid var(--line-2); border-radius: var(--radius);
  background: var(--panel); font-size: 16px; }
.field input:focus { outline: 2px solid var(--accent); outline-offset: 1px;
  border-color: transparent; }
.sugg { position: absolute; inset-inline: 0; top: calc(100% + 6px); z-index: 20;
  list-style: none; margin: 0; padding: 6px; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); }
.sugg li { margin: 0; }
.sugg button { display: block; width: 100%; text-align: start; background: none;
  border: 0; border-radius: var(--radius-sm); padding: 12px 14px;
  min-height: var(--tap); font-size: 15px; font-weight: 600; color: var(--ink); }
.sugg button:hover, .sugg button[aria-selected="true"] { background: var(--paper-2); }
.sugg .cc { color: var(--muted); font-size: var(--fs-hint); font-weight: 400; }

/* גלוית השמיים — CSS בלבד */
.postcard { position: relative; overflow: hidden; aspect-ratio: 5 / 4;
  width: 100%; max-width: 480px; margin-inline-start: auto; border-radius: var(--radius-lg);
  background: var(--grad-warm); border: 1px solid rgba(255,255,255,.6);
  box-shadow: var(--shadow-lg); }
.pc-sky { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pc-sun { fill: #FFE1A6; opacity: .85; }
.pc-cloud { fill: rgba(255,255,255,.82); }
.pc-path { fill: none; stroke: var(--route); stroke-width: 2.5;
  stroke-dasharray: 7 8; stroke-linecap: round; }
.pc-dot.a { fill: var(--accent); }
.pc-dot.b { fill: var(--teal); }
.pc-plane { fill: var(--ink); offset-path: path("M 46 244 C 140 150, 250 188, 352 62");
  offset-rotate: auto; offset-distance: 100%; }

@media (prefers-reduced-motion: no-preference) {
  /* המטוס עף על אותו מסלול שהקו מצייר, והמקווקו זוחל לכיוון הטיסה */
  .pc-plane { animation: pc-fly 7.5s cubic-bezier(.5,0,.5,1) infinite; }
  .pc-path { animation: pc-dash 3s linear infinite; }
  .pc-sun { animation: pc-glow 5s ease-in-out infinite; }
  .pc-cloud { animation: pc-drift 16s ease-in-out infinite; }
  .pc-cloud:nth-of-type(3) { animation-duration: 22s; animation-direction: reverse; }
}
@keyframes pc-fly {
  0% { offset-distance: 0%; opacity: 0; }
  7% { opacity: 1; }
  90% { opacity: 1; }
  100% { offset-distance: 100%; opacity: 0; }
}
@keyframes pc-dash { to { stroke-dashoffset: -30; } }
@keyframes pc-glow { 50% { opacity: .62; } }
@keyframes pc-drift { 50% { transform: translateX(-16px); } }

.postcard .float-tag { position: absolute; bottom: 9%; inset-inline-start: 8%;
  max-width: 220px; padding: 10px 12px; border-radius: var(--radius);
  background: rgba(255,255,255,.94); border: 1px solid var(--line);
  box-shadow: var(--shadow); backdrop-filter: blur(10px);
  font-size: var(--fs-tag); font-weight: 600; color: var(--ink); }

/* יעדים מהירים */
.quick { padding: var(--s2) 0 56px; }
.quick h2 { font-size: var(--fs-h2); margin: 0 0 4px; }
.quick .lead { font-size: var(--fs-small); color: var(--ink-2); margin: 0 0 var(--s4); }
.quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s4); }
.dest-card { position: relative; display: flex; flex-direction: column;
  padding: 0; text-align: start; border: 1px solid var(--line);
  border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow);
  transition: transform .18s ease, box-shadow .18s ease; }
.dest-card .card-ph { width: 100%; aspect-ratio: 4 / 3; border-radius: 0; }
.dest-card .card-ph img { transition: opacity .45s ease, transform .5s ease; }
.dest-card:hover .card-ph img { transform: scale(1.05); }
.dest-card .cap { display: flex; flex-direction: column; padding: 12px var(--s4) 10px; }
.dest-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.dest-card { background: var(--panel); }
.dest-card .name { font-size: 19px; font-weight: 800; color: var(--ink); }
.dest-card .country { font-size: var(--fs-hint); font-weight: 600;
  color: var(--muted); }
.dest-card .go { display: flex; align-items: center; justify-content: space-between;
  padding: 10px var(--s4); border-top: 1px solid var(--line);
  font-size: var(--fs-hint); font-weight: 800; color: var(--accent-ink); }
.dest-card .go::after { content: "←"; }

/* ── סקשנים מוכרים — הקצב של הלנדינג החי, מוסב ל-V2 ── */
.lsec { padding: 64px 0; }
.lsec.alt { background: var(--paper-2); }
.center { text-align: center; }
.sec-tag { display: inline-block; font-size: var(--fs-tag); font-weight: 600;
  color: var(--accent-ink); background: var(--accent-soft); padding: 6px 14px;
  border-radius: var(--radius-pill); margin-bottom: 14px; }
.sec-h { font-size: var(--fs-sec); font-weight: 600; letter-spacing: -.025em;
  line-height: 1.12; max-width: 600px; }
.center .sec-h, .center .sec-p { margin-inline: auto; }
.sec-p { font-size: var(--fs-body); line-height: 1.65; color: var(--ink-2);
  max-width: 540px; margin: 12px 0 0; }

/* לפני ואחרי — הכרטיס שמוכר את הסדר */
.ba-card { display: grid; grid-template-columns: 1fr 1fr; max-width: 720px;
  margin: 32px auto 0; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden;
  text-align: start; }
.ba-side { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 12px; }
.ba-before { background: var(--paper-2); }
.ba-after { background: var(--teal-soft); }
.ba-t { font-size: var(--fs-tag); font-weight: 600; letter-spacing: .02em;
  color: var(--muted); margin-bottom: 2px; }
.ba-after .ba-t { color: var(--teal); }
.ba-before span { display: flex; align-items: center; gap: 10px;
  font-size: var(--fs-small); font-weight: 400; color: var(--muted); }
.ba-before span::before { content: "✕"; font-size: 12px; font-weight: 600;
  color: #b9c4c2; flex: none; width: 18px; height: 18px; border-radius: 50%;
  background: var(--panel); display: grid; place-items: center; }
.ba-after span { display: flex; align-items: center; gap: 10px;
  font-size: var(--fs-small); font-weight: 600; color: var(--ink); }
.ba-after span::before { content: "✓"; font-size: 12px; font-weight: 600;
  color: #fff; flex: none; width: 18px; height: 18px; border-radius: 50%;
  background: var(--teal); display: grid; place-items: center; }

/* שלושה צעדים */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
  margin-top: 36px; text-align: start; }
.step { position: relative; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); }
.step .n { width: 34px; height: 34px; border-radius: var(--radius);
  background: var(--accent-soft); color: var(--accent-ink); display: grid;
  place-items: center; font-weight: 800; font-size: var(--fs-small);
  margin-bottom: 15px; }
.step .s-ic { position: absolute; inset-inline-end: 20px; top: 22px;
  width: 38px; height: 38px; border-radius: var(--radius);
  background: var(--paper-2); border: 1px solid var(--line); display: grid;
  place-items: center; font-size: 18px; }
.step h3 { font-size: 20px; font-weight: 600; line-height: 1.3; margin-bottom: 6px; }
.step p { font-size: var(--fs-small); line-height: 1.6; color: var(--ink-2); margin: 0; }

/* רשת היכולות — גם המדריך, גם הארגון */
.fgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  margin-top: 32px; text-align: start; }
.fcell { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease; }
.fcell:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.fcell .fic { width: 40px; height: 40px; border-radius: var(--radius);
  background: var(--paper-2); border: 1px solid var(--line); display: grid;
  place-items: center; margin-bottom: 12px; font-size: 18px; }
.fcell b { display: block; font-size: 20px; font-weight: 600; line-height: 1.3;
  margin-bottom: 4px; color: var(--ink); }
.fcell p { margin: 0; font-size: var(--fs-small); line-height: 1.6;
  color: var(--ink-2); }

/* CTA סוגר — חוזרים אל "לאן טסים?" */
.cta-final h2 { font-size: clamp(25px, 1.05rem + 2.4vw, 34px); font-weight: 800;
  letter-spacing: -.025em; }
.cta-final p { font-size: var(--fs-body); color: var(--ink-2); max-width: 440px;
  margin: 12px auto 0; }
.cta-final .startbox { max-width: 540px; margin: 22px auto 0; text-align: start; }
.sb-label { font-size: var(--fs-tag); font-weight: 800; color: var(--ink-2);
  margin-bottom: 9px; display: flex; align-items: center; gap: 6px; }

/* CTA דביק במובייל — מופיע כשההירו יוצא מהמסך, נעלם ליד הסוגר */
.sticky-cta { position: fixed; inset-inline: 0; bottom: 0; z-index: 40;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255,249,242,.96); backdrop-filter: blur(8px);
  border-top: 1px solid var(--line); display: none; opacity: 0;
  transition: opacity .25s ease; }
.sticky-cta .btn { width: 100%; }
.sticky-cta.vis { display: block; }
.sticky-cta.on { opacity: 1; }
@media (min-width: 769px) { .sticky-cta { display: none !important; } }

/* תג שני מרחף על הגלויה */
.float-tag.t2 { bottom: auto; inset-inline-start: auto; top: 10%;
  inset-inline-end: 7%; }

/* ── תנועה — מוסב מהלנדינג החי, כבוי אוטומטית ב-reduced-motion ── */
@media (prefers-reduced-motion: no-preference) {
  .anim { opacity: 0; transform: translateY(12px);
    transition: opacity .5s ease, transform .5s ease; }
  .anim.in { opacity: 1; transform: none; }
  .steps .anim:nth-child(2), .fgrid .anim:nth-child(2),
  .quick-grid .anim:nth-child(2) { transition-delay: .06s; }
  .steps .anim:nth-child(3), .fgrid .anim:nth-child(3),
  .quick-grid .anim:nth-child(3) { transition-delay: .12s; }
  .fgrid .anim:nth-child(4), .quick-grid .anim:nth-child(4) { transition-delay: .18s; }
  .fgrid .anim:nth-child(5) { transition-delay: .24s; }
  .fgrid .anim:nth-child(6) { transition-delay: .3s; }
  .enter-hero .in > div { animation: ttl-fade .6s ease both; }
  .postcard .float-tag { animation: ttl-fade .6s ease .5s both; }
  main .view-fade { animation: ttl-fade .35s ease both; }
  .grid-3 .anim:nth-child(2) { transition-delay: .06s; }
  .grid-3 .anim:nth-child(3) { transition-delay: .12s; }
  .grid-3 .anim:nth-child(4) { transition-delay: .18s; }
  .grid-3 .anim:nth-child(5) { transition-delay: .24s; }
  .grid-3 .anim:nth-child(6) { transition-delay: .3s; }
}
@keyframes ttl-fade { from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; } }
@keyframes pc-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@keyframes cloud-drift { 0%, 100% { translate: 0 0; } 50% { translate: -14px 3px; } }
@keyframes sun-glow { 50% { opacity: .8; } }

/* פוטר */
.foot { border-top: 1px solid var(--line); background: var(--paper-2);
  padding: var(--s6) 0 var(--s6); margin-top: var(--s8); }
.foot .in { display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: var(--s3) var(--s4);
  padding-bottom: var(--s4); border-bottom: 1px solid var(--line);
  margin-bottom: var(--s4); }
.foot .flinks { display: flex; flex-wrap: wrap; gap: 10px 16px;
  font-size: var(--fs-tag); }
.foot a { color: var(--ink-2); font-weight: 600; text-decoration: none; }
.foot a:hover { color: var(--accent-ink); }
.foot .ldisc { font-size: var(--fs-tag); color: var(--muted); text-align: center;
  margin: 0 auto; line-height: 1.75; max-width: 640px; }
.foot .lcopy { font-size: var(--fs-tag); color: var(--muted); text-align: center;
  margin: var(--s3) auto 0; font-weight: 600; }

/* ── תמונות מקום ── */
.ph { position: relative; overflow: hidden; background: var(--grad-warm);
  border-radius: var(--radius); flex: none; }
.ph img { width: 100%; height: 100%; object-fit: cover; display: block;
  opacity: 0; transition: opacity .45s ease; }
.ph.has-img img { opacity: 1; }
/* מסגרת בלי תמונה נשארת גרדיאנט חם — לא חור בפריסה */
.ph.no-img::after { content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 70% 30%, rgba(255,255,255,.55), transparent 60%); }

/* ── מרחב היעד ── */
main { padding-block: 0 var(--s8); }

.dest-hero { position: relative; overflow: hidden; border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg); margin: var(--s4) 0 var(--s3);
  padding: 92px 20px var(--s4); isolation: isolate; background: var(--grad-boot); }
.dest-hero .hero-ph { position: absolute; inset: 0; z-index: -2;
  border-radius: 0; animation: hero-in 1.1s ease both; }
@keyframes hero-in { from { transform: scale(1.06); } to { transform: none; } }
/* שכבת קריאות: הכיתוב יושב על תמונה, ולכן חייב רקע מדורג ולא ניחוש */
.dest-hero::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(to top,
    rgba(255,249,242,.97) 0%, rgba(255,249,242,.90) 34%,
    rgba(255,249,242,.45) 62%, rgba(255,249,242,.15) 100%); }
.dest-hero .d-name { position: relative; font-size: clamp(30px, 3.4vw, 40px);
  font-weight: 800; letter-spacing: -.03em; line-height: 1.05; color: var(--ink);
  text-shadow: 0 1px 0 rgba(255,255,255,.6); }
.dest-hero .d-country { position: relative; display: block;
  font-size: var(--fs-small); font-weight: 600; color: var(--accent-ink);
  margin: 4px 0 var(--s3); }
.fact-chips { position: relative; display: flex; flex-wrap: wrap; gap: var(--s2); }
.fact-chips span { background: rgba(255,255,255,.85); border: 1px solid var(--line);
  border-radius: var(--radius-pill); padding: 6px 12px; font-size: var(--fs-hint);
  font-weight: 600; color: var(--ink); }

/* השלבים שלי — לוח בתוכן, וגיליון תחתון מהכיפ */
.steps-block { margin: var(--s4) 0 var(--s5); }
.steps-panel { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }
.st-c { flex: none; width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-items: center; font-size: 12px; font-weight: 800;
  border: 1.5px solid var(--line-2); color: var(--muted); background: var(--panel); }
.st-c.done { background: var(--teal); border-color: var(--teal); color: #fff; }
.st-c.part { border-color: var(--teal); color: var(--teal-ink); }
.st-row { display: flex; align-items: center; gap: 10px; width: 100%;
  background: none; border: 0; text-align: start; padding: 11px var(--s4);
  min-height: 52px; }
.st-row + .st-row { border-top: 1px solid var(--line); }
.st-row:hover { background: var(--paper-2); }
.st-ic { flex: none; font-size: 16px; }
.st-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.st-tx b { font-size: var(--fs-small); color: var(--ink); }
.st-tx span { font-size: var(--fs-tag); color: var(--muted); font-weight: 600; }
.st-row.done .st-tx b { color: var(--teal-ink); }
.st-go { color: var(--accent-ink); font-weight: 800; }
/* גיליון השלבים */
.steps-sheet { width: 100%; max-width: 560px; max-height: 70svh;
  margin: auto auto 0; padding: 0; border: 0;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  background: var(--panel); color: var(--ink); box-shadow: var(--shadow-lg);
  overflow: auto; overscroll-behavior: contain; padding-block-end: var(--safe-b); }
.steps-sheet::backdrop { background: rgba(23,59,58,.42); }
.sheet-head { position: sticky; top: 0; background: var(--panel);
  display: flex; align-items: center; gap: var(--s2);
  padding: var(--s3) var(--s4); border-bottom: 1px solid var(--line); }
.sheet-head b { flex: 1; font-size: var(--fs-h3); font-weight: 800; }
.sheet-x { min-width: var(--tap); min-height: var(--tap); background: none;
  border: 0; border-radius: var(--radius); color: var(--ink-2); font-size: 18px; }
.steps-sheet .steps-panel { border: 0; border-radius: 0; box-shadow: none; }

/* אזור לינה נבחר */
.stay-card.chosen { border-color: var(--teal); box-shadow: var(--shadow-lg); }
.your-area { align-self: flex-start; margin-bottom: 6px; }
.stay-body { display: flex; flex-direction: column; align-items: flex-start; }
.stay-body p, .stay-body h3, .stay-sub { align-self: stretch; }

/* שישה שלבים בנחיתה */
.steps.six { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) { .steps.six { grid-template-columns: 1fr; } }

/* התקדמות הטיול — בדף הראשי של היעד */
.trip-progress { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
  padding: var(--s4) var(--s4) var(--s4); margin-bottom: var(--s3); }
.prog-cells { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s2);
  margin-bottom: var(--s3); }
.prog-cell { display: flex; flex-direction: column; align-items: center; gap: 2px;
  background: none; border: 0; border-radius: var(--radius); padding: 8px 4px;
  transition: background .15s; }
.prog-cell:hover { background: var(--paper-2); }
.prog-cell .pc-ic { font-size: 17px; }
.prog-cell b { font-size: 16px; font-weight: 800; color: var(--ink); }
.prog-cell span:last-child { font-size: var(--fs-tag); font-weight: 600;
  color: var(--muted); }

/* הוספה ליום מתוך כרטיס במדריך */
.add-to-day { display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  margin-top: var(--s2); padding-top: var(--s2);
  border-top: 1px dashed var(--line-2); }
.atd-label { font-size: var(--fs-tag); font-weight: 800; color: var(--ink-2); }
.atd-days { display: flex; flex-wrap: wrap; gap: 6px; }
.atd-btn { min-height: 32px; padding: 5px 12px; border-radius: var(--radius-pill);
  border: 1px solid var(--line-2); background: var(--panel);
  font-size: var(--fs-hint); font-weight: 800; color: var(--teal-ink);
  transition: background .15s, transform .15s; }
.atd-btn:hover { background: var(--teal-soft); transform: translateY(-1px); }
.atd-done { font-size: var(--fs-hint); font-weight: 800; color: var(--teal-ink); }

/* קישור חיפוש מלונות באזור */
.area-link { display: inline-flex; align-items: center; margin-top: 10px;
  font-size: var(--fs-hint); font-weight: 800; color: var(--accent-ink);
  text-decoration: none; }
.area-link:hover { text-decoration: underline; }

.notice { display: flex; gap: 10px; align-items: flex-start; background: var(--warn-bg);
  border: 1px solid var(--warn-line); color: var(--warn-ink);
  border-radius: var(--radius); padding: var(--s3) 14px; font-size: var(--fs-hint);
  line-height: 1.55; margin-bottom: var(--s3); }
.notice::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%;
  background: var(--accent); margin-top: 6px; }
.notice-tx { display: flex; flex-direction: column; gap: 2px; }
.checked-on { font-weight: 800; }

.start-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s3); }
.step-card { display: flex; flex-direction: column; gap: var(--s2); text-align: start;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: var(--s4);
  transition: transform .15s ease, box-shadow .15s ease; }
.step-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.step-card .n { width: 34px; height: 34px; border-radius: var(--radius);
  background: var(--accent-soft); color: var(--accent-ink); display: grid;
  place-items: center; font-weight: 800; font-size: var(--fs-small); }
.step-card b { font-size: 16px; font-weight: 600; color: var(--ink); }
.step-card span { font-size: var(--fs-hint); color: var(--muted); }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); }
.stay-card { display: flex; flex-direction: column; overflow: hidden;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
  transition: transform .18s ease, box-shadow .18s ease; }
.stay-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.stay-card .area-ph { width: 100%; aspect-ratio: 21 / 9; border-radius: 0; }
.stay-body { padding: var(--s4) var(--s4) var(--s4); }
.stay-body h3 { font-size: 17px; color: var(--ink); }
.stay-sub { display: block; font-size: var(--fs-hint); color: var(--muted);
  font-weight: 600; margin: 2px 0 10px; }
.stay-body p { margin: 0 0 10px; font-size: var(--fs-small); color: var(--ink-2);
  line-height: 1.6; }
.fit-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.fit-chips span { font-size: var(--fs-tag); font-weight: 600; color: var(--teal-ink);
  background: var(--teal-soft); border-radius: var(--radius-pill); padding: 4px 10px; }

.sec { margin-top: var(--s7); }
.sec-head { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--s3); }
.sec-head::before { content: ""; flex: none; width: 22px; height: 5px;
  border-radius: var(--radius-pill); background: var(--accent); }
.sec-head.no-tick::before { display: none; }
.sec-head h2 { font-size: var(--fs-h2); letter-spacing: -.02em; }
.count-pill { font-size: var(--fs-tag); font-weight: 600; color: var(--teal-ink);
  background: var(--teal-soft); border-radius: var(--radius-pill); padding: 3px 10px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s4); }

/* זהות צבע לקטגוריה — אותן ארבע משפחות גוון של הגלויות */
.icon-sq { flex: none; width: 34px; height: 34px; border-radius: var(--radius-sm);
  display: grid; place-items: center; font-size: 16px;
  border: 1px solid var(--line); }
.icon-sq.c1 { background: var(--tint-amber); }
.icon-sq.c2 { background: var(--tint-pink); }
.icon-sq.c3 { background: var(--tint-peach); }
.icon-sq.c4 { background: var(--tint-teal); }

.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: var(--s4) 0 0; }
.chips button { display: inline-flex; align-items: center; gap: 7px;
  min-height: 36px; padding: 6px 14px; border-radius: var(--radius-pill);
  border: 1px solid var(--line-2); background: var(--panel);
  font-size: var(--fs-hint); font-weight: 600; color: var(--ink-2); }
/* צבע הקטגוריה חי בריבוע האייקון בלבד — הצ׳יפים ניטרליים */
.chips button[aria-pressed="true"] { background: var(--accent);
  border-color: var(--accent); color: var(--on-accent); font-weight: 800; }

.item-card { position: relative; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease; }
.item-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.item-card .head { display: grid; grid-template-columns: 92px 1fr auto;
  align-items: center; gap: 12px; width: 100%; background: none; border: 0;
  text-align: start; padding: 12px 14px; min-height: var(--tap); }
.item-card.plain .head { grid-template-columns: 1fr auto; padding: 14px var(--s4); }
.item-card .head .tile { width: 92px; aspect-ratio: 4 / 3;
  border-radius: var(--radius-sm); }
/* מקום בלי תמונה מתאימה לא מקבל ריבוע ריק — הכרטיס הופך לשורת טקסט.
   ארבעים ריבועי גרדיאנט זהים הם בדיוק המראה שדוד פסל. */
.item-card .head:has(.tile.no-img) { grid-template-columns: 1fr auto; }
.item-card .tile.no-img { display: none; }
.item-card .cap { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.item-card .cap b { font-size: 16px; font-weight: 600; color: var(--ink);
  line-height: 1.3; }
/* חיתוך דטרמיניסטי: גובה שתי שורות בדיוק. line-clamp לא נאכף
   בכל הדפדפנים, וגובה מחושב לא משקר. */
.item-card .peek { font-size: var(--fs-hint); line-height: 1.5;
  max-height: 3em; overflow: hidden; color: var(--muted); }
.item-card .plus { flex: none; width: 26px; height: 26px;
  border-radius: var(--radius-sm); background: none;
  border: 1px solid var(--line-2); color: var(--muted); display: grid;
  place-items: center; font-weight: 800;
  transition: transform .2s, color .15s, border-color .15s; }
.item-card:hover .plus { color: var(--accent-ink); border-color: var(--accent); }
.item-card .plus::before { content: "+"; }
.item-card[data-open="true"] .plus { transform: rotate(45deg); }

.item-card .details { display: none; padding: var(--s3) var(--s4) 14px;
  border-top: 1px dashed var(--line-2); }
.item-card[data-open="true"] .details { display: block;
  animation: ttl-fade .25s ease both; }
.item-card[data-open="true"] .peek { display: none; }
.item-card[data-open="true"] .head .tile { aspect-ratio: 16 / 9; }
.item-card .details p { margin: 0 0 var(--s2); font-size: var(--fs-small);
  color: var(--ink-2); line-height: 1.6; }
.facts { margin: var(--s2) 0 0; padding: 0; list-style: none;
  font-size: var(--fs-hint); }
.facts li { color: var(--muted); padding-block: 3px; }
.badge { display: inline-block; font-size: 11px; font-weight: 800; padding: 2px 9px;
  border-radius: var(--radius-pill); background: var(--warn-bg);
  border: 1px solid var(--warn-line); color: var(--warn-ink);
  margin-inline-start: 6px; vertical-align: 1px; }

/* ── טפסים ורשימות ── */
.f-label { display: block; font-size: var(--fs-tag); font-weight: 800;
  color: var(--ink-2); margin-bottom: 6px; }
select { direction: rtl; }
input[type="text"], input[type="number"], input[type="date"], select {
  min-height: var(--tap); padding: 10px 14px; border: 1px solid var(--line-2);
  border-radius: var(--radius); background: var(--panel); font-size: 16px;
  font-weight: 400; width: 100%; }
input:focus, select:focus { outline: 2px solid var(--accent); outline-offset: 1px;
  border-color: transparent; }
.form-grid { display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 10px;
  align-items: end; }

.card, .sec { scroll-margin-top: 130px; }
.card { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); padding: var(--s5); box-shadow: var(--shadow);
  margin-bottom: var(--s3); }
.card h3 { font-size: var(--fs-h3); margin-bottom: var(--s2); }

.rows { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }
.rows.flat { gap: 0; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); overflow: hidden; }
.rows.flat li { border: 0; border-radius: 0; }
.rows.flat li + li { border-top: 1px solid var(--line); }
@media (hover: hover) {
  .rows.flat .del { opacity: 0; transition: opacity .15s; }
  .rows.flat li:hover .del, .rows.flat .del:focus-visible { opacity: 1; }
}
.rows li { display: flex; align-items: center; gap: 10px; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 10px 14px; min-height: var(--tap); }
.rows .grow { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; }
.rows .meta { font-size: var(--fs-hint); color: var(--muted); font-weight: 600;
  white-space: nowrap; }
.rows li.done .grow { color: var(--muted); text-decoration: line-through;
  text-decoration-color: var(--line-2); }
.rows input[type="checkbox"] { width: 22px; height: 22px; accent-color: var(--teal);
  flex: none; }
.pill { display: inline-flex; align-items: center; font-size: var(--fs-tag);
  font-weight: 600; border-radius: var(--radius-pill); padding: 4px 10px;
  background: var(--paper-2); color: var(--ink-2); white-space: nowrap; }
.pill.teal { background: var(--teal-soft); color: var(--teal-ink); }
.pill.warm { background: var(--accent-soft); color: var(--accent-ink); }
.del { flex: none; width: 40px; height: 40px; border: 0; background: none;
  border-radius: 10px; color: var(--muted); font-size: 16px; }
.del:hover { background: var(--accent-soft); color: var(--accent-ink); }

/* אפור על אפור לא נראה כשההתקדמות אפס — המסילה מקבלת ניגוד */
.bar { height: 7px; border-radius: var(--radius-pill); background: var(--paper-2);
  border: 1px solid var(--line); overflow: hidden; }
.bar.big { height: 11px; }
.bar i { display: block; height: 100%; background: var(--teal);
  border-radius: var(--radius-pill); }

/* באנר קטגוריה — תמונה של מקום אמיתי מאותה קטגוריה, עם הכותרת עליה */
.cat-banner { position: relative; overflow: hidden; border-radius: var(--radius-lg);
  box-shadow: var(--shadow); margin-bottom: var(--s3); isolation: isolate; }
/* רצועה, לא פוסטר: 21/8 על רוחב 1160 נתן 440 פיקסלים גובה ובלע את
   הכרטיסים שמתחתיו. גובה קבוע עם תקרה. */
.cat-banner .cat-ph { width: 100%; height: 132px; aspect-ratio: auto;
  border-radius: 0; }
.cat-banner .cat-ph img { transition: opacity .45s ease, transform .6s ease; }
.cat-banner:hover .cat-ph img { transform: scale(1.03); }
.cat-banner::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(23,59,58,.72) 0%,
    rgba(23,59,58,.30) 45%, rgba(23,59,58,0) 75%); }
.cat-cap { position: absolute; inset-inline: var(--s4); bottom: var(--s3); z-index: 1;
  display: flex; align-items: center; gap: 10px; color: #fff; }
.cat-cap b { font-size: 22px; font-weight: 800; letter-spacing: -.02em;
  text-shadow: 0 1px 6px rgba(0,0,0,.35); }
.cat-cap .cat-ic { width: 34px; height: 34px; border-radius: var(--radius-sm);
  background: rgba(255,255,255,.92); display: grid; place-items: center;
  font-size: 17px; flex: none; }
.cat-n { margin-inline-start: auto; font-size: var(--fs-hint); font-weight: 600;
  background: rgba(255,255,255,.22); backdrop-filter: blur(6px);
  border-radius: var(--radius-pill); padding: 4px 11px; white-space: nowrap; }
.more-row { justify-content: flex-start; margin-bottom: var(--s2); }
.more-row .more-btn { margin-inline-start: 0; }
@media (max-width: 760px) {
  .cat-banner .cat-ph { height: 104px; }
  .cat-cap b { font-size: 18px; }
}

/* כותרת לשונית */
.view-head { margin: var(--s5) 0 var(--s4); }
.view-head .hint { margin: 6px 0 0; font-size: var(--fs-small);
  line-height: 1.6; max-width: 620px; }

/* שתי המגירות: קודם עוזרים, ואחר כך פותחים תכנון ומסחר */
.drawers { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s3);
  margin: var(--s4) 0 var(--s2); }
.drw-btn { display: flex; align-items: center; gap: 10px; text-align: start;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
  padding: 12px var(--s4); min-height: 62px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s; }
.drw-btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.drw-btn.on { border-color: var(--accent); }
.drw-ic { flex: none; font-size: 20px; }
.drw-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.drw-tx b { font-size: var(--fs-small); font-weight: 800; color: var(--ink); }
.drw-tx span { font-size: var(--fs-tag); color: var(--muted); font-weight: 600; }
.drw-btn .plus { flex: none; width: 26px; height: 26px;
  border-radius: var(--radius-sm); border: 1px solid var(--line-2);
  color: var(--muted); display: grid; place-items: center; font-weight: 800;
  transition: transform .2s; }
.drw-btn .plus::before { content: "+"; }
.drw-btn.on .plus { transform: rotate(45deg); color: var(--accent-ink);
  border-color: var(--accent); }
@media (max-width: 480px) { .drawers { grid-template-columns: 1fr; } }

/* הסידורים — שורות שוות, לא ריבועים בגבהים שונים */
.svc-list { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }
.svc-row { display: flex; align-items: center; gap: 12px; width: 100%;
  min-height: 60px; padding: 10px var(--s4); color: var(--ink);
  background: none; border: 0; text-align: start;
  text-decoration: none; transition: background .15s ease; }
.svc-item + .svc-item { border-top: 1px solid var(--line); }
.svc-row:hover { background: var(--paper-2); }
.svc-row .plus { flex: none; width: 26px; height: 26px;
  border-radius: var(--radius-sm); background: none; border: 1px solid var(--line-2);
  color: var(--muted); display: grid; place-items: center; font-weight: 800;
  transition: transform .2s; }
.svc-row .plus::before { content: "+"; }
.svc-item[data-open="true"] .plus { transform: rotate(45deg); }
.svc-guide { display: none; padding: 0 var(--s4) var(--s4); }
.svc-item[data-open="true"] .svc-guide { display: block;
  animation: ttl-fade .25s ease both; }
.svc-guide .facts li { color: var(--ink-2); padding-block: 5px;
  padding-inline-start: 16px; position: relative; line-height: 1.55; }
.svc-guide .facts li::before { content: "\2022"; position: absolute;
  inset-inline-start: 0; color: var(--accent); font-weight: 800; }
.btn.out { margin-top: var(--s3); text-decoration: none;
  display: inline-flex; align-items: center; }
.svc-ic { flex: none; width: 34px; height: 34px; border-radius: var(--radius-sm);
  background: var(--paper-2); border: 1px solid var(--line); display: grid;
  place-items: center; font-size: 17px; }
.svc-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.svc-tx b { font-size: var(--fs-small); font-weight: 600; }
.svc-tx span { font-size: var(--fs-hint); color: var(--muted); }
.svc-go { flex: none; color: var(--accent-ink); font-weight: 800; }

/* המרה לשקלים — הסיכום שסוגר את התקציב */
.card.convert { border-color: var(--line-2); }
.conv-sum { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
.conv-sum b { font-size: 28px; font-weight: 800; color: var(--ink);
  letter-spacing: -.02em; }
.rates { display: grid; gap: 8px; }
.rate-row { display: flex; align-items: center; gap: 8px; }
.rate-lbl { font-size: var(--fs-small); font-weight: 600; color: var(--ink-2);
  min-width: 74px; }
/* כלל הטפסים הכללי מרחיב כל input ל-100% — כאן צריך שדה קטן, ולכן
   הסלקטור מפורש דיו כדי לגבור עליו */
.rate-row input.rate-in { flex: none; width: 104px; min-height: 38px;
  padding: 6px 12px; border: 1px solid var(--line-2);
  border-radius: var(--radius); background: var(--panel); font-size: 16px; }
.rate-cur { font-size: var(--fs-small); font-weight: 600; color: var(--ink-2); }
.rate-at { font-size: var(--fs-tag); color: var(--muted); font-weight: 600;
  white-space: nowrap; }
.warn-line { color: var(--warn-ink); }
.ref-line { display: block; font-size: var(--fs-tag); color: var(--muted);
  font-weight: 400; margin-top: 1px; }
.rows .grow { display: flex; flex-direction: column; }

/* ── הימים על קו המסע ── */
.slot-sec { margin-top: var(--s2); }
.slot-head { font-size: var(--fs-tag); font-weight: 800; color: var(--ink-2);
  margin: 8px 0 5px; }
.rows.slot-rows.empty { position: relative; min-height: 40px;
  border: 1px dashed var(--line); border-radius: var(--radius); }
.rows.slot-rows.empty::after { content: attr(data-hint); position: absolute;
  inset: 0; display: grid; place-items: center; font-size: var(--fs-tag);
  color: var(--muted); font-weight: 600; }
.rows li.dragging { opacity: .45; }
.drag-h { flex: none; cursor: grab; color: var(--muted); font-size: 13px;
  letter-spacing: -3px; user-select: none; }
.day-head { display: flex; align-items: center; gap: 10px; margin-bottom: var(--s2); }
.empty-day { text-align: center; padding: var(--s4) 0 var(--s3);
  border: 1px dashed var(--line-2); border-radius: var(--radius);
  background: var(--paper); }
.empty-day .hint { margin: 0 0 4px; }
.empty-day .more-btn { margin-inline: auto; }
.day-n { flex: none; width: 34px; height: 34px; border-radius: var(--radius);
  background: var(--accent-soft); color: var(--accent-ink); display: grid;
  place-items: center; font-weight: 800; font-size: var(--fs-small); }
.day-head h3 { font-size: 17px; }
.route { position: relative; padding-inline-start: 28px; }
.route::before { content: ""; position: absolute; inset-block: 10px;
  inset-inline-start: 9px; border-inline-start: 2px dashed var(--route); }
.route .card { position: relative; }
.route .card::before { content: ""; position: absolute; top: 24px;
  inset-inline-start: -25px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--paper); border: 2.5px solid var(--teal); }
.route .card.has-items::before { background: var(--teal); }

/* בורר פעילות עם חיפוש */
.pick { position: relative; }
.pick .results { position: absolute; inset-inline: 0; top: calc(100% + 4px);
  z-index: 15; list-style: none; margin: 0; padding: 6px; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); max-height: 260px; overflow-y: auto; }
.pick .results button { display: block; width: 100%; text-align: start;
  background: none; border: 0; border-radius: var(--radius-sm); padding: 10px 12px;
  min-height: var(--tap); font-size: var(--fs-small); font-weight: 600;
  color: var(--ink); }
.pick .results button:hover { background: var(--paper-2); }
.pick .results .cat { color: var(--muted); font-size: var(--fs-tag);
  font-weight: 400; }

/* ── מצבים ── */
.state { max-width: 420px; margin: var(--s6) auto; text-align: center;
  padding: var(--s7) var(--s5); background: var(--panel);
  border: 1px dashed var(--line-2); border-radius: var(--radius-lg);
  color: var(--muted); font-size: var(--fs-small); }
.state strong { display: block; color: var(--ink); font-weight: 800;
  font-size: 16px; margin: var(--s3) 0 4px; }
.state .art { position: relative; width: 120px; height: 36px; margin: 0 auto; }
.state .art::before { content: ""; position: absolute; inset-inline: 6px; top: 16px;
  border-top: 2px dashed var(--route); }
.state .art span { position: absolute; top: 11px; width: 12px; height: 12px;
  border-radius: 50%; }
.state .art .a { inset-inline-start: 0; background: var(--accent); }
.state .art .b { inset-inline-end: 0; background: var(--teal); }
@media (prefers-reduced-motion: no-preference) {
  .state.loading .art { animation: tt-pulse 1.2s ease-in-out infinite; }
  @keyframes tt-pulse { 50% { opacity: .45; } }
}

/* ═══ דסקטופ: הרצועה השנייה במקום ניווט תחתון ═══════════════ */
@media (min-width: 761px) {
  :root { --top-h: 64px; --top-h-sm: 64px; --nav-h: 44px;
          --chrome-b: 0px;
          --stick-t: calc(var(--top-h) + var(--nav-h)); }
  .top .desk-only { display: flex; }
  .top .in { gap: var(--s6); }
  .top .brand { font-size: var(--fs-h2); }
  .top .brand span { overflow: hidden; max-width: 140px;
    transition: max-width .18s ease, opacity .18s ease; }
  html[data-scroll="down"] .top .brand span,
  html[data-scroll="up"] .top .brand span { max-width: 0; opacity: 0; }
  /* בדסקטופ הרצועה לא מסתתרת: השנייה נעולה עליה ותקפוץ */
  html[data-scroll="down"] .top, html[data-scroll="up"] .top {
    transform: none; box-shadow: none; }
  .top-dest { flex: 0 1 auto; }
  .top-dest img { display: none; }
  .td-name { font-size: var(--fs-h2); }
  .top-steps { margin-inline-start: auto; }
  .ts-label { display: inline; font-size: var(--fs-hint); font-weight: 600;
    color: var(--ink-2); white-space: nowrap; }

  .secnav { position: sticky; top: var(--top-h); bottom: auto; z-index: 29;
    background: var(--paper); border-top: 0;
    border-bottom: 1px solid var(--line); padding-block-end: 0; }
  @supports (backdrop-filter: blur(12px)) {
    .secnav { background: rgba(255,249,242,.97); }
  }
  /* display:block עם inline-flex הוסיף גובה שורה סמוי — 77 פיקסלים
     במקום 44. flex ישיר מבטל את הקשר של ה-baseline. */
  .secnav { display: flex; justify-content: center; align-items: stretch;
    min-height: var(--nav-h); }
  .secnav .sec { flex: 0 0 auto; flex-direction: row; width: auto;
    min-height: var(--nav-h); padding: 0 var(--s4); margin: 0;
    font-size: var(--fs-small); }
  .sec-ic { display: none; }
  .secnav .sec[aria-current="page"]::before { inset-block-start: auto;
    inset-block-end: 0; inset-inline: 0; width: auto; margin-inline: 0;
    border-radius: 3px 3px 0 0; }
  .steps-sheet { margin: auto; border-radius: var(--radius-lg); max-height: 80svh; }
}

/* חלון נמוך: הכרום מפסיק להיות דביק כדי לא לבלוע את התוכן — WCAG 1.4.10 */
@media (max-height: 420px) {
  .top { position: static; transform: none !important; }
  .secnav { position: static; padding-block-end: 0; }
  body { padding-block-end: 0; }
  html { scroll-padding-top: 0; scroll-padding-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .top, .top *, .secnav, .secnav *, .skip, .steps-sheet, .steps-sheet * {
    transition: none !important; animation: none !important; }
}

/* ניגודיות כפויה: הרקע השקוף והפס הצבעוני נעלמים — מחזירים גבול */
@media (forced-colors: active) {
  .top, .secnav { background: Canvas; }
  .secnav .sec[aria-current="page"] { text-decoration: underline;
    text-underline-offset: 4px; }
}

/* ── שבירות ── */
@media (max-width: 900px) { .grid-3, .fgrid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) {
  .dest-hero { padding-top: 96px; }
  .item-card .head { grid-template-columns: 80px 1fr auto; gap: 10px;
    padding: 10px 12px; }
  .item-card .head .tile { width: 80px; }
  .item-card .cap b { font-size: 15px; }
  .sec { margin-top: var(--s6); }
  .steps-wrap { margin: var(--s3) 0 var(--s2); }
  .top-links { display: none; }
  .enter-hero { padding: var(--s6) 0 var(--s7); }
  .enter-hero .in { grid-template-columns: 1fr; gap: var(--s6); }
  .hero-copy { text-align: center; }
  .hero-copy .sub, .startbox { margin-inline: auto; }
  .sb-row { flex-direction: column; }
  .sb-row .btn { width: 100%; }
  .postcard { aspect-ratio: auto; height: 190px; max-width: none; margin: 0; }
  .postcard .sun { width: 70px; height: 70px; }
  .quick-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dest-card { min-height: 132px; }
  .dest-card .name { font-size: 17px; }
  /* מובייל חי, לא דסקטופ מוקטן: כותרת גדולה כמו בלנדינג החי */
  .enter-hero h1 { font-size: clamp(36px, 10.5vw, 44px); line-height: 1.03;
    max-width: 350px; margin-inline: auto; }
  .enter-hero .sub { font-size: 17px; max-width: 350px; margin-inline: auto; }
  .lsec { padding: 52px 0; }
  .steps, .fgrid { grid-template-columns: 1fr; }
  .step:not(:last-child)::after { content: ""; position: absolute; bottom: -19px;
    inset-inline-start: 50%; width: 2px; height: 18px; background: var(--line-2); }
  .ba-card { grid-template-columns: 1fr; }
}
@media (max-width: 700px) { .grid-2, .start-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .grid-3 { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr 1fr; }
  .form-grid > .span-2, .form-grid > .btn { grid-column: 1 / -1; }
}
@media (max-width: 480px) { .top .brand span { display: none; } }
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* ---- מחלקות עזר: CSP חוסם style= inline, אז המרווחים גרים כאן ---- */
.sp16 { height: 16px }
.mt0 { margin-top: 0 }
.mt8 { margin-top: 8px }
.mt10 { margin-top: 10px }
.mt12 { margin-top: 12px }
.mb6 { margin-bottom: 6px }
.mb8 { margin-bottom: 8px }
.mb14 { margin-bottom: 14px }
.hint.tight { margin: 0 0 8px }
.hint.after { margin: 10px 0 0 }
.row-flex { display: flex; align-items: center; gap: 10px }
.form-grid.two-one { grid-template-columns: 1fr 2fr }
.form-grid.grow-btn { grid-template-columns: 1fr auto }
.form-grid.dates { grid-template-columns: 1fr 1fr auto }
.narrow { max-width: 220px }

/* ── נגישות: הרכיב שהועבר מהאתר הישן, בלי inline ── */
/* 🔒 06.09.2026 — נמדד בטלפון: הכפתור ישב בדיוק על כפתור "הבנתי"
   של הודעת הפרטיות, שניהם ב-298,622. --ck-h הוא הגובה האמיתי של
   ההודעה, נקבע ב-ui/cookies.js ונמחק כשהיא נסגרת. */
.a11y-btn { position: fixed;
  bottom: calc(var(--chrome-b) + var(--ck-h, 0px) + 16px);
  inset-inline-start: 16px; width: 46px; height: 46px; border-radius: 50%;
  border: 2px solid #fff; background: #1a5fb4; color: #fff; font-size: 20px;
  z-index: 90; box-shadow: var(--shadow-lg); display: grid; place-items: center;
  transition: transform .15s; }
.a11y-btn:hover { transform: scale(1.08); }
.a11y-panel { position: fixed;
  bottom: calc(var(--chrome-b) + var(--ck-h, 0px) + 72px);
  inset-inline-start: 16px; width: 236px; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); z-index: 91; padding: 12px; }
.a11y-panel h3 { margin: 0 0 8px; font-size: var(--fs-small); color: #1a5fb4; }
.a11y-opt { display: block; width: 100%; text-align: start; background: var(--paper-2);
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 9px 12px; margin-bottom: 6px; font-weight: 600;
  font-size: var(--fs-tag); color: var(--ink); text-decoration: none; }
.a11y-opt.on { background: #1a5fb4; color: #fff; border-color: #1a5fb4; }
.a11y-opt.reset { background: var(--warn-bg); color: var(--warn-ink);
  border-color: var(--warn-line); }
.a11y-opt.link { background: var(--teal-soft); color: var(--teal-ink);
  border-color: rgba(47,143,131,.25); }
html.a11y-contrast { filter: contrast(1.35) saturate(1.15); }
html.a11y-gray { filter: grayscale(1); }
html.a11y-links a { text-decoration: underline !important; font-weight: 800 !important; }
html.a11y-font * { font-family: Arial, "Heebo", sans-serif !important;
  letter-spacing: .4px !important; }

/* ── הודעת העוגיות ── */
.ck-bar { position: fixed; inset-inline: 0; z-index: 95;
  bottom: var(--chrome-b);
  display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap;
  justify-content: center; background: var(--panel);
  border-top: 1px solid var(--line); box-shadow: 0 -8px 24px rgba(120,50,25,.12);
  padding: var(--s3) var(--s4) calc(var(--s3) + var(--safe-b)); }
.ck-tx { margin: 0; flex: 1 1 320px; min-width: 0; max-width: 640px;
  font-size: var(--fs-hint); line-height: 1.6; color: var(--ink-2); }
.ck-tx a { color: var(--accent-ink); font-weight: 600; }
.ck-bar .btn { flex: none; }
@media (max-width: 480px) { .ck-bar { justify-content: stretch; }
  .ck-bar .btn { width: 100%; } }

/* גילוי נאות בנקודת הקישור — לא רק בפוטר */
.aff-note { margin: var(--s2) 0 0; font-size: var(--fs-tag); line-height: 1.6;
  color: var(--muted); font-weight: 400; }

/* עובדה שאומתה מול מקור רשמי — תווית ותאריך */
.badge.ok { background: var(--teal-soft); border-color: rgba(47,143,131,.25);
  color: var(--teal-ink); }

/* ייחוס תמונה — חובה ברישיונות קומונס */
/* 🔒 06.09.2026 — במסך של 360 השורה הזאת הייתה ברוחב 452, והקישור
   "פרטי הרישיון" נחתך אל מחוץ למסך. בנוסף pointer-events: none חל
   גם עליו, כלומר הוא לא היה לחיץ בשום מכשיר. הרישיון מחייב שהקישור
   יהיה נגיש. עכשיו השורה נשברת, והקישור לבדו מקבל בחזרה נגיעה. */
.ph-credit { position: absolute; inset-inline-end: 6px; bottom: 6px; z-index: 2;
  max-width: calc(100% - 12px); font-size: 12px; font-weight: 600;
  line-height: 1.45; color: #fff; background: rgba(23,59,58,.62);
  border-radius: 4px; padding: 3px 8px; pointer-events: none; }
.ph-credit a { pointer-events: auto; color: #fff; text-decoration: underline; }
.cat-banner .ph-credit { bottom: auto; top: 6px; }

/* רשימת הייחוס בתחתית העמוד. מכסה גם את האריחים, שאין עליהם מקום
   קריא לשם צלם ולרישיון. ריקה כשאין תמונות — ואז אינה תופסת מקום. */
.ph-credits:empty { display: none; }
.ph-credits { margin-top: var(--s3); text-align: center; }
.ph-credits-t { font-size: var(--fs-tag); font-weight: 700; color: var(--ink-2);
  margin: 0 0 4px; }
.ph-credits-l { list-style: none; margin: 0; padding: 0;
  font-size: var(--fs-tag); color: var(--muted); line-height: 1.7; }
.ph-credits-l li { overflow-wrap: anywhere; }
.ph-credits-l a { color: var(--ink-2); font-weight: 600; }
/* נתיב ההסרה — נוכח לצד כל תמונה, לא מוסתר בעמוד יצירת קשר */
.ph-credits-l a.ph-report { color: var(--muted); font-weight: 600;
  text-decoration: underline; }
.ph-credits-n { font-size: var(--fs-tag); color: var(--muted);
  margin: 8px 0 0; }

/* גיבוי הטיול לקובץ */
.bk-card { margin-top: var(--s3); }
.bk-label { position: relative; overflow: hidden; cursor: pointer;
  display: inline-flex; align-items: center; }
.bk-file { position: absolute; inset: 0; opacity: 0; cursor: pointer;
  width: 100%; height: 100%; }
.bk-msg { font-size: var(--fs-hint); font-weight: 600; color: var(--teal-ink); }

/* ── 03.09.2026 — שכבת ההחלטה של היעד ──────────────────────────────
   עד כאן מסך היעד ענה על "מה לעשות". השכבה הזו עונה על מה שבא לפניו:
   למה לטוס לכאן בכלל, למי זה מתאים ולמי לא, ולכאן או ליעד אחר.
   הכול נבנה מהטוקנים והכרטיסים הקיימים — אין כאן שפה חדשה. */

.why-sec .why-body { font-size: var(--fs-body); line-height: 1.75;
  color: var(--ink-2); max-width: 68ch; }

.fits-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); }
.fit-col { background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
  padding: var(--s4); }
.fit-col h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px;
  font-size: var(--fs-h3); }
.fit-col .fit-ic { flex: none; width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center; font-size: 13px; font-weight: 800; }
.fit-col.good { border-color: rgba(47,143,131,.28); }
.fit-col.good .fit-ic { background: var(--teal-soft); color: var(--teal-ink); }
.fit-col.less { border-color: var(--warn-line); }
.fit-col.less .fit-ic { background: var(--warn-bg); color: var(--warn-ink); }

/* בעד ונגד באזור לינה. החסרונות באותו משקל ולא מוסתרים — אזור בלי
   חיסרון אינו אזור אלא ברושור. */
.area-pc { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s3);
  align-self: stretch; margin-top: var(--s3); }
.area-pc .pc { background: var(--paper-2); border-radius: var(--radius);
  padding: 10px 12px; }
.area-pc .pc b { display: block; font-size: var(--fs-hint); margin-bottom: 4px; }
.area-pc .pc ul { margin: 0; padding-inline-start: 16px; }
.area-pc .pc li { font-size: var(--fs-hint); line-height: 1.6;
  color: var(--ink-2); }
.area-pc .pros b { color: var(--teal-ink); }
.area-pc .cons { background: var(--warn-bg); }
.area-pc .cons b { color: var(--warn-ink); }
.area-note, .area-near { align-self: stretch; margin-top: 10px;
  font-size: var(--fs-hint); line-height: 1.6; color: var(--ink-2); }
.area-near { color: var(--muted); }

/* השוואה ליעד אחר */
.rel-card { display: flex; flex-direction: column; gap: 6px;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
  padding: var(--s4); text-decoration: none; color: inherit;
  transition: transform .15s, box-shadow .15s, border-color .15s; }
.rel-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg);
  border-color: var(--teal); }
.rel-card b { font-size: var(--fs-h3); }
.rel-card span { font-size: var(--fs-hint); line-height: 1.6;
  color: var(--ink-2); }

@media (max-width: 760px) {
  /* בנייד שתי עמודות הופכות את הרשימות לצרות מדי לקריאה */
  .fits-grid, .area-pc { grid-template-columns: 1fr; }
}

.quick-all { text-align: center; margin-top: var(--s4); }
.quick-all a { font-weight: 800; font-size: var(--fs-body);
  color: var(--teal-ink); text-decoration: none; }
.quick-all a:hover { text-decoration: underline; }

/* אזור לינה שלא נמצאה לו תמונה: רצועת גרדיאנט ריקה מעל הכרטיס נקראת
   כמו טעינה שלא הסתיימה, ולא כמו החלטה. הכרטיס פשוט מתחיל בטקסט —
   בדיוק כמו שאריח קטן בכרטיס פריט כבר נעלם כשאין לו תמונה.
   הכותרת והבאנרים נשארים עם הרקע המותגי: שם רצועה ריקה היא חלק
   מהפריסה, והעלמתה הייתה מקריסה את הכותרת. */
.stay-card .area-ph.no-img { display: none; }

/* ── מכשירי מגע ──
   נמדד 06.09.2026 בארבעים צירופים של מנוע ומסך: קישור בקשת ההסרה
   63 על 18, "האתר הרשמי" 74 על 19, הלוגו 109 על 30, כפתורי הסינון
   89 על 39, וכל הכפתורים הקטנים בגובה 38. אפל מבקשת 44 על 44.
   הריפוד השלילי מגדיל את שטח הנגיעה בלי להזיז את הפריסה. */
@media (pointer: coarse) {
  .btn.small, .chips button { min-height: 44px; }
  .foot a, .flinks a, .quick-all a { padding-block: 13px;
    margin-block: -13px; display: inline-block; }
  .ph-report, .ph-credit a, .area-link, .ck-tx a {
    padding-block: 13px; margin-block: -13px; }
}