/* ===================================================================
   PRODUCT MODERN - עמודי מוצר בהירים (clickpro.html, achievements.html)
   נטען אחרי style.css.
   ------------------------------------------------------------------
   - כל הכללים תחת body.pm-page כדי לא לדלוף לעמודים אחרים.
   - prefix pm- לכל רכיב חדש.
   - עיצוב בהיר בלבד: רקע לבן/בהיר וטקסט כהה. בלי כרטיסים כהים
     (החלטת המשתמש 08/10/2026: הגרסה הכהה הייתה בניגודיות נמוכה).
   - כל טקסט עומד בניגודיות 4.5:1 לפחות מול הרקע שלו.
   - בגלל zoom: 0.64 הגופן הקטן ביותר הוא 0.85rem, כדי שיישאר קריא.
   - כל מוצר מקבל גוון משלו (pm--clickpro ירוק, pm--hesegim כחול)
     דרך משתני --pm-accent-*.
   - מחלקות שה-JS תלוי בהן נשמרות: product-entry-modern,
     modern-platform-selector, platform-card, modern-mockup-image,
     purchase-btn, trial-btn, #btn-free-download, gallery-grid/gallery-image.
   =================================================================== */

/* ===== 1. טוקנים וקנה מידה ===== */
body.pm-page {
    /* קנה מידה זהה לזמן ולסוויץ': 0.64 במחשב, 0.78 בחלון צר, 0.92 בנייד */
    zoom: 0.64;

    --pm-ink:    #0c2129;   /* כותרות */
    --pm-text:   #1d3640;   /* טקסט רגיל */
    --pm-text-2: #3a525c;   /* טקסט משני - 7.6:1 על לבן */
    --pm-muted:  #51666f;   /* תוויות - 5.9:1 על לבן */
    --pm-line:   rgba(12, 33, 41, 0.12);
    --pm-line-2: rgba(12, 33, 41, 0.2);
    --pm-surface: #ffffff;
    --pm-surface-2: #f5f8f9;

    --pm-r-lg: 30px;
    --pm-r-md: 20px;
    --pm-r-sm: 14px;

    --pm-shadow-sm: 0 2px 10px -4px rgba(12, 33, 41, 0.14);
    --pm-shadow-md: 0 18px 44px -26px rgba(12, 33, 41, 0.32);
    --pm-shadow-lg: 0 34px 80px -44px rgba(12, 33, 41, 0.4);

    /* גוון המוצר - ברירת מחדל טורקיז של המותג */
    --pm-accent:        #0b6e7f;
    --pm-accent-strong: #08505d;
    --pm-accent-tint:   rgba(11, 110, 127, 0.08);
    --pm-accent-line:   rgba(11, 110, 127, 0.24);
    --pm-hero-tint:     #eef7f8;

    color: var(--pm-text);
    background:
        radial-gradient(circle at 8% 4%, var(--pm-accent-tint), transparent 30%),
        linear-gradient(180deg, #fbfdfd 0%, #f3f7f8 50%, #fafcfc 100%) !important;
    background-attachment: fixed !important;
}

/* קליק פרו - ירוק (5.3:1 על לבן) */
body.pm-page.pm--clickpro {
    --pm-accent:        #1d7a41;
    --pm-accent-strong: #145a2f;
    --pm-accent-tint:   rgba(29, 122, 65, 0.08);
    --pm-accent-line:   rgba(29, 122, 65, 0.26);
    --pm-hero-tint:     #eef8f1;
}

/* הישגים - כחול (6.1:1 על לבן) */
body.pm-page.pm--hesegim {
    --pm-accent:        #2552bd;
    --pm-accent-strong: #1a3c8f;
    --pm-accent-tint:   rgba(37, 82, 189, 0.07);
    --pm-accent-line:   rgba(37, 82, 189, 0.24);
    --pm-hero-tint:     #eef3fd;
}

/* ===== 2. פריסה ===== */
body.pm-page main.product-page-main {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 150px 0 5.5rem !important;
    min-height: 0;
    overflow: visible;
}

body.pm-page [id] { scroll-margin-top: 132px; }

body.pm-page .pm-shell {
    width: min(1700px, calc(100% - 44px));
    margin-inline: auto;
    box-sizing: border-box;
}

body.pm-page .pm-sec {
    position: relative;
    padding-top: 3.6rem;
}

/* אלמנטים שה-JS הגלובלי מסמן ל-reveal: ב-hero הם גלויים תמיד */
body.pm-page .pm-hero[data-reveal],
body.pm-page .pm-hero [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}

/* ===== 3. כותרות סקשן ===== */
body.pm-page .pm-head {
    max-width: 820px;
    margin: 0 auto 2.2rem;
    text-align: center;
}

body.pm-page .pm-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    margin-bottom: 14px;
    border-radius: 999px;
    background: var(--pm-accent-tint);
    border: 1px solid var(--pm-accent-line);
    color: var(--pm-accent-strong);
    font-size: 0.92rem;
    font-weight: 800;
}

