/* ═══════════════════════════════════════════════════════════
   BERALE3D — אתר תיק העבודות הזמני
   הפלטה נלקחה מסרטוני הסטטוס של הסטודיו.
   ═══════════════════════════════════════════════════════════ */

:root {
  /* ── צפחה ── */
  --slate:    #27313a;   /* הרקע */
  --slate-up: #303c48;   /* משטח מורם */
  --slate-dn: #1e262d;   /* עמוק יותר — כותרת, פוטר, תריס */

  /* ── פליז ── */
  --brass:     #9a8149;  /* קווים, מסגרות, סימון פעיל */
  --brass-lit: #c6a95f;  /* טקסט קטן — עובר ניגודיות */
  --brass-dim: rgba(154, 129, 73, .3);

  /* שני גווני הפליז של הלוגו, נדגמו מ־נכסים/logo.png.
     בלוגו הצד השמאלי בהיר והימני כהה — וכך גם בגמלון ובקו שתחת הכותרת. */
  --brass-a: #bf9c54;    /* בהיר — הצד השמאלי */
  --brass-b: #80652f;    /* כהה — הצד הימני */

  /* ── בהיר ── */
  --frame: #ffffff;      /* מסגרת התמונה */
  --ink:   #eef0f2;      /* טקסט ראשי */
  --ink-2: #a8b2bb;      /* טקסט משני */

  /* ── טיפוגרפיה ── */
  --sans: 'Assistant', 'Segoe UI', system-ui, sans-serif;

  /* ── תנועה — הכל חסום בזמן ── */
  --ease:      cubic-bezier(.22, 1, .36, 1);
  --ease-io:   cubic-bezier(.65, 0, .35, 1);
  --t-fast:    .22s;
  --t-mid:     .38s;
  --t-slow:    .62s;
  /* הזום בריחוף על תמונה. הכניסה ארוכה בכוונה — התמונה ממשיכה
     לזחול כל עוד העכבר עליה ולא קופאת אחרי רגע. היציאה קצרה יותר
     אך עדיין רכה, כדי שההתרחקות לא תיקרא כקפיצה. */
  --t-zoom-in:  5s;
  --t-zoom-out: 1.4s;
  --ease-zoom-in:  cubic-bezier(.12, .62, .3, 1);
  --ease-zoom-out: cubic-bezier(.3, 0, .2, 1);
  --zoom:       1.07;
  /* הכהיית הריחוף בכרטיס פרויקט — מהירה, הכיתוב צריך להופיע מיד */
  --t-veil:     .45s;

  /* ── מבנה ── */
  /* כותרת בגובה רגיל — לוגו ואייקוני יצירת קשר בלבד. הלוגו יוצא
     66.7px ברוחבו המרבי, ולכן 88 נותן נשימה של 10px מכל צד. */
  --head-h:  88px;
  --pad-x:   clamp(16px, 4vw, 56px);
  --gal-pad: clamp(20px, 5vw, 96px);

  /* הפלקט — השלט הממורכז שנתלה מתחת לכותרת ובו שלוש הגלריות.
     --nav-h ייכויל מחדש אחרי שדובי יכין את הסמלים הסופיים. */
  --nav-h:     112px;
  --nav-icon:  40px;    /* תיבת הסמל שמעל השם */
  --plaque-r:  16px;    /* הפינות התחתונות */
  /* כמה מהפלקט מציץ מתחת לכותרת כשהוא מקופל. השפה התחתונה שלו —
     קו הפליז והפינות — היא הידית שפותחת אותו בריחוף. */
  --peek:      17px;


  /* קווי הפליז — עובי אחיד ונראה, בלי להכביד */
  --line-w:    2px;
  --brass-line: rgba(154, 129, 73, .55);
  /* עומק שן הצ'ברון. נמדד ביחס לרוחב המסך — בערך קבוע בפיקסלים
     הגג נראה שטוח על מסך רחב. */
  --chev:      clamp(48px, 7.5vw, 132px);
  --chev-edge: 7px;      /* עובי רצועת הפליז */
  --chev-foot: clamp(26px, 3.2vw, 54px);
  /* הסימון של הלשונית הפעילה — הגרסה הקווית של element 4.
     --apex-h הוא הגובה מהחוד עד תחתית הקו, וכל השאר נגזר ממנו:
     עובי הקו, רוחב הצורה, ומרחק כפות הרגליים מהחוד.
     המספרים נלקחים מ-gable-line.svg. אם משנים שם את העובי
     (נכסים/בונה-גמלון-קווי.py) — צריך לעדכן כאן את --rule-w. */
  --apex-h:    36px;
  --apex-ar:   2.9344;   /* רוחב חלקי גובה */
  --rule-w:    calc(var(--apex-h) * .1289);
  --apex-left: calc(var(--apex-h) * 1.4672);  /* מהחוד לכף הרגל השמאלית */
  --apex-right:calc(var(--apex-h) * 1.0464);  /* ולימנית */
  --radius:  4px;
  --max:     1680px;
}

@media (max-width: 700px) {
  :root {
    --head-h: 64px; --chev-edge: 4px; --apex-h: 24px;
    --nav-h: 84px; --nav-icon: 28px; --plaque-r: 12px; --peek: 13px;
  }
}