/* ============================================================
   מסך החיפוש
   ------------------------------------------------------------
   האפקטים הקודמים היו נכונים אבל בלתי נראים: 15px של מטוס על קו
   דק, במשך 900ms. נוכחות היא גודל ומשך, לא רק קיום.

   כאן הכל בקנה מידה אמיתי — מטוס של 44px שחוצה מסך מלא, שורה
   בגודל כותרת שנחשפת מאחוריו, והחברות שנדלקות אחת-אחת.
   ============================================================ */

.srch{
  position:fixed;inset:0;z-index:200;
  display:grid;place-items:center;
  background:var(--bg);
  padding:24px;
}
.srch[hidden]{display:none}

/* כניסה ויציאה רכות — מסך שנעלם בבת אחת נראה כמו תקלה */
.srch{animation:srch-in 260ms cubic-bezier(.23,1,.32,1) both}
.srch.is-out{animation:srch-out 300ms cubic-bezier(.23,1,.32,1) both}
@keyframes srch-in{from{opacity:0}to{opacity:1}}
@keyframes srch-out{from{opacity:1}to{opacity:0}}

.srch-in{
  inline-size:min(720px,100%);
  display:flex;flex-direction:column;align-items:center;
  text-align:center;
}
.srch-mark{
  inline-size:auto;block-size:56px;
  opacity:.9;margin-block-end:26px;
}

