/* ===== העולם של שיפי =====
   קובץ עצמאי, אינו נוגע ב-style.css של הרווקה.

   מבנה אתר רגיל: סרגל עליון דביק, הירו שמכיל את שני
   העולמות כבר במסך הראשון, רצועה, מי אני, רשימת תפוצה,
   וסרגל תחתון עם עמודות.                                */

/* הצבעים לקוחים מכרזת המיתוג של שיפי, חמישה במדויק.
   הכותרות ב-Heebo Black והגוף ב-Assistant.
   כתב היד נשאר של הרווקה בלבד, ולא של הסופרת.        */

:root{
  --cream:#faf7f4;
  --plum:#352536;
  --plum-2:#20141f;
  --berry:#b73563;
  --blush:#eedce4;
  --smoke:#b9acca;

  --ink:#352536;
  --ink-2:rgba(53,37,54,.74);
  --ink-3:rgba(53,37,54,.5);
  --on-dark:rgba(250,247,244,.76);
  --line:rgba(53,37,54,.12);

  --nav-h:62px;

  --sans:'Assistant',system-ui,-apple-system,'Arial Hebrew',sans-serif;
  --display:'Heebo','Assistant',system-ui,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 34px)}
body{font-family:var(--sans);color:var(--ink);background:var(--cream);
  line-height:1.65;overflow-x:clip;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
p{text-wrap:pretty}
:focus-visible{outline:2.5px solid var(--berry);outline-offset:3px;border-radius:5px}
.skip{position:absolute;inset-inline-start:-9999px;top:0;z-index:99;
  background:var(--cream);color:var(--plum);padding:10px 18px;font-weight:700}
.skip:focus{inset-inline-start:12px;top:12px}

/* ---------- סרגל עליון ---------- */
.nav{position:sticky;top:0;z-index:50;background:var(--plum);
  border-bottom:1px solid rgba(250,247,244,.1);transition:box-shadow .25s}
.nav.is-stuck{box-shadow:0 6px 26px rgba(32,20,31,.28)}
.nav-in{max-width:1180px;margin:0 auto;height:var(--nav-h);padding:0 20px;
  display:flex;align-items:center;justify-content:space-between;gap:20px}
.nav-logo img{width:78px;height:auto}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links a{font-size:15px;font-weight:600;color:rgba(250,247,244,.82);
  transition:color .2s}
.nav-links a:hover{color:var(--cream)}
.nav-cta{background:var(--berry);color:var(--cream)!important;
  border-radius:99px;padding:9px 20px;font-weight:700!important;
  transition:background .2s}
.nav-cta:hover{background:#cf3f72}
.foot-social{display:flex;gap:18px}
.foot-social a{display:block;color:rgba(250,247,244,0.68);transition:color .2s}
.foot-social a:hover{color:var(--blush)}
.foot-social svg{width:20px;height:20px;fill:currentColor;display:block}

.nav-burger{display:none;background:none;border:0;cursor:pointer;
  width:40px;height:40px;flex-direction:column;justify-content:center;gap:5px;
  align-items:flex-end;padding:0}
.nav-burger span{display:block;height:2px;background:var(--cream);border-radius:2px;
  transition:width .2s}
.nav-burger span:nth-child(1){width:22px}
.nav-burger span:nth-child(2){width:16px}
.nav-burger span:nth-child(3){width:22px}

/* ---------- הירו ---------- */
.hero{position:relative;overflow:hidden;
  background:linear-gradient(180deg,#3d2b3e 0%,var(--plum) 38%,var(--plum-2) 100%);
  color:var(--cream);padding:clamp(24px,3.9vw,56px) 20px clamp(24px,3.9vw,56px)}
.hero-leaves{position:absolute;inset:0;pointer-events:none}
.hl{position:absolute;width:min(30vw,330px);opacity:.1;filter:brightness(0) invert(1)}
.hl-1{top:-14%;inset-inline-start:-5%;transform:rotate(18deg)}
.hl-2{bottom:-22%;inset-inline-end:-6%;transform:rotate(-158deg)}
.hero-in{position:relative;z-index:2;max-width:1180px;margin:0 auto;
  display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  align-items:center;gap:clamp(24px,4vw,56px)}

/* עמודת הטקסט ברוחב קבוע, כדי שהכותרת, הפסקה והכפתורים
   יתחילו ויסתיימו באותו קו ולא ייראו כמו שלושה בלוקים שונים. */
.hero-txt{max-width:23em;justify-self:start}
.hero-kick{font-family:var(--display);font-size:13px;font-weight:600;
  letter-spacing:.13em;color:var(--blush);line-height:1;margin-bottom:14px}
/* שתי שורות בלבד, כל אחת בשורה אחת, ובאותו רוחב. */
.hero-h{font-family:var(--display);font-size:clamp(22px,3.3vw,30px);
  font-weight:700;line-height:1.2;letter-spacing:-.01em}
.hero-h>span{display:block;white-space:nowrap}
/* הגודל מכויל כך ששתי שורות הכותרת יוצאות באותו רוחב בדיוק.
   אם הטקסט משתנה, למדוד שוב את שני הרוחבים. */
.hero-h em{font-family:var(--display);font-style:normal;font-weight:900;
  color:var(--berry);font-size:1.578em;line-height:1;
  display:block;white-space:nowrap;margin:4px 0 -3px}
.hero-p{margin-top:14px;font-size:clamp(14.5px,1.5vw,16.5px);
  color:var(--on-dark)}
.hero-hint{margin-top:20px;font-size:13px;font-weight:600;letter-spacing:.1em;
  color:rgba(250,247,244,0.68)}
.hero-btns{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:0 24px;border-radius:99px;
  font-size:15px;font-weight:700;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-2px)}
.btn-1{background:var(--cream);color:var(--plum)}
.btn-1:hover{background:#fff}
.btn-2{border:1.5px solid rgba(250,247,244,.34);color:var(--cream)}
.btn-2:hover{border-color:var(--cream)}

/* ---------- שני העולמות ---------- */
.hero-worlds{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.3vw,16px);
  /* בלי זה, חזרה לספרים מגלילה מצמידה אותם לסרגל */
  scroll-margin-top:calc(var(--nav-h) + 40px)}

.world{position:relative;display:block;overflow:hidden;border-radius:10px;
  aspect-ratio:3/4;background:var(--plum-2);isolation:isolate;
  container-type:inline-size;
  /* הפאנלים כהים כמו הרקע, ובלי טבעת וצל הם נטמעים בו */
  box-shadow:0 0 0 1px rgba(250,247,244,.18), 0 20px 46px rgba(10,6,11,.6);
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s}
.world:hover{transform:translateY(-5px);
  box-shadow:0 0 0 1px rgba(250,247,244,.4), 0 28px 58px rgba(10,6,11,.66)}
.world-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.world:hover .world-bg{transform:scale(1.05)}

/* גבעת אשל עוד אין לו תמונה, ולכן פאנל מעוצב ולא מלבן ריק */
.world-art{position:absolute;inset:0;
  background:
    radial-gradient(70% 55% at 50% 38%, rgba(183,53,99,.28) 0%, transparent 70%),
    radial-gradient(120% 100% at 70% 12%, #55414a 0%, #372932 46%, #1c1318 100%)}
.world-art img{position:absolute;top:8%;inset-inline-start:-12%;
  width:110%;opacity:.2;filter:brightness(0) invert(1);transform:rotate(-8deg)}
.world-art::after{content:"גבעת אשל";position:absolute;inset-inline:0;top:36%;
  font-family:var(--display);font-size:clamp(26px,3vw,40px);
  text-align:center;color:rgba(250,247,244,.24);line-height:1}

.world-veil{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(24,14,24,.94) 0%,rgba(28,17,28,.62) 36%,
    rgba(30,18,30,.12) 64%,transparent 84%)}
.world-flag{position:absolute;top:12px;inset-inline-end:12px;z-index:3;
  background:var(--cream);color:var(--plum);font-size:11px;font-weight:700;
  letter-spacing:.09em;border-radius:99px;padding:4px 12px}
.world-txt{position:absolute;inset-inline:0;bottom:0;z-index:2;
  padding:clamp(14px,1.5vw,18px);
  display:flex;flex-direction:column;align-items:flex-start;color:var(--cream)}
.world-kick{font-family:var(--display);font-size:10.5px;font-weight:600;
  letter-spacing:.12em;color:var(--blush);line-height:1;margin-bottom:5px}
/* שם הספר בשורה אחת תמיד, ולכן נמדד ביחס לרוחב הפאנל ולא למסך */
.world-name{font-size:clamp(12px,7.4cqi,19px);font-weight:800;line-height:1.2;
  letter-spacing:-.02em;white-space:nowrap}
.world-line{margin-top:5px;font-size:clamp(11px,4.6cqi,13.5px);
  color:var(--on-dark);line-height:1.4}
.world-go{margin-top:10px;display:inline-flex;align-items:center;gap:7px;
  font-size:12.5px;font-weight:700;
  border-bottom:1.5px solid rgba(250,247,244,.4);padding-bottom:3px}
/* אותו חץ בדיוק כמו בגבעת אשל */
.world-go i{width:9px;height:9px;flex:none;
  border-inline-start:2px solid currentColor;
  border-bottom:2px solid currentColor;
  border-end-start-radius:2px;
  transform:rotate(45deg);transition:transform .2s}
.world:hover .world-go i{transform:rotate(45deg) translate(-3px,-3px)}

/* ---------- רצועה ---------- */
.strip{background:var(--blush);display:flex;flex-wrap:wrap;
  justify-content:center;align-items:center;gap:9px clamp(20px,3vw,42px);
  padding:clamp(15px,2vw,20px) 18px;color:var(--ink-2);text-align:center}
.strip p{margin:0;font-size:clamp(13px,1.35vw,16px);font-weight:700;
  line-height:1.3;white-space:nowrap;color:var(--ink)}
.strip span{color:var(--berry);margin-inline-end:1px}

/* ---------- מי אני ---------- */
.me{max-width:900px;margin:0 auto;padding:clamp(44px,6vw,80px) 22px;
  display:flex;align-items:center;gap:clamp(24px,4vw,48px)}
.me-pic-wrap{position:relative;flex:none}
.me-pic{width:clamp(140px,20vw,260px);height:clamp(140px,20vw,260px);
  object-fit:cover;border-radius:6px}
.me-pic-wrap::after{content:"";position:absolute;inset-inline-end:-11px;bottom:-11px;
  width:100%;height:100%;border:1.5px solid var(--smoke);border-radius:6px;z-index:-1}
.me-hi{font-family:var(--display);font-weight:900;font-size:clamp(22px,2.6vw,30px);
  color:var(--berry);line-height:1.1;letter-spacing:-.02em;margin-bottom:12px}
.me-p{font-size:clamp(14.5px,1.5vw,16px);color:var(--ink-2)}
.me-list{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:16px}
.me-list li{position:relative;padding-inline-start:20px;
  font-size:clamp(14px,1.5vw,15.5px);color:var(--ink-2);line-height:1.5}
.me-list li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;
  width:9px;height:8px;
  -webkit-mask:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'><path d='M12 21S2 14 2 7.7A5.7 5.7 0 0 1 12 4a5.7 5.7 0 0 1 10 3.7C22 14 12 21 12 21z' fill='black'/></svg>");
  mask:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'><path d='M12 21S2 14 2 7.7A5.7 5.7 0 0 1 12 4a5.7 5.7 0 0 1 10 3.7C22 14 12 21 12 21z' fill='black'/></svg>");
  background-color:var(--berry)}

/* ---------- הרשימה ---------- */
.nl{position:relative;background:var(--blush);padding:clamp(40px,5.5vw,68px) 22px;
  overflow:hidden;text-align:center}
.nl-leaf{position:absolute;top:-16%;inset-inline-start:-4%;width:min(34vw,290px);
  opacity:.2;transform:rotate(12deg);pointer-events:none}
.nl-in{position:relative;z-index:2;max-width:520px;margin:0 auto}
.nl-h{font-size:clamp(21px,2.8vw,29px);font-weight:800;line-height:1.2;
  letter-spacing:-.02em}
.nl-h em{font-family:var(--display);font-style:normal;font-weight:700;
  color:var(--berry);font-size:1.2em;line-height:.9}
.nl-sub{margin-top:10px;font-size:clamp(14px,1.5vw,15.5px);color:var(--ink-2)}
.nl-form{display:flex;flex-direction:column;gap:10px;margin-top:20px;
  max-width:400px;margin-inline:auto}
.nl-form input[type=email]{width:100%;font:inherit;font-size:16px;text-align:center;
  color:var(--ink);background:var(--cream);border:1.5px solid rgba(53,37,54,.16);
  border-radius:8px;padding:13px 16px;min-height:50px}
.nl-form input[type=email]::placeholder{color:var(--ink-3)}
.nl-form input[type=email]:focus{outline:none;border-color:var(--berry)}
.nl-form button{width:100%;font:inherit;font-size:16px;font-weight:700;
  color:var(--cream);background:var(--plum);border:0;border-radius:8px;
  padding:13px 30px;min-height:50px;cursor:pointer;transition:background .2s}
.nl-form button:hover{background:var(--berry)}
.nl-ok{display:flex;align-items:flex-start;gap:9px;text-align:start;
  font-size:12.5px;line-height:1.45;color:var(--ink-2);cursor:pointer}
.nl-ok input{flex:none;width:17px;height:17px;margin-top:1px;accent-color:var(--berry)}
.nl-fine{margin-top:13px;font-size:12.5px;color:var(--ink-3)}
.nl-fine a{color:var(--berry);text-decoration:underline}

/* ---------- סרגל תחתון ---------- */
.foot{background:var(--plum);color:var(--cream)}
.foot-in{max-width:1180px;margin:0 auto;padding:clamp(38px,5vw,60px) 22px clamp(28px,3.5vw,42px);
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(24px,3vw,44px)}
.foot-col{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
/* הלוגו מיושר לשורה של כותרות העמודות, והרשתות מתחתיו.
   קודם זה היה שורה אחת ממורכזת אנכית, והלוגו ריחף באמצע. */
.foot-brand{flex-direction:column;align-items:flex-start;
  width:100%;gap:16px}
.foot-col a{font-size:14px;color:rgba(250,247,244,0.68);transition:color .2s}
.foot-col a:hover{color:var(--blush)}
.foot-h{font-size:13px;font-weight:700;letter-spacing:.07em;
  color:var(--cream);margin-bottom:2px}
.foot-logo{width:84px;height:auto;opacity:.9}
.foot-msg{font-size:14px;color:rgba(250,247,244,0.68);max-width:24ch}
.foot-social{display:flex;gap:16px;margin-top:2px}
.foot-bar .credit a{color:rgba(250,247,244,.7);border-bottom:1px solid rgba(250,247,244,.22)}
.foot-bar .credit a:hover{color:var(--blush);border-color:var(--blush)}
.foot-bar{border-top:1px solid rgba(250,247,244,.12);
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;
  gap:8px 20px;max-width:1180px;margin:0 auto;padding:16px 22px;
  font-size:12.5px;color:rgba(250,247,244,0.68)}

/* ---------- לוח וטלפון ---------- */
@media(max-width:1024px){
  .hero-in{grid-template-columns:1fr;gap:26px}
  .hero-txt{max-width:none;justify-self:stretch;text-align:center}
  .hero-p{margin-inline:auto}
  .hero-btns{justify-content:center}
  .world{aspect-ratio:4/5}
  .foot-in{grid-template-columns:1fr 1fr}
}

@media(max-width:760px){
  .nav-burger{display:flex}
  .nav-links{position:absolute;inset-inline:0;top:var(--nav-h);
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--plum-2);border-bottom:1px solid rgba(250,247,244,.12);
    padding:6px 20px 18px;
    display:none}
  .nav.is-open .nav-links{display:flex}
  .nav-links a{padding:13px 0;font-size:16px;
    border-bottom:1px solid rgba(250,247,244,.08)}
  .nav-cta{margin-top:14px;text-align:center;border-bottom:0!important}

  .hero{padding-top:18px}
  .hero-kick{font-size:12.5px;margin-bottom:13px}
  .hero-h{font-size:clamp(24px,7vw,28px)}
  .hero-p{margin-top:15px;font-size:15px}
  .hero-in{gap:18px}
  /* שני הספרים זה לצד זה גם בנייד. יחס לאורך, כי זה היחס
     של האיורים עצמם, וכך אין חיתוך של ראשים ויש גובה לטקסט.
     המידות נמדדות ביחס לרוחב הפאנל (cqi) ולא למסך. */
  .hero-worlds{grid-template-columns:1fr 1fr;gap:9px}
  .world{aspect-ratio:3/4}
  .world-veil{background:linear-gradient(to top,rgba(20,12,20,.96) 0%,
    rgba(24,15,24,.8) 32%,rgba(28,17,28,.3) 62%,transparent 86%)}
  .world-txt{padding:6cqi}
  .world-kick{font-size:clamp(10px,6cqi,12px);letter-spacing:.07em;margin-bottom:5px}
  /* בפאנל צר שם ארוך בשורה אחת יוצא זעיר. שתי שורות בגודל
     קריא עדיפות על שורה אחת שאי אפשר לקרוא. */
  .world-name{white-space:normal;font-size:clamp(14px,9cqi,20px);line-height:1.16}
  .world-line{font-size:clamp(11.5px,6.6cqi,14px);margin-top:6px;line-height:1.4}
  .world-go{font-size:clamp(12px,6.8cqi,14px);margin-top:10px;gap:6px}
  .world-go i{width:8px;height:8px}
  .world-flag{top:8px;inset-inline-end:8px;font-size:9.5px;padding:3px 9px}
  .me{flex-direction:column;text-align:center;gap:26px}
  .me-list li{text-align:start;max-width:19rem;margin-inline:auto}
  /* שתי עמודות בנייד. שלוש עמודות זו אחת מתחת לשנייה, והפוטר
     נמתח לגובה של מסך שלם. */
  .foot-in{grid-template-columns:1fr 1fr;gap:26px 18px}
  .foot-brand{grid-column:1 / -1}
  .foot-bar{justify-content:center;text-align:center}
}

@media(max-width:360px){
  /* בפאנל של 136 פיקסלים המשפט המתאר חונק את התמונה */
  .world-line{display:none}
  .world-txt{padding:5.5cqi}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ================= גבעת אשל, טיזר =================
   האיור נגמר בעמודת שמנת מימין, ולכן הטקסט יושב עליה
   בדסקטופ בלי להסתיר אף זוג. בנייד האיור למעלה והטקסט
   מתחתיו, על אותה שמנת.                                */
.gv{position:relative;background:#f7f0e4;overflow:hidden}
.gv-art{display:block;line-height:0}
.gv-art img{display:block;width:100%;height:auto}
.gv-in{position:absolute;z-index:2;top:50%;transform:translateY(-50%);
  inset-inline-start:clamp(20px,3vw,52px);
  width:min(34%,430px);text-align:center}
.gv-kick{font-size:13px;font-weight:700;letter-spacing:.06em;
  color:var(--berry)}
.gv-name{margin-top:5px;font-family:'Frank Ruhl Libre',var(--display),serif;
  font-weight:900;font-size:clamp(30px,4vw,56px);line-height:1;
  color:#4c512d;letter-spacing:-.015em}
.gv-line{margin-top:11px;font-size:clamp(14.5px,1.5vw,17px);line-height:1.55;
  color:rgba(39,40,32,.78);font-weight:600}
.gv-form{margin-top:clamp(14px,1.8vw,22px)}
.gv-row{display:flex;gap:8px}
.gv-row input[type=email]{flex:1;min-width:0;min-height:50px;padding:0 16px;
  border-radius:99px;border:1px solid rgba(76,81,45,.2);background:#fff;
  font-family:inherit;font-size:15.5px;color:#272820}
.gv-row button{min-height:50px;padding-inline:20px;border:0;border-radius:99px;
  cursor:pointer;font-family:inherit;font-size:15px;font-weight:700;
  background:#c6205b;color:#fff;white-space:nowrap;transition:background .2s}
.gv-row button:hover{background:#d93a72}
.gv-ok{display:flex;gap:8px;align-items:flex-start;margin-top:11px;
  text-align:start;font-size:12.5px;line-height:1.5;
  color:rgba(39,40,32,0.68);cursor:pointer}
.gv-ok input{margin-top:3px;flex:none;width:16px;height:16px;accent-color:#c6205b}

@media(max-width:860px){
  .gv{padding-bottom:clamp(26px,5vw,40px)}
  .gv-in{position:static;transform:none;width:auto;
    padding:clamp(20px,5vw,30px) 22px 0;margin:0 auto;max-width:520px}
  .gv-row{flex-direction:column}
  .gv-row button{width:100%}
  .gv-ok{justify-content:center;text-align:start}
}

/* ================= שתי רצועות, אותו מבנה =================
   כל עולם מקבל את האיור שלו ברוחב מלא, והטקסט יושב על
   האזור הפנוי שבו. הגובה מוגבל, כדי שהרצועות לא יבלעו
   את העמוד.                                              */
.hv,.gv{position:relative;overflow:hidden}
.hv{background:var(--plum-2);color:var(--cream)}
.gv{background:#f7f0e4}
.hv-art,.gv-art{display:block;line-height:0}
.hv-art img,.gv-art img{display:block;width:100%;height:auto;
  max-height:clamp(250px,25vw,360px);object-fit:cover}
/* גילי יושבת בשליש התחתון, ולכן החיתוך יורד כדי להראות
   אותה במלואה ולא לחתוך אותה במותן. */
.hv-art img{object-position:center 74%}
/* אצל גבעת אשל הראשים גבוהים, ולכן החיתוך עולה. */
.gv-art img{object-position:center 34%}

.hv-in,.gv-in{position:absolute;z-index:2;top:50%;transform:translateY(-50%);
  width:min(36%,420px);text-align:center}
/* בלי רקע הטקסט הלבן נבלע בשמיים. הצללה רכה ומעגלית
   שנמסה לשקיפות, ולא מלבן שנראה כמו תיבה. */
.hv-in::before{content:"";position:absolute;z-index:-1;
  inset:-14% -18%;border-radius:50%;
  background:radial-gradient(60% 55% at 50% 50%,
    rgba(22,12,22,.72) 0%, rgba(22,12,22,.52) 46%,
    rgba(22,12,22,.22) 72%, rgba(22,12,22,0) 100%);
  filter:blur(6px)}
/* הטקסט יושב על השמיים הריקים שמימין לגילי */
.hv-in{right:clamp(18px,3vw,60px)}
/* ואצל גבעת אשל על עמודת השמנת שמשמאל */
.gv-in{left:clamp(18px,3vw,52px)}

.hv-kick,.gv-kick{font-size:12.5px;font-weight:700;letter-spacing:.09em}
.hv-kick{color:var(--blush)}
.gv-kick{color:var(--berry)}
.hv-name,.gv-name{margin-top:8px;font-weight:900;line-height:1.05;
  letter-spacing:-.02em;font-size:clamp(21px,2.7vw,36px)}
.hv-name{font-family:var(--display)}
.gv-name{font-family:'Frank Ruhl Libre',var(--display),serif;color:#4c512d}
.hv-line,.gv-line{margin-top:11px;font-size:clamp(13.5px,1.35vw,16px);line-height:1.55}
.hv-line{color:var(--on-dark)}
.gv-line{color:rgba(39,40,32,.78);font-weight:600}
.hv-btns{margin-top:15px;display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.hv-btns .btn{min-height:42px;padding:0 20px;font-size:14.5px}

.gv-form{margin-top:20px}
.gv-row{display:flex;gap:8px}
.gv-row input[type=email]{flex:1;min-width:0;min-height:46px;padding:0 15px;
  border-radius:99px;border:1px solid rgba(76,81,45,.2);background:#fff;
  font-family:inherit;font-size:15px;color:#272820}
.gv-row button{min-height:46px;padding-inline:18px;border:0;border-radius:99px;
  cursor:pointer;font-family:inherit;font-size:14.5px;font-weight:700;
  background:#c6205b;color:#fff;white-space:nowrap;transition:background .2s}
.gv-row button:hover{background:#d93a72}
/* הנוסח נעול (גרסה 1 נשמרת אצל כל נרשמת), ולכן מצמצמים
   נפח ולא מילים. */
.gv-ok{display:flex;gap:7px;align-items:flex-start;margin-top:13px;
  text-align:start;font-size:11.5px;line-height:1.35;
  color:rgba(39,40,32,0.68);cursor:pointer}
.gv-ok input{margin-top:2px;flex:none;width:15px;height:15px;accent-color:#c6205b}

@media(max-width:860px){
  /* בלי תקרה התמונה תפסה כ-490 פיקסלים, ועם בלוק הטקסט
     מתחתיה כל רצועה יצאה 720. שתי רצועות זה 1440, כמעט
     שני מסכים על שני בלוקים. */
  .hv-art img{max-height:clamp(170px,34vw,230px);object-position:center 72%}
  .gv-art img{max-height:clamp(170px,34vw,230px);object-position:center 34%}
  .hv-in,.gv-in{position:static;transform:none;width:auto;left:auto;right:auto;
    padding:clamp(20px,5vw,28px) 22px clamp(24px,5.5vw,34px);
    margin:0 auto;max-width:500px}
  .hv-in::before{display:none}
  .hv-name,.gv-name{font-size:clamp(20px,5.6vw,26px)}
  .hv-line,.gv-line{margin-top:9px;font-size:14.5px}
  .hv-btns{margin-top:12px}
  .hv-btns .btn{min-height:44px}
  .hv{padding-bottom:0}
  .hv-name br{display:none}
  .hv-btns .btn{flex:1;min-width:130px}
  .gv-row{flex-direction:column}
  .gv-row button{width:100%}
  .gv-ok{justify-content:center}
}

/* אוויר בתוך הבלוק. קודם הכל היה צמוד וזה נקרא דחוס. */
.gv-in,.hv-in{padding-block:6px}
.gv-row{gap:10px}

/* ---- יעדי מגע בנייד ---- */
@media(max-width:860px){
  .nav-logo{display:inline-flex;align-items:center;min-height:44px}
  .nav-links a{min-height:44px;display:inline-flex;align-items:center}
  .foot-col a{display:block;padding-block:10px;line-height:1.25}
  .foot-col{gap:0}
  .foot-social a{display:grid;place-items:center;width:44px;height:44px;margin:-11px}
  .foot-social{gap:24px}
  .foot-bar a{display:inline-block;padding-block:10px}
  .world-go{padding-block:6px}
  /* הרצועות לא נמתחות מעבר למקור שלהן */
  .hv,.gv{max-width:100vw}
}
@media(min-width:861px){
  .hv-art img,.gv-art img{max-width:1788px;margin-inline:auto}
}

/* ---- הקו התחתון בקרדיט מיותר ---- */
.foot-bar .credit a{border-bottom:0}
.foot-bar .credit a:hover{border-bottom:0;color:var(--blush)}

/* ---- אוויר בין שורות ----
   העמוד היה דחוס: הכותרות, הפאנלים והרצועות נגעו זה בזה. */
.hero{padding-block:clamp(30px,4.6vw,62px)}
.hero-kick{margin-bottom:18px;line-height:1.5}
.hero-h{line-height:1.3}
.hero-h em{margin:8px 0 2px}
.hero-p{margin-top:18px;line-height:1.7}
.hero-btns{margin-top:26px}
.hero-worlds{margin-top:clamp(18px,2.4vw,30px)}
.world-txt{padding:clamp(16px,1.8vw,22px)}
.world-line{margin-top:7px;line-height:1.5}
.world-go{margin-top:11px}
@media(max-width:860px){
  .hero{padding-block:26px 30px}
  .hero-in{gap:26px}
  .hero-kick{margin-bottom:14px}
  .hero-p{margin-top:14px}
  .hero-btns{margin-top:20px}
}

/* ---- רצפת גודל טקסט, ומטרת מגע לתיבות הסימון ---- */
.world-kick{font-size:12px}
.world-line{font-size:12.5px}
.nl-ok span,.nl-fine{font-size:12.5px}
input[type="checkbox"]{width:20px;height:20px;flex:none;
  accent-color:var(--pink,#c6205b);cursor:pointer}
label:has(input[type="checkbox"]){align-items:center;gap:10px;min-height:44px}
.nl-ok,.nl-ok span,.gv-ok,.gv-ok span{font-size:12.5px;line-height:1.5}

/* ---- אין קו תחתון בקישורים ---- */
a,.credit a,.nl-fine a,.foot-bar a,.foot-bar .credit a,
.foot-col a,.hero-quiet,.band-more{
  text-decoration:none;
  border-bottom:0;
}
a:hover,.credit a:hover,.nl-fine a:hover,
.foot-bar a:hover{text-decoration:none;border-bottom:0}
.nav a,.site-nav a{border-bottom:revert}
.foot-col a{padding-block:5px}

/* תיבות האישור יצאו מהיישור של הטופס: התווית הייתה
   ממורכזת, ולכן הריבוע בלט ימינה מקצה השדה והכפתור. */
.nl-ok,.gv-ok{display:flex;align-items:flex-start;gap:10px;
  width:100%;margin-inline:auto;text-align:start}
.nl-ok span,.gv-ok span{flex:1;min-width:0}
.nl-ok input[type="checkbox"],.gv-ok input[type="checkbox"]{flex:none;margin-top:2px}
.nl-ok,.gv-ok{padding-inline:var(--fieldpad,16px)}
.nl-fine,.gv-fine{padding-inline:var(--fieldpad,16px)}

/* אוויר אחרי הכפתורים ברצועות, ובין הלוגו לאייקונים */
.hv-btns,.gv-btns{margin-bottom:clamp(20px,4vw,30px)}
.foot-brand,.foot-logo{margin-bottom:clamp(14px,3vw,20px)}
.foot-social{margin-top:clamp(14px,3vw,20px)}

/* ההירו היה 570 פיקסל גובה בדסקטופ. הכרטיסים מתקצרים
   והרצועה נושמת פחות, בלי לגעת בטיפוגרפיה. */
@media(min-width:761px){
  .hero{padding-block:clamp(28px,3.4vw,46px)}
  .world{height:auto}
  .world .w-1,.world .w-2{aspect-ratio:3/4;height:auto}
}
/* הכרטיסים נקבעו ביחס 3/4 בכלל קודם עם עוצמה גבוהה
   יותר. כאן הם מתקצרים באמת. */
@media(min-width:761px){
  .hero .world{aspect-ratio:auto;height:clamp(280px,32vw,340px)}
  .hero-cards,.hero .cards{align-items:start}
}

/* האיור החדש לרצועת גבעת אשל בנייד הוא רחב (2.03) ועם
   הפרחים רק למעלה, ולכן אין צורך לחתוך אותו כלפי מעלה. */
@media(max-width:700px){
  .gv-art img{max-height:none;object-position:center top;height:auto}
}

/* הכותרת בהירו: הריווח בין שתי השורות ובין הכותרת
   לשורה שמתחתיה היה נדיב מדי. */
.hero-kick{margin-bottom:10px}
.hero-h{line-height:1.1}
.hero-h em{margin:0 0 -6px}
.hero-p{margin-top:10px}
@media(max-width:760px){
  .hero-kick{margin-bottom:9px}
  .hero-p{margin-top:9px}
}

/* ==== רצועת גבעת אשל: הבלוק במרכז עמודת השמנת ====
   נמדד על האיור: הציור נגמר ב-59.5 אחוז, ולכן מרכז השמנת
   הוא 79.7 אחוז. הבלוק היה צמוד לקצה ונראה דחוק ימינה. */
@media(min-width:701px){
  /* בעברית inset-inline-start הוא הצד הימני הפיזי, ולכן
     כאן משתמשים במאפיינים פיזיים כדי שלא יתהפך.
     עמודת השמנת היא 59.5 עד 100 אחוז, ומרכזה 79.75. */
  .gv-in{inset-inline-start:auto;inset-inline-end:auto;
    right:0;left:auto;width:40.5%;
    padding-inline:clamp(12px,2vw,30px)}
}

/* ---- רצועת גבעת אשל בנייד: קצב אחיד ---- */
@media(max-width:700px){
  .gv-in{width:auto;padding-inline:clamp(18px,5vw,28px)}
  .gv-kick{margin:0}
  .gv-name{margin-top:8px}
  .gv-line{margin-top:8px}
  .gv form,.gv .gv-row{margin-top:16px}
  .gv-ok{margin-top:12px}
}

/* ---- רצועת גבעת אשל: שדה נמוך יותר, והבלוק יורד ---- */
@media(min-width:701px){
  .gv-in{top:calc(50% + 14px)}
  .gv .gv-row input[type=email],
  .gv input[type=email]{min-height:46px;height:46px;font-size:15.5px;
    padding:10px 16px}
  .gv .gv-row button,.gv .gv-row .btn{min-height:46px;font-size:15px}
  .gv-ok{margin-top:14px}
}

/* הרווח בין המשפט האחרון בהירו לשני הכרטיסים */
.hero-worlds{margin-top:clamp(16px,2.4vw,26px)!important}
@media(max-width:760px){
  .hero-worlds{margin-top:14px!important}
}
/* שדה האימייל ברצועה: לא על כל הרוחב */
@media(min-width:701px){
  .gv .gv-row{max-width:420px;margin-inline:auto}
  .gv .gv-row input[type=email]{flex:1 1 180px}
  .gv .gv-row button{flex:0 0 auto}
}

/* ── רווחי הפוטר היו גדולים מדי: gap של 9 ועוד ריפוד של 5
   לכל קישור נתנו 19 פיקסל בין שורה לשורה. ── */
.foot-col{gap:2px}
.foot-col a{padding-block:4px;line-height:1.35}
@media(max-width:760px){
  .foot-col{gap:0}
  .foot-col a{padding-block:7px}
}

/* ── הכותרת הקטנה נגעה בבוגנוויליה רק כשהרצועה נערמת בנייד.
   בדסקטופ השוליים האלה דחפו את כל הבלוק מתחת למרכז. ── */
@media(max-width:860px){ .gv-kick{margin-top:clamp(8px,1.4vw,16px)} }

/* ── ווידג׳ט הנגישות. הכללים ישבו רק ב-style.css, ולכן
   כל עמוד שעובר לשפה של שיפי איבד אותם. ── */
.acc-fab{position:fixed;left:16px;bottom:16px;z-index:80;width:52px;height:52px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;
  background:#2b6cb0;box-shadow:0 8px 22px rgba(0,0,0,.45);transition:transform .2s}
.acc-fab:hover{transform:scale(1.07)}
.acc-fab svg{width:27px;height:27px;fill:#fff}
.acc-restore{position:fixed;left:0;bottom:88px;z-index:80;width:15px;height:46px;border:none;padding:0;cursor:pointer;
  border-radius:0 11px 11px 0;background:#2b6cb0;opacity:.6;display:none}
.acc-restore:hover{opacity:1;width:22px}
.acc-panel{position:fixed;left:16px;bottom:78px;z-index:81;width:242px;max-height:calc(100vh - 120px);overflow-y:auto;
  background:#fbf7ef;border:1px solid #e6ddcb;border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.45);
  padding:12px;display:none;flex-direction:column;gap:7px;direction:rtl}
.acc-panel.open{display:flex}
.acc-panel .t{font-size:11px;letter-spacing:.14em;color:#9a6b3a;font-weight:700;padding:2px 4px}
.acc-panel button{background:#efe7d6;border:none;border-radius:10px;padding:11px;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;color:#241b16;text-align:right}
.acc-panel button:hover{background:#e6ddcb}
.acc-panel button[aria-pressed="true"]{background:var(--rose);color:#fff}
.acc-panel .acc-group{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}
.acc-panel .acc-group button{padding:10px 4px;text-align:center;font-size:13px}
.acc-panel .acc-reset{margin-top:2px;background:transparent;border:1.5px solid #c58aa2;color:#a8496f;text-align:center}
.acc-panel .acc-reset:hover{background:#a8496f;color:#fff}
.acc-panel button:focus-visible,.acc-fab:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* ── הרצועה המשפטית. עצמאית בעיצובה, כדי שתיראה נכון
   בכל שלוש השפות של האתר. ── */
.legal-bar{display:flex;flex-wrap:wrap;justify-content:center;
  gap:6px 20px;padding:22px 18px 26px;font-size:13px;line-height:1.6;
  border-top:1px solid currentColor;border-color:color-mix(in srgb,currentColor 14%,transparent);
  opacity:.72}
.legal-bar a{color:inherit;text-decoration:none;
  border-bottom:1px solid transparent;padding-block:4px;min-height:24px}
.legal-bar a:hover,.legal-bar a:focus-visible{border-bottom-color:currentColor}

/* ── יעד מגע: 24 פיקסל לפחות, כמו בדרישת WCAG 2.2. ── */
.legal-bar a,.ge-quiet,.foot-col a,.foot-bar a,.credit a,.prk-foot a{
  min-height:24px;display:inline-block;padding-block:3px}
.skip-link,.skip{background:#7a1338;color:#fff}

/* ── כפתור הנגישות בשפת שיפי. ── */
.acc-fab,#accBtn{background:var(--plum);color:var(--cream);
  box-shadow:0 8px 22px -10px rgba(53,37,54,.5)}
.acc-fab:hover,#accBtn:hover{background:var(--berry)}

/* ── הרווח בין הלוגו לאייקונים בפוטר היה גדול מדי. ── */
.foot-brand{gap:14px}
.foot-social{margin-top:2px}

/* ── רצועת גבעת אשל: הטופס הוחלף בקישור, כי הספר נמכר.
   הכפתור יורש .btn שהוא לבן, ועל קרם הוא נעלם. כאן הוא
   מקבל את אותו מראה שהיה לכפתור הטופס: בוגנוויליה מלא. ── */
.gv-btns{display:flex;justify-content:center;margin-top:clamp(16px,2.2vw,22px)}
.gv-btns .btn{min-height:50px;display:inline-flex;align-items:center;
  justify-content:center;padding-inline:34px;border-radius:99px;border:0;
  background:var(--berry);color:#fff;font-weight:800;font-size:16px;
  box-shadow:0 10px 24px -12px rgba(183,53,99,.65)}
.gv-btns .btn:hover{background:#d93a72;color:#fff}

/* ── העמוד הנוכחי ברצועה המשפטית: טקסט, לא קישור. ── */
.legal-bar [aria-current="page"]{font-weight:700;opacity:.55;
  padding-block:4px;display:inline-block;min-height:24px}

/* ── שוליים תחתונים על הכפתור הותירו 36 פיקסל ריקים בתחתית
   המיכל ורק 6 בראשו, כך שהמיכל היה ממורכז אבל מה שרואים
   ישב גבוה. השוליים נדרשים רק כשהרצועה נערמת בנייד. ── */
@media(min-width:861px){
  .hv-btns,.gv-btns{margin-bottom:0}
}

/* ── top:50% נמדד פעם אחת, לפני שהאיור סיים להיטען, ונשאר
   תקוע על גובה שכבר לא קיים. שוליים אוטומטיים בין שני
   קצוות מחשבים את עצמם מחדש בכל שינוי גובה. ── */
@media(min-width:861px){
  .hv-in,.gv-in{top:0;bottom:0;transform:none;
    height:fit-content;margin-block:auto}
}