/* ============================================================
   lexa-index-guest.css
   ייחודי לדף "כתיבת תוכן לקידום אתרים" בלבד
   יש לטעון אחרי lexa-shared.css ו-lexa-index.css
   ============================================================ */


/* ────────────────────────────────────────
   HERO — hero עם וידאו במקום hero-card
──────────────────────────────────────── */
.lexa-ig-hero-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.lexa-ig-video-wrap {
    border-radius: 16px;
    overflow: hidden;
}


/* ────────────────────────────────────────
   E-E-A-T GRID — שני עמודות טקסט
──────────────────────────────────────── */
.lexa-ig-eeat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.lexa-ig-eeat-col h3 {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--lexa-stone-900);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.lexa-ig-eeat-col h3 i { color: var(--lexa-teal-mid); }

.lexa-ig-eeat-col p {
    font-size: .9rem;
    color: var(--lexa-stone-600);
    line-height: 1.8;
    margin-bottom: 12px;
}

.lexa-ig-eeat-col p:last-child { margin-bottom: 0; }


/* ────────────────────────────────────────
   STEP HEADER — כותרת + זמן בשורה
──────────────────────────────────────── */
.lexa-ig-step-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.lexa-ig-step-header h3 {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--lexa-stone-900);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.lexa-ig-step-time {
    font-size: .8rem;
    font-weight: 700;
    color: var(--lexa-stone-500);
    background: var(--lexa-stone-100);
    padding: 4px 12px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}

.lexa-ig-step-badge {
    font-size: .75rem;
    font-weight: 800;
    color: #dc2626;
    background: #fef2f2;
    border: 1px solid #fecaca;
    padding: 3px 10px;
    border-radius: 20px;
}

/* שלב 4 מודגש */
.lexa-qfo-step--highlight {
    border: 2px solid var(--lexa-teal-border) !important;
    background: var(--lexa-teal-pale);
}

.lexa-step-num--danger {
    background: linear-gradient(135deg, #dc2626, #ef4444) !important;
}


/* ────────────────────────────────────────
   TABLE FREE BADGE
──────────────────────────────────────── */
.lexa-ig-free-badge {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    color: var(--lexa-teal-dark);
    background: var(--lexa-teal-pale);
    border: 1px solid var(--lexa-teal-soft);
    padding: 2px 10px;
    border-radius: 20px;
    margin-right: 6px;
}


/* ────────────────────────────────────────
   SPLIT LAYOUT — מאמרים 70/30
──────────────────────────────────────── */
.lexa-ig-split-layout {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 40px;
    align-items: start;
}

.lexa-ig-split-text p {
    font-size: .92rem;
    color: var(--lexa-stone-600);
    line-height: 1.85;
    margin-bottom: 14px;
}

.lexa-ig-split-stats {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 160px;
}

.lexa-ig-stat-block {
    background: linear-gradient(135deg, var(--lexa-teal-mid), var(--lexa-teal-light));
    border-radius: 16px;
    padding: 20px 24px;
    text-align: center;
    color: #fff;
}

.lexa-ig-stat-block--secondary {
    background: var(--lexa-teal-pale);
}

.lexa-ig-stat-block--secondary .lexa-ig-stat-num,
.lexa-ig-stat-block--secondary .lexa-ig-stat-label {
    color: var(--lexa-teal-dark);
}

.lexa-ig-stat-num {
    display: block;
    font-size: 2.4rem;
    font-weight: 900;
    line-height: 1;
    margin-bottom: 4px;
}

.lexa-ig-stat-label {
    display: block;
    font-size: .8rem;
    font-weight: 600;
    opacity: .9;
    line-height: 1.4;
}


/* ────────────────────────────────────────
   FIT SPLIT — כן / לא
──────────────────────────────────────── */
.lexa-fit-split-card--yes h3 { color: var(--lexa-teal-dark); }

.lexa-fit-split-card--no h3 { color: #dc2626; }

.lexa-fit-split-card--no ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.lexa-fit-split-card--no ul li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    font-size: .9rem;
    color: var(--lexa-stone-600);
    line-height: 1.6;
}

.lexa-fit-split-card--no ul li:last-child { margin-bottom: 0; }

.lexa-fit-split-card--no ul li i {
    color: #dc2626;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 2px;
}


/* ────────────────────────────────────────
   IG BADGE — תגית קטנה בכרטיסי תמחור
──────────────────────────────────────── */
.lexa-ig-badge {
    display: inline-block;
    font-size: .78rem;
    font-weight: 800;
    color: #dc2626;
    background: #fef2f2;
    border: 1px solid #fecaca;
    padding: 4px 14px;
    border-radius: 20px;
    margin-bottom: 16px;
}

.lexa-ig-badge--primary {
    color: var(--lexa-teal-dark);
    background: var(--lexa-teal-pale);
    border-color: var(--lexa-teal-soft);
}


/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media (max-width: 991px) {
    .lexa-ig-hero-inner { grid-template-columns: 1fr; gap: 32px; }
    .lexa-ig-eeat-grid  { grid-template-columns: 1fr; gap: 28px; }
    .lexa-ig-split-layout { grid-template-columns: 1fr; }
    .lexa-ig-split-stats { flex-direction: row; min-width: unset; }
    .lexa-ig-stat-block { flex: 1; }
}

@media (max-width: 767px) {
    .lexa-ig-step-header { flex-direction: column; align-items: flex-start; }
    .lexa-ig-split-stats { flex-direction: column; }
    .lexa-ig-stat-block  { padding: 16px; }
    .lexa-ig-stat-num    { font-size: 1.8rem; }
}


/* ────────────────────────────────────────
   PRICING — העתק מ-lexa-index.css
   (נטען רק בדף זה, לא ב-index)
──────────────────────────────────────── */
.lexa-idx-pricing-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 820px;
    margin-inline: auto;
}

