/* Blog 1 only: original Rhythm blocks; definitive Figma 531:2 and 531:326. */

.sa-blog .row{--bs-gutter-x:24px;}

.sa-blog .sa-cover .hs-line-7{margin-bottom:20px;}
.sa-blog .sa-cover .hs-line-6{margin:0;}

.sa-blog .sa-cover .col-md-4{padding-top:30px;align-self:flex-start;}
.sa-blog .sa-cover .row{align-items:flex-start;}
.sa-blog h2.section-title{margin:0 0 12px!important;}
.sa-blog .sa-guides{padding:80px 0 60px;}

.sa-blog .sa-guides .section-text p{margin:0;}
.sa-blog .sa-guides .section-text .col-md-6{width:100%;}
.sa-blog .sa-guide-grid{--bs-gutter-x:48px;margin-top:24px;}
.sa-blog .sa-guide-item{padding:16px 0;border-bottom:1px solid #ddd;}
.sa-blog .sa-guide-item h3{margin:0 0 12px;}
.sa-blog .sa-guide-item h3 a{display:flex;gap:16px;justify-content:space-between;}
.sa-blog .sa-guide-item h3 span{flex:0 0 24px;text-align:right;}
.sa-blog .sa-guide-item p{margin:0;}
.sa-blog .sa-guides>.container>.sa-glossary{margin:0;padding-top:24px;}
.sa-blog .sa-guides>.container>.sa-all-guides{margin:0;padding-top:27px;}
.sa-blog #stories{padding:80px 0 140px;}
.sa-blog #stories>.container>p{margin:0 0 48px!important;}
.sa-blog #stories .post-prev-img{margin-bottom:26px;}
.sa-blog #stories .post-prev-img img{display:block;aspect-ratio:403/258;object-fit:cover;}
.sa-blog #stories .post-prev-title{margin-bottom:3px;}
.sa-blog #stories .post-prev-info{margin-bottom:15px;}
.sa-blog #stories .post-prev-text{margin-bottom:15px;}
.sa-blog #stories .post-prev-more{padding-bottom:12.65px;}

.sa-blog #stories [data-blog-card]{margin-bottom:60px!important;}
.sa-blog .pagination{margin:30px 0 0;display:flex;gap:5px;align-items:flex-start;}
.sa-blog .pagination>a,.sa-blog .pagination>span{display:inline-flex;align-items:center;justify-content:center;width:46px;height:48.96875px;margin:0;padding:0;border-radius:3px;}
.sa-blog .pagination .fa{font-size:13px;}
.sa-blog .widget{margin-bottom:60px;}
.sa-blog .widget-title{margin-bottom:20px;padding-bottom:10px;}

.sa-blog .widget-posts-img{width:100px;margin-right:12px;}



.sa-blog .tags a{margin-right:6.125px;}
.sa-blog footer.footer{padding:70px 0 109px!important;min-height:0;}
.sa-blog .footer-social-links{height:54px;line-height:54px;margin-bottom:46px!important;}
.sa-blog .footer-social-links a{width:54px;height:54px;line-height:54px;opacity:1;}
.sa-blog .footer-social-links a:before{opacity:.85;}
.sa-blog .footer-social-links a i{font-size:28px;top:6px;}
.sa-blog .footer-copy{margin-bottom:10px;}
.sa-blog .footer-made{opacity:1;}

.sa-blog footer .link-to-top{display:none;}
.sa-blog .blog-mobile-break{display:none;}
@media (max-width:767px){
.sa-blog .sa-cover{background-image:url("../images/redesign/532-102.webp")!important;}
.sa-blog .sa-cover .hs-line-7{margin-bottom:10px;}

.sa-blog .sa-cover .col-md-4{padding-top:0;margin-top:25px!important;}


.sa-blog .sa-guides{padding:60px 0;}

.sa-blog .sa-guide-grid{--bs-gutter-x:24px;}


.sa-blog #stories{padding:60px 0 70px;}

.sa-blog #stories .post-prev-img{margin-bottom:24px;}
.sa-blog #stories .post-prev-img img{aspect-ratio:342/219;}
.sa-blog #stories .post-prev-title,.sa-blog #stories .post-prev-info,.sa-blog #stories .post-prev-text{margin-bottom:12px;}
.sa-blog #stories .post-prev-more{padding:0;}
.sa-blog #stories [data-blog-card]{margin-bottom:48px!important;}
.sa-blog .blog-desktop-break{display:none;}
.sa-blog .blog-mobile-break{display:block;}
.sa-blog footer.footer{padding:42px 0 53px!important;}
.sa-blog .footer-social-links{margin-bottom:29px!important;}
.sa-blog .footer-copy{margin-bottom:49px;width:350px;max-width:calc(100vw - 40px);margin-left:-4px;}
}
/* Measured gaps override only the preliminary shared Blog adaptations. */
.sa-blog .sa-guides h2.section-title{margin-bottom:12px!important;}
.sa-blog #stories .post-prev-more{padding:0;}

@media (min-width:768px){.sa-blog .sa-cover .col-md-4{margin-top:0!important;}.sa-blog .sa-cover .hs-line-6{padding-bottom:0;}}
@media (max-width:767px){
.sa-blog #stories>.container>.row>.col-md-8{margin-bottom:0!important;}


.sa-blog .pagination{margin-top:30px!important;}
}
.sa-blog .sa-cover .hs-line-6{margin-bottom:0!important;}

/* Exact Figma fills; preserve native hover/focus behavior. */




.sa-blog .sa-cover .hs-line-6{opacity:1;}
/* Figma navigation label boxes; native dropdown/menu behavior is unchanged. */

.sa-blog .sa-guide-item{border-color:#e0e0e0;}
.sa-blog .widget-menu li a{display:inline-block;padding:0;border:0;}

/* Approved fixed tag control widths, independent of text glyph bounds. */
.sa-blog .tags a:nth-child(1){width:58.234375px;}
.sa-blog .tags a:nth-child(2){width:80.671875px;}
.sa-blog .tags a:nth-child(3){width:65.96875px;}
.sa-blog .tags a:nth-child(4){width:57.328125px;}
.sa-blog .tags a:nth-child(5){width:54.609375px;}
.sa-blog .tags a:nth-child(6){width:71.609375px;}
.sa-blog .tags a:nth-child(7){width:59.34375px;}
@media (min-width:768px){.sa-blog .sa-cover .mod-breadcrumbs{margin-top:0;}}

.sa-blog .widget-menu li{display:flex;align-items:center;}
/* Preserve 1/64px desktop row metrics from the Figma text reference. */

/* Figma rounds mobile text rectangles to the next whole pixel while retaining fractional line height. */
@supports (height:calc-size(fit-content,round(up,size,1px))){
 .sa-blog .sa-cover .hs-line-7,.sa-blog .sa-cover .hs-line-6,.sa-blog .sa-cover .mod-breadcrumbs,.sa-blog .widget-title{height:calc-size(fit-content,round(up,size,1px));}
 
}
@supports not (height:calc-size(fit-content,round(up,size,1px))){
 .sa-blog .sa-cover .hs-line-7,.sa-blog .sa-cover .hs-line-6,.sa-blog .sa-cover .mod-breadcrumbs{padding-bottom:var(--blog-text-rounding,0px)!important;}
 .sa-blog .widget-title{padding-bottom:calc(10px + var(--blog-text-rounding,0px));}
 
}

.sa-blog .pagination>span:nth-child(3){width:52px;}
.sa-blog .widget-menu li{padding:2px 0 8px;}
.sa-blog .widget-posts-img{aspect-ratio:100/64.21875;object-fit:cover;}

/* Visual review: exact local Figma properties, scoped to Blog 1. */
.sa-blog .sa-guides{background-color:#f6f6f6;}
.sa-blog footer.footer{background-color:#f4f4f4;}
.sa-blog .sa-glossary a,.sa-blog .sa-all-guides a{white-space:pre-wrap;}
/* Flex discards leading whitespace: preserve the approved counter text. */
.sa-blog .widget-menu small{white-space:pre;}
.sa-blog .widget-posts-descr{position:relative;top:-1px;}

.sa-blog .pagination>span[aria-disabled]{border-color:#d0d0d0;}
.sa-blog .pagination>span:not([aria-disabled]){border-color:#eee;}
/* Figma's second numbered link uses the native hover palette. It is not current. */
.sa-blog .pagination>a:not([aria-label]){border-color:#888;}
.sa-blog .pagination>a:not([aria-current]):hover{border-color:#555;}
.sa-blog .pagination>a:focus-visible{outline:2px dotted #555;outline-offset:3px;}



@media (min-width:768px){
 .sa-blog #stories .post-prev-img img{max-width:403px;}
 
 .sa-blog #stories .post-prev-more .text-link{vertical-align:top;position:relative;top:4px;}
}
/* Figma excerpt bottom-to-next-frame gaps: 13.765625 / 13.375 px.
   These are local distances (text node vs parent frame), not footer offsets. */
@media (min-width:1400px){
 .sa-blog #stories [data-blog-card] .post-prev-text{margin-bottom:13.375px;}
 .sa-blog #stories [data-blog-card]:nth-child(-n/**/+2) .post-prev-text{margin-bottom:13.765625px;}
}



/* User-approved alignment with the Research your Sicilian ancestry guide index. */
.sa-blog .sa-guides{background:#fff;}
.sa-blog .sa-guides>.container{width:calc(100% - 48px);max-width:900px;padding:0;}
.sa-blog .sa-guides h2.section-title{font-size:32px;line-height:42px;font-weight:600;letter-spacing:0;color:#2e2e2e;margin-bottom:17px!important;}
.sa-blog .sa-guides .section-text{font-size:18px;line-height:27px;color:#666;}
.sa-blog .sa-guide-grid{--bs-gutter-x:24px;margin-top:62px;row-gap:40px;}
.sa-blog .sa-guide-item{border-bottom:0;border-top:1px solid #dbdbdb;padding:17px 0 0;}
.sa-blog .sa-guide-item h3{font-size:22px;line-height:29px;font-weight:600;letter-spacing:0;margin:0 0 17px;color:#2e2e2e;}
.sa-blog .sa-guide-item h3 a{display:inline;color:inherit;}
.sa-blog .sa-guide-item h3 span{float:none;}
.sa-blog .sa-guide-item p{font-size:17px;line-height:25px;color:#666;}
.sa-blog .sa-glossary a,.sa-blog .sa-all-guides a{white-space:normal;}
@media(max-width:767px){
.sa-blog .sa-guides h2.section-title{font-size:27px;line-height:34px;}
.sa-blog .sa-guide-grid{margin-top:40px;row-gap:32px;}
.sa-blog .sa-guide-item h3{font-size:20px;line-height:26px;}
.sa-blog .sa-guide-item p{font-size:16px;line-height:23px;}
}
