/* Souqly pro blog — article page parts. Works on store themes (--p --tx --mu --sf --r) and on the Souqly site (--blue --ink --muted --line). */
:root{--sqb-p:var(--p,var(--blue,#3b5bfd));--sqb-tx:var(--tx,var(--ink,#0b1b3a));--sqb-mu:var(--mu,var(--muted,#5b6785));--sqb-sf:var(--sf,#fff);--sqb-r:var(--r,14px);
  --sqb-line:color-mix(in srgb,var(--sqb-tx) 12%,transparent);--sqb-soft:color-mix(in srgb,var(--sqb-p) 7%,transparent)}
.s-prose,.prose{line-height:1.85}
.s-prose h2,.prose h2,.s-prose h3,.prose h3{scroll-margin-top:90px}
.s-prose table,.prose table{width:100%;border-collapse:collapse;margin:20px 0;font-size:.95em;display:block;overflow-x:auto}
.s-prose th,.s-prose td,.prose th,.prose td{border:1px solid var(--sqb-line);padding:10px 12px;text-align:start}
.s-prose th,.prose th{background:var(--sqb-soft)}
.s-prose blockquote,.prose blockquote{margin:22px 0;padding:14px 20px;border-inline-start:4px solid var(--sqb-p);background:var(--sqb-soft);border-radius:0 var(--sqb-r) var(--sqb-r) 0;font-size:1.05em}
.s-prose a,.prose a{color:var(--sqb-p);text-underline-offset:3px}

/* Meta line under the title */
.sqb-meta{display:flex;align-items:center;gap:12px;margin:10px 0 18px;color:var(--sqb-mu);font-size:14px}
.sqb-meta img{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.sqb-meta b{color:var(--sqb-tx);font-size:15px}.sqb-meta b a{color:inherit;text-decoration:none}.sqb-meta small{display:block;font-size:13px}
.sqb-rev{font-size:13px}.sqb-rev a{color:var(--sqb-p)}

/* Table of contents */
.sqb-toc{border:1px solid var(--sqb-line);background:var(--sqb-sf);border-radius:var(--sqb-r);padding:14px 18px;margin:0 0 26px}
.sqb-toc summary{cursor:pointer;font-weight:800;display:flex;align-items:center;gap:8px;list-style:none;color:var(--sqb-tx)}
.sqb-toc summary::-webkit-details-marker{display:none}
.sqb-toc summary::after{content:'▾';margin-inline-start:auto;transition:transform .2s}.sqb-toc:not([open]) summary::after{transform:rotate(-90deg)}
.sqb-toc ol{margin:12px 0 2px;padding-inline-start:22px;display:grid;gap:6px}
.sqb-toc ol.plain{list-style:none;padding-inline-start:4px}
.sqb-toc ul{margin:6px 0 2px;padding-inline-start:18px;display:grid;gap:5px;list-style:circle;font-size:.95em}
.sqb-toc a{color:var(--sqb-tx);text-decoration:none;opacity:.85}.sqb-toc a:hover,.sqb-toc a.on{color:var(--sqb-p);opacity:1}

/* Callouts */
.sqb-call{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--sqb-r);margin:22px 0;border:1px solid transparent}
.sqb-call>div>:first-child{margin-top:0}.sqb-call>div>:last-child{margin-bottom:0}
.sqb-call-ic{flex:0 0 auto;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:#fff}
.sqb-tip{background:color-mix(in srgb,#16a34a 9%,transparent);border-color:color-mix(in srgb,#16a34a 25%,transparent)}.sqb-tip .sqb-call-ic{background:#16a34a}
.sqb-success{background:color-mix(in srgb,#0ea5e9 9%,transparent);border-color:color-mix(in srgb,#0ea5e9 25%,transparent)}.sqb-success .sqb-call-ic{background:#0ea5e9}
.sqb-warning{background:color-mix(in srgb,#f59e0b 11%,transparent);border-color:color-mix(in srgb,#f59e0b 30%,transparent)}.sqb-warning .sqb-call-ic{background:#d97706}
.sqb-note{background:var(--sqb-soft);border-color:color-mix(in srgb,var(--sqb-p) 22%,transparent)}.sqb-note .sqb-call-ic{background:var(--sqb-p)}

/* Buttons */
.sqb-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:999px;background:var(--sqb-p);color:#fff!important;font-weight:800;text-decoration:none!important;border:0;cursor:pointer;font:inherit;font-weight:800;box-shadow:0 8px 22px -10px var(--sqb-p);transition:transform .15s,filter .15s}
.sqb-btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.sqb-ghost{background:transparent;color:var(--sqb-tx)!important;border:1.5px solid var(--sqb-line);box-shadow:none}
.sqb-wa{background:#25d366}
.sqb-cta-inline{text-align:center;margin:26px 0}

/* Product / service / plan cards */
.sqb-card{display:flex;gap:18px;align-items:stretch;border:1px solid var(--sqb-line);background:var(--sqb-sf);border-radius:calc(var(--sqb-r) + 4px);padding:14px;margin:26px 0;box-shadow:0 14px 34px -24px rgba(0,0,0,.35)}
.sqb-card-img{flex:0 0 38%;max-width:240px;border-radius:var(--sqb-r);overflow:hidden;display:block;background:var(--sqb-soft)}
.sqb-card-img img{width:100%;height:100%;object-fit:cover;margin:0!important;border-radius:0!important;aspect-ratio:1}
.sqb-card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;justify-content:center;padding:4px}
.sqb-card h3{margin:0;font-size:1.25rem}.sqb-card h3 a{color:var(--sqb-tx);text-decoration:none}
.sqb-kicker{color:var(--sqb-p);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.sqb-price{margin:0;font-size:1.05rem}.sqb-price b{font-size:1.3rem;color:var(--sqb-tx)}.sqb-price s{color:var(--sqb-mu);margin-inline-start:6px}
.sqb-desc{margin:0;color:var(--sqb-mu);font-size:.95rem;line-height:1.6}
.sqb-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px;align-items:center}.sqb-row form{margin:0}
.sqb-out{color:#c0392b;font-weight:700}
.sqb-plan{background:linear-gradient(135deg,var(--sqb-soft),transparent 70%),var(--sqb-sf)}
.sqb-plan ul{list-style:none;padding:0;margin:4px 0;display:grid;gap:4px}.sqb-plan li{display:flex;gap:6px;align-items:center}.sqb-plan li svg{color:#16a34a}
.sqb-products{margin:24px 0}
.sqb-video{position:relative;aspect-ratio:16/9;margin:24px 0;border-radius:var(--sqb-r);overflow:hidden;background:#000}
.sqb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* FAQ, sources */
.sqb-faq{margin:36px 0 10px}.sqb-faq h2{margin-bottom:12px}
.sqb-faq details{border:1px solid var(--sqb-line);border-radius:var(--sqb-r);padding:0 16px;margin:0 0 10px;background:var(--sqb-sf)}
.sqb-faq summary{cursor:pointer;font-weight:700;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:10px}
.sqb-faq summary::-webkit-details-marker{display:none}.sqb-faq summary::after{content:'+';font-size:1.3em;line-height:1;color:var(--sqb-p)}.sqb-faq details[open] summary::after{content:'−'}
.sqb-faq details>div{padding:0 0 14px;color:var(--sqb-mu);line-height:1.75}
.sqb-sources{margin:26px 0;font-size:14px;color:var(--sqb-mu)}.sqb-sources h4{margin:0 0 6px;color:var(--sqb-tx)}.sqb-sources ol{margin:0;padding-inline-start:20px}.sqb-sources a{color:inherit}

/* Call-to-action box */
.sqb-cta-box{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:34px 0;padding:26px 28px;border-radius:calc(var(--sqb-r) + 6px);color:#fff;
  background:radial-gradient(120% 140% at 0% 0%,color-mix(in srgb,var(--sqb-p) 70%,#fff 0%) 0%,var(--sqb-p) 45%,color-mix(in srgb,var(--sqb-p) 60%,#000) 100%);box-shadow:0 24px 50px -28px var(--sqb-p)}
.sqb-cta-box h3{margin:0 0 4px;color:#fff;font-size:1.35rem}.sqb-cta-box p{margin:0;opacity:.92}
.sqb-cta-box .sqb-btn{background:#fff;color:var(--sqb-p)!important;box-shadow:none}.sqb-cta-box .sqb-wa{background:#25d366;color:#fff!important}

/* Share */
.sqb-share{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:26px 0;padding:14px 0;border-top:1px solid var(--sqb-line);border-bottom:1px solid var(--sqb-line)}
.sqb-share b{margin-inline-end:6px}
.sqb-share a,.sqb-share button{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;border:1px solid var(--sqb-line);color:var(--sqb-tx);text-decoration:none;font:inherit;font-size:13.5px;font-weight:700;background:transparent;cursor:pointer}
.sqb-share a:hover,.sqb-share button:hover{border-color:var(--sqb-p);color:var(--sqb-p)}
.sqb-share .s-wa-c{background:#25d366;border-color:#25d366;color:#fff}

/* Author box + author page */
.sqb-author{display:flex;gap:18px;align-items:flex-start;margin:30px 0;padding:22px;border:1px solid var(--sqb-line);border-radius:calc(var(--sqb-r) + 4px);background:var(--sqb-sf)}
.sqb-av-wrap{flex:0 0 auto}
.sqb-av{width:88px;height:88px;border-radius:50%;object-fit:cover;display:block;margin:0!important;box-shadow:0 0 0 4px var(--sqb-soft)}
.sqb-av-l{display:grid;place-items:center;background:var(--sqb-p);color:#fff;font-size:34px;font-weight:800}
.sqb-author-body{min-width:0;flex:1}
.sqb-author h3,.sqb-author h1{margin:2px 0 2px}.sqb-author h3 a{color:var(--sqb-tx);text-decoration:none}
.sqb-job{margin:0 0 8px;color:var(--sqb-p);font-weight:700}
.sqb-bio{margin:0 0 10px;color:var(--sqb-mu);line-height:1.7}
.sqb-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}.sqb-tags span{padding:4px 11px;border-radius:999px;background:var(--sqb-soft);color:var(--sqb-p);font-size:12.5px;font-weight:700}
.sqb-creds{list-style:none;padding:0;margin:0 0 12px;display:grid;gap:6px}.sqb-creds li{display:flex;gap:8px;align-items:center}.sqb-creds svg{color:#16a34a;flex:0 0 auto}
.sqb-links{display:flex;flex-wrap:wrap;gap:6px}
.sqb-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:999px;border:1px solid var(--sqb-line);color:var(--sqb-tx)!important;text-decoration:none!important;font-size:13px;font-weight:700}
.sqb-chip:hover{border-color:var(--sqb-p);color:var(--sqb-p)!important}.sqb-chip-wa{background:#25d366;border-color:#25d366;color:#fff!important}
.sqb-more{display:inline-block;margin-top:12px;font-weight:800;color:var(--sqb-p);text-decoration:none}
.sqb-author-full{padding:30px;align-items:center}.sqb-author-full .sqb-av{width:132px;height:132px}.sqb-author-full h1{font-size:clamp(28px,4vw,40px)}

/* Progress bar + sticky button */
.sqb-progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:9999;pointer-events:none}
.sqb-progress i{display:block;height:100%;width:0;background:var(--sqb-p);transition:width .1s linear}
.sqb-sticky{position:fixed;inset:auto 12px 12px 12px;z-index:900;display:none}
.sqb-sticky .sqb-btn{width:100%;padding:14px}
@media (max-width:720px){
  .sqb-sticky.on{display:block}
  .sqb-card{flex-direction:column}.sqb-card-img{max-width:none;flex-basis:auto}
  .sqb-author{flex-direction:column;align-items:flex-start}.sqb-author-full{align-items:center;text-align:center}.sqb-author-full .sqb-links,.sqb-author-full .sqb-tags{justify-content:center}
  .sqb-cta-box{padding:22px}.sqb-cta-box .sqb-btn{width:100%}
}