/* =========================================================
   CK Digital 360, שכבת הנושא (נטענת אחרונה).
   1. משתני צבע לשני המצבים: כהה (ברירת מחדל) ובהיר (html[data-theme="light"])
   2. "אי כהה": רכיב שנשאר כהה בשני המצבים (הדר, פוטר, אריח מדיה)
   3. הדר חדש: תפריט שירותים עם תמונה לכל שירות, קישור למרכז המדריכים, מתג מצב
   4. פוטר, סרגל מובייל וכפתור צף
   5. התאמות של הרכיבים הישנים למצב הבהיר
   כלל: CSS חדש משתמש רק במשתנים. אין צבע קשיח מחוץ לקובץ הזה.
   ========================================================= */

/* ---------- 1. משתנים ---------- */
:root{
  --bg:#000000;--bg-2:#0b0b0c;
  --tile:#1d1d1f;--tile-2:#161617;--tile-3:#2a2a2c;
  --text:#f5f5f7;--text-2:#a1a1a6;--grey:#86868b;
  --fg-rgb:245,245,247;--bg-rgb:0,0,0;
  --hair:rgba(245,245,247,.12);--hair-2:rgba(245,245,247,.2);
  --pink:#E7357A;--pink-ink:#F0508F;--pink-fill:#D62B6E;
  --star:#FEC15C;
  --media:#0b0b0c;--on-media:#f5f5f7;--on-media-2:rgba(245,245,247,.72);
  --shadow:0 40px 90px -40px rgba(0,0,0,.9);
  --shadow-s:0 18px 40px -20px rgba(0,0,0,.7);
  --r-s:14px;--r-m:20px;--r-l:28px;--r-xl:36px;
  --sec:clamp(88px,13vh,170px);
  --max:1360px;
  /* שמות ישנים, ממופים לחדשים */
  --black:var(--bg);--ink:var(--bg-2);--ink-2:var(--bg-2);--white:var(--text);
  --line:var(--hair);--line-soft:rgba(var(--fg-rgb),.08);--surface:var(--tile);
  --font:"Rubik",-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Hebrew","Heebo",system-ui,"Segoe UI",Arial,sans-serif;
  color-scheme:dark;
}
html[data-theme="light"]{
  --bg:#ffffff;--bg-2:#f5f5f7;
  --tile:#f0f0f3;--tile-2:#e9e9ee;--tile-3:#dedee4;
  --text:#1d1d1f;--text-2:#48484d;--grey:#66666b;
  --fg-rgb:29,29,31;--bg-rgb:255,255,255;
  --hair:rgba(29,29,31,.12);--hair-2:rgba(29,29,31,.22);
  --pink-ink:#C2185B;
  --shadow:0 40px 80px -46px rgba(29,29,31,.38);
  --shadow-s:0 16px 36px -22px rgba(29,29,31,.3);
  color-scheme:light;
}
/* ---------- 2. אי כהה ---------- */
.on-dark,.hd,.mm,.ft,.mbar,.fab{
  --bg:#000000;--bg-2:#0b0b0c;
  --tile:#1d1d1f;--tile-2:#161617;--tile-3:#2a2a2c;
  --text:#f5f5f7;--text-2:#a1a1a6;--grey:#86868b;
  --fg-rgb:245,245,247;--bg-rgb:0,0,0;
  --hair:rgba(245,245,247,.12);--hair-2:rgba(245,245,247,.2);
  --pink-ink:#F0508F;
  --black:var(--bg);--ink:var(--bg-2);--ink-2:var(--bg-2);--white:var(--text);--line:var(--hair);
  color:var(--text);
}
html{background:var(--bg)}
body{background:var(--bg);color:var(--text);transition:background-color .5s var(--ease),color .5s var(--ease)}
/* כותרת לא נשברת עם מילה יתומה בשורה האחרונה */
.h1,.h2,.h3,.h1 span,.h2 span,.hero__h1{text-wrap:balance}
.lead{text-wrap:pretty}
.go{color:var(--pink-ink)}
.tag b{color:var(--pink-ink)}
:focus-visible{outline:2px solid var(--text);outline-offset:4px}
.skip{background:var(--text);color:var(--bg)}