.lexa-idx-pricing-card {
    background: #fff;
    border-radius: var(--lexa-radius-card);
    border: 1px solid var(--lexa-stone-200);
    box-shadow: var(--lexa-shadow-card);
    padding: 36px 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: all .35s ease;
}

.lexa-idx-pricing-card:hover {
    box-shadow: var(--lexa-shadow-hover);
    border-color: var(--lexa-teal-border);
    transform: translateY(-4px);
}

.lexa-idx-pricing-card--main {
    border-color: var(--lexa-teal-border);
    background: linear-gradient(160deg, #fff 0%, var(--lexa-teal-pale) 100%);
}

.lexa-idx-pricing-icon {
    width: 68px; height: 68px;
    border-radius: 50%;
    background: var(--lexa-teal-pale);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.8rem; color: var(--lexa-teal-dark);
    margin-bottom: 16px;
}

.lexa-idx-pricing-card h3 {
    font-size: 1.2rem; font-weight: 800;
    color: var(--lexa-stone-900);
    margin-bottom: 12px;
}

.lexa-idx-pricing-price {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

.lexa-idx-pricing-amount {
    font-size: 2.4rem;
    font-weight: 900;
    color: var(--lexa-teal-dark);
    line-height: 1;
}

.lexa-idx-pricing-period {
    font-size: .85rem;
    color: var(--lexa-stone-500);
    line-height: 1.4;
}

.lexa-idx-pricing-card .lexa-checklist {
    width: 100%;
    text-align: right;
    margin-bottom: 20px;
}

.lexa-idx-pricing-note {
    font-size: .85rem;
    color: var(--lexa-stone-500);
    margin-bottom: 20px;
    font-style: italic;
}


/* ────────────────────────────────────────
   FIT SPLIT — כן / לא (modifiers)
   (.lexa-fit-split ו-.lexa-fit-split-card
    מוגדרים ב-shared, רק modifiers כאן)
──────────────────────────────────────── */
.lexa-fit-split-card--yes h3 {
    color: var(--lexa-teal-dark);
}

.lexa-fit-split-card--yes h3 i {
    color: var(--lexa-teal-mid);
}

.lexa-fit-split-card--no h3 {
    color: #dc2626;
}

.lexa-fit-split-card--no h3 i {
    color: #dc2626;
}

.lexa-fit-split-card--no ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.lexa-fit-split-card--no ul li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    font-size: .9rem;
    color: var(--lexa-stone-600);
    line-height: 1.65;
}

.lexa-fit-split-card--no ul li:last-child { margin-bottom: 0; }

.lexa-fit-split-card--no ul li i {
    color: #dc2626;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 2px;
}


/* ─── responsive additions ─── */
@media (max-width: 767px) {
    .lexa-idx-pricing-grid { grid-template-columns: 1fr; max-width: 480px; }
    .lexa-idx-pricing-card { padding: 28px 20px; }
}


/* ────────────────────────────────────────
   FIT SPLIT CARD — תוכן פנימי
   (base layout חסר מ-shared)
──────────────────────────────────────── */
.lexa-fit-split-card {
    display: flex;
    flex-direction: column;
}

.lexa-fit-split-card h3 {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lexa-fit-split-card .lexa-checklist {
    margin: 0;
}


/* ────────────────────────────────────────
   PRICING BUTTON — רוחב מלא
──────────────────────────────────────── */
.lexa-ig-pricing-btn {
    width: 100%;
    justify-content: center;
    margin-top: auto;
}


/* ────────────────────────────────────────
   FINAL CTA — כרטיס gradient כהה
──────────────────────────────────────── */
.lexa-ig-final-cta {
    background: linear-gradient(135deg, var(--lexa-teal-dark) 0%, var(--lexa-teal-mid) 100%);
    border-radius: var(--lexa-radius-card);
    padding: 52px 40px;
    text-align: center;
}

.lexa-ig-final-cta-title {
    font-size: 1.6rem;
    font-weight: 900;
    color: #fff;
    margin-bottom: 14px;
    line-height: 1.35;
}

.lexa-ig-final-cta-sub {
    font-size: 1rem;
    color: rgba(255, 255, 255, .85);
    margin-bottom: 28px;
    line-height: 1.7;
}

.lexa-ig-final-cta-btn {
    font-size: 1.1rem;
    padding: 16px 44px;
    display: inline-flex;
}

.lexa-ig-final-cta-note {
    font-size: .8rem;
    color: rgba(255, 255, 255, .55);
    margin-top: 16px;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .lexa-ig-final-cta { padding: 36px 24px; }
    .lexa-ig-final-cta-title { font-size: 1.3rem; }
    .lexa-ig-final-cta-btn { width: 100%; justify-content: center; }
}


/* ────────────────────────────────────────
   ARTICLE PACKAGE CARD HEADER
──────────────────────────────────────── */
.lexa-ig-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}

.lexa-ig-card-header h3 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--lexa-stone-900);
}

