/* patch.css — משלים מחלקות responsive שחסרות ב-styles.css המהודר.
 * ה-Tailwind output שהוקומפל בעבר התיישן ביחס לקוד הנוכחי, ולכן כמה
 * מחלקות responsive שנוספו מאוחר יותר לא נכללו בו — מה שגרם לרשתות
 * (תוכניות, סיפורים, מאמרים, השיטה) להיערם על כל הרוחב במחשב.
 * הקובץ הזה מחזיר בדיוק את החוקים החסרים. נטען אחרי styles.css. */

@media (min-width: 640px) {
  .sm\:w-auto { width: auto; }
  .sm\:flex-row { flex-direction: row; }
}

@media (min-width: 768px) {
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .md\:flex-row { flex-direction: row; }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:flex-row { flex-direction: row; }
}

/* ============================================================
 * עיצוב Hero אדיטוריאלי — בהשראת DESIGN_STRATEGY (Good Inside × The Soke)
 * מיתוג זהב-קרם נשמר. RTL, מובייל-first. inline ב-patch כי styles.css מהודר וישן.
 * ============================================================ */
.hb-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#FCFAF6 0%, #F8F4EC 100%);
  padding:clamp(104px,12vw,150px) clamp(20px,5vw,64px) clamp(64px,7vw,100px);
}
.hb-hero__inner{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1fr; gap:clamp(36px,5vw,72px); align-items:center;
}
.hb-hero__text{ text-align:start; }
.hb-hero__eyebrow{
  font-family:Rubik,sans-serif; font-weight:600; font-size:12.5px; text-transform:uppercase;
  letter-spacing:.2em; color:#8A6A2F; display:inline-flex; align-items:center; gap:12px; margin-bottom:22px;
}
.hb-hero__eyebrow::before{ content:""; width:28px; height:1px; background:#C2974A; display:inline-block; }
.hb-hero__title{
  font-family:Rubik,sans-serif; font-weight:600; color:#221F1A;
  font-size:clamp(1.9rem,3.2vw,2.9rem); line-height:1.22; letter-spacing:-.005em;
  margin:0 0 20px; max-width:20ch; text-wrap:balance;
}
.hb-hero__sub{
  font-family:Assistant,sans-serif; color:#5B554D; font-weight:400;
  font-size:clamp(16px,1.4vw,18.5px); line-height:1.75; max-width:48ch; margin:0 0 34px;
}
.hb-hero__cta{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
.hb-hero__btn{
  display:inline-flex; align-items:center; justify-content:center;
  background:#C2974A; color:#fff; font-family:Rubik,sans-serif; font-weight:700; font-size:17px;
  padding:16px 32px; border-radius:999px; text-decoration:none; border:0; cursor:pointer;
  box-shadow:0 16px 38px -14px rgba(194,151,74,.65); transition:transform .25s, box-shadow .25s, background .25s;
}
.hb-hero__btn:hover{ background:#B0843C; transform:translateY(-2px); box-shadow:0 22px 48px -16px rgba(194,151,74,.8); }
.hb-hero__link{
  font-family:Rubik,sans-serif; font-weight:700; font-size:16px; color:#8A6A2F; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px; padding:6px 4px; transition:color .2s, gap .2s;
}
.hb-hero__link:hover{ color:#6E521F; gap:12px; }
.hb-hero__media{ position:relative; justify-self:center; width:100%; max-width:480px; }
.hb-hero__frame{
  position:relative; aspect-ratio:4/5; border-radius:20px; overflow:hidden;
  background:#fff; box-shadow:0 34px 70px -32px rgba(45,42,38,.4);
}
.hb-hero__frame img{ width:100%; height:100%; object-fit:cover; display:block; }

@media (min-width:1024px){
  .hb-hero__inner{ grid-template-columns:0.9fr 1.1fr; }
  .hb-hero__media{ order:-1; max-width:100%; }   /* מדיה ראשונה = צד שמאל ב-RTL */
}
@media (prefers-reduced-motion:reduce){ .hb-hero__btn,.hb-hero__link{ transition:none; } }