/* =========================================================
   Blossom Beauty Care — Blog
   Premium Deep Plum / Blossom Coral theme
   Scoped to blog components
   ========================================================= */

body{
    background:#FFFDFC;
    color:#3B2932;
}

/* Layout */
.rr-blog-layout{
    max-width:1240px;
    margin:42px auto 70px;
    padding:0 22px;
    display:grid;
    grid-template-columns:minmax(0,820px) 320px;
    gap:34px;
}

.rr-blog-main{min-width:0}

/* Article */
.rr-blog{
    background:#FFFDFC;
    border:1px solid #EAD8D3;
    border-radius:24px;
    padding:34px;
    box-shadow:0 12px 36px rgba(74,38,58,.08);
}

.rr-blog-title{
    margin:0 0 20px;
    color:#4A263A;
    font-size:clamp(2rem,4vw,2.8rem);
    line-height:1.18;
    font-weight:800;
    letter-spacing:-.025em;
}

.rr-blog-content{
    color:#3B2932;
    font-size:17px;
    line-height:1.78;
}

.rr-blog-content p{margin:0 0 16px}

.rr-blog-content h2{
    margin:34px 0 13px;
    padding-left:15px;
    border-left:4px solid #E77972;
    color:#4A263A;
    font-size:clamp(1.45rem,3vw,1.85rem);
    line-height:1.3;
    font-weight:800;
}

.rr-blog-content h3{
    margin:25px 0 9px;
    color:#6A4053;
    font-size:1.3rem;
    line-height:1.35;
    font-weight:750;
}

.rr-blog-content a{
    color:#D56560;
    text-decoration:none;
    border-bottom:1px solid rgba(213,101,96,.28);
}

.rr-blog-content a:hover{
    color:#4A263A;
    border-bottom-color:#4A263A;
}

/* Featured image */
.rr-blog-featured-image{
    margin:0 0 25px;
    overflow:hidden;
    border-radius:19px;
    box-shadow:0 12px 32px rgba(74,38,58,.12);
    background:#FBF4F1;
}

.rr-blog-featured-image img{
    display:block;
    width:100%;
    height:auto;
    max-height:520px;
    object-fit:cover;
}

/* Content images */
.rr-blog-figure{margin:25px 0}

.rr-blog-figure img{
    display:block;
    width:100%;
    max-width:700px;
    max-height:520px;
    height:auto;
    margin:0 auto;
    object-fit:cover;
    border-radius:17px;
    box-shadow:0 10px 28px rgba(74,38,58,.10);
}

.rr-blog-figure figcaption{
    margin-top:10px;
    text-align:center;
    color:#735F68;
    font-size:13px;
}

/* Lists */
.rr-blog-content ul:not(.rr-toc-list),
.rr-blog-content ol{
    margin:12px 0 18px 24px;
    padding:0;
}

.rr-blog-content ul:not(.rr-toc-list){list-style:disc}
.rr-blog-content ol{list-style:decimal}

.rr-blog-content li{
    margin-bottom:6px;
    line-height:1.72;
}

.rr-blog-content li:last-child{margin-bottom:0}

