/* ============================================================
   סייברנט ישראל — דף הורים · מיינקראפט יזמות ובינה מלאכותית
   שפה עיצובית: Voxel-Futurism — הקובייה היא היחידה.
   דף סטטי יחיד → קובץ CSS יחיד (ponytail). מחולק לסקשנים למטה.
   ============================================================ */

/* ---------- 1. פונטים (self-hosted) ---------- */
@font-face{font-family:Rubik;src:url(assets/fonts/rubik-400.woff2)format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Rubik;src:url(assets/fonts/rubik-500.woff2)format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Rubik;src:url(assets/fonts/rubik-700.woff2)format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Assistant;src:url(assets/fonts/assistant-400.woff2)format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Assistant;src:url(assets/fonts/assistant-600.woff2)format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Assistant;src:url(assets/fonts/assistant-700.woff2)format("woff2");font-weight:700;font-display:swap}

/* ---------- 2. טוקנים ---------- */
:root{
  /* משטחים כהים — כל אחד עם foreground מזווג (כלל #3) */
  --deep:#030712;        --deep-fg:#F3F4F6;
  --card-dark:#0B132B;   --card-dark-fg:#E8EDF5;
  --deep-soft:#0A1122;   --deep-soft-fg:#F3F4F6;

  /* משטחים בהירים */
  --paper:#F4F7FA;       --paper-fg:#0B132B;
  --surface:#FFFFFF;     --surface-fg:#0B132B;
  --paper-2:#E9EFF6;     --paper-2-fg:#0B132B;

  /* אקסנטים */
  --neon:#00F0FF;             /* רק על כהה */
  --neon-dim:#7FF7FF;
  --teal:#06687A;             /* גרסת הנאון לרקע בהיר — 5.97:1 על --paper */
  --teal-fg:#FFFFFF;          /* 6.4:1 */
  --teal-deep:#04505E;
  --violet:#8B5CF6;
  --violet-ink:#5B21B6;       /* על בהיר */
  --green:#10B981;
  --green-ink:#046C4E;        /* על בהיר */
  --amber-ink:#8A5A00;
  --wa:#075E54;          --wa-fg:#FFFFFF;   /* 7.67:1 */

  /* טקסט משני */
  --muted:#4A5A70;            /* על --paper ≈ 7:1 */
  --muted-dark:#9FB2C9;       /* על --deep ≈ 8:1 */
  --line:#D3DEEA;
  --line-dark:#1E2A45;

  /* מערכת */
  --block:4px;                /* פינות — כמעט ריבוע, וקסל */
  --shadow-block:6px;         /* היסט הצל הקשיח = פאת הקובייה */
  --wrap:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- 3. איפוס ובסיס ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--paper);color:var(--paper-fg);
  font-family:Assistant,system-ui,sans-serif;
  font-size:clamp(1.0625rem,.98rem + .35vw,1.1875rem);
  line-height:1.75;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{font-family:Rubik,system-ui,sans-serif;font-weight:700;line-height:1.15;text-wrap:balance}
h1{font-size:clamp(2.1rem,1.35rem + 3.3vw,4.05rem);letter-spacing:-.02em}
h2{font-size:clamp(1.75rem,1.25rem + 2.1vw,2.9rem);letter-spacing:-.015em}
h3{font-size:clamp(1.2rem,1.08rem + .5vw,1.45rem)}
p{text-wrap:pretty}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--neon);outline-offset:3px;border-radius:var(--block)}
.dark-band :focus-visible{outline-color:var(--neon)}
.light-band :focus-visible{outline-color:var(--teal)}

.wrap{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto}
@media(max-width:560px){.wrap{width:calc(100% - 2rem)}}

.dark-band{background:var(--deep);color:var(--deep-fg)}
.light-band{background:var(--paper);color:var(--paper-fg)}
section{padding-block:clamp(3.5rem,2rem + 6vw,6.5rem)}

/* ---------- 4. אלמנטים חוזרים ---------- */