/* כפתורים, בשני המצבים */
.btn--wa{background:var(--text);color:var(--bg)}
.btn--wa .btn__ic{background:rgba(var(--bg-rgb),.16)}
.btn--pink{background:var(--pink-fill);color:#fff}
.btn--ghost{color:var(--text);box-shadow:inset 0 0 0 1px var(--hair-2)}
.btn--ghost .btn__ic{background:rgba(var(--fg-rgb),.1)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1px var(--text)}

/* ---------- 3. הדר ---------- */
.hd{position:fixed;inset-block-start:14px;inset-inline:0;margin-inline:auto;z-index:50;width:min(1280px,100% - 28px);font-size:15px}
.hd__bar{position:relative;z-index:2;height:60px;display:flex;align-items:center;gap:14px;padding-inline:22px 8px;border-radius:999px;
  background:rgba(22,22,23,.8);-webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px);box-shadow:inset 0 0 0 1px var(--hair)}
html[data-theme="light"] .hd__bar{background:rgba(22,22,23,.92)}
.hd__logo{flex:none;display:block;width:128px}
.hd__logo img{width:100%;height:auto;mix-blend-mode:normal}
.hd__nav{display:flex;align-items:center;gap:2px;margin-inline:auto}
.hd__nav>a,.hd__drop-t{position:relative;display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:999px;font-weight:400;color:rgba(245,245,247,.82);letter-spacing:-.005em;white-space:nowrap;transition:color .3s var(--ease),background-color .3s var(--ease)}
.hd__nav>a:hover,.hd__drop-t:hover,.hd[data-open="services"] .hd__drop-t{color:#fff;background:rgba(245,245,247,.08)}
.hd__nav [aria-current="page"],.hd__drop[aria-current="page"] .hd__drop-t{color:#fff;font-weight:600}
.hd__drop-t i{width:6px;height:6px;border-inline-end:1.5px solid currentColor;border-block-end:1.5px solid currentColor;rotate:45deg;translate:0 -2px;transition:rotate .4s var(--ease),translate .4s var(--ease)}
.hd[data-open="services"] .hd__drop-t i{rotate:225deg;translate:0 2px}
/* הקישור למרכז המדריכים: בולט, אבל שקט */
.hd__nav>a.hd__ai{margin-inline-start:6px;padding-inline:14px 6px;gap:9px;color:#fff;box-shadow:inset 0 0 0 1px var(--hair-2)}
.hd__nav>a.hd__ai:hover,.hd[data-open="ai"] .hd__ai{background:rgba(245,245,247,.1);box-shadow:inset 0 0 0 1px rgba(245,245,247,.4)}
.hd__ai svg{width:15px;height:15px;color:var(--pink-ink)}
.hd__ai em{font-style:normal;font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--pink-fill);color:#fff;line-height:1.4}
.hd__tools{display:flex;align-items:center;gap:8px;flex:none}
.hd__ic{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:inset 0 0 0 1px var(--hair-2);transition:background-color .3s var(--ease)}
.hd__ic:hover{background:rgba(245,245,247,.1)}
.hd__ic svg{width:18px;height:18px}
.hd__theme .i-sun{display:none}
html[data-theme="light"] .hd__theme .i-sun{display:block}
html[data-theme="light"] .hd__theme .i-moon{display:none}
.hd .btn{min-height:44px;font-size:15px;padding-inline:18px 5px;gap:10px}
.hd .btn__ic{width:34px;height:34px}
.hd__burger{display:none;position:relative}
.hd__burger i{position:absolute;inset-inline:13px;height:1.5px;background:currentColor;border-radius:2px;transition:transform .5s var(--ease)}
.hd__burger i:nth-child(1){inset-block-start:17px}
.hd__burger i:nth-child(2){inset-block-start:24px}
.hd--menu .hd__burger i:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.hd--menu .hd__burger i:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}

/* הפאנל שנפתח מתחת להדר */
.mg{position:absolute;inset-inline:0;inset-block-start:100%;padding-block-start:10px;opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);transform-origin:50% 0;transition:opacity .35s var(--ease),transform .45s var(--ease),visibility 0s .35s;pointer-events:none}
.hd[data-open] .mg{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .35s var(--ease),transform .45s var(--ease)}
.mg__in{border-radius:var(--r-l);padding:14px;background:rgba(18,18,19,.98);-webkit-backdrop-filter:saturate(180%) blur(26px);backdrop-filter:saturate(180%) blur(26px);box-shadow:inset 0 0 0 1px var(--hair),0 40px 90px -30px rgba(0,0,0,.7)}
.mg__p{display:none}
.hd[data-open="services"] .mg__p--services,.hd[data-open="ai"] .mg__p--ai{display:grid}
.mg__p--services{grid-template-columns:minmax(0,1fr) 400px;gap:14px}
.mg__list{display:grid;grid-template-columns:1fr 1fr;gap:2px;align-content:start}
.mg__i{position:relative;display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;column-gap:14px;padding:9px 12px;border-radius:var(--r-s);transition:background-color .3s var(--ease)}
.mg__i:hover,.mg__i:focus-visible,.mg__i.on{background:rgba(245,245,247,.07)}
.mg__t{width:54px;height:54px;border-radius:12px;overflow:hidden;background:var(--tile)}
.mg__t img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.mg__i:hover .mg__t img,.mg__i.on .mg__t img{transform:scale(1.08)}
.mg__i b{display:block;font-weight:600;font-size:16px;letter-spacing:-.01em;color:#fff}
.mg__i small{display:block;font-size:13.5px;line-height:1.35;color:var(--grey);margin-block-start:1px}
.mg__i--all{grid-template-columns:minmax(0,1fr);box-shadow:inset 0 0 0 1px var(--hair)}
.mg__i--all b{color:var(--pink-ink)}
.mg__i--shop b{color:#95BF47}
.mg__i--el b{color:#F0447D}
.mg__i--ac b{color:#38D5F1}
.mg__i--code b{color:#A78BFA}
.mg__stage{position:relative;border-radius:var(--r-m);overflow:hidden;background:var(--media);aspect-ratio:16/12;align-self:start;isolation:isolate}
.mg__stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;opacity:0;transform:scale(1.04);transition:opacity .5s var(--ease),transform 1.2s var(--ease)}
.mg__stage img.on{opacity:1;transform:none}
.mg__stage::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.82) 100%);z-index:1}
.mg__cap{position:absolute;inset-inline:18px;inset-block-end:16px;z-index:2}
.mg__cap b{display:block;font-size:20px;font-weight:700;letter-spacing:-.02em;color:#fff}
.mg__cap span{display:block;font-size:14.5px;line-height:1.4;color:rgba(245,245,247,.8);margin-block-start:3px}
/* פאנל המדריכים */
.mg__p--ai{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:14px;align-items:stretch}
.mg__shot{position:relative;border-radius:var(--r-m);overflow:hidden;background:var(--media);min-height:300px}
.mg__shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.mg__ai{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:14px;padding:18px 22px}
.mg__ai h3{font-size:clamp(24px,2.2vw,32px);font-weight:700;letter-spacing:-.025em;line-height:1.1}
.mg__ai p{font-size:16px;line-height:1.5;color:var(--text-2);max-width:40ch}
.mg__stats{display:flex;flex-wrap:wrap;gap:8px}
.mg__stats li{display:inline-flex;align-items:baseline;gap:6px;padding:7px 14px;border-radius:999px;background:rgba(245,245,247,.07);font-size:14px;color:var(--text-2)}
.mg__stats b{color:#fff;font-weight:600}

/* תפריט מובייל */
.mm{position:fixed;inset:0;z-index:49;background:rgba(0,0,0,.96);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);overflow-y:auto;overscroll-behavior:contain;padding:96px 18px 120px;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility 0s .4s}
.mm--open{opacity:1;visibility:visible;transition:opacity .4s var(--ease)}
.mm__main{display:grid;gap:2px}
.mm__main a{display:flex;align-items:center;justify-content:space-between;padding:12px 4px;font-size:28px;font-weight:700;letter-spacing:-.025em;border-block-end:1px solid var(--hair)}
.mm__h{margin-block:30px 12px;font-size:14px;font-weight:600;color:var(--grey)}
.mm__svc{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mm__svc a{position:relative;display:block;aspect-ratio:1/1;border-radius:var(--r-m);overflow:hidden;background:var(--tile)}
.mm__svc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mm__svc a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.85) 100%)}
.mm__svc b{position:absolute;z-index:1;inset-inline:14px;inset-block-end:12px;font-size:16px;font-weight:600;line-height:1.2}
.mm__ai{display:grid;gap:6px;margin-block-start:14px;padding:20px;border-radius:var(--r-m);background:var(--tile)}
.mm__ai b{font-size:20px;font-weight:700;letter-spacing:-.02em}
.mm__ai span{font-size:15px;color:var(--text-2);line-height:1.45}
.mm__ai em{font-style:normal;color:var(--pink-ink);font-weight:500;margin-block-start:4px}
.mm__row{display:flex;gap:10px;margin-block-start:14px}
.mm__row button{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--hair-2);font-size:16px}
.mm__row svg{width:18px;height:18px}
.mm .i-sun{display:none}
html[data-theme="light"] .mm .i-sun{display:block}
html[data-theme="light"] .mm .i-moon{display:none}