.rr-blog-content li::marker{color:#E77972}

/* Blockquote */
.rr-blog-content blockquote{
    margin:26px 0;
    padding:20px 23px;
    background:linear-gradient(135deg,#FBF4F1,#F8E9E4);
    border-left:4px solid #E77972;
    border-radius:13px;
    color:#4A263A;
}

/* Tables */
.rr-table-wrap{
    overflow-x:auto;
    margin:26px 0;
    border-radius:13px;
}

.rr-blog-content table{
    width:100%;
    min-width:560px;
    border-collapse:collapse;
    background:#FFFDFC;
    font-size:15px;
}

.rr-blog-content th{
    background:#F8E9E4;
    color:#4A263A;
    font-weight:800;
}

.rr-blog-content td,
.rr-blog-content th{
    padding:12px 13px;
    border:1px solid #EAD8D3;
}

.rr-blog-content hr{
    border:0;
    height:1px;
    margin:34px 0;
    background:#EAD8D3;
}

/* TOC */
.rr-toc{
    margin:20px 0 26px;
    padding:16px 18px;
    background:#FBF4F1;
    border:1px solid #EAD8D3;
    border-radius:15px;
}

.rr-toc-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:9px;
}

.rr-toc-title{
    color:#4A263A;
    font-size:15px;
    font-weight:800;
}

.rr-toc-toggle{
    padding:0;
    border:0;
    background:none;
    color:#D56560;
    cursor:pointer;
    font-size:12px;
    font-weight:800;
}

.rr-toc-list{
    margin:0;
    padding-left:18px;
}

.rr-toc-item{margin-bottom:3px}
.rr-toc-item:last-child{margin-bottom:0}

.rr-toc-item a{
    display:block;
    color:#735F68;
    font-size:13px;
    line-height:1.4;
    text-decoration:none;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    border:0;
}

.rr-toc-item a:hover{color:#E77972}

/* Sidebar */
.rr-blog-sidebar{
    position:sticky;
    top:110px;
    align-self:start;
    padding:20px;
    background:#4A263A;
    border:1px solid rgba(244,181,157,.28);
    border-radius:22px;
    box-shadow:0 15px 38px rgba(74,38,58,.18);
}

.rr-sidebar-search{
    margin-bottom:20px;
    overflow:hidden;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(244,181,157,.25);
    border-radius:12px;
}

.rr-sidebar-search form{display:flex}

.rr-sidebar-search input{
    flex:1;
    min-width:0;
    padding:13px;
    border:0;
    outline:0;
    background:transparent;
    color:#fff;
    font-size:14px;
}

.rr-sidebar-search input::placeholder{color:rgba(255,255,255,.62)}

.rr-sidebar-search button{
    width:48px;
    border:0;
    background:#E77972;
    color:#fff;
    cursor:pointer;
    transition:.2s ease;
}

.rr-sidebar-search button:hover{background:#D56560}

.rr-sidebar-title{
    margin:0 0 17px;
    padding:11px 13px;
    color:#fff;
    background:rgba(255,255,255,.07);
    border-left:4px solid #F4B59D;
    border-radius:9px;
    font-size:17px;
    font-weight:800;
}

/* Related posts */
.rr-blog-sidebar .rr-blog-card{
    display:flex;
    gap:10px;
    margin-bottom:13px;
    padding:9px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(244,181,157,.14);
    border-radius:13px;
    transition:.25s ease;
}

.rr-blog-sidebar .rr-blog-card:hover{
    transform:translateY(-2px);
    background:rgba(255,255,255,.10);
    border-color:rgba(244,181,157,.30);
}

.rr-blog-sidebar .rr-blog-thumb{
    flex:0 0 82px;
}

.rr-blog-sidebar .rr-blog-thumb img{
    display:block;
    width:82px;
    height:62px;
    object-fit:cover;
    border-radius:8px;
}

.rr-blog-sidebar .rr-blog-body{
    flex:1;
    min-width:0;
}

.rr-blog-sidebar .rr-blog-title{
    margin:0;
    font-size:13px;
    line-height:1.4;
    font-weight:700;
}

.rr-blog-sidebar .rr-blog-title a{
    color:#FFFDFC;
    border:0;
}

.rr-blog-sidebar .rr-blog-title a:hover{color:#F4B59D}

.rr-blog-sidebar .rr-excerpt,
.rr-blog-sidebar .rr-date{display:none}

/* Pagination */
.rr-pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:7px;
    margin:45px 0 20px;
}

.rr-pagination a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:40px;
    height:40px;
    padding:0 11px;
    color:#4A263A;
    background:#FFFDFC;
    border:1px solid #EAD8D3;
    border-radius:10px;
    text-decoration:none;
    font-size:14px;
    font-weight:750;
    transition:.2s ease;
}

.rr-pagination a:hover{
    color:#D56560;
    border-color:#E77972;
    background:#FBF4F1;
}

.rr-pagination a.active{
    color:#fff;
    background:#E77972;
    border-color:#E77972;
    box-shadow:0 7px 17px rgba(231,121,114,.25);
}

.rr-pagination span{color:#735F68;padding:0 4px}

/* Author meta */
.rr-author-meta{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 0 22px;
    padding:12px 14px;
    background:#FBF4F1;
    border:1px solid #EAD8D3;
    border-radius:13px;
}

.rr-author-meta-image{
    width:52px;
    height:52px;
    flex:0 0 52px;
    overflow:hidden;
    border:2px solid #fff;
    border-radius:50%;
    box-shadow:0 4px 12px rgba(74,38,58,.12);
}

.rr-author-meta-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
}

.rr-author-meta-content{min-width:0}

.rr-author-meta-name{
    margin:0 0 2px;
    color:#4A263A;
    font-size:16px;
    line-height:1.3;
    font-weight:800;
}

.rr-author-meta-role{
    margin:0;
    color:#735F68;
    font-size:13px;
    line-height:1.45;
}

.rr-author-meta-experience{
    display:inline-block;
    margin-top:3px;
    color:#D56560;
    font-size:12px;
    line-height:1.4;
    font-weight:750;
}

.rr-author-meta-date{
    display:inline-block;
    margin:3px 0 0 10px;
    padding-left:10px;
    border-left:1px solid #DCC7C1;
    color:#735F68;
    font-size:12px;
    line-height:1.4;
    font-weight:600;
}

/* Author biography */
.rr-author-bio{
    display:flex;
    align-items:flex-start;
    gap:20px;
    margin:34px 0 4px;
    padding:22px;
    background:linear-gradient(135deg,#FBF4F1,#FFFDFC);
    border:1px solid #EAD8D3;
    border-left:4px solid #E77972;
    border-radius:15px;
}

.rr-author-bio-image{
    width:100px;
    height:114px;
    flex:0 0 100px;
    overflow:hidden;
    border-radius:12px;
    background:#FFFDFC;
    box-shadow:0 7px 19px rgba(74,38,58,.12);
}

.rr-author-bio-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
}

.rr-author-bio-content{min-width:0;flex:1}

.rr-author-bio-label{
    margin:0 0 5px;
    color:#D56560;
    font-size:11px;
    line-height:1.3;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.rr-author-bio-name{
    margin:0 0 4px;
    color:#4A263A;
    font-size:21px;
    line-height:1.3;
    font-weight:800;
}

.rr-author-bio-role{
    margin:0 0 9px;
    color:#6A4053;
    font-size:14px;
    line-height:1.5;
    font-weight:750;
}

.rr-author-bio-text{
    margin:0;
    color:#735F68;
    font-size:15px;
    line-height:1.7;
}

/* Responsive */
@media(max-width:1024px){
    .rr-blog-layout{
        grid-template-columns:1fr;
        max-width:900px;
    }

    .rr-blog-sidebar{
        position:static;
        margin-top:0;
    }
}

@media(max-width:768px){
    .rr-blog-layout{
        margin:24px auto 50px;
        padding:0 15px;
    }

    .rr-blog{
        padding:21px;
        border-radius:19px;
    }

    .rr-blog-title{font-size:27px}

    .rr-blog-content{
        font-size:16px;
        line-height:1.72;
    }

    .rr-blog-content h2{font-size:23px;margin-top:28px}
    .rr-blog-content h3{font-size:19px}

    .rr-blog-featured-image{border-radius:15px}
    .rr-blog-featured-image img{max-height:420px}

    .rr-blog-figure img{
        width:100%;
        max-height:430px;
        border-radius:14px;
    }

    .rr-blog-sidebar{
        padding:16px;
        border-radius:18px;
    }

    .rr-author-meta{
        padding:10px 12px;
        margin-bottom:18px;
    }

    .rr-author-meta-image{
        width:46px;
        height:46px;
        flex-basis:46px;
    }

    .rr-author-meta-name{font-size:15px}
    .rr-author-meta-role{font-size:12px}

    .rr-author-bio{
        gap:14px;
        padding:17px;
        margin-top:27px;
    }

    .rr-author-bio-image{
        width:78px;
        height:90px;
        flex-basis:78px;
    }

    .rr-author-bio-name{font-size:19px}
    .rr-author-bio-role{font-size:13px}
    .rr-author-bio-text{font-size:14px;line-height:1.65}
}

@media(max-width:520px){
    .rr-blog-layout{padding:0 12px}

    .rr-blog{
        padding:17px;
        border-radius:17px;
    }

    .rr-blog-title{font-size:24px}

    .rr-blog-content{font-size:15.7px}

    .rr-blog-content h2{
        padding-left:12px;
        border-left-width:3px;
        font-size:21px;
    }

    .rr-blog-content h3{font-size:18px}

    .rr-blog-featured-image img{
        max-height:320px;
    }

    .rr-blog-figure img{
        max-height:330px;
    }

    .rr-author-meta-experience,
    .rr-author-meta-date{display:block}

    .rr-author-meta-date{
        margin-left:0;
        padding-left:0;
        border-left:0;
    }

    .rr-author-bio{
        display:block;
    }

    .rr-author-bio-image{
        width:82px;
        height:94px;
        margin:0 0 14px;
    }

    .rr-pagination{margin-top:35px}
}

@media(prefers-reduced-motion:reduce){
    .rr-blog-layout *{
        transition:none!important;
        animation:none!important;
    }
}
