/* ============================================================
   brand.css — שפת המותג של כולל חצות ארץ ישראל
   ------------------------------------------------------------
   מקור אחד ויחיד לצבעי המותג וללוגו.

   הצבעים כאן לא הומצאו: הם נשאבו ישירות מקובץ הלוגו הרשמי
   (לוגו כולל חצות_מעודכן.pdf). האותיות "ארץ ישראל" ו"כולל חצות"
   מצוירות שם בוקטור במילוי CMYK שמתורגם ל-#6a0800, והשורה
   "KOLLEL CHATZOS" ב-#c6922a. שני אלה הם --brand-red ו--brand-gold,
   וכל שאר הסולם נבנה סביבם.

   הקובץ נטען *לפני* הסגנון הפנימי של כל דף, כדי שדף יוכל לדרוס
   בעת הצורך. הדפים עצמם ממפים את המשתנים הישנים שלהם אל הסולם
   הזה (למשל --burgundy-700:var(--brand-red-700)), כך שאין צורך
   לרדוף אחרי צבעים מפוזרים בתוך כללי CSS.

   נכסי הלוגו — public/assets/ (נבנים ע"י scripts/build-brand-assets.py):
     logo.png / .webp        הלוגו המלא, לרקע בהיר
     logo-light.png / .webp  אותו לוגו, אותיות בשמנת — לרקע בורדו
     logo-mark.png / .webp   הגלובוס בלבד (סמל), עובד על כל רקע
     logo-print.png          רזולוציה גבוהה, להדפסה
     icon-32/180/192/512.png אייקונים לדפדפן ולמסך הבית

   כל נכס מוגש דרך <picture>: WebP למי שתומך (פי 2.5 קטן יותר),
   PNG לכל השאר. הקצאת המקום נעשית ע"י width/height בתגית, כדי
   שהדף לא יקפוץ בזמן הטעינה.
   ============================================================ */

:root{
  /* --- אדום המותג (האות בלוגו) --- */
  --brand-red-900:#3a0606;
  --brand-red-800:#4f0808;
  --brand-red-700:#6a0800;   /* צבע האותיות בלוגו — הצבע הראשי */
  --brand-red-600:#8a1207;
  --brand-red-500:#a63012;
  --brand-red-tint:#f7e9e6;

  /* --- זהב המותג (KOLLEL CHATZOS) --- */
  --brand-gold-900:#5f4310;
  --brand-gold-800:#75531a;
  --brand-gold-700:#8a6a1e;
  --brand-gold-600:#a87b23;
  --brand-gold-500:#c6922a;  /* צבע הזהב בלוגו */
  --brand-gold-400:#d8a94f;
  --brand-gold-300:#e8c583;
  --brand-gold-100:#f6e3bd;
  --brand-gold-50:#f9efdb;

  /* --- ענבר הגלובוס: המבטא החם --- */
  --brand-amber:#e0771c;
  --brand-amber-soft:#f4a63c;

  /* --- קלף ודיו --- */
  --brand-cream:#faf6ef;
  --brand-parchment:#fbf3e2;
  --brand-surface:#fffdf9;
  --brand-ink:#241a17;
  --brand-ink-soft:#4a3a33;
  --brand-muted:#6f625b;      /* 5.6:1 על קלף — עובר AA */
  --brand-line:#e6dbcc;
  --brand-line-gold:rgba(198,146,42,.42);

  /* --- מצבים. כל אחד נבדק לניגודיות 4.5:1 לפחות מול הרקע שלו --- */
  --brand-ok:#1f6b36;      --brand-ok-bg:#e9f3ea;  --brand-ok-border:#a9d3b3;
  --brand-warn:#8a5300;    --brand-warn-bg:#fdf0dd; --brand-warn-border:#e8cd9c;
  --brand-err:#a3271b;     --brand-err-bg:#fdecea;  --brand-err-border:#f0bcb6;
  --brand-off:#6f645c;     --brand-off-bg:#f1ece5;  --brand-off-border:#d6ccbe;

  /* --- מדרגים --- */
  --brand-grad-header:linear-gradient(135deg,#3a0606 0%,#6a0800 45%,#8a1207 78%,#a63012 100%);
  --brand-grad-button:linear-gradient(180deg,#8a1207 0%,#6a0800 100%);
  --brand-grad-gold:linear-gradient(180deg,var(--brand-gold-300),var(--brand-gold-500));
}

/* ============================================================
   הלוגו — רכיבים מוכנים
   ============================================================ */

/* <picture> הוא inline כברירת מחדל ומוסיף רווח תחתון — מיישרים אותו
   לרכיב בלוק, אחרת נוצר פס ריק מתחת לכל לוגו. */
.brand-pic{display:block;line-height:0}

/* הסמל (הגלובוס) בשורת כותרת. הגובה נקבע, הרוחב נגזר. */
.brand-mark{
  height:var(--brand-mark-h,46px);
  width:auto;
  flex:none;
  display:block;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.30));
}

/* שורת כותרת: סמל + טקסט, ממורכזים */
.brand-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  flex-wrap:nowrap;
}
.brand-row .brand-txt{min-width:0}

/* הלוגו המלא — לרקע בהיר (אישור רכישה, מסך כניסה, הדפסה) */
.brand-full{
  display:block;
  width:auto;
  height:var(--brand-full-h,140px);
  max-width:100%;
  margin-inline:auto;
}

/* הלוגו המלא על רקע בורדו — אותיות בשמנת */
.brand-hero{
  display:block;
  width:auto;
  height:var(--brand-hero-h,124px);
  max-width:100%;
  margin:0 auto 10px;
  filter:drop-shadow(0 3px 10px rgba(0,0,0,.35));
}

@media (max-width:480px){
  :root{ --brand-hero-h:104px; --brand-full-h:112px; }
}

/* ============================================================
   שירות
   ============================================================ */
/* טקסט לקוראי מסך בלבד — נשאר בעץ הנגישות, לא נראה בעין */
.sr-only{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;border:0;
}

@media print{
  .brand-mark,.brand-full,.brand-hero{ filter:none; -webkit-print-color-adjust:exact; print-color-adjust:exact }
}