/*
 * SARGODEANS FURNITURE
 * Permanent Premium Blog Article Design
 * v1.2.22
 *
 * This stylesheet is intentionally scoped to .sf-blog-rich so ordinary site
 * pages remain untouched. blog_post.php also carries a compact critical copy
 * so the article remains designed even if a browser has stale external CSS.
 */

.sf-blog-rich{
    width:100%;
    max-width:900px;
    margin:0 auto;
    color:#39433f;
    font-family:var(--font-body,"Poppins",Arial,sans-serif);
    font-size:17px;
    line-height:1.9;
    overflow-wrap:anywhere;
    word-break:normal;
}
.sf-blog-rich>*:first-child{margin-top:0!important}
.sf-blog-rich>*:last-child{margin-bottom:0!important}
.sf-blog-rich p{margin:0 0 22px!important;color:#3d4542!important}
.sf-blog-rich strong{color:#202623!important;font-weight:750!important}
.sf-blog-rich em{font-style:italic}

.sf-blog-rich h2,
.sf-blog-rich h3,
.sf-blog-rich h4{
    position:relative;
    color:#102b24!important;
    font-family:var(--font-display,"Cormorant Garamond",Georgia,serif)!important;
    font-weight:700!important;
    letter-spacing:-.015em;
}
.sf-blog-rich h2{
    margin:52px 0 20px!important;
    padding:15px 18px 15px 24px!important;
    border-left:4px solid #C8A45C!important;
    border-radius:0 13px 13px 0;
    background:linear-gradient(90deg,rgba(200,164,92,.11),rgba(248,246,241,.62) 48%,rgba(255,255,255,0));
    font-size:clamp(1.85rem,3vw,2.42rem)!important;
    line-height:1.2!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.sf-blog-rich h2:after{
    content:"";
    position:absolute;
    left:24px;
    bottom:7px;
    width:54px;
    height:2px;
    border-radius:999px;
    background:#C8A45C;
}
.sf-blog-rich h3{
    margin:36px 0 15px!important;
    padding-left:17px!important;
    font-size:clamp(1.48rem,2.5vw,1.92rem)!important;
    line-height:1.28!important;
}
.sf-blog-rich h3:before{
    content:"";
    position:absolute;
    left:0;
    top:.27em;
    width:4px;
    height:1.05em;
    border-radius:999px;
    background:#C8A45C;
}
.sf-blog-rich h4{margin:29px 0 12px!important;font-size:clamp(1.22rem,2vw,1.52rem)!important;line-height:1.35!important}

/* Premium bullet cards. */
.sf-blog-rich ul{
    list-style:none!important;
    margin:10px 0 30px!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
}
.sf-blog-rich ul>li{
    display:block!important;
    position:relative!important;
    margin:0!important;
    min-height:46px;
    padding:11px 16px 11px 44px!important;
    border:1px solid rgba(200,164,92,.25)!important;
    border-radius:12px!important;
    background:linear-gradient(135deg,#fbfaf7,#fff)!important;
    color:#39433f!important;
    line-height:1.62!important;
    box-shadow:0 5px 18px rgba(16,43,36,.035);
}
.sf-blog-rich ul>li:before{
    content:"✓"!important;
    position:absolute!important;
    left:14px!important;
    top:12px!important;
    width:20px!important;
    height:20px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:#C8A45C!important;
    color:#fff!important;
    font-size:11px!important;
    font-weight:900!important;
    line-height:1!important;
    box-shadow:0 0 0 4px rgba(200,164,92,.12)!important;
}
.sf-blog-rich ul>li::marker{content:""!important}

/* Premium numbered cards. */
.sf-blog-rich ol{
    counter-reset:sf-blog-premium!important;
    list-style:none!important;
    margin:10px 0 30px!important;
    padding:0!important;
    display:grid!important;
    gap:10px!important;
}
.sf-blog-rich ol>li{
    counter-increment:sf-blog-premium!important;
    display:block!important;
    position:relative!important;
    margin:0!important;
    min-height:48px!important;
    padding:11px 16px 11px 55px!important;
    border:1px solid rgba(16,43,36,.09)!important;
    border-radius:12px!important;
    background:#fff!important;
    color:#39433f!important;
    line-height:1.62!important;
}
.sf-blog-rich ol>li:before{
    content:counter(sf-blog-premium)!important;
    position:absolute!important;
    left:12px!important;
    top:8px!important;
    width:32px!important;
    height:32px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:#102b24!important;
    color:#fff!important;
    font-size:.8rem!important;
    font-weight:800!important;
    box-shadow:0 5px 13px rgba(16,43,36,.15)!important;
}
.sf-blog-rich ol>li::marker{content:""!important}

.sf-blog-rich blockquote{
    position:relative!important;
    margin:38px 0!important;
    padding:26px 62px 26px 30px!important;
    border:1px solid rgba(200,164,92,.28)!important;
    border-left:4px solid #C8A45C!important;
    border-radius:0 14px 14px 0!important;
    background:linear-gradient(135deg,#f8f6f1,#fff)!important;
    box-shadow:0 10px 28px rgba(16,43,36,.06)!important;
    color:#34403b!important;
    font-family:var(--font-display,"Cormorant Garamond",Georgia,serif)!important;
    font-size:clamp(1.2rem,2vw,1.48rem)!important;
    line-height:1.62!important;
    font-style:italic!important;
}
.sf-blog-rich blockquote:after{
    content:"“";
    position:absolute;
    right:18px;
    top:-3px;
    color:rgba(200,164,92,.22);
    font-family:Georgia,serif;
    font-size:5rem;
    line-height:1;
}

.sf-blog-rich a{color:#183c32!important;text-decoration:underline!important;text-decoration-color:#C8A45C!important;text-underline-offset:3px}
.sf-blog-rich a:hover{color:#C8A45C!important}
.sf-blog-rich img{display:block!important;width:auto!important;max-width:100%!important;height:auto!important;margin:32px auto!important;border-radius:13px!important;box-shadow:0 12px 30px rgba(16,43,36,.08)!important}
.sf-blog-rich hr{width:90px!important;margin:42px auto!important;border:0!important;border-top:2px solid #C8A45C!important}

.blog-home-cta{max-width:900px;margin:48px auto 8px;padding:30px 32px;display:flex;align-items:center;justify-content:space-between;gap:26px;border:1px solid rgba(200,164,92,.34);border-radius:16px;background:linear-gradient(135deg,#f8f6f1,#fff);box-shadow:0 12px 32px rgba(16,43,36,.07)}
.blog-home-cta-copy{min-width:0;max-width:650px}.blog-home-cta-kicker{display:block;margin-bottom:7px;color:#C8A45C;font-size:.76rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.blog-home-cta h2{margin:0 0 8px;color:#102b24;font-family:var(--font-display,"Cormorant Garamond",Georgia,serif);font-size:clamp(1.6rem,2.4vw,2.05rem);line-height:1.2}.blog-home-cta p{margin:0;color:#58605d;line-height:1.65}.blog-home-cta-button{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:999px;background:#102b24;color:#fff;text-decoration:none;font-weight:800;white-space:nowrap}.blog-home-cta-button:hover{background:#183c32}

@media(max-width:768px){
    .sf-blog-rich{max-width:100%;font-size:16px;line-height:1.8}
    .sf-blog-rich p{margin-bottom:20px!important}
    .sf-blog-rich h2{margin-top:39px!important;padding:13px 14px 13px 18px!important;font-size:clamp(1.58rem,7vw,2rem)!important;border-radius:0 10px 10px 0}
    .sf-blog-rich h2:after{left:18px;width:43px}
    .sf-blog-rich h3{margin-top:30px!important;font-size:clamp(1.34rem,6vw,1.68rem)!important}
    .sf-blog-rich h4{font-size:1.25rem!important}
    .sf-blog-rich ul>li{padding:10px 12px 10px 40px!important;border-radius:10px!important}
    .sf-blog-rich ul>li:before{left:12px!important;top:11px!important;width:18px!important;height:18px!important}
    .sf-blog-rich ol>li{padding:10px 12px 10px 49px!important;border-radius:10px!important}
    .sf-blog-rich ol>li:before{left:10px!important;top:8px!important;width:29px!important;height:29px!important}
    .sf-blog-rich blockquote{margin:30px 0!important;padding:21px 42px 21px 21px!important;font-size:1.13rem!important;border-radius:0 10px 10px 0!important}
    .blog-home-cta{margin-top:36px;padding:23px;flex-direction:column;align-items:stretch;gap:18px}.blog-home-cta-button{width:100%}
}
@media(max-width:480px){
    .sf-blog-rich{font-size:15.5px;line-height:1.76}
    .sf-blog-rich h2{font-size:1.55rem!important}
    .sf-blog-rich h3{font-size:1.3rem!important}
    .sf-blog-rich ul>li,.sf-blog-rich ol>li{font-size:15px!important}
    .sf-blog-rich blockquote{font-size:1.08rem!important}
    .sf-blog-rich img{margin:24px auto!important;border-radius:9px!important}
}