/* תגית סקשן */
.eyebrow{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:Rubik;font-weight:500;font-size:.8rem;letter-spacing:.14em;
  padding:.4rem .85rem;border-radius:var(--block);
  background:var(--paper-2);color:var(--teal-deep);
  border:1px solid var(--line);
}
.dark-band .eyebrow{background:#0E1A33;color:var(--neon);border-color:var(--line-dark)}
.eyebrow::before{content:"";width:9px;height:9px;background:currentColor;flex:none}

/* כפתורים — מגע ≥44px, padding לפי הטבלה */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:52px;padding:.85rem 1.7rem;
  font-family:Rubik;font-weight:500;font-size:1.02rem;
  border-radius:var(--block);border:2px solid transparent;
  text-decoration:none;cursor:pointer;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s;
}
.btn svg{width:22px;height:22px;flex:none}
.btn-wa{background:var(--wa);color:var(--wa-fg);box-shadow:var(--shadow-block) var(--shadow-block) 0 #022B27}
.btn-wa:hover{transform:translate(3px,-3px);box-shadow:9px 9px 0 #022B27}
.btn-primary{background:var(--teal);color:var(--teal-fg);box-shadow:var(--shadow-block) var(--shadow-block) 0 var(--teal-deep)}
.btn-primary:hover{transform:translate(3px,-3px);box-shadow:9px 9px 0 var(--teal-deep)}
.btn-ghost{background:transparent;color:var(--deep-fg);border-color:#31415F}
.btn-ghost:hover{border-color:var(--neon);color:var(--neon);background:#0A1526}
.btn-ghost-light{background:var(--surface);color:var(--teal-deep);border-color:var(--line)}
.btn-ghost-light:hover{border-color:var(--teal);background:var(--paper-2)}
/* היסט הצל מתהפך ב-RTL כדי ש"פאת הקובייה" תיפול תמיד לצד ההגיוני */
[dir=rtl] .btn-wa,[dir=rtl] .btn-primary{box-shadow:calc(var(--shadow-block) * -1) var(--shadow-block) 0 var(--_sh,#022B27)}
[dir=rtl] .btn-primary{--_sh:var(--teal-deep)}
[dir=rtl] .btn-wa:hover{transform:translate(-3px,-3px);box-shadow:-9px 9px 0 #022B27}
[dir=rtl] .btn-primary:hover{transform:translate(-3px,-3px);box-shadow:-9px 9px 0 var(--teal-deep)}
@media(prefers-reduced-motion:reduce){.btn:hover{transform:none}}

/* כרטיס-בלוק — הצל הקשיח = הפאה הצדדית של הקובייה */
.blockcard{
  background:var(--surface);color:var(--surface-fg);
  border:2px solid var(--line);border-radius:var(--block);
  padding:1.6rem;
  box-shadow:-5px 5px 0 var(--paper-2);
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s;
}
.blockcard:hover{transform:translate(2px,-3px);box-shadow:-8px 8px 0 #D9E4F0;border-color:#B9CBDF}
@media(prefers-reduced-motion:reduce){.blockcard:hover{transform:none}}

/* אייקון-קובייה */
.cube{
  width:52px;height:52px;flex:none;display:grid;place-items:center;
  border-radius:var(--block);background:var(--paper-2);color:var(--teal-deep);
  border:2px solid var(--line);
}
.cube svg{width:26px;height:26px}
.dark-band .cube{background:#101D38;border-color:var(--line-dark);color:var(--neon)}

/* צ'יפ */
.chip{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.45rem .95rem;border-radius:var(--block);
  background:var(--surface);border:1px solid var(--line);color:var(--paper-fg);
  font-size:.95rem;font-weight:600;
}
.dark-band .chip{background:#0E1A33;border-color:var(--line-dark);color:var(--deep-fg)}

/* קצה-בלוקים בין רצועה כהה לבהירה — שן אחת דקה, רמז לוקסל ולא דגל מרוץ */
.edge{height:12px;position:relative;overflow:hidden;background:var(--paper)}
.edge::before{
  content:"";position:absolute;inset-inline:0;top:0;height:12px;display:block;
  background:repeating-linear-gradient(to right,var(--deep) 0 18px,transparent 18px 36px);
}
.edge-up{background:var(--deep)}
.edge-up::before{background:repeating-linear-gradient(to right,var(--paper) 0 18px,transparent 18px 36px)}

/* ---------- 5. כותרת עליונה ---------- */
.topbar{
  position:sticky;top:0;z-index:60;
  background:rgba(3,7,18,.86);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line-dark);color:var(--deep-fg);
}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.7rem}
.topbar__brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;min-height:44px}
.topbar__brand img{width:38px;height:auto}
.topbar__brand b{font-family:Rubik;font-size:1.02rem;font-weight:700;letter-spacing:-.01em}
.topbar__brand span{display:block;font-size:.72rem;color:var(--muted-dark);font-weight:400;line-height:1.3}
.topbar .btn{min-height:44px;padding:.5rem 1.1rem;font-size:.94rem;box-shadow:none!important;transform:none!important}
@media(max-width:600px){.topbar__brand span{display:none}.topbar .btn span{display:none}.topbar .btn{padding:.5rem .8rem}}

/* ---------- 6. Hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--deep);color:var(--deep-fg);padding-block:clamp(3rem,1.5rem + 7vw,6rem) clamp(3.5rem,2rem + 6vw,6rem)}
/* רצפת וקסל נסוגה */
.hero__floor{
  position:absolute;inset-inline:-30%;bottom:-10%;height:62%;
  background-image:linear-gradient(rgba(0,240,255,.28) 2px,transparent 2px),linear-gradient(90deg,rgba(0,240,255,.28) 2px,transparent 2px);
  background-size:64px 64px;
  transform:perspective(520px) rotateX(72deg);
  transform-origin:bottom center;
  mask-image:linear-gradient(to top,#000 5%,transparent 78%);
  pointer-events:none;
}
.hero__glow{
  position:absolute;width:min(60rem,105vw);aspect-ratio:1;
  inset-inline-start:-18rem;top:-24rem;
  background:radial-gradient(circle,rgba(0,240,255,.17),transparent 62%);
  pointer-events:none;
}
.hero__glow--v{inset-inline-start:auto;inset-inline-end:-22rem;top:auto;bottom:-26rem;background:radial-gradient(circle,rgba(139,92,246,.19),transparent 62%)}
.hero__in{position:relative;z-index:2;display:grid;gap:clamp(2rem,1rem + 4vw,3.5rem);align-items:center}
@media(min-width:940px){.hero__in{grid-template-columns:1.08fr .92fr}}
.hero h1{margin-block:1.1rem .9rem}
.hero h1 em{font-style:normal;color:var(--neon);text-shadow:0 0 26px rgba(0,240,255,.42)}
.hero__lead{font-size:clamp(1.08rem,1rem + .4vw,1.3rem);color:#CBD7E8;max-width:36ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-block-start:1.9rem}
/* במובייל: כפתורים ברוחב מלא — קצה ישר במקום מדרגות */
@media(max-width:620px){
  .hero__cta{flex-direction:column;align-items:stretch}
  .hero__tag{inset-inline-start:0;font-size:.8rem;padding:.5rem .8rem}
}
.hero__meta{display:flex;flex-wrap:wrap;gap:.6rem;margin-block-start:1.6rem}

/* מסגרת התמונה — קופסת וקסל */
.hero__art{position:relative}
.hero__frame{
  position:relative;border:2px solid #2A3B5C;border-radius:var(--block);
  background:var(--card-dark);padding:.55rem;
  box-shadow:-14px 14px 0 rgba(0,240,255,.13),0 30px 70px rgba(0,0,0,.55);
}
.hero__frame img{border-radius:2px;width:100%}
.hero__tag{
  position:absolute;inset-inline-start:-.7rem;bottom:-1.1rem;max-width:calc(100% - .5rem);
  background:var(--neon);color:#03212B;
  font-family:Rubik;font-weight:700;font-size:.88rem;
  padding:.55rem 1rem;border-radius:var(--block);
  box-shadow:0 8px 26px rgba(0,240,255,.34);
}

/* ---------- 7. רצועת אמון ---------- */
.trust{background:var(--card-dark);color:var(--card-dark-fg);padding-block:1.6rem;border-block:1px solid var(--line-dark)}
.trust__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.75rem 2rem;text-align:center}
.trust__item{display:flex;align-items:center;gap:.6rem;font-size:.98rem;color:#C6D3E6}
.trust__item svg{width:20px;height:20px;color:var(--neon);flex:none}
.trust__item b{color:#fff;font-weight:600}

/* ---------- 8. כותרות סקשן ---------- */
.head{max-width:62ch;display:flex;flex-direction:column;gap:1rem;margin-block-end:clamp(2rem,1.2rem + 2.5vw,3.2rem)}
.head p{color:var(--muted);font-size:1.08rem}
.dark-band .head p{color:var(--muted-dark)}
.head--center{margin-inline:auto;text-align:center;align-items:center}

/* ---------- 9. רשתות ---------- */
.grid{display:grid;gap:1.25rem}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))}

/* כרטיס "מה קורה במפגש" */
.step{display:flex;flex-direction:column;gap:.95rem;position:relative}
/* מספר-רפאים דקורטיבי בלבד (aria-hidden) — הכותרת נושאת את המשמעות.
   פטור מ-WCAG 1.4.3 כטקסט אינצידנטלי; מוחזק בכוונה חלש כדי לא להתחרות ב-h3. */
.step__n{
  position:absolute;top:1rem;inset-inline-end:1.2rem;
  font-family:Rubik;font-weight:700;font-size:2.6rem;line-height:1;
  color:#DCE6F2;letter-spacing:-.04em;user-select:none;
}
.step h3{position:relative}
.step p{color:var(--muted);font-size:1rem}

/* מדיה + טקסט */
.split{display:grid;gap:clamp(1.75rem,1rem + 3vw,3rem);align-items:center}
@media(min-width:900px){.split{grid-template-columns:1fr 1fr}.split--art-first>*:first-child{order:2}}
.shot{border:2px solid var(--line);border-radius:var(--block);padding:.5rem;background:var(--surface);box-shadow:-10px 10px 0 var(--paper-2)}
.shot img{border-radius:2px}
.dark-band .shot{background:var(--card-dark);border-color:#2A3B5C;box-shadow:-10px 10px 0 rgba(0,240,255,.12)}

/* רשימת ✓ */
.ticks{display:flex;flex-direction:column;gap:.85rem;list-style:none;padding:0}
.ticks li{display:flex;gap:.75rem;align-items:flex-start}
.ticks svg{width:22px;height:22px;flex:none;color:var(--green-ink);margin-top:.28rem}
.dark-band .ticks svg{color:var(--green)}
.ticks b{font-weight:700}
.ticks span{color:var(--muted)}
.dark-band .ticks span{color:var(--muted-dark)}

/* ---------- 10. קבוצות גיל ---------- */
.ages{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))}
.age{display:flex;align-items:center;gap:1.1rem;padding:1.5rem}
.age__badge{
  width:74px;height:74px;flex:none;display:grid;place-items:center;
  font-family:Rubik;font-weight:700;font-size:1.35rem;
  border-radius:var(--block);background:var(--teal);color:var(--teal-fg);
  box-shadow:-5px 5px 0 var(--teal-deep);
}
.age--b .age__badge{background:var(--violet-ink);box-shadow:-5px 5px 0 #3B1177}
.age h3{margin-bottom:.2rem}
.age p{color:var(--muted);font-size:.98rem;line-height:1.6}

/* ---------- 11. הערכה (כרטיס פרימיום כהה) ---------- */
.kit{position:relative;overflow:hidden;background:var(--deep);color:var(--deep-fg)}
.kit__glow{position:absolute;width:44rem;aspect-ratio:1;top:-16rem;inset-inline-end:-14rem;background:radial-gradient(circle,rgba(139,92,246,.2),transparent 62%);pointer-events:none}
.kit__in{position:relative;z-index:2}
.kit__box{
  background:linear-gradient(150deg,#0D1730,#0B132B 55%,#0A1B2E);
  border:2px solid #2A3B5C;border-radius:var(--block);
  padding:clamp(1.5rem,1rem + 2.5vw,2.75rem);
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.kit__items{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,17.5rem),1fr));margin-block:1.75rem}
@media(min-width:1000px){.kit__items{grid-template-columns:repeat(3,1fr)}}
.kit__item{
  display:flex;gap:.9rem;align-items:flex-start;
  background:rgba(255,255,255,.035);border:1px solid var(--line-dark);
  border-radius:var(--block);padding:1.05rem;
}
.kit__item h4{font-size:1.02rem;margin-bottom:.15rem}
.kit__item p{font-size:.93rem;color:var(--muted-dark);line-height:1.55}
.kit__item .cube{width:44px;height:44px}
.kit__item .cube svg{width:22px;height:22px}
.kit__price{
  display:flex;flex-wrap:wrap;align-items:center;gap:1rem;
  border-top:1px solid var(--line-dark);padding-top:1.5rem;margin-top:.5rem;
}
.kit__price div{flex:1 1 18rem}
.kit__price strong{display:block;font-family:Rubik;font-size:1.15rem;color:var(--neon)}
.kit__price p{font-size:.96rem;color:var(--muted-dark);margin-top:.2rem}

/* ---------- 12. FAQ ---------- */
.faq{display:flex;flex-direction:column;gap:.85rem;max-width:52rem;margin-inline:auto}
.faq details{
  background:var(--surface);border:2px solid var(--line);border-radius:var(--block);
  box-shadow:-4px 4px 0 var(--paper-2);overflow:hidden;
}
.faq details[open]{border-color:var(--teal)}
.faq summary{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.05rem 1.3rem;min-height:56px;cursor:pointer;list-style:none;
  font-family:Rubik;font-weight:500;font-size:1.06rem;
}
.faq summary::-webkit-details-marker{display:none}
/* צ'ברון מטה = פתח. פיזי בכוונה — כיוון החץ אינו תלוי בכיוון הכתיבה. */
.faq summary::after{
  content:"";flex:none;width:13px;height:13px;
  border-right:3px solid var(--teal);border-bottom:3px solid var(--teal);
  transform:rotate(45deg);margin-block-end:6px;transition:transform .22s var(--ease);
}
.faq details[open] summary::after{transform:rotate(225deg);margin-block:6px 0 0}
.faq summary:hover{background:var(--paper)}
.faq__a{padding:0 1.3rem 1.3rem;color:var(--muted);font-size:1.02rem}
.faq__a p+p{margin-top:.7rem}

/* ---------- 13. CTA סופי + פוטר ---------- */
.final{position:relative;overflow:hidden;background:var(--deep);color:var(--deep-fg);text-align:center}
.final__glow{position:absolute;width:52rem;aspect-ratio:1;top:-20rem;inset-inline-start:50%;translate:-50% 0;background:radial-gradient(circle,rgba(0,240,255,.16),transparent 62%);pointer-events:none}
.final__in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.3rem}
.final h2 em{font-style:normal;color:var(--neon)}
.final p{color:#C6D3E6;max-width:48ch}
.final__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;margin-top:.6rem}
.final__contact{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.75rem;margin-top:1.2rem;font-size:1rem}
.final__contact a{display:inline-flex;align-items:center;gap:.5rem;color:#CBD7E8;text-decoration:none;min-height:44px}
.final__contact a:hover{color:var(--neon)}
.final__contact svg{width:19px;height:19px}

.foot{background:#020509;color:#8A9BB4;padding-block:1.75rem;border-top:1px solid var(--line-dark);font-size:.9rem}
.foot__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem}
.foot a{color:#B9C8DC}

/* ---------- 14. וואטסאפ צף ---------- */
.fab{
  position:fixed;inset-inline-start:1.1rem;bottom:1.1rem;z-index:70;
  display:inline-flex;align-items:center;gap:.6rem;
  min-height:56px;padding:.9rem 1.3rem;
  background:var(--wa);color:var(--wa-fg);text-decoration:none;
  font-family:Rubik;font-weight:500;
  border-radius:var(--block);
  box-shadow:0 10px 30px rgba(0,0,0,.4);
  transition:transform .18s var(--ease);
}
.fab:hover{transform:translateY(-3px)}
.fab svg{width:26px;height:26px;flex:none}
@media(max-width:640px){.fab span{display:none}.fab{padding:1rem;border-radius:var(--block)}}
@media(prefers-reduced-motion:reduce){.fab:hover{transform:none}}

/* ---------- 15. חשיפה בגלילה ---------- */
.rev{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.rev.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rev{opacity:1;transform:none;transition:none}}

/* ---------- 16. הדפסה ---------- */
@media print{
  .topbar,.fab,.hero__floor,.hero__glow,.kit__glow,.final__glow,.edge{display:none}
  body,.dark-band,.hero,.kit,.final,.trust{background:#fff!important;color:#000!important}
  .rev{opacity:1;transform:none}
  .blockcard,.kit__box,.faq details{box-shadow:none;border-color:#999}
  .faq details{break-inside:avoid}
  .faq__a{display:block!important}
}