.lexa-ig-card-icon {
    width: 60px; height: 60px; min-width: 60px;
    border-radius: 50%;
    background: var(--lexa-teal-pale);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem;
    color: var(--lexa-teal-dark);
    flex-shrink: 0;
}


/* ────────────────────────────────────────
   STEPS CTA AREA
──────────────────────────────────────── */
.lexa-ig-steps-cta {
    margin-top: 28px;
    text-align: center;
}

.lexa-ig-steps-cta-btn {
    font-size: 1.05rem;
    padding: 16px 40px;
}

.lexa-ig-steps-cta-note {
    font-size: .85rem;
    color: var(--lexa-stone-500);
    margin-top: 12px;
    text-align: center;
}


/* ────────────────────────────────────────
   CTA BAR — bottom rounded variant
──────────────────────────────────────── */
.lexa-cta-bar--rounded-bottom {
    border-radius: 0 0 24px 24px;
}


/* ────────────────────────────────────────
   ICON ROW — אייקון גדול + טקסט
   (AI penalty section + Hebrew section)
──────────────────────────────────────── */
.lexa-ig-icon-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.lexa-ig-row-icon {
    font-size: 3rem;
    color: var(--lexa-teal-mid);
    flex-shrink: 0;
    line-height: 1.2;
}


/* ────────────────────────────────────────
   AI MODE section — overrides
──────────────────────────────────────── */
.lexa-ig-no-margin { margin: 0 !important; }

.lexa-ig-sub-heading {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--lexa-stone-900);
    margin-bottom: 14px;
}

.lexa-ig-takeaway-mt { margin-top: 16px; }


/* ────────────────────────────────────────
   VIDEO TESTIMONIAL CARDS
──────────────────────────────────────── */
.lexa-ig-video-card {
    background: #fff;
    border-radius: var(--lexa-radius-card);
    border: 1px solid var(--lexa-stone-200);
    overflow: hidden;
    transition: box-shadow .3s ease;
}

.lexa-ig-video-card:hover {
    box-shadow: var(--lexa-shadow-hover);
}

.lexa-ig-video-meta {
    padding: 16px 20px;
}

.lexa-ig-video-name {
    margin: 0 0 2px;
    font-weight: 700;
    font-size: .9rem;
    color: var(--lexa-teal-dark);
}

.lexa-ig-video-role {
    margin: 0;
    font-size: .85rem;
    color: var(--lexa-stone-500);
}