/* Blog pages use the same internal-page language, with a calmer editorial rhythm. */
.blog-main{padding:0 0 clamp(52px,8vw,120px);background:var(--cream);min-height:55vh}
.blog-shell{width:100%;margin-inline:auto}
.blog-index-hero{position:relative;isolation:isolate;overflow:hidden;border-radius:30px;width:min(1465px,calc(100% - 80px));height:auto;min-height:max(200px,min(294px,calc((100svh - 144px) * .2983)));display:grid;place-items:center;text-align:center;color:#fff;padding:0;margin:0 auto clamp(30px,5vw,70px);background:#431f10}
.blog-hero-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.blog-index-hero::after,.blog-article-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(67,31,16,.82) 0%,rgba(67,31,16,.70) 48%,rgba(67,31,16,.84) 100%)}
.blog-index-hero__copy,.blog-article-hero__copy{position:relative;z-index:1}
.blog-kicker{display:none}
.blog-index-title,.blog-article-title{font-size:min(90px,calc((100svh - 144px) * .0913));line-height:1.06;margin:0;font-weight:800;color:#fff}
.blog-index-title .is-accent,.blog-article-title .is-accent{background:linear-gradient(90deg,#ffd26b,#f16a2c);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.blog-index-copy{max-width:42ch;margin:20px auto 0;font-size:clamp(16px,1.45vw,21px);line-height:1.6;color:rgba(255,255,255,.88)}
.blog-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:clamp(18px,2.2vw,30px)}
.blog-section-head h2{margin:0;font-size:clamp(25px,3vw,42px);color:#431f10}
.blog-section-head p{margin:0;color:#7c6f69;font-size:15px}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,30px);align-items:start}
.blog-card{display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid rgba(67,31,16,.1);border-radius:24px;box-shadow:0 12px 34px rgba(67,31,16,.09);min-height:100%;transition:transform .25s ease,box-shadow .25s ease}
.blog-card:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(67,31,16,.16)}
.blog-card-media{display:block;aspect-ratio:1.46;overflow:hidden;background:#f4e8dc}
.blog-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.blog-card:hover img{transform:scale(1.04)}
.blog-card-body{display:flex;flex-direction:column;flex:1;padding:clamp(18px,2vw,28px)}
.blog-card h3{margin:0 0 10px;font-size:clamp(21px,2vw,29px);line-height:1.15;color:#20364c}
.blog-card p{margin:0;color:#756c68;font-size:clamp(14px,1.1vw,16px);line-height:1.65;display:block}
.blog-read{display:inline-flex;align-items:center;gap:10px;margin-top:auto;padding-top:22px;color:#c44f21;font-weight:800;text-decoration:none;font-size:16px}.blog-read span{font-size:22px;transition:transform .2s ease}.blog-read:hover span{transform:translateX(-4px)}
.blog-card:nth-child(4){grid-column:2}
.blog-article-hero{position:relative;isolation:isolate;overflow:hidden;width:min(1465px,calc(100% - 80px));height:auto;min-height:max(200px,min(294px,calc((100svh - 144px) * .2983)));display:grid;place-items:center;text-align:center;color:#fff;background:#431f10;padding:0;border-radius:30px;margin:0 auto clamp(30px,5vw,64px)}
.blog-article-hero__copy{max-width:1200px;width:100%;padding-inline:24px}.blog-article-crumb{margin:0 0 12px;color:rgba(255,255,255,.8);font-size:14px}.blog-article-crumb a{color:inherit;text-decoration:none}.blog-article-crumb a:hover{text-decoration:underline;color:#fff}.blog-article-crumb i{font-style:normal;margin-inline:7px;color:rgba(255,254,251,.68)}
.blog-article-title{font-size:min(90px,calc((100svh - 144px) * .0913));max-width:none}.blog-article-lead{display:none}
.blog-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:clamp(28px,6vw,90px);align-items:start;max-width:1040px;margin-inline:auto}.blog-article-content{font-size:clamp(14px,1.15vw,17px);line-height:1.65;color:#443c38}.blog-article-content h2{font-size:clamp(25px,2.4vw,36px);line-height:1.2;color:#431f10;margin:1.4em 0 .35em}.blog-article-content p{margin:0 0 1.05em}.blog-article-content p:first-child{font-size:inherit;color:#2e2724}.blog-article-aside{position:sticky;top:24px;isolation:isolate;overflow:hidden;background:#fbe9df;border:1px solid transparent;border-radius:22px;padding:24px;color:#431f10}.blog-article-aside::before{content:"";position:absolute;z-index:-2;inset:-65%;background:conic-gradient(from 0deg,rgba(241,106,44,.9),rgba(255,210,107,.9),rgba(251,233,223,.05),rgba(241,106,44,.9));animation:blog-aside-border 8s linear infinite}.blog-article-aside::after{content:"";position:absolute;z-index:-1;inset:1px;border-radius:21px;background:#fbe9df}.blog-article-aside>*{position:relative;z-index:1}.blog-article-aside strong{display:block;font-size:20px;font-weight:900;line-height:1.2;margin-bottom:7px}.blog-article-aside p{margin:0 0 30px;line-height:1.6;font-size:15px}.blog-help-btn{display:inline-flex;flex-direction:row-reverse;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:6px 12px;border-radius:999px;background:var(--grad-accent);color:#fff;text-decoration:none;font-size:13px;font-weight:800;box-shadow:0 8px 18px rgba(241,106,44,.24);transition:transform .2s ease,box-shadow .2s ease}.blog-help-btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(241,106,44,.34)}.blog-help-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}.blog-article-nav{display:flex;justify-content:space-between;gap:12px;margin:clamp(32px,5vw,64px) auto 0;max-width:1040px;padding-top:22px;border-top:1px solid rgba(67,31,16,.15)}.blog-article-nav a{color:#431f10;font-weight:700;text-decoration:none}.blog-article-nav a:hover{color:#c44f21}.blog-empty{text-align:center;padding:80px 20px;color:#431f10}
@keyframes blog-aside-border{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.blog-article-aside::before{animation:none}}
.blog-footer{margin-top:0}
@media (max-width:900px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.blog-card:nth-child(4){grid-column:auto}.blog-article-layout{grid-template-columns:1fr}.blog-article-aside{position:relative;top:auto;order:-1}.blog-article-aside p{display:inline;margin-inline-end:12px}}
@media (max-width:1024px){.blog-main{padding-top:0}.blog-index-hero,.blog-article-hero{width:min(calc(100% - 48px),720px);height:auto;min-height:clamp(254px,35.5vw,314px);border-radius:36px;margin-top:-16px;margin-bottom:32px}.blog-index-title,.blog-article-title{font-size:clamp(52px,8.4vw,72px)}.blog-article-hero__copy{padding-inline:16px}.blog-article-crumb{font-size:clamp(15px,2.1vw,18px)}}
@media (max-width:600px){.blog-shell{width:100%}.blog-index-hero,.blog-article-hero{width:calc(100% - 32px);height:auto;min-height:230.65px;border-radius:32px;margin-top:-16px;margin-bottom:16px}.blog-index-hero::before,.blog-article-hero::before{content:"";position:absolute;z-index:1;left:50%;top:-64.35px;width:91.35px;height:91.35px;transform:translateX(-50%);border-radius:50%;background:var(--cream);pointer-events:none}.blog-index-title,.blog-article-title{font-size:clamp(33px,10vw,52px)}.blog-grid,.blog-section-head,.blog-article-layout,.blog-article-nav{width:min(calc(100% - 28px),1240px);margin-inline:auto}.blog-grid{grid-template-columns:1fr;gap:16px}.blog-card:nth-child(4){grid-column:auto}.blog-card-body{padding:20px}.blog-article-hero{padding:30px 20px}.blog-article-layout{gap:18px}.blog-article-content,.blog-article-content p,.blog-article-content p:first-child{font-size:18px;line-height:1.6}.blog-article-aside{position:relative;top:auto;align-self:start;height:auto;min-height:0;display:block;padding:22px}.blog-article-aside strong{font-size:20px;margin-bottom:6px}.blog-article-aside p{margin-bottom:30px}.blog-article-nav{flex-direction:column}.blog-section-head{display:block}.blog-section-head p{margin-top:8px}}

/* כרטיס התרומה משתמש באותו אפרסק מדויק של אזור "רוצים להיות חלק ממעגל הנתינה". */
.blog-article-aside{background:var(--jn-bg,#fff5f0)}
.blog-article-aside::before{background:conic-gradient(from 0deg,rgba(241,106,44,.9),rgba(255,210,107,.9),rgba(255,245,240,.05),rgba(241,106,44,.9))}
.blog-article-aside::after{background:var(--jn-bg,#fff5f0)}

/* ניווט מאמרים מינימליסטי: תמונה קטנה, שם מאמר וחץ ברור. */
.blog-article-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;direction:ltr;gap:14px;margin:clamp(32px,5vw,64px) auto 0;max-width:1040px;padding-top:20px;border-top:1px solid rgba(67,31,16,.13)}
.blog-nav-card{display:grid;grid-template-columns:68px minmax(0,1fr) 26px;align-items:center;gap:11px;min-width:0;padding:9px 11px;border:1px solid rgba(67,31,16,.1);border-radius:16px;background:#fff;color:#431f10;text-decoration:none;direction:rtl;box-shadow:0 6px 18px rgba(67,31,16,.06);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.blog-nav-card:hover{transform:translateY(-2px);border-color:rgba(241,106,44,.55);box-shadow:0 10px 22px rgba(67,31,16,.1)}
.blog-nav-card img{width:68px;height:58px;object-fit:cover;border-radius:11px;display:block}
.blog-nav-card__copy{display:flex;flex-direction:column;min-width:0;text-align:right}
.blog-nav-card__copy small{margin-bottom:3px;color:#786b62;font-size:11px;font-weight:700}
.blog-nav-card__copy strong{display:block;overflow:hidden;color:#431f10;font-size:15px;line-height:1.25;white-space:normal}
.blog-nav-card__arrow{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--jn-bg,#fff5f0);color:#f16a2c;font-size:18px;line-height:1}
.blog-nav-card--empty{visibility:hidden;box-shadow:none;border-color:transparent;background:transparent}
@media (max-width:600px){.blog-article-content{text-align:center;font-size:16px;line-height:1.6}.blog-article-content p,.blog-article-content p:first-child{font-size:16px;line-height:1.6}.blog-article-aside{text-align:center;background:var(--jn-bg,#fff5f0)}.blog-article-aside p{margin-bottom:10px}.blog-help-btn{margin-inline:auto}.blog-article-nav{grid-template-columns:1fr;gap:10px;margin-top:36px}.blog-nav-card{grid-template-columns:58px minmax(0,1fr) 24px;padding:8px 10px}.blog-nav-card img{width:58px;height:50px}.blog-nav-card__copy strong{font-size:14px}.blog-nav-card--empty{display:none}}

/* דסקטופ: מעטפת רחבה יותר וכרטיס תרומה דביק שאינו שובר את הכותרת. */
@media (min-width:1025px){
  .blog-article-layout{max-width:1180px;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(34px,5vw,72px)}
  .blog-article-nav{max-width:1180px}
  .blog-article-aside{position:sticky;top:24px;align-self:start}
  .blog-article-aside strong{white-space:nowrap}
}
.blog-article-aside p{margin-bottom:20px}
@media (max-width:600px){.blog-article-aside p{margin-bottom:20px}}

/* בגלילה הכרטיס נשאר מתחת לפס ההידר הצף ולא נבלע מאחוריו. */
@media (min-width:901px){.blog-article-aside{top:calc(var(--hd-h,72px) + 16px)}}

/* ארכיון הבלוג — התאמה למסך הארכיון מהאפיון. */
.blog-index-hero{margin-bottom:0}
.blog-section-head{display:none}
.blog-grid{width:min(1380px,calc(100% - 80px));grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(60px,6vw,92px) clamp(18px,2vw,38px);margin:clamp(96px,7vw,120px) auto 0}
.blog-card:nth-child(4){grid-column:auto}
.blog-card{position:relative;overflow:visible;border:0;border-radius:20px;background:#fff;box-shadow:0 4px 8px rgba(67,31,16,.16);min-height:0}
.blog-card-media{position:absolute;z-index:2;top:-59px;left:50%;width:112px;height:112px;transform:translateX(-50%);aspect-ratio:1;border-radius:50%;overflow:visible;padding:5px;background:var(--cream);box-shadow:none}
.blog-card-media::before{content:"";position:absolute;inset:-7px;border:2px dashed rgba(67,31,16,.86);border-radius:50%;pointer-events:none}
.blog-card-media img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;transition:transform .35s ease}
.blog-card:hover .blog-card-media img{transform:scale(1.04)}
.blog-card-body{align-items:center;text-align:center;padding:67px 18px 23px;min-height:166px}
.blog-card h3{margin:0 0 9px;color:var(--ink);font-size:clamp(18px,1.3vw,23px);line-height:1.15;font-weight:800}
.blog-card p{margin:0;color:#80746e;font-size:clamp(12px,.9vw,14px);line-height:1.32;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.blog-read{margin-top:13px;padding-top:0;color:#c25624;font-size:13px;line-height:1.2;gap:4px}
.blog-read span{font-size:15px}
@media (max-width:1024px){.blog-grid{width:min(calc(100% - 56px),760px);grid-template-columns:repeat(2,minmax(0,1fr));gap:78px 24px;margin-top:104px}}
@media (max-width:600px){.blog-grid{width:min(calc(100% - 32px),360px);grid-template-columns:1fr;gap:78px;margin-top:96px}.blog-card{border-radius:20px}.blog-card-body{padding:66px 22px 23px;min-height:166px}.blog-card h3{font-size:21px}.blog-card p{font-size:14px;line-height:1.4}.blog-card-media{width:108px;height:108px;top:-56px}.blog-read{font-size:13px}}

/* מידות הארכיון בפריים: גריד קומפקטי, כרטיסים אחידים וטקסט קצר. */
.blog-grid{width:min(1380px,70vw)}
.blog-card-body{height:172px;min-height:172px;box-sizing:border-box;padding:54px 16px 14px}
.blog-card h3{font-size:clamp(17px,1.25vw,21px);line-height:1.12;margin-bottom:7px;min-height:2.24em}
.blog-card p{font-size:clamp(11px,.8vw,13px);line-height:1.25;-webkit-line-clamp:3}
.blog-read{margin-top:10px;font-size:12px}
@media (max-width:1024px){.blog-grid{width:min(70vw,760px)}}
@media (max-width:600px){.blog-grid{width:min(calc(100% - 32px),360px)}.blog-card-body{height:172px;min-height:172px;padding:54px 20px 14px}.blog-card h3{font-size:20px}.blog-card p{font-size:13px;line-height:1.3}.blog-read{font-size:13px}}

.blog-card-body{flex:0 0 172px;overflow:hidden}

/* כרטיס Figma: התמונה חוצה את השפה העליונה, והקשת המקווקוות נשארת בחוץ בלבד. */
.blog-card-media{box-sizing:border-box;width:50%;max-width:149px;height:auto;aspect-ratio:1;top:calc(-50% - 10px);padding:5px;background:var(--cream);border-radius:50%;overflow:visible}
.blog-card-media::before{inset:-8px -8px auto;height:calc(50% + 14px);border:2px dashed rgba(67,31,16,.86);border-bottom:0;border-radius:999px 999px 0 0}
.blog-card-media{top:0;transform:translate(-50%,-58%)}
.blog-card-body{flex:0 0 auto;height:auto;min-height:166px;overflow:visible;padding:72px 16px 18px}
.blog-card h3{min-height:2.24em}
.blog-card p{display:block;overflow:visible;-webkit-line-clamp:unset;-webkit-box-orient:initial;font-size:clamp(11px,.8vw,13px);line-height:1.25}
.blog-read{margin-top:12px}
@media (max-width:600px){.blog-grid{gap:110px}.blog-card-body{min-height:166px;padding:72px 20px 18px}.blog-card p{font-size:13px;line-height:1.3}.blog-card-media{width:100px;max-width:100px}.blog-card-media::before{inset:-7px -7px auto;height:calc(50% + 12px)}}

/* תיקון ארכיון: תגיות עדינות, גובה אחיד ומרווח שורות שמכיל את קשת התמונה. */
.blog-grid{row-gap:clamp(92px,7vw,120px)}
.blog-card-body{display:flex;flex:0 0 263px;height:263px;min-height:263px;box-sizing:border-box;overflow:hidden;padding:66px 16px 18px}
.blog-card-tags{display:flex;justify-content:center;align-items:center;gap:6px;height:24px;min-height:24px;margin:0 0 8px;direction:rtl}
.blog-card-tags span{display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;border:1px solid rgba(196,116,78,.22);border-radius:999px;background:#fff5f0;color:#8c5540;font-size:11px;line-height:1;white-space:nowrap}
.blog-card h3{height:47px;min-height:47px;margin:0 0 7px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.blog-card p{height:3.9em;min-height:3.9em;margin:0;line-height:1.3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.blog-read{height:22px;min-height:22px;margin-top:10px}
.blog-card-tags span{border:0;box-shadow:none;background:rgba(255,245,240,.88);color:#9a6048}
.blog-card-media::before{inset:-10px -10px auto;height:calc(50% + 18px);border-width:1.5px;border-radius:999px 999px 0 0}
.blog-card-media::before{display:none}
/* Original Figma frame: 204 × 102 after rotation, around a 149.251px photo.
   Keep the exported curve and its 14/14 dashes proportional to the photo. */
.blog-card-dash{position:absolute;z-index:0;left:50%;top:50%;width:calc((100% - 10px) * 1.366827);height:auto;aspect-ratio:2 / 1;transform:translate(-50%,-90.28%);opacity:.7;pointer-events:none}
.blog-card-dash::after{content:"";position:absolute;left:25%;top:-50%;width:50%;height:200%;background:url("/assets/blog/figma-card-arc.svg") center / 100% 100% no-repeat;transform:rotate(90deg)}
.blog-card-media img{position:relative;z-index:1}
.blog-read{display:inline-flex;align-items:center;justify-content:center;width:max-content;align-self:center;height:28px;min-height:28px;margin-top:10px;padding:4px 13px;border-radius:999px;background:var(--grad-accent);color:#fff;box-shadow:0 5px 12px rgba(241,106,44,.2);font-weight:700}
.blog-read span{color:#fff}
@media (max-width:600px){.blog-grid{width:min(calc(100% - 72px),320px);row-gap:120px;margin-top:104px}.blog-card-body{flex-basis:263px;height:263px;min-height:263px;padding:66px 14px 18px}.blog-card-media{width:118px;max-width:118px;height:auto}.blog-index-hero{min-height:200.65px}}

/* 15.9.2026: גוף הכרטיס היה בגובה קבוע של 263px, ומתחת לכפתור "קרא עוד"
   נשארו 54 עד 62 פיקסלים ריקים. עכשיו הגובה נקבע לפי התוכן והריווח
   מתחת לכפתור הוא 30px בדיוק. התגיות, הכותרת והתקציר בגובה קבוע משלהם,
   ולכן כל הכרטיסים נשארים באותו גובה. */
.blog-card-body{flex:0 0 auto;height:auto;min-height:0;padding-bottom:30px}

/* Let article text shrink within the grid and grow vertically when enlarged. */
.blog-article-content, .blog-article-aside { min-width: 0; }
.blog-article-hero__copy { overflow-wrap: anywhere; }

/* הכותרת מוצגת רק עד ש-blog.js מרנדר את העמוד; אם הסקריפט נכשל,
   היא נשארת ומספקת לעמוד כותרת ראשית אמיתית. */
.blog-fallback-title { width: min(1240px, calc(100% - 40px)); margin: 120px auto 40px; font-size: clamp(32px, 4vw, 58px); font-weight: 800; color: var(--ink); text-align: center; }