/* ---- הבמה: המטוס חוצה אותה וצובע מסלול ---- */
.srch-stage{
  position:relative;
  inline-size:100%;block-size:56px;
  margin-block-end:8px;
}
/* הקו שממתין להיצבע */
.srch-stage::before{
  content:"";position:absolute;inset-inline:0;inset-block-start:50%;
  block-size:0;border-block-start:1px dashed var(--line);
}
.srch-trail{
  position:absolute;inset-block-start:50%;inset-inline-start:0;
  block-size:0;border-block-start:2px solid var(--sun);
  inline-size:0;
  animation:srch-trail 1.9s cubic-bezier(.45,0,.55,1) infinite;
}
.srch-plane{
  position:absolute;inset-block-start:50%;inset-inline-start:0;
  margin-block-start:-22px;
  color:var(--brand);
  transform:scaleX(-1);          /* אף המטוס ימינה ב-SVG, טס שמאלה ב-RTL */
  animation:srch-fly 1.9s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes srch-fly{
  0%   {opacity:0;inset-inline-start:0}
  10%  {opacity:1}
  86%  {opacity:1}
  100% {opacity:0;inset-inline-start:calc(100% - 44px)}
}
@keyframes srch-trail{
  0%   {inline-size:0;opacity:0}
  10%  {opacity:1}
  86%  {opacity:1}
  100% {inline-size:100%;opacity:0}
}

/* ---- השורה שנחשפת ---- */
.srch-line{
  margin:0 0 34px;
  font-size:clamp(20px,3.2vw,30px);
  font-weight:500;line-height:1.35;color:var(--deep);
  min-block-size:2.7em;
  display:flex;align-items:center;justify-content:center;
}
.srch-line.is-reveal{animation:srch-reveal 640ms cubic-bezier(.23,1,.32,1) both}
@keyframes srch-reveal{
  0%   {clip-path:inset(0 0 0 100%);opacity:.4}
  100% {clip-path:inset(0 0 0 0);opacity:1}
}

/* ---- החברות, נדלקות אחת-אחת ---- */
.srch-ins{
  list-style:none;margin:0 0 30px;padding:0;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:clamp(18px,3.4vw,40px);
  min-block-size:40px;
}
.srch-ins li{
  display:flex;align-items:center;
  filter:grayscale(1);opacity:.28;
  transform:scale(.94);
  transition:filter 260ms var(--cmp-out,cubic-bezier(.23,1,.32,1)),
             opacity 260ms var(--cmp-out,cubic-bezier(.23,1,.32,1)),
             transform 260ms var(--cmp-out,cubic-bezier(.23,1,.32,1));
}
.srch-ins li.is-on{filter:none;opacity:1;transform:none}
.srch-ins li.is-done{filter:none;opacity:.62;transform:none}
.srch-ins img{block-size:34px;inline-size:auto;max-inline-size:140px;object-fit:contain}
.srch-ins .ins-word{font-size:21px;font-weight:600;letter-spacing:-.02em;color:var(--ink-2)}

/* ---- פס ההתקדמות ---- */
.srch-bar{
  inline-size:min(420px,100%);block-size:8px;
  background:var(--bg-3);border-radius:999px;overflow:hidden;
}
.srch-bar i{
  display:block;block-size:100%;inline-size:0;
  background:var(--sun);border-radius:999px;
  transition:inline-size 320ms cubic-bezier(.45,0,.55,1);
}

@media (max-width:560px){
  .srch-mark{block-size:46px;margin-block-end:20px}
  .srch-stage{block-size:46px}
  .srch-ins{gap:16px}
  .srch-ins img{block-size:26px}
  .srch-ins .ins-word{font-size:17px}
}

/* ---- תנועה מופחתת ----
   בלי טיסה ובלי חשיפה. המסך עדיין מופיע, עדיין אומר מה קורה,
   ועדיין מדליק את החברות — רק בלי תנועה רציפה. */
@media (prefers-reduced-motion:reduce){
  .srch,.srch.is-out{animation:none}
  .srch-plane{animation:none;inset-inline-start:calc(50% - 22px);opacity:1}
  .srch-trail{animation:none;inline-size:100%;opacity:.5}
  .srch-line.is-reveal{animation:none}
  .srch-ins li{transition:none}
  .srch-bar i{transition:none}
}

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

   המראה: נייר עיתון, מסגרת גזורה, כותרת בפונט עיתונאי.
   ============================================================ */
.srch-clips{
  position:relative;
  inline-size:100%;
  block-size:250px;
  margin-block-end:26px;
}

.clip-card{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  text-align:start;
  background:#FCFBF7;                 /* נייר, לא לבן מסך */
  border-radius:3px;
  padding:20px 22px 18px;
  box-shadow:0 1px 2px rgba(5,39,77,.08), 0 14px 34px -18px rgba(5,39,77,.35);
  opacity:0;transform:translateY(10px) rotate(-.4deg);
  pointer-events:none;
  /* קו הגזירה: שוליים משוננים בקצה התחתון */
  --tooth:6px;
  -webkit-mask:
    linear-gradient(#000 0 0) top/100% calc(100% - var(--tooth)) no-repeat,
    repeating-conic-gradient(from -45deg at bottom, #000 0 25%, #0000 0 50%) bottom/12px var(--tooth) repeat-x;
  mask:
    linear-gradient(#000 0 0) top/100% calc(100% - var(--tooth)) no-repeat,
    repeating-conic-gradient(from -45deg at bottom, #000 0 25%, #0000 0 50%) bottom/12px var(--tooth) repeat-x;
}
.clip-card.is-on{
  opacity:1;transform:none;pointer-events:auto;
  animation:clip-in 520ms cubic-bezier(.23,1,.32,1) both;
}
.clip-card.is-off{animation:clip-out 320ms cubic-bezier(.23,1,.32,1) both}

@keyframes clip-in{
  0%   {opacity:0;transform:translateY(14px) rotate(-1.2deg) scale(.985)}
  100% {opacity:1;transform:none}
}
@keyframes clip-out{
  0%   {opacity:1;transform:none}
  100% {opacity:0;transform:translateY(-10px) rotate(.8deg) scale(.99)}
}

/* שורת המקור, כמו קרדיט בעיתון */
.clip-src{
  display:flex;align-items:center;gap:8px;
  margin-block-end:10px;
  font-size:12px;color:var(--muted);
  letter-spacing:0;
}
.clip-outlet{font-weight:600;color:var(--deep)}
.clip-dot{inline-size:3px;block-size:3px;border-radius:50%;background:var(--line);flex:none}
.clip-rule{flex:1;block-size:0;border-block-start:1px solid #E4DFD2}

.clip-head{
  margin:0 0 10px;
  font-family:"Frank Ruhl Libre",Rubik,serif;
  font-size:clamp(17px,2.1vw,22px);font-weight:600;line-height:1.35;
  color:#1A1A17;
}
.clip-sum{
  margin:0;
  font-size:14px;line-height:1.65;color:#4A4A44;
  /* גזיר לא מציג רומן: ארבע שורות ואז נגמר */
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;
}
.clip-foot{
  margin-block-start:auto;padding-block-start:12px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.clip-link{
  font-size:12.5px;color:var(--brand);
  text-decoration:underline;text-underline-offset:3px;
}
.clip-tag{
  font-size:11.5px;color:var(--muted-2);
  border:1px solid #E4DFD2;border-radius:999px;padding:3px 9px;
}

@media (max-width:560px){
  .srch-clips{block-size:290px}
  .clip-card{padding:16px 18px 14px}
  .clip-sum{-webkit-line-clamp:5;font-size:13.5px}
}

@media (prefers-reduced-motion:reduce){
  .clip-card{transform:none}
  .clip-card.is-on,.clip-card.is-off{animation:none}
  .clip-card.is-off{opacity:0}
}