/* ================================================================
   Shakumbhri AI Auto Blog Pro — Frontend CSS
   Lightweight, responsive, cache-friendly, Core Web Vitals optimized
   ================================================================ */
:root{
  --saibp-green:#2d6a4f;
  --saibp-green-dark:#1b4332;
  --saibp-green-lt:#52b788;
  --saibp-wa:#25d366;
  --saibp-radius:8px;
  --saibp-shadow:0 2px 12px rgba(0,0,0,.08);
}

/* ── Table of Contents ─────────── */
.saibp-toc{background:#f8faf9;border-left:4px solid var(--saibp-green);border-radius:var(--saibp-radius);padding:16px 20px;margin:28px 0;max-width:680px}
.saibp-toc__header{display:flex;justify-content:space-between;align-items:center;font-weight:700;color:var(--saibp-green-dark);margin-bottom:10px}
.saibp-toc__toggle{background:none;border:none;cursor:pointer;font-size:.9rem;color:var(--saibp-green);padding:0 4px;line-height:1}
.saibp-toc__nav ol{margin:0;padding-left:20px}
.saibp-toc__nav li{margin:5px 0;font-size:.92rem}
.saibp-toc__nav a{color:var(--saibp-green);text-decoration:none}
.saibp-toc__nav a:hover{text-decoration:underline}
.saibp-toc__nav ul{margin:4px 0 4px 16px;padding:0;list-style:disc}

/* ── Content wrap ──────────────── */
.saibp-content-wrap table{width:100%;border-collapse:collapse;margin:24px 0;font-size:.92rem}
.saibp-content-wrap table th{background:var(--saibp-green-dark);color:#fff;padding:12px 16px;text-align:left}
.saibp-content-wrap table td{padding:10px 16px;border:1px solid #e0e0e0}
.saibp-content-wrap table tr:nth-child(even) td{background:#f8f9fa}

/* ── Content images ────────────── */
.saibp-content-image{margin:32px 0;text-align:center}
.saibp-content-image img{max-width:100%;height:auto;border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,.1);display:block;margin:0 auto}
.saibp-content-image figcaption{margin-top:8px;font-size:.83rem;color:#666;font-style:italic}

/* ── Stats box ─────────────────── */
.saibp-stats-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;background:linear-gradient(135deg,var(--saibp-green-dark),var(--saibp-green));border-radius:12px;padding:24px;margin:32px 0;color:#fff}
.saibp-stats-box .stat-item{text-align:center}
.saibp-stats-box .stat-number{font-size:1.8rem;font-weight:800;display:block}
.saibp-stats-box .stat-label{font-size:.78rem;opacity:.85;margin-top:4px;display:block}

/* ── Expert quote ──────────────── */
blockquote.saibp-expert-quote{border-left:5px solid var(--saibp-green-lt);background:#f0fdf4;margin:28px 0;padding:18px 22px;border-radius:0 8px 8px 0;font-style:italic;color:var(--saibp-green-dark);font-size:1.02rem;line-height:1.7}
blockquote.saibp-expert-quote cite{display:block;margin-top:8px;font-size:.85rem;color:var(--saibp-green);font-style:normal;font-weight:700}

/* ── Benefits list ─────────────── */
ul.saibp-benefits-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;list-style:none;padding:0;margin:20px 0}
ul.saibp-benefits-list li{background:#fff;border:1px solid #e0e0e0;border-left:4px solid var(--saibp-green);border-radius:0 6px 6px 0;padding:10px 14px;font-size:.92rem;line-height:1.5}

/* ── Inline CTA ────────────────── */
.saibp-inline-cta{background:linear-gradient(135deg,var(--saibp-green-dark),var(--saibp-green));color:#fff;border-radius:10px;padding:24px 28px;margin:32px 0;text-align:center}
.saibp-inline-cta h3{color:#fff;margin:0 0 8px;font-size:1.3rem}
.saibp-inline-cta p{opacity:.9;margin:0 0 18px}

/* ── Lead form ─────────────────── */
.saibp-lead-form-wrap{background:linear-gradient(135deg,var(--saibp-green-dark),var(--saibp-green));border-radius:12px;padding:32px 36px;margin:40px 0;color:#fff}
@media(max-width:600px){.saibp-lead-form-wrap{padding:22px 16px}}
.saibp-lead-form__title{margin:0 0 6px;font-size:1.5rem;color:#fff;font-weight:800}
.saibp-lead-form__subtitle{margin:0 0 22px;opacity:.85;font-size:.93rem}
.saibp-form-row{margin-bottom:14px}
.saibp-form-row--2col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.saibp-form-row--2col{grid-template-columns:1fr}}
.saibp-form-group{display:flex;flex-direction:column}
.saibp-form-group label{font-size:.82rem;font-weight:600;color:rgba(255,255,255,.85);margin-bottom:4px}
.saibp-form-group input,.saibp-form-group select,.saibp-form-group textarea{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:9px 13px;color:#fff;font-size:.93rem;outline:none;width:100%;box-sizing:border-box;transition:border-color .2s}
.saibp-form-group input:focus,.saibp-form-group select:focus,.saibp-form-group textarea:focus{border-color:var(--saibp-wa);background:rgba(255,255,255,.18)}
.saibp-form-group input::placeholder,.saibp-form-group textarea::placeholder{color:rgba(255,255,255,.5)}
.saibp-form-group select option{color:#222;background:#fff}
.saibp-form-group--checkbox{flex-direction:row;align-items:center;gap:10px}
.saibp-form-group--checkbox label{font-size:.84rem;font-weight:400;color:rgba(255,255,255,.8);margin:0}

/* ── Buttons ───────────────────── */
.saibp-btn{display:inline-block;border:none;border-radius:6px;cursor:pointer;font-weight:700;font-size:.93rem;padding:11px 22px;text-decoration:none;transition:background .2s,transform .1s;text-align:center;line-height:1.4}
.saibp-btn--primary{background:var(--saibp-wa);color:#fff}
.saibp-btn--primary:hover{background:#1da851;transform:translateY(-1px);color:#fff}
.saibp-btn--lg{padding:13px 30px;font-size:1rem;width:100%;display:block}
.saibp-btn--whatsapp{background:var(--saibp-wa);color:#fff}
.saibp-btn--whatsapp:hover{background:#1da851;color:#fff}

/* ── Notices ───────────────────── */
.saibp-notice{padding:13px 16px;border-radius:6px;margin-bottom:14px;font-weight:600;font-size:.93rem}
.saibp-notice--success{background:#d1e7dd;color:#0f5132}
.saibp-notice--error{background:#f8d7da;color:#842029}

/* ── CTA block ─────────────────── */
.saibp-cta-block{background:#f0fdf4;border:2px solid var(--saibp-green-lt);border-radius:10px;padding:24px 28px;margin:32px 0;text-align:center}
.saibp-cta-block h3{color:var(--saibp-green-dark);font-size:1.35rem;margin:0 0 8px}
.saibp-cta-block p{color:#555;margin:0 0 18px}
.saibp-cta-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ── Author box ────────────────── */
.saibp-author-box{display:flex;gap:18px;align-items:flex-start;background:#f8faf9;border:1px solid #e0e0e0;border-radius:10px;padding:22px 26px;margin:32px 0}
@media(max-width:500px){.saibp-author-box{flex-direction:column;align-items:center;text-align:center}}
.saibp-author-box img{border-radius:50%;flex-shrink:0;width:76px;height:76px;object-fit:cover}

/* ── Related posts ─────────────── */
.saibp-related-posts{margin:36px 0}
.saibp-related-posts h3{color:var(--saibp-green-dark);border-bottom:3px solid var(--saibp-green-lt);padding-bottom:8px;margin-bottom:18px}
.saibp-related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.saibp-related-card{display:block;background:#fff;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden;text-decoration:none;transition:box-shadow .2s}
.saibp-related-card:hover{box-shadow:0 4px 18px rgba(0,0,0,.1)}
.saibp-related-card img{width:100%;height:130px;object-fit:cover;display:block}
.saibp-related-card-thumb-empty{width:100%;height:130px;background:linear-gradient(135deg,var(--saibp-green-dark),var(--saibp-green-lt));display:flex;align-items:center;justify-content:center;font-size:2rem}
.saibp-related-card-body{padding:12px}
.saibp-related-card-title{margin:0;color:var(--saibp-green-dark);font-weight:600;font-size:.88rem;line-height:1.4}
.saibp-related-card-date{font-size:.74rem;color:#888;margin-top:5px;display:block}

/* ── Pillar link ───────────────── */
a.saibp-pillar-link{color:var(--saibp-green-dark);font-weight:600;border-bottom:2px solid var(--saibp-green-lt);text-decoration:none}
a.saibp-pillar-link:hover{color:var(--saibp-green)}

/* ── WhatsApp float ────────────── */
.saibp-wa-float{position:fixed;bottom:24px;right:24px;z-index:9999;background:var(--saibp-wa);color:#fff;border-radius:50px;padding:11px 18px 11px 13px;display:flex;align-items:center;gap:9px;box-shadow:0 4px 16px rgba(37,211,102,.4);text-decoration:none;font-weight:700;font-size:.88rem;transition:transform .2s,box-shadow .2s}
.saibp-wa-float:hover{transform:scale(1.05) translateY(-2px);box-shadow:0 6px 22px rgba(37,211,102,.5);color:#fff}
@media(max-width:480px){.saibp-wa-float{padding:12px;border-radius:50%}.saibp-wa-label{display:none}}

/* ── Hindi font ────────────────── */
.saibp-lang-hindi{font-family:'Noto Sans Devanagari',Mangal,Arial,sans-serif;line-height:1.9}

/* ── Responsive ────────────────── */
@media(max-width:768px){
  .saibp-stats-box{grid-template-columns:repeat(2,1fr)}
  .saibp-lead-form-wrap{padding:22px 16px}
  ul.saibp-benefits-list{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════════
   SAIBP Ultra Blog Styles — Content Elements
   ═══════════════════════════════════════════════════ */

/* Stats Box */
.saibp-stats-box {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 18px;
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border: 1px solid #bbf7d0;
    border-radius: 14px;
    padding: 28px 24px;
    margin: 32px 0;
}
.saibp-stats-box .stat-item {
    text-align: center;
    padding: 12px;
}
.saibp-stats-box .stat-number {
    display: block;
    font-size: 2rem;
    font-weight: 800;
    color: #15803d;
    line-height: 1.1;
}
.saibp-stats-box .stat-label {
    display: block;
    font-size: .78rem;
    color: #4b5563;
    margin-top: 6px;
    font-weight: 500;
}

/* Expert Quote */
.saibp-expert-quote {
    background: #fffbeb;
    border-left: 5px solid #f59e0b;
    border-radius: 0 10px 10px 0;
    padding: 22px 28px;
    margin: 32px 0;
    font-style: italic;
}
.saibp-expert-quote p {
    font-size: 1.08rem;
    line-height: 1.75;
    color: #1f2937;
    margin: 0 0 10px;
}
.saibp-expert-quote cite {
    font-size: .82rem;
    color: #6b7280;
    font-style: normal;
    font-weight: 600;
}

/* Definition Box */
.saibp-definition-box {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    padding: 20px 24px;
    margin: 24px 0;
    font-size: .95rem;
    line-height: 1.7;
    color: #1e40af;
}

/* Benefits List */
.saibp-benefits-list {
    list-style: none;
    padding: 0;
    margin: 24px 0;
}
.saibp-benefits-list li {
    padding: 14px 18px 14px 48px;
    position: relative;
    border-bottom: 1px solid #f3f4f6;
    line-height: 1.65;
}
.saibp-benefits-list li:before {
    content: "✅";
    position: absolute;
    left: 14px;
    top: 14px;
    font-size: 1rem;
}
.saibp-benefits-list li:last-child { border-bottom: none; }

/* Comparison Table */
.saibp-compare-table {
    width: 100%;
    border-collapse: collapse;
    margin: 28px 0;
    font-size: .9rem;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.07);
}
.saibp-compare-table thead tr {
    background: #15803d;
    color: #fff;
}
.saibp-compare-table th,
.saibp-compare-table td {
    padding: 13px 16px;
    text-align: left;
    border: 1px solid #e5e7eb;
}
.saibp-compare-table tbody tr:nth-child(even) { background: #f9fafb; }
.saibp-compare-table tbody tr:hover { background: #f0fdf4; }

/* Process Steps */
.saibp-process-list {
    counter-reset: none;
    padding: 0;
    margin: 24px 0;
    list-style: none;
}
.saibp-process-list li {
    padding: 14px 18px 14px 56px;
    position: relative;
    background: #f9fafb;
    border-radius: 8px;
    margin-bottom: 10px;
    counter-increment: saibp-process;
    border-left: 4px solid #15803d;
}
.saibp-process-steps {
    display: grid;
    gap: 16px;
    margin: 24px 0;
}
.saibp-process-steps .step {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    background: #f9fafb;
    border-radius: 10px;
    padding: 18px;
    border: 1px solid #e5e7eb;
}
.saibp-process-steps .step-num {
    background: #15803d;
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    border-radius: 50%;
    min-width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.saibp-process-steps .step p { margin: 4px 0 0; font-size: .9rem; color: #374151; }

/* Inline CTA */
.saibp-inline-cta {
    background: linear-gradient(135deg, #15803d 0%, #166534 100%);
    color: #fff;
    border-radius: 14px;
    padding: 36px 32px;
    margin: 40px 0;
    text-align: center;
}
.saibp-inline-cta h3 {
    font-size: 1.5rem;
    font-weight: 800;
    margin: 0 0 12px;
    color: #fff;
}
.saibp-inline-cta p {
    font-size: 1rem;
    opacity: .9;
    margin: 0 0 22px;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}
.saibp-cta-button {
    display: inline-block;
    background: #fff;
    color: #15803d;
    font-weight: 700;
    padding: 14px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-size: 1rem;
    transition: transform .15s, box-shadow .15s;
}
.saibp-cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,.2);
    color: #15803d;
    text-decoration: none;
}

/* FAQ */
.saibp-faq-item {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    margin-bottom: 12px;
    overflow: hidden;
}
.saibp-faq-q {
    background: #f9fafb;
    padding: 16px 20px;
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    color: #1f2937;
    cursor: pointer;
    border-bottom: 1px solid #e5e7eb;
}
.saibp-faq-a {
    padding: 16px 20px;
    color: #374151;
    line-height: 1.75;
}
.saibp-faq-a p { margin: 0; }

/* References */
.saibp-references-list {
    list-style: none;
    padding: 0;
    margin: 16px 0;
}
.saibp-references-list li {
    padding: 8px 0 8px 28px;
    position: relative;
    border-bottom: 1px solid #f3f4f6;
    font-size: .9rem;
}
.saibp-references-list li:before {
    content: "🔗";
    position: absolute;
    left: 0;
    top: 9px;
    font-size: .85rem;
}
.saibp-references-list a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}
.saibp-references-list a:hover { text-decoration: underline; }

/* Content Images */
.saibp-content-image { margin: 36px auto !important; }
.saibp-content-image figcaption {
    margin-top: 10px;
    font-size: .8rem;
    color: #9ca3af;
    text-align: center;
    font-style: italic;
}

/* Disclaimer */
.saibp-disclaimer {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 14px 18px;
    font-size: .8rem;
    color: #6b7280;
    margin-top: 32px;
}

/* Mobile */
@media (max-width: 640px) {
    .saibp-stats-box { grid-template-columns: 1fr 1fr; }
    .saibp-stats-box .stat-number { font-size: 1.5rem; }
    .saibp-inline-cta { padding: 24px 18px; }
    .saibp-compare-table { font-size: .78rem; }
    .saibp-compare-table th,
    .saibp-compare-table td { padding: 9px 10px; }
}