body.pm-page .pm-h2 {
    margin: 0 0 12px;
    font-size: clamp(2rem, 3.4vw, 2.9rem);
    font-weight: 900;
    line-height: 1.14;
    letter-spacing: -0.03em;
    color: var(--pm-ink);
}

body.pm-page .pm-h2 em {
    font-style: normal;
    color: var(--pm-accent);
}

body.pm-page .pm-lead {
    margin: 0;
    font-size: 1.15rem;
    line-height: 1.7;
    color: var(--pm-text-2);
}

/* ===================================================================
   4. HERO - כרטיס בהיר עם טקסט, אזור הורדה ותמונת מוצר
   =================================================================== */
body.pm-page .pm-hero.product-entry-modern {
    /* איפוס סגנון product-entry-modern הישן מ-style.css */
    display: block;
    grid-template-columns: none;
    gap: 0;
    margin-bottom: 0;

    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(2.4rem, 4vw, 3.8rem) clamp(1.6rem, 4vw, 3.6rem);
    border: 1px solid var(--pm-line);
    border-radius: 36px;
    text-align: right;
    color: var(--pm-text);
    background:
        radial-gradient(ellipse 60% 80% at 15% 50%, var(--pm-hero-tint) 0%, transparent 70%),
        linear-gradient(180deg, #ffffff 0%, #fbfdfd 100%);
    box-shadow: var(--pm-shadow-lg);
}

body.pm-page .pm-hero.product-entry-modern:hover {
    transform: none;
    box-shadow: var(--pm-shadow-lg);
}

/* רשת עדינה מאחורי התמונה */
body.pm-page .pm-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image:
        linear-gradient(var(--pm-accent-tint) 1px, transparent 1px),
        linear-gradient(90deg, var(--pm-accent-tint) 1px, transparent 1px);
    background-size: 56px 56px;
    -webkit-mask-image: radial-gradient(ellipse 45% 70% at 18% 50%, #000 0%, transparent 75%);
    mask-image: radial-gradient(ellipse 45% 70% at 18% 50%, #000 0%, transparent 75%);
    pointer-events: none;
}

body.pm-page .pm-orb { display: none; }

body.pm-page .pm-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
    gap: clamp(2rem, 4vw, 3.6rem);
    /* התמונה ממורכזת לגובה הטקסט ואינה נמתחת - בלי חלל ריק מתחתיה */
    align-items: center;
}

body.pm-page .pm-hero-copy { min-width: 0; }

/* גלולות עליונות */
body.pm-page .pm-ribbons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}

body.pm-page .pm-ribbon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 15px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--pm-line-2);
    color: var(--pm-text);
    font-size: 0.92rem;
    font-weight: 700;
}

body.pm-page .pm-ribbon svg { flex: none; color: var(--pm-accent); }

body.pm-page .pm-ribbon-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--pm-accent);
    box-shadow: 0 0 0 4px var(--pm-accent-tint);
}

