﻿/* =====================================================================
   shared.css — סגנונות משותפים לכל עמודי אתר תכל&quot;ס
   ===================================================================== */
body { font-family: 'Assistant', sans-serif; background-color: #fbfcfe; color: #0f172a; }
html { scroll-behavior: smooth; }

/* כותרות — Heebo, משקל 800, מרווח רגיל (לא דחוס) */
h1, h2, h3, .font-display { font-family: 'Heebo', 'Assistant', sans-serif; font-weight: 800 !important; letter-spacing: normal; }
/* ביטול הדחיסה של tracking-tighter על כותרות */
h1.tracking-tighter, h2.tracking-tighter, h3.tracking-tighter,
h1.tracking-tight, h2.tracking-tight, h3.tracking-tight { letter-spacing: normal !important; }

.brand-gradient { background: linear-gradient(135deg, #101721 0%, #202430 100%); }
.hero-bg { background: linear-gradient(160deg, #101721 0%, #161c27 55%, #202430 100%); }
.pain-bg { background: linear-gradient(135deg, #1e1b2e 0%, #2d1a1a 100%); }

/* ===== רקע בהיר נקי + dot-grid (כמו SwiftCollect) ===== */
.bg-clean {
    background:
        radial-gradient(circle at 1px 1px, rgba(15,23,42,0.06) 1px, transparent 0) 0 0 / 26px 26px,
        linear-gradient(180deg, #ffffff 0%, #f4f8fd 100%);
}
.bg-clean-tint {
    background:
        radial-gradient(circle at 1px 1px, rgba(132,204,22,0.07) 1px, transparent 0) 0 0 / 26px 26px,
        linear-gradient(180deg, #f7fdf0 0%, #eef5fc 100%);
}
/* קלף כהה "צף" עם פינות ענק (כמו תמונה 3) */
.dark-float {
    background: linear-gradient(150deg, #101721 0%, #202430 100%);
    border-radius: 48px;
}

/* reveal on scroll */
.reveal { opacity: 0; transform: translateY(28px); transition: all 0.75s cubic-bezier(.22,1,.36,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }

.glass { background: rgba(255,255,255,0.06); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.12); }
.glow-green { box-shadow: 0 0 40px -10px rgba(132,204,22,0.4); }
.stat-number { font-variant-numeric: tabular-nums; }
.zoomable { cursor: zoom-in; transition: transform 0.3s ease; }
.zoomable:hover { transform: scale(1.02); }

/* ===== NAVBAR ===== */
#navbar { transition: all 0.3s ease; }
#navbar.scrolled { background: rgba(16,23,33,0.98); box-shadow: 0 2px 20px rgba(0,0,0,0.4); }
.nav-link.nav-active { color: #fff; }
.nav-link.nav-active::after,
.nav-active::after {
    content: ''; display: block; height: 2px; margin-top: 2px;
    background: #84cc16; border-radius: 2px;
}

/* ===== NAV DROPDOWN — MEGA MENU (דו-עמודתי עם פאנל תמונה) ===== */
.nav-dropdown { position: relative; }
.nav-mega {
    position: absolute; top: 100%; right: 50%; transform: translateX(50%) translateY(10px);
    margin-top: 12px;
    width: 860px; max-width: 94vw; background: #fff; border-radius: 22px;
    box-shadow: 0 30px 70px -15px rgba(11,17,33,0.55); border: 1px solid rgba(0,0,0,0.05);
    padding: 0; opacity: 0; visibility: hidden;
    transition: all 0.22s cubic-bezier(.22,1,.36,1); z-index: 60; overflow: hidden;
    display: grid; grid-template-columns: 1fr 280px;
}
.nav-dropdown:hover .nav-mega,
.nav-dropdown:focus-within .nav-mega { opacity: 1; visibility: visible; transform: translateX(50%) translateY(0); }

/* עמודת רשימת הפיצ'רים (ימין) */
.nav-mega-list { padding: 18px; }
.nav-mega-list .nm-eyebrow {
    font-size: 0.7rem; font-weight: 800; letter-spacing: 1.5px; color: #65a30d;
    text-transform: uppercase; padding: 0 8px 4px;
}
.nav-mega-list .nm-title {
    font-size: 1.15rem; font-weight: 800; color: #0f172a; padding: 0 8px 14px;
    line-height: 1.3;
}
.nav-mega-list .nm-title span { color: #65a30d; }

.nav-dd-item {
    position: relative; display: flex; align-items: center; gap: 11px; padding: 9px 10px;
    border-radius: 12px; transition: all 0.16s; cursor: pointer; border: 1px solid transparent;
}
.nav-dd-item:hover { background: #f8fafc; border-color: #e2e8f0; }
.nav-dd-icon {
    width: 38px; height: 38px; border-radius: 10px; display: flex;
    align-items: center; justify-content: center; flex-shrink: 0; transition: transform 0.16s;
}
.nav-dd-item:hover .nav-dd-icon { transform: scale(1.08); }

/* גווני אייקונים — כל פיצ'ר בצבע משלו */
.dd-c-green  { background: #ecfccb; color: #4d7c0f; }
.dd-c-emerald{ background: #d1fae5; color: #047857; }
.dd-c-blue   { background: #ccfbf1; color: #0f766e; }
.dd-c-indigo { background: #ecfccb; color: #65a30d; }
.dd-c-purple { background: #f3e8ff; color: #7e22ce; }
.dd-c-amber  { background: #fef3c7; color: #b45309; }
.dd-c-rose   { background: #ffe4e6; color: #be123c; }
.dd-c-cyan   { background: #cffafe; color: #0e7490; }
.dd-c-orange { background: #ffedd5; color: #c2410c; }

.dd-new {
    background: #84cc16; color: #1a2e05; font-size: 0.58rem; font-weight: 800;
    padding: 1px 6px; border-radius: 100px; letter-spacing: 0.3px; margin-right: 4px;
    vertical-align: middle;
}

/* עמודת התמונה הכהה (שמאל) */
.nav-mega-promo {
    position: relative; background: linear-gradient(160deg, #101721 0%, #202430 100%);
    padding: 22px; display: flex; flex-direction: column; justify-content: space-between;
    overflow: hidden;
}
.nav-mega-promo::before {
    content: ''; position: absolute; top: -60px; left: -60px; width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(132,204,22,0.18) 0%, transparent 70%); pointer-events: none;
}
.nav-mega-promo .promo-txt { position: relative; z-index: 2; }
.nav-mega-promo .promo-h {
    color: #fff; font-weight: 800; font-size: 1.05rem; line-height: 1.35; margin-bottom: 6px;
}
.nav-mega-promo .promo-h span { color: #a3e635; }
.nav-mega-promo .promo-p { color: #9ca3af; font-size: 0.78rem; line-height: 1.55; }
.nav-mega-promo .promo-img {
    position: relative; z-index: 2; margin-top: 16px; border-radius: 12px; overflow: hidden;
    border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 16px 36px -12px rgba(0,0,0,0.6);
}
.nav-mega-promo .promo-img img { width: 100%; display: block; }
.nav-mega-promo .promo-cta {
    position: relative; z-index: 2; margin-top: 16px;
    display: flex; align-items: center; justify-content: center; gap: 7px;
    padding: 11px; border-radius: 12px; background: linear-gradient(135deg, #65a30d, #84cc16);
    color: #fff; font-weight: 800; font-size: 0.88rem; transition: all 0.18s;
    box-shadow: 0 8px 20px -6px rgba(132,204,22,0.5);
}
.nav-mega-promo .promo-cta:hover { transform: translateY(-1px); box-shadow: 0 12px 26px -6px rgba(132,204,22,0.65); }

/* בנייד — מסתירים את עמודת התמונה */
@media (max-width: 880px) {
    .nav-mega { grid-template-columns: 1fr; }
    .nav-mega-promo { display: none; }
}

/* ===== FEATURE TABS ===== */
.ftab-btn {
    display: flex; align-items: center; gap: 8px; padding: 13px 22px;
    border-radius: 14px; font-weight: 700; font-size: 0.95rem;
    color: #475569; background: transparent; border: 1px solid transparent;
    transition: all 0.2s; white-space: nowrap; cursor: pointer;
}
.ftab-btn:hover { color: #65a30d; background: #f7fee7; }
.ftab-btn.active {
    color: #fff; background: linear-gradient(135deg,#65a30d,#84cc16);
    box-shadow: 0 8px 20px -6px rgba(132,204,22,0.55);
}
.ftab-panel { display: none; }
.ftab-panel.active { display: block; animation: ftabFade 0.45s cubic-bezier(.22,1,.36,1); }
@keyframes ftabFade { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.feat-num {
    font-size: 3.5rem; font-weight: 900; line-height: 1;
    color: rgba(132,204,22,0.12); user-select: none; position: absolute; top: 0; left: 0;
}
.feat-icon-wrap { width: 56px; height: 56px; border-radius: 16px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

/* ===== MODALS ===== */
.modal-overlay {
    position: fixed; inset: 0; z-index: 2000; display: flex;
    justify-content: center; align-items: center; padding: 16px;
    background: rgba(0,0,0,0.75); backdrop-filter: blur(8px);
}
.modal-overlay.hidden { display: none; }

/* ===== LIGHTBOX ===== */
#lightbox {
    display: none; position: fixed; inset: 0; z-index: 3000;
    background: rgba(0,0,0,0.88); justify-content: center; align-items: center; backdrop-filter: blur(6px);
}
#lightbox.open { display: flex; }
#lightbox img { max-width: 92%; max-height: 92%; border-radius: 10px; box-shadow: 0 0 60px rgba(0,0,0,0.6); }
#lightbox-close { position: absolute; top: 24px; right: 28px; color: #fff; font-size: 44px; cursor: pointer; line-height: 1; }

/* ===== BACK TO TOP ===== */
#back-to-top {
    position: fixed; bottom: 28px; left: 28px; z-index: 99; opacity: 0; visibility: hidden;
    transition: all 0.3s ease; transform: translateY(12px);
}
#back-to-top.show { opacity: 1; visibility: visible; transform: translateY(0); }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
