/*
Theme Name: VendorBazaar
Description: Blog theme for VendorBazaar. Header and footer are the website's own (generated by `php artisan blog:sync-shell`).
Version: 1.0
Author: VendorBazaar
Text Domain: vendorbazaar
*/
.bl{padding:28px 0 56px;background:var(--bg-soft,#f4f8fd)}
.bl .wrap{max-width:none;width:100%;margin:0 auto;padding:0 clamp(16px,3.2vw,56px)}
.bl-hero{padding:30px 0 22px}
.bl-hero h1{margin:0 0 8px;font-size:clamp(26px,4vw,38px);color:var(--ink,#0f1d33)}
.bl-hero p{margin:0;color:var(--muted,#5f6b7d);max-width:680px}
.bl-crumbs{font-size:13px;color:var(--muted,#5f6b7d);margin-bottom:10px}
.bl-crumbs a{color:var(--blue,#1a5fc8)}
.bl-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
.bl-card{background:#fff;border:1px solid var(--line,#e3e9f2);border-radius:var(--r,12px);overflow:hidden;box-shadow:var(--sh,0 2px 10px rgba(15,29,51,.06));display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.bl-card:hover{box-shadow:var(--sh-h,0 10px 28px rgba(15,29,51,.12));transform:translateY(-2px)}
.bl-card .im{display:block;aspect-ratio:16/9;background:var(--bg-blue,#eaf2fd);overflow:hidden}
.bl-card .im img{width:100%;height:100%;object-fit:cover}
.bl-card .bd{padding:16px 18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.bl-card h2{margin:0;font-size:18px;line-height:1.3}
.bl-card h2 a{color:var(--ink,#0f1d33)}
.bl-card h2 a:hover{color:var(--blue,#1a5fc8)}
.bl-card p{margin:0;color:var(--text,#3b4658);font-size:14.5px;line-height:1.55}
.bl-meta{font-size:12.5px;color:var(--muted,#5f6b7d)}
.bl-more{margin-top:auto;font-weight:600;font-size:14px;color:var(--blue,#1a5fc8)}
.bl-art{background:#fff;border:1px solid var(--line,#e3e9f2);border-radius:var(--r,12px);padding:clamp(18px,3vw,48px);min-width:0}
.bl-art h1{margin:0 0 10px;font-size:clamp(26px,4vw,38px);line-height:1.2;color:var(--ink,#0f1d33)}
.bl-art .feat{margin:18px -4px 22px;border-radius:var(--r,12px);overflow:hidden}
.bl-art .feat img{width:100%;height:auto;display:block}
.bl-body{color:var(--text,#3b4658);font-size:17px;line-height:1.75}
.bl-body h2,.bl-body h3,.bl-body h4{color:var(--ink,#0f1d33);line-height:1.3;margin:1.6em 0 .5em}
.bl-body a{color:var(--blue,#1a5fc8);text-decoration:underline}
.bl-body img{max-width:100%;height:auto;border-radius:8px}
.bl-body blockquote{margin:1.4em 0;padding:10px 18px;border-left:4px solid var(--blue,#1a5fc8);background:var(--bg-blue,#eaf2fd);border-radius:0 8px 8px 0}
.bl-body table{border-collapse:collapse;width:100%}
.bl-body th,.bl-body td{border:1px solid var(--line,#e3e9f2);padding:8px 10px;text-align:left}
.bl-nav{display:flex;justify-content:center;gap:8px;margin-top:30px;flex-wrap:wrap}
.bl-nav a,.bl-nav span{padding:8px 14px;border:1px solid var(--line,#e3e9f2);border-radius:999px;background:#fff;font-size:14px;color:var(--ink,#0f1d33)}
.bl-nav .current{background:var(--blue,#1a5fc8);color:#fff;border-color:var(--blue,#1a5fc8)}
.bl-search{display:flex;gap:8px;margin-top:16px;max-width:460px}
.bl-search input{flex:1;height:44px;border:1px solid var(--line,#e3e9f2);border-radius:999px;padding:0 16px;font:inherit}
.bl-search button{height:44px;padding:0 20px;border:0;border-radius:999px;background:var(--blue,#1a5fc8);color:#fff;font-weight:600;cursor:pointer}
.bl-empty{background:#fff;border:1px dashed var(--line,#e3e9f2);border-radius:var(--r,12px);padding:40px;text-align:center;color:var(--muted,#5f6b7d)}
.bl-pn{display:flex;justify-content:space-between;gap:14px;margin:22px 0 0;font-size:14px}
.bl-pn a{color:var(--blue,#1a5fc8);font-weight:600}

/* ---- full-width article layout ---- */
.bl-single .bl-title{padding:6px 0 22px}
.bl-single .bl-title h1{margin:0 0 12px;font-size:clamp(28px,4.2vw,46px);line-height:1.15;color:var(--ink,#0f1d33);letter-spacing:-.01em}
.bl-single .bl-title .lead{margin:0 0 12px;font-size:clamp(16px,1.6vw,19px);color:var(--text,#3b4658);line-height:1.6;max-width:1100px}
.bl-featured{margin:0 0 26px;border-radius:var(--r,12px);overflow:hidden;box-shadow:var(--sh,0 2px 10px rgba(15,29,51,.06));background:var(--bg-blue,#eaf2fd)}
.bl-featured img{display:block;width:100%;height:auto;max-height:560px;object-fit:cover}
.bl-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.bl-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
.bl-box{background:#fff;border:1px solid var(--line,#e3e9f2);border-radius:var(--r,12px);padding:20px}
.bl-box h3{margin:0 0 12px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#5f6b7d)}
.bl-toc{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.bl-toc a{display:block;padding:7px 10px;border-radius:8px;font-size:14px;color:var(--text,#3b4658);border-left:3px solid transparent}
.bl-toc a:hover,.bl-toc a.on{background:var(--bg-blue,#eaf2fd);color:var(--blue,#1a5fc8);border-left-color:var(--blue,#1a5fc8)}
.bl-cta{background:linear-gradient(135deg,#0f2a57,#1a5fc8);color:#fff;border:0}
.bl-cta h3{color:#cfe0fb}.bl-cta p{margin:0 0 14px;font-size:15px;line-height:1.55}
.bl-cta a.btn{display:inline-block;background:#fff;color:#0f2a57;font-weight:700;padding:10px 18px;border-radius:999px;text-decoration:none;font-size:14px}
.bl-body{font-size:18px;line-height:1.8}
.bl-body h2{font-size:clamp(23px,2.4vw,30px);margin-top:1.9em;padding-bottom:.35em;border-bottom:1px solid var(--line,#e3e9f2);scroll-margin-top:100px}
.bl-body h2:first-child{margin-top:0}
.bl-body h3{font-size:20px}
.bl-body figure{margin:1.8em 0}.bl-body figure img{width:100%;border-radius:var(--r,12px);display:block}
.bl-body figcaption{margin-top:8px;font-size:13.5px;color:var(--muted,#5f6b7d);text-align:center}
.bl-body ul,.bl-body ol{padding-left:1.3em}.bl-body li{margin:.35em 0}
.bl-body .bl-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin:1.6em 0;padding:0;list-style:none;counter-reset:s}
.bl-body .bl-steps li{margin:0;background:var(--bg-soft,#f4f8fd);border:1px solid var(--line,#e3e9f2);border-radius:var(--r,12px);padding:22px 20px 20px;counter-increment:s}
.bl-body .bl-steps li:before{content:counter(s);display:grid;place-items:center;width:34px;height:34px;margin-bottom:12px;border-radius:50%;background:var(--blue,#1a5fc8);color:#fff;font-weight:700;font-size:15px}
.bl-body .bl-steps b{display:block;color:var(--ink,#0f1d33);font-size:17px;margin-bottom:4px}
.bl-body .bl-steps span{font-size:15px;line-height:1.55;display:block}
.bl-body .bl-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:1.4em 0}
.bl-body .bl-card2{background:#fff;border:1px solid var(--line,#e3e9f2);border-radius:var(--r,12px);padding:20px;box-shadow:var(--sh,0 2px 10px rgba(15,29,51,.05))}
.bl-body .bl-card2 h4{margin:0 0 8px;font-size:17px}.bl-body .bl-card2 ul{margin:0;font-size:15.5px;line-height:1.6}
.bl-body .bl-note{margin:1.6em 0;padding:16px 20px;border-radius:0 var(--r,12px) var(--r,12px) 0;border-left:4px solid #1a5fc8;background:#eaf2fd;font-size:16.5px;line-height:1.65}
.bl-body .bl-note.warn{border-left-color:#d98a00;background:#fff6e0}
.bl-body table{margin:1.4em 0;font-size:16px}.bl-body th{background:var(--bg-blue,#eaf2fd);color:var(--ink,#0f1d33)}
.bl-body details{border:1px solid var(--line,#e3e9f2);border-radius:10px;padding:14px 18px;margin:10px 0;background:#fff}
.bl-body summary{cursor:pointer;font-weight:600;color:var(--ink,#0f1d33)}
.bl-body details p{margin:10px 0 0}
@media(max-width:1000px){.bl-layout{grid-template-columns:minmax(0,1fr)}.bl-side{position:static;order:-1}.bl-toc-box{display:none}}
@media(max-width:600px){.bl-body{font-size:16.5px}.bl-grid{grid-template-columns:1fr}}