body.pm-page .pm-hero-title {
    margin: 0 0 16px;
    font-size: clamp(2.3rem, 4.2vw, 3.6rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.035em;
    color: var(--pm-ink);
}

body.pm-page .pm-hero-title em {
    font-style: normal;
    color: var(--pm-accent);
}

body.pm-page .pm-hero-sub {
    max-width: 660px;
    margin: 0 0 24px;
    font-size: 1.2rem;
    line-height: 1.7;
    color: var(--pm-text-2);
}

body.pm-page .pm-hero-sub strong { color: var(--pm-ink); font-weight: 800; }

/* ----- תיבת ההורדה / רכישה ----- */
body.pm-page .pm-buy {
    max-width: 640px;
    padding: 20px;
    margin-bottom: 22px;
    border-radius: var(--pm-r-md);
    background: #ffffff;
    border: 1px solid var(--pm-line-2);
    box-shadow: var(--pm-shadow-md);
}

body.pm-page .pm-buy-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

body.pm-page .pm-buy-label {
    font-size: 1rem;
    font-weight: 800;
    color: var(--pm-ink);
}

body.pm-page .pm-price {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    color: var(--pm-ink);
}

body.pm-page .pm-price-now {
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: -0.02em;
}

body.pm-page .pm-price-old {
    font-size: 1rem;
    font-weight: 600;
    color: var(--pm-muted);
    text-decoration: line-through;
}

body.pm-page .pm-price-note {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--pm-muted);
}

/* בורר פלטפורמה - segmented control בהיר */
body.pm-page .pm-buy .modern-platform-selector {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin: 0 0 14px;
    padding: 5px;
    border-radius: 16px;
    background: #eef2f4;
    border: 1px solid var(--pm-line);
}

body.pm-page .pm-buy .modern-platform-selector input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

body.pm-page .pm-buy .platform-card {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px;
    border: 1.5px solid transparent;
    border-radius: 12px;
    background: transparent;
    color: var(--pm-text-2);
    box-shadow: none;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body.pm-page .pm-buy .platform-card:hover:not(.disabled) {
    background: rgba(255, 255, 255, 0.7);
}

body.pm-page .pm-buy .modern-platform-selector input:checked + .platform-card {
    background: #ffffff;
    border-color: var(--pm-accent);
    color: var(--pm-ink);
    box-shadow: 0 8px 20px -12px rgba(12, 33, 41, 0.45);
}

body.pm-page .pm-buy .modern-platform-selector input:checked + .platform-card svg { color: var(--pm-accent); }

body.pm-page .pm-buy .modern-platform-selector input:focus-visible + .platform-card {
    outline: 2px solid var(--pm-accent);
    outline-offset: 2px;
}

body.pm-page .pm-buy .platform-card.disabled {
    opacity: 1;
    color: #6a7c84;
    cursor: not-allowed;
    background: transparent;
}

body.pm-page .pm-buy .platform-card svg { flex: none; }

body.pm-page .pm-buy .platform-info {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 8px;
}

body.pm-page .pm-buy .platform-name {
    font-size: 1.08rem;
    font-weight: 800;
    color: inherit;
}

body.pm-page .pm-buy .platform-status {
    font-size: 0.86rem;
    font-weight: 600;
    color: inherit;
}

/* כפתורי פעולה */
body.pm-page .pm-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.pm-page .pm-btn-primary,
body.pm-page .pm-btn-ghost {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    border-radius: 999px;
    cursor: pointer;
    text-decoration: none;
    font-family: inherit;
    line-height: 1.2;
}

/* כפתור ראשי: מילוי בגוון המוצר וטקסט לבן */
body.pm-page .pm-btn-primary {
    padding: 17px 26px;
    border: none;
    background: var(--pm-accent);
    color: #ffffff !important;
    font-size: 1.15rem;
    font-weight: 800;
    box-shadow: 0 14px 30px -16px var(--pm-accent), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

body.pm-page .pm-btn-primary:hover {
    background: var(--pm-accent-strong);
    transform: translateY(-2px);
    box-shadow: 0 18px 36px -16px var(--pm-accent);
}

body.pm-page .pm-btn-ghost {
    padding: 14px 22px;
    background: #ffffff;
    border: 1.5px solid var(--pm-accent-line);
    color: var(--pm-accent-strong) !important;
    font-size: 1.04rem;
    font-weight: 700;
    transition: background 0.2s ease, border-color 0.2s ease;
}

body.pm-page .pm-btn-ghost:hover {
    background: var(--pm-accent-tint);
    border-color: var(--pm-accent);
}

body.pm-page .pm-ver {
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: 700;
}

body.pm-page .pm-ver:empty { display: none; }

/* קישורים קטנים מתחת לכפתורים */
body.pm-page .pm-buy-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 20px;
    margin-top: 14px;
}

body.pm-page .pm-buy-links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--pm-text-2);
    text-decoration: none;
    transition: color 0.2s ease;
}