@media (max-width:1180px){
  .hd__nav>a[data-k="contact"]{display:none}
}
@media (max-width:1060px){
  .hd__nav{display:none}
  .hd__bar{padding-inline:18px 8px}
  .hd__tools{margin-inline-start:auto}
  .hd__burger{display:grid}
  .mg{display:none}
  .hd .btn--wa span:first-child{display:none}
  .hd .btn--wa{padding-inline:5px}
}
@media (max-width:760px){
  .hd .hd__wa{display:none}
  .hd__theme{display:none}
  .hd__logo{width:118px}
}

/* ---------- 4. פוטר ---------- */
.ft{position:relative;overflow:clip;background:#000;padding-block:clamp(64px,9vh,110px) 0;font-size:16px}
.ft__top{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.6fr) minmax(0,1fr) minmax(0,1.1fr) minmax(0,1.2fr);gap:34px 28px;align-items:start}
.ft__brand img{width:190px;mix-blend-mode:normal}
.ft__brand p{margin-block-start:18px;font-size:clamp(24px,2.2vw,34px);font-weight:700;letter-spacing:-.025em;line-height:1.1}
.ft__brand small{display:block;margin-block-start:10px;font-size:15px;color:var(--grey);line-height:1.5}
.ft__col h3{font-size:13.5px;font-weight:600;color:var(--grey);margin-block-end:12px}
.ft__col a,.ft__col span.ft__hours{display:block;padding-block:5px;color:rgba(245,245,247,.86);transition:color .3s var(--ease)}
.ft__col a:hover{color:#fff}
.ft__col--2{columns:2;column-gap:24px}
.ft__col--2 h3{column-span:all}
.ft__col--2 a{break-inside:avoid}
.ft__hours{color:var(--grey)!important;font-size:14.5px}
.ft__ai{display:grid;gap:8px;padding:20px;border-radius:var(--r-m);background:var(--tile-2);box-shadow:inset 0 0 0 1px var(--hair)}
.ft__ai b{font-size:18px;font-weight:700;letter-spacing:-.02em}
.ft__ai span{font-size:14.5px;line-height:1.5;color:var(--text-2)}
.ft__ai em{font-style:normal;font-weight:500;color:var(--pink-ink);font-size:15px}
.ft .word{color:#161617!important;transform:none;margin-block:clamp(30px,5vh,60px) 0;line-height:.86;font-weight:700;letter-spacing:-.04em;-webkit-text-stroke:0;background:none}
.ft__legal{position:relative;z-index:2;background:#000;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 30px;padding-block:18px 24px;font-size:13.5px;color:var(--grey);border-block-start:1px solid var(--hair)}
.ft__legal-l{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center}
.ft__legal a:hover,.ft__legal button:hover{color:#fff}
.ft__legal button{font-size:13.5px;color:var(--grey)}
@media (max-width:1100px){
  .ft__top{grid-template-columns:1fr 1fr 1fr}
  .ft__brand{grid-column:1/-1}
  .ft__ai{grid-column:1/-1}
}
@media (max-width:760px){
  .ft{padding-block-end:84px}
  .ft__top{grid-template-columns:1fr 1fr;gap:30px 20px}
  .ft__col--2{grid-column:1/-1}
  .ft .word{display:none}
}
/* כפתור צף: בדסקטופ רק אייקון, כדי שלא יסתיר תוכן */
.fab{background:#f5f5f7;color:#000;height:56px;width:56px;padding:0;justify-content:center;font-size:0;gap:0;box-shadow:0 14px 34px rgba(0,0,0,.45)}
.fab span{width:56px;height:56px;background:transparent}
.fab svg{width:26px;height:26px}
.mbar{background:rgba(22,22,23,.9)}
.mbar__wa{background:#f5f5f7;color:#000}

/* ---------- 5. התאמות הרכיבים הישנים למצב הבהיר ---------- */
html[data-theme="light"] .shot,html[data-theme="light"] .rt__shot,html[data-theme="light"] .bw{box-shadow:var(--shadow),0 0 0 1px var(--hair)!important}
html[data-theme="light"] .lead{color:var(--text-2)}
html[data-theme="light"] .word{color:var(--tile)!important}

/* >>> מצב בהיר לעמודים הפנימיים: site, pages, inner, work, service (התחלה) */
/* 5.1 הציאן והזהב של השכבה הישנה משמשים כצבעי טקסט, ולכן הם מתהפכים עם המצב */
html[data-theme="light"]{--cyan:var(--text);--gold:#515154}

/* 5.2 אריחי מדיה שמוגדרים ב-CSS ונשארים כהים גם במצב הבהיר, בלי לגעת ב-HTML.
   אותם ערכים של סעיף 2. בשורה השנייה הקיצורים של עמודי השירות מחושבים מחדש בתוך כל אי כהה. */
html[data-theme="light"] :is(.tile--k,.tile[data-gen],.ab__360,.ab__pic,.koren__pic,.chain__video){
  --bg:#000000;--bg-2:#0b0b0c;
  --tile:#1d1d1f;--tile-2:#161617;--tile-3:#2a2a2c;
  --text:#f5f5f7;--text-2:#a1a1a6;--grey:#86868b;
  --fg-rgb:245,245,247;--bg-rgb:0,0,0;
  --hair:rgba(245,245,247,.12);--hair-2:rgba(245,245,247,.2);
  --pink-ink:#F0508F;
  --black:var(--bg);--ink:var(--bg-2);--ink-2:var(--bg-2);--white:var(--text);--line:var(--hair);
  color:var(--text);
}
html[data-theme="light"] :is(.on-dark,.hd,.mm,.ft,.mbar,.fab,.tile--k,.tile[data-gen],.ab__360,.ab__pic,.koren__pic,.chain__video){
  --cyan:#f5f5f7;--gold:#d2d2d7;
  --t1:var(--tile);--t2:var(--tile-2);--t3:var(--tile-3);--tx:var(--text);--tx2:var(--text-2);--hr:var(--hair);
}

/* 5.3 ורוד של טקסט וקישורים: כהה יותר על רקע בהיר, כדי לעמוד בניגודיות */
html[data-theme="light"] :is(.legal__toc a[aria-current],.legal__body a,.ct__fact dd a:hover,.case__no,.big__k,.faq__me a,.chain__sum a,.kor__say .go,.tile .go svg,.ac,.h1 .ac,.h2 .ac){color:var(--pink-ink)}
/* אפור על אריח בהיר (tile-2) יורד מתחת ל-4.5, ולכן הטקסט המשני שם עולה דרגה */
html[data-theme="light"] :is(.me__by,.me__hours,.totals2 dt,.postf__row small,.postc__m,.plist small,.ways span span,.case .micro,.case__head p,.mt dt,.svh__cap){color:var(--text-2)}
html[data-theme="light"] .ways b{color:var(--text)}

/* 5.4 תמונות של קורן צולמו על שחור: במצב הבהיר הן יושבות באריח כהה ומעוגל, בלי מסכת הדהייה */
html[data-theme="light"] :is(.ab__pic,.koren__pic){border-radius:var(--r-xl);overflow:hidden;background:var(--media)}
html[data-theme="light"] :is(.ab__pic,.koren__pic) img{-webkit-mask-image:none;mask-image:none;mix-blend-mode:normal}
html[data-theme="light"] .ab__pic{align-self:center;margin-block-end:clamp(40px,7vh,84px)}
html[data-theme="light"] .ab__pic img{height:100%;object-fit:cover;object-position:50% 0}
html[data-theme="light"] .koren{padding-block-start:var(--sec)}
html[data-theme="light"] .koren__grid{align-items:center}
html[data-theme="light"] .koren__pic{margin:0}
html[data-theme="light"] .koren__say{padding-block:clamp(90px,9vw,130px) 0}
@media (max-width:760px){
  html[data-theme="light"] .koren__pic{margin:0 0 34px;width:auto}
  html[data-theme="light"] .koren__say{margin-block-start:0;padding-block-start:0}
  html[data-theme="light"] .koren__say::before{display:none}
}

/* 5.5 צילומי מסך ותמונות בהירות מקבלים קו מתאר עדין, כדי לא להתמזג ברקע */
html[data-theme="light"] :is(.dash,.logos figure,.adwall li,.lineup figure,.bx__lead figure,.bx__row figure){box-shadow:0 0 0 1px var(--hair)}
html[data-theme="light"] .bento>.tile:not(.tile--txt){box-shadow:0 0 0 1px var(--hair)}

/* 5.6 צללים: צל שחור חזק נראה מלוכלך על לבן */
html[data-theme="light"] .dashf{box-shadow:var(--shadow-s),0 0 0 1px var(--hair)}
html[data-theme="light"] .case--stack .dash+.dash{box-shadow:var(--shadow),0 0 0 1px var(--hair)}
html[data-theme="light"] :is(.lineup,.tile--case) .dashf{box-shadow:0 0 0 1px var(--hair)}
/* <<< מצב בהיר לעמודים הפנימיים (סוף) */