body.pm-page .pm-buy-links a:hover { color: var(--pm-accent-strong); text-decoration: underline; }

body.pm-page .pm-buy-links svg { flex: none; color: var(--pm-accent); }

/* שורת הבטחות */
body.pm-page .pm-assurances {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 22px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

body.pm-page .pm-assurances li {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.98rem;
    font-weight: 600;
    color: var(--pm-text-2);
}

body.pm-page .pm-assurances svg { flex: none; color: var(--pm-accent); }

/* סרגל נתונים */
body.pm-page .pm-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 20px;
    border-top: 1px solid var(--pm-line);
}

body.pm-page .pm-stat {
    position: relative;
    flex: 1 1 110px;
    min-width: 100px;
    padding: 2px 12px;
}

body.pm-page .pm-stat:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 0;
    top: 12%;
    bottom: 12%;
    width: 1px;
    background: var(--pm-line-2);
}

body.pm-page .pm-stat-num {
    margin-bottom: 4px;
    font-size: clamp(1.45rem, 2.3vw, 1.9rem);
    font-weight: 900;
    color: var(--pm-accent-strong);
}

body.pm-page .pm-stat-label {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--pm-muted);
}

/* ----- ויזואל ----- */
body.pm-page .pm-hero-visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

body.pm-page .pm-visual-link {
    display: block;
    width: 100%;
    text-decoration: none;
    border-radius: 18px;
}

body.pm-page .pm-hero-visual .modern-mockup-image {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    filter: drop-shadow(0 30px 40px rgba(12, 33, 41, 0.2));
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

body.pm-page .pm-hero-visual:hover .modern-mockup-image { transform: translateY(-4px); }

/* צילום עם רקע מלא (לא שקוף) - פינות מעוגלות ומסגרת עדינה */
body.pm-page .pm-hero-visual .modern-mockup-image.pm-img-framed {
    border-radius: 14px;
    border: 1px solid var(--pm-line-2);
    filter: none;
    box-shadow: 0 34px 70px -36px rgba(12, 33, 41, 0.5);
}

/* צילום אנכי (אנדרואיד) - מגבלת גובה כדי שלא ינפח את ה-hero */
body.pm-page .pm-hero-visual .modern-mockup-image.pm-img-framed[src*="android"] {
    width: auto;
    max-height: 560px;
    border-radius: 26px;
}

body.pm-page .pm-float {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid var(--pm-line-2);
    box-shadow: 0 18px 36px -20px rgba(12, 33, 41, 0.45);
    color: var(--pm-ink);
    pointer-events: none;
}

body.pm-page .pm-float-ic {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex: none;
    border-radius: 10px;
    background: var(--pm-accent-tint);
    color: var(--pm-accent);
}

body.pm-page .pm-float-k {
    display: block;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--pm-muted);
}

body.pm-page .pm-float-v {
    display: block;
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.25;
    color: var(--pm-ink);
}

body.pm-page .pm-float--a { top: 2%; left: -10px; animation: pm-bob 6.5s ease-in-out infinite; }
body.pm-page .pm-float--b { bottom: 4%; right: -14px; animation: pm-bob 7.5s ease-in-out infinite 0.6s; }

@keyframes pm-bob {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-8px); }
}

/* ===================================================================
   5. רצועת אמון
   =================================================================== */
body.pm-page .pm-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 24px;
    width: fit-content;
    max-width: min(1700px, calc(100% - 44px));
    margin: 22px auto 0;
    padding: 14px 22px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid var(--pm-line);
    box-shadow: var(--pm-shadow-sm);
}

body.pm-page .pm-strip span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--pm-text);
    white-space: nowrap;
}

body.pm-page .pm-strip svg { flex: none; color: var(--pm-accent); }

/* ===================================================================
   6. Bento - יכולות
   =================================================================== */
body.pm-page .pm-bento {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
}

body.pm-page .pm-cell {
    position: relative;
    overflow: hidden;
    grid-column: span 2;
    padding: 24px;
    border-radius: var(--pm-r-md);
    background: #ffffff;
    border: 1px solid var(--pm-line);
    box-shadow: var(--pm-shadow-sm);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

body.pm-page .pm-cell:hover {
    transform: translateY(-4px);
    border-color: var(--pm-accent-line);
    box-shadow: var(--pm-shadow-md);
}

body.pm-page .pm-cell--wide { grid-column: span 3; }
body.pm-page .pm-cell--full { grid-column: span 6; }

/* כרטיס מודגש: רקע בגוון המוצר בהיר, טקסט כהה */
body.pm-page .pm-cell--dark {
    grid-column: span 3;
    background: linear-gradient(160deg, var(--pm-hero-tint) 0%, #ffffff 100%);
    border-color: var(--pm-accent-line);
}

body.pm-page .pm-cell-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}

body.pm-page .pm-cell-ic {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    flex: none;
    border-radius: 12px;
    background: var(--pm-accent-tint);
    color: var(--pm-accent);
}

body.pm-page .pm-cell--dark .pm-cell-ic {
    background: var(--pm-accent);
    color: #ffffff;
}

body.pm-page .pm-tag {
    display: inline-block;
    padding: 4px 11px;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 800;
    background: var(--pm-accent-tint);
    border: 1px solid var(--pm-accent-line);
    color: var(--pm-accent-strong);
    white-space: nowrap;
}

body.pm-page .pm-cell h3 {
    margin: 0 0 8px;
    font-size: 1.22rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--pm-ink);
}

body.pm-page .pm-cell p {
    margin: 0;
    font-size: 1.02rem;
    line-height: 1.65;
    color: var(--pm-text-2);
}

body.pm-page .pm-cell-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

body.pm-page .pm-cell-list li {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    border-radius: 999px;
    background: var(--pm-surface-2);
    border: 1px solid var(--pm-line);
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--pm-text);
}

body.pm-page .pm-cell-list svg { flex: none; color: var(--pm-accent); }

/* ===================================================================
   7. גלריית מסכים
   =================================================================== */
body.pm-page .pm-shots {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

body.pm-page .pm-shot {
    position: relative;
    margin: 0;
    overflow: hidden;
    border-radius: var(--pm-r-md);
    background: #fff;
    border: 1px solid var(--pm-line);
    box-shadow: var(--pm-shadow-sm);
    transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.32s ease, border-color 0.32s ease;
}

body.pm-page .pm-shot:hover {
    transform: translateY(-6px);
    border-color: var(--pm-accent-line);
    box-shadow: var(--pm-shadow-md);
}

body.pm-page .pm-shot--wide { grid-column: span 2; }

body.pm-page .pm-shot-media {
    aspect-ratio: 16 / 10;
    padding: 12px 12px 0;
    overflow: hidden;
    box-sizing: border-box;
    background: linear-gradient(160deg, var(--pm-hero-tint) 0%, #e9eff1 100%);
}

body.pm-page .pm-shot-media img.gallery-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    border: 1px solid var(--pm-line);
    border-bottom: none;
    border-radius: 10px 10px 0 0;
    background: #fff;
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: zoom-in;
}

/* צילום עם רקע שקוף ומסגרת חלון משלו - מוצג במלואו */
body.pm-page .pm-shot--contain .pm-shot-media img.gallery-image {
    object-fit: contain;
    object-position: center;
    border: none;
    background: transparent;
}

/* צילום אנכי - מוצג במלואו במרכז */
body.pm-page .pm-shot--portrait .pm-shot-media img.gallery-image {
    width: auto;
    margin: 0 auto;
    object-fit: contain;
    border-radius: 14px 14px 0 0;
}

body.pm-page .pm-shot:hover img.gallery-image { transform: translateY(-3px); }

body.pm-page .pm-shot-body { padding: 16px 18px 20px; }

body.pm-page .pm-shot-body .pm-tag { margin-bottom: 8px; }

body.pm-page .pm-shot-body h3 {
    margin: 0 0 6px;
    font-size: 1.14rem;
    font-weight: 800;
    color: var(--pm-ink);
}

body.pm-page .pm-shot-body p {
    margin: 0;
    font-size: 0.98rem;
    line-height: 1.6;
    color: var(--pm-text-2);
}

body.pm-page .pm-shots-hint {
    margin: 18px 0 0;
    text-align: center;
    font-size: 0.98rem;
    color: var(--pm-text-2);
}

body.pm-page .pm-shots-hint a {
    color: var(--pm-accent-strong);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ===================================================================
   8. כרטיסי מידע
   =================================================================== */
body.pm-page .pm-notes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

body.pm-page .pm-note {
    display: flex;
    gap: 16px;
    padding: 24px;
    border-radius: var(--pm-r-md);
    background: #fff;
    border: 1px solid var(--pm-line);
    box-shadow: var(--pm-shadow-sm);
}

body.pm-page .pm-note .pm-cell-ic { margin: 0; }

body.pm-page .pm-note h3 {
    margin: 2px 0 6px;
    font-size: 1.18rem;
    font-weight: 800;
    color: var(--pm-ink);
}

body.pm-page .pm-note p {
    margin: 0;
    font-size: 1.02rem;
    line-height: 1.7;
    color: var(--pm-text-2);
}

body.pm-page .pm-note p + p { margin-top: 6px; }
body.pm-page .pm-note strong { color: var(--pm-ink); }

body.pm-page .pm-note-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

body.pm-page .pm-chip-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 15px;
    border-radius: 999px;
    background: #fff;
    border: 1.5px solid var(--pm-accent-line);
    color: var(--pm-accent-strong);
    font-size: 0.95rem;
    font-weight: 800;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease;
}

body.pm-page .pm-chip-link:hover { background: var(--pm-accent-tint); border-color: var(--pm-accent); }

body.pm-page .pm-chip-link svg { flex: none; }

/* ===================================================================
   9. CTA מסכם - בהיר
   =================================================================== */
body.pm-page .pm-cta {
    position: relative;
    overflow: hidden;
    margin-top: 3.6rem;
    padding: clamp(2.2rem, 4vw, 3.2rem);
    border-radius: var(--pm-r-lg);
    border: 1px solid var(--pm-accent-line);
    background:
        radial-gradient(circle at 20% 0%, var(--pm-accent-tint), transparent 50%),
        linear-gradient(160deg, var(--pm-hero-tint) 0%, #ffffff 100%);
    box-shadow: var(--pm-shadow-md);
    text-align: center;
}

body.pm-page .pm-cta h2 {
    margin: 0 0 10px;
    font-size: clamp(1.8rem, 3.2vw, 2.5rem);
    font-weight: 900;
    letter-spacing: -0.03em;
    color: var(--pm-ink);
}

body.pm-page .pm-cta p {
    max-width: 680px;
    margin: 0 auto 24px;
    font-size: 1.12rem;
    line-height: 1.7;
    color: var(--pm-text-2);
}

body.pm-page .pm-cta .pm-btn-primary {
    display: inline-flex;
    width: auto;
}

/* קישור משני בתחתית העמוד */
body.pm-page .pm-foot-link {
    display: flex;
    justify-content: center;
    margin-top: 22px;
}

body.pm-page .pm-foot-link a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 999px;
    border: 1px dashed var(--pm-line-2);
    color: var(--pm-text-2);
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    transition: border-color 0.2s ease, color 0.2s ease;
}

body.pm-page .pm-foot-link a:hover { border-color: var(--pm-accent); color: var(--pm-accent-strong); }

/* ===================================================================
   10. באנר Toast (קליק פרו)
   =================================================================== */
body.pm-page .modern-toast-banner {
    position: fixed;
    top: 130px;
    left: 20px;
    z-index: 9998;
    width: 420px;
    max-width: calc(100vw - 40px);
    overflow: hidden;
    direction: rtl;
    background: #fff;
    border: 1px solid var(--pm-line);
    border-radius: 14px;
    box-shadow: 0 16px 44px -14px rgba(12, 33, 41, 0.3);
    opacity: 0;
    transform: translateX(-50px) scale(0.9);
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    pointer-events: none;
}

body.pm-page .modern-toast-banner.show { opacity: 1; transform: none; pointer-events: auto; }
body.pm-page .modern-toast-banner.hide { opacity: 0; transform: translateX(-50px) scale(0.9); pointer-events: none; }

body.pm-page .toast-content-wrapper { display: flex; align-items: center; gap: 15px; padding: 16px 20px; }

body.pm-page .toast-icon {
    display: flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; flex-shrink: 0;
    border-radius: 50%; background: #fffbeb;
}

body.pm-page .toast-icon svg { width: 24px; height: 24px; color: #b45309; }
body.pm-page .toast-text { flex: 1; text-align: right; }
body.pm-page .toast-text h4 { margin: 0 0 4px; font-size: 1.05rem; font-weight: 800; color: #1e293b; }
body.pm-page .toast-text p { margin: 0; font-size: 0.95rem; line-height: 1.45; color: #334155; }

body.pm-page .toast-close-btn {
    display: flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; padding: 0; margin: -2px 0 auto;
    background: transparent; border: none; color: #64748b;
    font-size: 26px; cursor: pointer;
}

body.pm-page .toast-close-btn:hover { color: #1e293b; }
body.pm-page .toast-progress-bar { width: 100%; height: 4px; background: #d97706; transform-origin: right; }
body.pm-page .modern-toast-banner.show .toast-progress-bar { animation: pm-shrink 10s linear forwards; }

@keyframes pm-shrink { from { width: 100%; } to { width: 0%; } }

/* קישור עדין בתוך המודלים */
body.pm-page .modal-content .link-style {
    display: inline-block;
    width: auto;
    margin-top: 10px;
    padding: 10px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #475569 !important;
    font-size: 0.95rem;
    font-weight: 400;
    text-decoration: underline;
    cursor: pointer;
}

body.pm-page .modal-content .link-style:hover { color: var(--pm-accent-strong) !important; }

/* ===================================================================
   11. התאמות לפי מוצר
   =================================================================== */
/* צילומי הישגים רחבים יותר (1471x838), ולכן יחס התצוגה תואם כדי שלא ייחתכו */
body.pm-page.pm--hesegim .pm-shot-media { aspect-ratio: 16 / 9.4; }

/* ===================================================================
   12. רספונסיביות
   הערה: media queries נמדדים ברוחב החלון האמיתי ולא אחרי zoom.
   =================================================================== */
@media (max-width: 1180px) {
    body.pm-page .pm-hero-inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 2.4rem;
    }
    body.pm-page .pm-hero-visual { order: 2; }
    body.pm-page .pm-hero-sub,
    body.pm-page .pm-buy { max-width: none; }
    body.pm-page .pm-shots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.pm-page .pm-shot--wide { grid-column: span 2; }
    body.pm-page .pm-cell,
    body.pm-page .pm-cell--wide,
    body.pm-page .pm-cell--dark { grid-column: span 3; }
}

@media (max-width: 1099px) {
    body.pm-page { zoom: 0.78; }
}

@media (max-width: 900px) {
    body.pm-page .pm-notes { grid-template-columns: minmax(0, 1fr); }
    body.pm-page .pm-float--b { display: none; }
    body.pm-page .pm-float--a { left: 8px; top: 8px; }
}

@media (max-width: 820px) {
    body.pm-page { zoom: 0.92; }
    body.pm-page main.product-page-main { padding-top: 142px !important; }
    body.pm-page .pm-hero.product-entry-modern {
        border-radius: 26px;
        padding: 2rem 1.2rem;
    }
    body.pm-page .pm-shell { width: calc(100% - 24px); }
    body.pm-page .pm-strip { border-radius: 22px; }
    body.pm-page .pm-buy { padding: 16px; }
    body.pm-page .pm-buy .platform-status { display: none; }
    body.pm-page .pm-stat { flex: 1 1 44%; min-width: 44%; }
    body.pm-page .pm-stat::after { display: none; }
    body.pm-page .pm-shots { grid-template-columns: minmax(0, 1fr); }
    body.pm-page .pm-shot--wide { grid-column: auto; }
    body.pm-page .pm-cell,
    body.pm-page .pm-cell--wide,
    body.pm-page .pm-cell--dark { grid-column: span 6; }
    body.pm-page .pm-hero-visual .modern-mockup-image.pm-img-framed[src*="android"] { max-height: 440px; }
    body.pm-page .modern-toast-banner {
        top: 100px;
        left: 50%;
        width: calc(100vw - 30px);
        transform: translate(-50%, -20px) scale(0.9);
    }
    body.pm-page .modern-toast-banner.show { transform: translate(-50%, 0) scale(1); }
    body.pm-page .modern-toast-banner.hide { transform: translate(-50%, -20px) scale(0.9); }
}

/* ===================================================================
   13. נגישות - תנועה מופחתת
   =================================================================== */
@media (prefers-reduced-motion: reduce) {
    body.pm-page .pm-float { animation: none !important; }
    body.pm-page .pm-hero-visual .modern-mockup-image,
    body.pm-page .pm-cell,
    body.pm-page .pm-shot,
    body.pm-page .pm-btn-primary { transition: none !important; transform: none !important; }
}

/* צילומי הגלריה של קליק פרו (assets/images/clickpro/windows/gallery, 1400x860)
   כוללים מסגרת שחורה של 8px בצדדים ובתחתית ופס של 1px למעלה.
   חותכים אותה ב-CSS ולא בקובץ, כי קובץ תמונה חדש נחסם זמנית בנטפרי עד אישור.
   האחוזים בשוליים השליליים יחסיים לרוחב .pm-shot-clip, ולכן החיתוך מדויק בכל רוחב. */
body.pm-page .pm-shot--trim .pm-shot-media { aspect-ratio: auto; }

body.pm-page .pm-shot--trim .pm-shot-clip {
    display: block;
    overflow: hidden;
    border: 1px solid var(--pm-line);
    border-bottom: none;
    border-radius: 10px 10px 0 0;
    background: #fff;
}

body.pm-page .pm-shot--trim .pm-shot-media img.gallery-image {
    width: calc(100% * 1400 / 1384);
    max-width: none;
    height: auto;
    object-fit: fill;
    margin: calc(-100% * 1 / 1384) calc(-100% * 8 / 1384) calc(-100% * 8 / 1384);
    border: none;
    border-radius: 0;
    background: transparent;
}