/* CAROUSEL ── horizontal scroll-snap row of featured/recent cards */
.bi2_carousel_wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 56px 24px 8px;
}
.bi2_carousel_header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 18px;
  gap: 16px;
}
.bi2_carousel_label {
  font-size: var(--fs-eyebrow);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tr-eyebrow);
  text-transform: uppercase;
  color: var(--ss-light-muted);
  margin: 0;
}
.bi2_carousel_nav {
  display: flex;
  gap: 8px;
}
.bi2_carousel_btn {
  width: 36px;
  height: 36px;
  border-radius: var(--r-full);
  border: 1px solid var(--ss-border);
  background: var(--ss-bg);
  color: var(--ss-muted);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all var(--t-fast) var(--easing);
  padding: 0;
}
.bi2_carousel_btn:hover {
  background: var(--ss-navy);
  color: #fff;
  border-color: var(--ss-navy);
}
.bi2_carousel_btn:disabled {
  opacity: .35;
  cursor: not-allowed;
  background: var(--ss-bg);
  color: var(--ss-muted);
  border-color: var(--ss-border);
}
.bi2_carousel_btn:focus-visible {
  outline: 2px solid var(--ss-orange);
  outline-offset: 2px;
}

.bi2_carousel {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  /* scroll-snap is "proximity" so the per-frame auto-drift doesn't fight the
     snap-to-card behavior; user prev/next still snaps cleanly. */
  scroll-snap-type: x proximity;
  padding: 6px 4px 18px;
  margin: 0 -4px;
  scrollbar-width: none;            /* Firefox */
  -ms-overflow-style: none;         /* IE/Edge legacy */
}
.bi2_carousel::-webkit-scrollbar { display: none; }

.bi2_card {
  flex: none;
  scroll-snap-align: start;
  position: relative;
  background: var(--ss-bg);
  border: 1px solid var(--ss-border);
  border-radius: var(--r-xl);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  transition: transform var(--t-base) var(--easing), box-shadow var(--t-base) var(--easing), border-color var(--t-base) var(--easing);
  box-shadow: var(--shadow-1);
}
.bi2_card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--ss-orange);
  opacity: 0;
  transition: opacity var(--t-base) var(--easing);
  z-index: 2;
}
.bi2_card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-2);
  border-color: #dde1e8;
  text-decoration: none;
}
.bi2_card:hover::before { opacity: 1; }
.bi2_card:hover .bi2_card_title { color: var(--ss-orange); }
.bi2_card:focus-visible { outline: 2px solid var(--ss-orange); outline-offset: 2px; }

.bi2_card_visual {
  width: 100%;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--ss-navy);
  position: relative;
}
.bi2_card_visual > *,
.bi2_card_visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.bi2_card_fallback {
  width: 100%; height: 100%;
  background:
    radial-gradient(ellipse at 30% 30%, rgba(238,103,35,.30), transparent 60%),
    radial-gradient(ellipse at 75% 70%, rgba(26,115,232,.26), transparent 65%);
}
.bi2_card_featured_badge {
  position: absolute;
  top: 12px; left: 12px;
  z-index: 3;
  background: var(--ss-orange);
  color: #fff;
  font-size: 9.5px;
  font-weight: var(--fw-bold);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  padding: 5px 9px;
  border-radius: var(--r-sm);
  box-shadow: 0 4px 12px rgba(238,103,35,.35);
}
.bi2_card_body {
  padding: 20px 22px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.bi2_card_eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10.5px;
  letter-spacing: var(--tr-eyebrow);
  text-transform: uppercase;
  color: var(--ss-orange);
  font-weight: var(--fw-bold);
}
.bi2_card_title {
  font-size: 17px;
  line-height: var(--lh-snug);
  letter-spacing: -.005em;
  color: var(--ss-slate);
  font-weight: var(--fw-semibold);
  margin: 0;
  flex: 1;
  transition: color var(--t-fast) var(--easing);
}
.bi2_card_meta {
  font-size: var(--fs-caption);
  color: var(--ss-light-muted);
  margin-top: 4px;
}

/* CATEGORY FILTER ROW */
.bi2_filters {
  border-bottom: 1px solid var(--ss-border);
  padding: 32px 24px 18px;
  margin-top: 60px;
}
.bi2_filters_inner {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}
.bi2_filter {
  font-size: var(--fs-caption);
  font-weight: var(--fw-medium);
  padding: 6px 14px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  background: transparent;
  color: var(--ss-muted);
  text-decoration: none;
  transition: all var(--t-fast) var(--easing);
}
.bi2_filter:hover {
  color: var(--ss-slate);
  background: var(--ss-bg-light);
  text-decoration: none;
}
.bi2_filter.is-active {
  color: var(--ss-navy);
  background: var(--ss-bg-light);
  border-color: var(--ss-border);
}

/* CHRONOLOGICAL FEED ── Stripe-style text list */
.bi2_feed {
  max-width: 800px;
  margin: 0 auto;
  padding: 30px 24px 100px;
}
.bi2_feed_section_label {
  font-size: var(--fs-eyebrow);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tr-eyebrow);
  text-transform: uppercase;
  color: var(--ss-light-muted);
  margin: 30px 0 8px;
}
.bi2_row {
  display: block;
  padding: 28px 0;
  border-bottom: 1px solid var(--ss-border);
  text-decoration: none;
  color: inherit;
  transition: padding-left var(--t-base) var(--easing);
  position: relative;
}
.bi2_row:hover { text-decoration: none; padding-left: 6px; }
.bi2_row:hover .bi2_row_title { color: var(--ss-orange); }
.bi2_row_meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.bi2_row_cat {
  font-size: 10.5px;
  letter-spacing: var(--tr-eyebrow);
  text-transform: uppercase;
  color: var(--ss-orange);
  font-weight: var(--fw-bold);
}
.bi2_row_meta_sep {
  width: 3px; height: 3px;
  border-radius: var(--r-full);
  background: var(--ss-light-muted);
}
.bi2_row_date {
  font-size: var(--fs-caption);
  color: var(--ss-light-muted);
}
.bi2_row_title {
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: var(--lh-snug);
  letter-spacing: var(--tr-tight);
  color: var(--ss-slate);
  font-weight: var(--fw-bold);
  margin: 0 0 8px;
  transition: color var(--t-fast) var(--easing);
}
.bi2_row_dek {
  font-size: var(--fs-body-lg);
  line-height: var(--lh-relaxed);
  color: var(--ss-body);
  margin: 0 0 10px;
  max-width: 680px;
}
.bi2_row_byline {
  font-size: var(--fs-caption);
  color: var(--ss-muted);
}
.bi2_row_byline strong { color: var(--ss-slate); font-weight: var(--fw-semibold); }
.bi2_row:last-child { border-bottom: 0; }

.bi2_empty {
  text-align: center;
  color: var(--ss-muted);
  padding: 80px 0;
  font-size: var(--fs-body-lg);
}

@media (max-width: 640px) {
  .bi2_top { padding: 70px 20px 50px; }
  .bi2_featured_wrap { padding: 50px 16px 0; }
  .bi2_featured_visual { aspect-ratio: 16/10; }
  .bi2_featured_body { padding: 24px 22px 26px; }
  .bi2_featured_title { font-size: 24px; }
  .bi2_row_title { font-size: 20px; }
}

/* Archive controls progressively enhance the complete HTML archive. */
#blog-main [hidden] { display: none !important; }
.bi2_tools { max-width: 800px; margin: 30px auto 0; padding: 0 24px; }
.bi2_search_grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 16px; }
.bi2_field label { display: block; font-size: 13px; font-weight: 600; color: var(--ss-slate); margin-bottom: 7px; }
.bi2_field input, .bi2_field select { width: 100%; min-height: 46px; padding: 11px 14px; border: 1px solid var(--ss-border); border-radius: 8px; background: #fff; color: var(--ss-slate); font: inherit; font-size: 14px; }
.bi2_field input:focus-visible, .bi2_field select:focus-visible, .bi2_filter:focus-visible, .bi2_row:focus-visible, .bi2_more:focus-visible, .bi2_clear:focus-visible { outline: 3px solid var(--ss-orange); outline-offset: 3px; }
.bi2_results { display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: 13px; color: var(--ss-muted); margin-top: 18px; }
.bi2_results p { margin: 0; }
.bi2_clear { border: 0; background: none; color: var(--ss-slate); font: inherit; text-decoration: underline; cursor: pointer; padding: 10px 0; }
.bi2_more { display: block; min-height: 48px; margin: 32px auto 0; padding: 12px 26px; border: 1px solid var(--ss-border); border-radius: 999px; font: inherit; font-size: 14px; font-weight: 600; color: var(--ss-navy); background: var(--ss-bg-light); cursor: pointer; }
.bi2_more:hover { border-color: var(--ss-orange); }
.bi2_filter { min-height: 40px; display: inline-flex; align-items: center; }
.bi2_row_meta { flex-wrap: wrap; }
.bi2_top h1 { text-wrap: balance; }
.bi2_feed_section_label { margin-top: 0; }
.bi2_carousel_btn { width: 44px; height: 44px; }
.bi2_carousel { scrollbar-width: thin; }
.bi2_carousel::-webkit-scrollbar { display: block; height: 5px; }

@media (max-width: 640px) {
 .bi2_top { padding: 0; }
 .bi2_top_inner { padding: 110px 20px 60px; }
 .bi2_search_grid { grid-template-columns: 1fr; }
 .bi2_filters { margin-top: 28px; }
 .bi2_carousel_wrap { padding-top: 32px; }
}
@media (prefers-reduced-motion: reduce) {
 #blog-main *, #blog-main *::before { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Existing SendSafely silk aurora animation, initialized by aurora-silk.js. */
.bi2_top{position:relative;isolation:isolate;overflow:hidden;background:#0a1628;color:#fff;padding:0;text-align:left}
.bi2_atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}





.bi2_top_inner{max-width:1180px;margin:0 auto;padding:148px 24px 76px;position:relative}
.bi2_top_eyebrow{color:#d8ad8c;text-transform:uppercase;font-size:11px;font-weight:600;letter-spacing:2px;margin-bottom:27px;display:flex;align-items:center;gap:13px}
.bi2_top_eyebrow::before{content:'';width:26px;height:1px;background:#ee6723}
.bi2_top h1{max-width:950px;color:#fff;font-size:clamp(38px,4.5vw,64px);line-height:1.12;letter-spacing:-2px;font-weight:500;margin:0 0 24px;text-wrap:initial}
.bi2_top p{max-width:570px;color:#b7c1cf;font-size:17px;line-height:1.8;margin:0}
.bi2_explore{display:inline-flex;align-items:center;gap:28px;margin-top:28px;color:#fff;font-size:13px;font-weight:500;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.3)}
.bi2_explore:hover{color:#f5ab7f;text-decoration:none;border-color:#f5ab7f}
.bi2_explore:focus-visible{outline:2px solid #ee6723;outline-offset:6px}
.bi2_hero_footer{max-width:1132px;margin:0 auto;padding:22px 0;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:18px;color:#9cabbc;font-size:10px;letter-spacing:1.2px;text-transform:uppercase}
.bi2_carousel_wrap{padding-top:64px;padding-bottom:0}
.bi2_carousel_header{margin-bottom:24px;align-items:center}
.bi2_carousel_label{font-size:12px;color:#536277;letter-spacing:1.4px}
.bi2_card{border-radius:10px;box-shadow:none;border-color:#e1e6ed;transition:border-color .2s,transform .2s}
.bi2_card::before{display:none}
.bi2_card:hover{box-shadow:none;border-color:#aab6c4;transform:translateY(-3px)}
.bi2_card_visual{aspect-ratio:16/9}
.bi2_card_body{padding:24px;gap:12px}
.bi2_card_title{font-size:18px;font-weight:500;line-height:1.5;color:#172d47;letter-spacing:-.35px}
.bi2_card_eyebrow{color:#97623a;font-size:10px;letter-spacing:1.4px}
.bi2_card_meta{color:#627084;font-size:11px;line-height:1.8;margin-top:5px}
.bi2_carousel_btn{border-radius:4px;border-color:#dce2e9;color:#263b5e}
.bi2_filters{max-width:1180px;padding:28px 24px 0;margin:56px auto 0;border-bottom:none}
.bi2_filters_inner{max-width:none;justify-content:flex-start;gap:4px;border-bottom:1px solid #dce2e9;padding-bottom:16px}
.bi2_filter{border-radius:4px;font-size:12px;padding:9px 16px;color:#536277}
.bi2_filter.is-active{color:#fff;background:#172d47;border-color:#172d47}
.bi2_tools{max-width:1180px;margin-top:28px}
.bi2_search_grid{grid-template-columns:minmax(0,2fr) minmax(200px,1fr);gap:24px}
.bi2_field label{font-size:11px;font-weight:500;color:#536277}
.bi2_field input,.bi2_field select{border-radius:5px;min-height:48px;font-size:13px;background:#fafbfd;border-color:#dce2e9}
.bi2_results{font-size:11px;margin-top:20px;color:#627084}
.bi2_feed{max-width:1180px;padding-top:34px;padding-bottom:100px}
.bi2_feed_section_label{font-size:12px;color:#536277;letter-spacing:1.4px;border-bottom:1px solid #dce2e9;padding-bottom:20px;margin-bottom:0;scroll-margin-top:95px}
.bi2_row{display:grid;grid-template-columns:170px minmax(0,1fr);column-gap:32px;padding:34px 34px 34px 0;transition:background .2s;border-color:#e3e8ee}
.bi2_row:hover{padding-left:0;background:#fafbfd}
.bi2_row_meta{grid-column:1;grid-row:1 / 4;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:10px;padding-top:6px;margin:0}
.bi2_row_meta_sep{display:none}
.bi2_row_cat{font-size:10px;color:#97623a;letter-spacing:1.1px}
.bi2_row_date{font-size:11px;color:#627084}
.bi2_row_title,.bi2_row_dek,.bi2_row_byline{grid-column:2}
.bi2_row_title{font-size:23px;font-weight:500;line-height:1.45;letter-spacing:-.5px;max-width:790px;color:#172d47;margin-bottom:12px}
.bi2_row_dek{font-size:14px;line-height:1.85;color:#627084;max-width:750px;margin-bottom:14px}
.bi2_row_byline{font-size:11px;color:#627084}
.bi2_row_byline strong{font-weight:500;color:#43546a}
.bi2_more{border-radius:5px;background:#fff;border-color:#c9d2de;font-size:12px;min-width:215px}
@media(max-width:1180px){.bi2_hero_footer{margin-left:24px;margin-right:24px}}
@media(max-width:640px){
.bi2_top_inner{padding:116px 24px 52px}.bi2_top h1{font-size:clamp(32px,8vw,45px);letter-spacing:-1.2px;line-height:1.2}.bi2_top p{font-size:14px;line-height:1.85}.bi2_top_eyebrow{font-size:9px;margin-bottom:22px}
.bi2_hero_footer{padding:20px 0;flex-direction:column;gap:9px;font-size:8px;letter-spacing:.9px}
.bi2_carousel_wrap{padding-top:36px}.bi2_card_body{padding:20px}.bi2_card_title{font-size:16px}.bi2_filters{margin-top:28px}.bi2_filter{font-size:11px;padding:8px 11px}.bi2_search_grid{grid-template-columns:1fr;gap:16px}.bi2_feed{padding-top:26px}.bi2_row{display:block;padding:26px 0}.bi2_row_meta{flex-direction:row;flex-wrap:wrap;gap:14px;margin-bottom:12px;padding:0}.bi2_row_title{font-size:20px}.bi2_row_dek{font-size:13px}.bi2_row_byline{font-size:10px}
}

.bi2_atmosphere .aurora_silk_canvas{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* Image-led archive: keep each article's artwork beside its editorial summary. */
.bi2_top_inner{padding-top:120px;padding-bottom:48px}
.bi2_top h1{font-size:clamp(36px,4vw,56px)}
.bi2_explore{margin-top:20px}
.bi2_hero_footer{padding-top:18px;padding-bottom:18px}
.bi2_carousel_wrap{padding-top:40px}
.bi2_row{grid-template-columns:300px minmax(0,1fr);gap:36px;align-items:center;padding:32px 0}
.bi2_row:hover{background:transparent}
.bi2_row .blog_card_media{grid-column:1;grid-row:1}
.bi2_row_copy{grid-column:2;min-width:0}
.bi2_row_meta{display:flex;flex-direction:row;align-items:center;gap:14px;margin-bottom:12px;padding:0}
.bi2_row_title{font-size:24px;line-height:1.4;margin-bottom:12px}
.bi2_row_dek{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:14px}
.bi2_read{display:flex;align-items:center;gap:22px;font-size:11px;font-weight:500;color:#172d47;margin-top:18px}
.bi2_row:hover .bi2_read{color:#b24b19}
@media(max-width:900px){.bi2_row{grid-template-columns:240px minmax(0,1fr);gap:26px}.bi2_row_title{font-size:21px}}
@media(max-width:640px){.bi2_top_inner{padding-top:105px;padding-bottom:38px}.bi2_top h1{font-size:clamp(31px,8vw,43px)}.bi2_row{display:block;padding:28px 0}.bi2_row .blog_card_media{margin-bottom:22px;aspect-ratio:16/9}.bi2_row_meta{margin-bottom:10px}.bi2_row_title{font-size:21px}.bi2_row_dek{font-size:14px}.bi2_read{margin-top:14px}.bi2_carousel_wrap{padding-top:30px}}

.bi2_all_link{font-size:12px;color:#43546a;display:flex;gap:12px;align-items:center}
.bi2_row_dek{display:block;overflow:visible;-webkit-line-clamp:unset}
.bi2_filters{margin-top:24px}
/* Compact archive navigation: one search surface, lightweight topic selector. */
.bi2_sr_only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.bi2_filters_inner{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:24px;padding-bottom:0;border-color:#e7ebef}
.bi2_filters_inner::-webkit-scrollbar{display:none}
.bi2_filter{flex-shrink:0;border:0;border-bottom:2px solid transparent;border-radius:0;padding:14px 0;background:none;font-size:12px;color:#708096;font-weight:400}
.bi2_filter:hover{background:none;color:#172d47}
.bi2_filter.is-active{background:none;color:#172d47;border:0;border-bottom:2px solid #ee6723;font-weight:500}
.bi2_tools{margin-top:24px;background:transparent}
.bi2_search_grid{display:flex;align-items:center;gap:0;min-height:54px;border:1px solid #e0e6ec;border-radius:12px;background:#fff;box-shadow:0 2px 6px rgba(16,35,58,.02)}
.bi2_search_field{flex:1;min-width:0;position:relative}
.bi2_search_icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:#708096;pointer-events:none}
.bi2_field input#blog-search{min-height:52px;background:transparent;border:0;border-radius:12px 0 0 12px;padding:14px 12px 14px 48px;font-size:14px;box-shadow:none;color:#172d47}
.bi2_field input#blog-search::placeholder{color:#7d8999;opacity:1}
.bi2_topic_field{flex:0 0 180px;border-left:1px solid #e7ebef;padding:0 12px}
.bi2_field select#blog-tag{min-height:38px;border:0;background-color:transparent;border-radius:5px;padding:8px 26px 8px 10px;font-size:12px;font-weight:500;color:#43546a;text-overflow:ellipsis;cursor:pointer}
.bi2_search_grid:focus-within{border-color:#8c9cb0;box-shadow:0 0 0 3px rgba(23,45,71,.05)}
.bi2_field input#blog-search:focus-visible,.bi2_field select#blog-tag:focus-visible{outline:2px solid #889bb3;outline-offset:-4px}
.bi2_results{margin-top:12px;min-height:26px;font-size:10px;color:#7d8999;letter-spacing:.1px}
.bi2_clear{padding:4px 0;font-size:10px;color:#43546a}
.bi2_feed{padding-top:16px}
.bi2_feed_section_label{border:0;padding-bottom:4px;margin-bottom:0;font-size:10px;color:#708096;letter-spacing:1.6px}
@media(max-width:640px){.bi2_filters_inner{gap:23px}.bi2_filter{font-size:12px;padding:13px 0}.bi2_tools{margin-top:20px}.bi2_search_grid{min-height:52px;border-radius:10px}.bi2_topic_field{flex-basis:126px;padding:0 5px}.bi2_field input#blog-search{font-size:16px;padding-left:40px;padding-right:4px}.bi2_search_icon{left:14px;width:16px;height:16px}.bi2_field select#blog-tag{font-size:12px;padding-left:7px;padding-right:20px}.bi2_results{margin-top:10px}.bi2_feed{padding-top:12px}}
@media(max-width:350px){.bi2_topic_field{flex-basis:112px}.bi2_search_icon{left:11px}.bi2_field input#blog-search{padding-left:32px;font-size:16px}}

/* Simplified blog masthead. */
.bi2_top h1{margin-bottom:0}
.bi2_hero_footer{color:rgba(255,255,255,.5)}

/* Featured stories: one consistent, touch-native editorial rail. */
.bi2_story_rail{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:1px;overscroll-behavior-x:contain;scrollbar-width:none;padding:6px 1px 16px;outline-offset:4px}
.bi2_story_rail::-webkit-scrollbar{display:none}
.bi2_story{flex:0 0 calc((100% - 72px)/3.15);min-width:0;scroll-snap-align:start;display:flex;flex-direction:column;background:#fff;border:1px solid #e0e6ed;border-radius:16px;overflow:hidden;color:#172d47;text-decoration:none;transition:border-color .2s,box-shadow .2s}
.bi2_story:hover{border-color:#b7c3d2;box-shadow:0 8px 24px #142c4510;text-decoration:none}
.bi2_story:focus-visible,.bi2_story_rail:focus-visible{outline:2px solid #ee6723;outline-offset:3px}
.bi2_story .blog_card_media{aspect-ratio:16/9;border-radius:0;flex:none;background:#edf1f6}
.bi2_story .bi2_card_body{padding:24px;display:flex;flex:1;flex-direction:column;gap:14px}
.bi2_story .bi2_card_eyebrow{color:#a64b20;font-size:10px;letter-spacing:1.7px;margin:0}
.bi2_story .bi2_card_title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:4.05em;flex:none;margin:0;font-size:23px;line-height:1.35;letter-spacing:-.65px;font-weight:500}
.bi2_story .bi2_card_meta{margin-top:auto;padding-top:10px;font-size:11px;line-height:1.7;color:#64758b}
.bi2_story .bi2_read{border-top:1px solid #edf0f4;padding-top:16px;margin-top:0;font-size:12px;justify-content:space-between}
.bi2_story .bi2_read span{display:grid;place-items:center;border-radius:50%;width:30px;height:30px;background:#f3f6f8;transition:background .2s,color .2s}
.bi2_story:hover .bi2_read span{background:#172d47;color:#fff}
.bi2_rail_footer{display:flex;align-items:center;justify-content:flex-end;gap:24px;padding-top:8px}
.bi2_rail_footer[hidden]{display:none}
.bi2_rail_buttons{display:flex;gap:8px}
.bi2_rail_buttons button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #dce3eb;border-radius:50%;background:#fff;color:#172d47;font-size:21px;cursor:pointer;transition:background .2s,color .2s}
.bi2_rail_buttons button:hover:not(:disabled){background:#172d47;color:white}
.bi2_rail_buttons button:disabled{opacity:.3;cursor:default}
.bi2_rail_buttons button:focus-visible{outline:2px solid #ee6723;outline-offset:3px}
@media(max-width:1050px){.bi2_story{flex-basis:calc((100% - 40px)/2.2)}.bi2_story_rail{gap:20px}.bi2_story .bi2_card_title{font-size:22px}}
@media(max-width:640px){.bi2_story{flex-basis:88%}.bi2_story_rail{gap:16px}.bi2_story .bi2_card_body{padding:20px;gap:12px}.bi2_story .bi2_card_title{font-size:21px}.bi2_carousel_header{align-items:center}.bi2_all_link{font-size:10px;gap:8px}.bi2_rail_footer{gap:16px}.bi2_carousel_wrap{padding-top:32px}}
@media(prefers-reduced-motion:reduce){.bi2_story,.bi2_story .bi2_read span{transition:none}}

/* Readable archive feedback and a hint that topics continue offscreen. */
.bi2_results,.bi2_clear{font-size:12px}
@media(max-width:900px){.bi2_filters_inner{padding-right:22px;mask-image:linear-gradient(to right,#000 0%,#000 calc(100% - 18px),transparent 100%)}}

/* Preserve complete original artwork in consistent, quiet presentation frames. */
.bi2_story .blog_card_media{aspect-ratio:2/1;background:#fff;border-bottom:1px solid #edf0f4}
/* Archive feed: a single editorial column, not a card grid. Each article is one
   full-width row — restrained thumbnail on the left, headline and standfirst on
   the right, separated by hairlines. Reads as a masthead index rather than a
   marketing tile wall, and scans far faster at 220 articles. */
#blog-posts{display:block;margin-top:10px;border-top:1px solid #e5eaf0}
#blog-posts .bi2_row{display:grid;grid-template-columns:clamp(240px,26vw,330px) minmax(0,1fr);column-gap:38px;align-items:start;min-width:0;padding:30px 22px;margin:0 -22px;border-bottom:1px solid #e5eaf0;border-radius:14px;position:relative;transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s cubic-bezier(.22,.61,.36,1),background-color .3s ease,border-color .2s ease}
#blog-posts .bi2_row[hidden]{display:none}
#blog-posts .blog_card_media{aspect-ratio:16/10;margin:0;border:1px solid #edf0f4;border-radius:6px;background:#fff;overflow:hidden}
#blog-posts .bi2_row_copy{display:flex;flex-direction:column;min-width:0}
#blog-posts .bi2_row_meta{flex-wrap:wrap;gap:6px 14px;margin-bottom:9px}
#blog-posts .bi2_row_title{font-size:22px;line-height:1.34;letter-spacing:-.45px;margin:0 0 10px}
#blog-posts .bi2_row_dek{font-size:14.5px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 12px}
#blog-posts .bi2_row_byline{margin:0}
#blog-posts .bi2_read{margin-top:12px;padding-top:0;justify-content:flex-start;gap:7px;font-size:12px}
/* Rich hover: the row lifts off the page as a single surface. Horizontal padding
   is cancelled by an equal negative margin, so the resting layout is unchanged and
   only the hover state gains a card. Transform and shadow only — no geometry
   changes — so neighbouring rows never reflow. */
#blog-posts .bi2_row:hover,
#blog-posts .bi2_row:focus-visible{
  transform:translateY(-4px);
  background:#fff;
  border-bottom-color:transparent;
  box-shadow:0 22px 44px -26px rgba(12,28,45,.5),0 3px 10px rgba(12,28,45,.06);
  z-index:1;
}
#blog-posts .blog_card_media{overflow:hidden}
#blog-posts .blog_card_media>img{transition:transform .55s cubic-bezier(.22,.61,.36,1)}
#blog-posts .bi2_row:hover .blog_card_media>img{transform:scale(1.05)}
#blog-posts .bi2_read span{display:inline-block;transition:transform .3s cubic-bezier(.22,.61,.36,1)}
#blog-posts .bi2_row:hover .bi2_read span{transform:translate(4px,-4px)}
@media(prefers-reduced-motion:reduce){
  #blog-posts .bi2_row,#blog-posts .blog_card_media>img,#blog-posts .bi2_read span{transition:none}
  #blog-posts .bi2_row:hover{transform:none}
  #blog-posts .bi2_row:hover .blog_card_media>img{transform:none}
  #blog-posts .bi2_row:hover .bi2_read span{transform:none}
}
@media(max-width:760px){
  #blog-posts .bi2_row{grid-template-columns:1fr;row-gap:15px;padding:22px 0}
  #blog-posts .bi2_row_title{font-size:19px}
  #blog-posts .blog_card_media{aspect-ratio:2/1}
}

/* Editorial details and predictable in-page navigation. */
.bi2_archive_heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:6px}
.bi2_archive_heading>span{font-size:11px;color:#708096}
#blog-archive-title{scroll-margin-top:90px}
.bi2_reading_time{display:block;font-size:11px;color:#64758b;margin-bottom:5px;font-weight:400}
.bi2_story .bi2_card_meta .bi2_reading_time{margin-bottom:2px}
#blog-posts .bi2_row_byline{font-size:12px;line-height:1.7;color:#64758b}
#blog-posts .bi2_row_title{transition:color .18s ease}
#blog-posts .bi2_row:hover .bi2_row_title{color:#a8491d}
#blog-posts .bi2_row:focus-visible{outline:2px solid #ee6723;outline-offset:8px;border-radius:8px}
@media(prefers-reduced-motion:reduce){#blog-posts .bi2_row_title{transition:none}}



/* Keep motion control available to keyboard users without a persistent icon. */


/* Category icons — a quiet glyph beside each label so the feed and the article
   masthead read at a glance. Masked SVG rather than an icon font: no extra
   request, inherits currentColor, and no markup change (data-category is already
   on the row). */
#blog-posts .bi2_row[data-category="Security"] .bi2_row_cat::before,
#blog-posts .bi2_row[data-category="Engineering"] .bi2_row_cat::before,
#blog-posts .bi2_row[data-category="Product"] .bi2_row_cat::before,
#blog-posts .bi2_row[data-category="Integrations"] .bi2_row_cat::before,
#blog-posts .bi2_row[data-category="Customers"] .bi2_row_cat::before,
#blog-posts .bi2_row[data-category="Article"] .bi2_row_cat::before,
.bp_hero[data-category="Security"] .bp_eyebrow_text::before,
.bp_hero[data-category="Engineering"] .bp_eyebrow_text::before,
.bp_hero[data-category="Product"] .bp_eyebrow_text::before,
.bp_hero[data-category="Integrations"] .bp_eyebrow_text::before,
.bp_hero[data-category="Customers"] .bp_eyebrow_text::before,
.bp_hero[data-category="Article"] .bp_eyebrow_text::before,
.bi2_story[data-category="Security"] .bi2_card_eyebrow::before,
.bi2_story[data-category="Engineering"] .bi2_card_eyebrow::before,
.bi2_story[data-category="Product"] .bi2_card_eyebrow::before,
.bi2_story[data-category="Integrations"] .bi2_card_eyebrow::before,
.bi2_story[data-category="Customers"] .bi2_card_eyebrow::before,
.bi2_story[data-category="Article"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Security"]::before,
.bc_filter[data-category="Security"]::before,
.bc_row[data-category="Security"] .bc_row_cat::before,
.bi2_filter[data-category="Engineering"]::before,
.bc_filter[data-category="Engineering"]::before,
.bc_row[data-category="Engineering"] .bc_row_cat::before,
.bi2_filter[data-category="Product"]::before,
.bc_filter[data-category="Product"]::before,
.bc_row[data-category="Product"] .bc_row_cat::before,
.bi2_filter[data-category="Integrations"]::before,
.bc_filter[data-category="Integrations"]::before,
.bc_row[data-category="Integrations"] .bc_row_cat::before,
.bi2_filter[data-category="Customers"]::before,
.bc_filter[data-category="Customers"]::before,
.bc_row[data-category="Customers"] .bc_row_cat::before,
.bi2_filter[data-category="Article"]::before,
.bc_filter[data-category="Article"]::before,
.bc_row[data-category="Article"] .bc_row_cat::before,
.bc_filter[data-category="Article"]::before,
.bc_row[data-category="Article"] .bc_row_cat::before{
  content:"";display:inline-block;width:1em;height:1em;margin-right:6px;
  vertical-align:-.13em;background-color:currentColor;opacity:.75;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}

#blog-posts .bi2_row[data-category="Security"] .bi2_row_cat::before,
.bp_hero[data-category="Security"] .bp_eyebrow_text::before,
.bi2_story[data-category="Security"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Security"]::before,
.bc_filter[data-category="Security"]::before,
.bc_row[data-category="Security"] .bc_row_cat::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.4 8 11 4.6-1.6 8-6 8-11V5l-8-3z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.4 8 11 4.6-1.6 8-6 8-11V5l-8-3z'/%3E%3C/svg%3E")}
#blog-posts .bi2_row[data-category="Engineering"] .bi2_row_cat::before,
.bp_hero[data-category="Engineering"] .bp_eyebrow_text::before,
.bi2_story[data-category="Engineering"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Engineering"]::before,
.bc_filter[data-category="Engineering"]::before,
.bc_row[data-category="Engineering"] .bc_row_cat::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m8 6-6 6 6 6M16 6l6 6-6 6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m8 6-6 6 6 6M16 6l6 6-6 6'/%3E%3C/svg%3E")}
#blog-posts .bi2_row[data-category="Product"] .bi2_row_cat::before,
.bp_hero[data-category="Product"] .bp_eyebrow_text::before,
.bi2_story[data-category="Product"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Product"]::before,
.bc_filter[data-category="Product"]::before,
.bc_row[data-category="Product"] .bc_row_cat::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 3 7v10l9 5 9-5V7l-9-5zM3 7l9 5 9-5M12 12v10'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 3 7v10l9 5 9-5V7l-9-5zM3 7l9 5 9-5M12 12v10'/%3E%3C/svg%3E")}
#blog-posts .bi2_row[data-category="Integrations"] .bi2_row_cat::before,
.bp_hero[data-category="Integrations"] .bp_eyebrow_text::before,
.bi2_story[data-category="Integrations"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Integrations"]::before,
.bc_filter[data-category="Integrations"]::before,
.bc_row[data-category="Integrations"] .bc_row_cat::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 3v6H4v6a3 3 0 0 0 3 3h6v-4a2 2 0 1 1 4 0v4h3V9h-6V3h-4z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 3v6H4v6a3 3 0 0 0 3 3h6v-4a2 2 0 1 1 4 0v4h3V9h-6V3h-4z'/%3E%3C/svg%3E")}
#blog-posts .bi2_row[data-category="Customers"] .bi2_row_cat::before,
.bp_hero[data-category="Customers"] .bp_eyebrow_text::before,
.bi2_story[data-category="Customers"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Customers"]::before,
.bc_filter[data-category="Customers"]::before,
.bc_row[data-category="Customers"] .bc_row_cat::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2M9 6a4 4 0 1 0 0 8 4 4 0 0 0 0-8M22 20v-2a4 4 0 0 0-3-3.9M16 2.1a4 4 0 0 1 0 7.8'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2M9 6a4 4 0 1 0 0 8 4 4 0 0 0 0-8M22 20v-2a4 4 0 0 0-3-3.9M16 2.1a4 4 0 0 1 0 7.8'/%3E%3C/svg%3E")}
#blog-posts .bi2_row[data-category="Article"] .bi2_row_cat::before,
.bp_hero[data-category="Article"] .bp_eyebrow_text::before,
.bi2_story[data-category="Article"] .bi2_card_eyebrow::before,
.bi2_filter[data-category="Article"]::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zM14 2v6h6M8 13h8M8 17h5'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zM14 2v6h6M8 13h8M8 17h5'/%3E%3C/svg%3E")}

/* The filter tabs are small, so their glyph sits a touch tighter and lighter
   until the tab is active. */
.bi2_filter[data-category]::before,.bc_filter[data-category]::before{
  margin-right:6px;
  background-color:var(--ss-orange,#ee6723);
  opacity:.7;
  transition:opacity .16s ease;
}
.bi2_filter[data-category].is-active::before,.bi2_filter[data-category]:hover::before,
.bc_filter[data-category].is-active::before,.bc_filter[data-category]:hover::before{opacity:1}


/* -- Search + topic filter -------------------------------------------------
   These controls had accumulated three layers of rules, and the select was
   never given appearance:none -- so the browser drew its own bordered control
   inside the custom pill, which read as a double border. This block is the
   single source of truth for the pair: one pill, a hairline divider, and a
   select that looks like a filter rather than a form field. */
.bi2_search_grid{
  display:flex;align-items:stretch;gap:0;min-height:52px;
  border:1px solid #dfe5ec;border-radius:10px;background:#fff;
  box-shadow:0 1px 2px rgba(16,35,58,.04);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.bi2_search_grid:hover{border-color:#cdd6e0}
.bi2_search_grid:focus-within{border-color:#8c9cb0;box-shadow:0 0 0 3px rgba(23,45,71,.07)}

.bi2_field{display:flex;align-items:center;min-width:0}
.bi2_field:first-child{flex:1 1 auto}
.bi2_field input#blog-search{
  width:100%;min-height:50px;border:0;background:transparent;box-shadow:none;
  padding:13px 12px 13px 44px;font:inherit;font-size:14px;color:#172d47;border-radius:10px 0 0 10px;
}
.bi2_field input#blog-search::placeholder{color:#8b96a5;opacity:1}
.bi2_field input#blog-search:focus-visible{outline:0}

/* The divider belongs to the topic field, so it can never double up with a border. */
.bi2_topic_field{flex:0 0 auto;border-left:1px solid #e8edf2;padding:0 6px}
.bi2_field select#blog-tag{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  min-height:38px;border:0;background-color:transparent;box-shadow:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%2364758b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:11px 7px;
  padding:8px 30px 8px 12px;font:inherit;font-size:13px;font-weight:500;color:#43546a;
  border-radius:7px;cursor:pointer;max-width:200px;text-overflow:ellipsis;
  transition:background-color .15s ease,color .15s ease;
}
.bi2_field select#blog-tag:hover{background-color:#f4f7fa;color:#172d47}
.bi2_field select#blog-tag:focus-visible{outline:2px solid var(--ss-orange,#ee6723);outline-offset:-2px}

@media(max-width:640px){
  .bi2_search_grid{min-height:50px;border-radius:10px}
  /* 16px keeps iOS from zooming the page when the field takes focus. */
  .bi2_field input#blog-search{font-size:16px;padding-left:40px}
  .bi2_field select#blog-tag{font-size:13px;max-width:132px;padding-right:26px}
}


/* -- Category and tag archives -------------------------------------------
   These pages carry their own bc_* classes and never loaded this stylesheet,
   so none of the blog index's design reached them. They do now; this section
   maps the archive's classes onto the same treatments. */
.bc_top{position:relative;isolation:isolate;overflow:hidden}
.bc_atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.bc_atmosphere .aurora_silk_canvas{display:block;position:absolute;inset:0;width:100%;height:100%}
.bc_top_inner{position:relative;z-index:1}

/* Breadcrumb: same affordance rules as the article masthead — links brighter and
   underlined, the current page quiet. */
.bc_crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:12px;margin-bottom:22px}
.bc_crumbs a{color:rgba(255,255,255,.82);text-decoration:underline;text-decoration-color:rgba(255,255,255,.28);text-underline-offset:3px;text-decoration-thickness:1px;padding:2px 4px;border-radius:4px;transition:color .16s ease,text-decoration-color .16s ease,background-color .16s ease}
.bc_crumbs a:hover{color:#fff;text-decoration-color:var(--ss-orange,#ee6723);background:rgba(255,255,255,.07)}
.bc_crumbs a:focus-visible{outline:2px solid var(--ss-orange,#ee6723);outline-offset:2px}
.bc_crumb_sep{color:rgba(255,255,255,.3);margin:0 3px}
.bc_crumb_current{color:rgba(255,255,255,.55)}

/* Filter tabs: the index's underline tabs, not pills, so the two pages agree. */
.bc_filters{border-bottom:1px solid #e9eef3;padding:0 24px}
.bc_filters_inner{max-width:1132px;margin:0 auto;display:flex;flex-wrap:nowrap;gap:26px;overflow-x:auto;scrollbar-width:none}
.bc_filters_inner::-webkit-scrollbar{display:none}
.bc_filter{flex-shrink:0;display:inline-flex;align-items:center;min-height:auto;border:0;border-bottom:2px solid transparent;border-radius:0;padding:14px 0;background:none;font-size:12px;color:#708096;font-weight:400;transition:color .16s ease,border-color .16s ease}
.bc_filter:hover{color:#172d47;background:none;border-color:#cdd6e0}
.bc_filter.is-active{color:#172d47;background:none;border-bottom-color:var(--ss-orange,#ee6723);font-weight:500}

/* Rows: the same single-column editorial list and hover lift as the index. */
.bc_feed{max-width:1132px;margin:0 auto;padding:10px 24px 0}
.bc_feed .bc_row{display:grid;grid-template-columns:clamp(240px,26vw,330px) minmax(0,1fr);column-gap:38px;align-items:start;min-width:0;padding:30px 22px;margin:0 -22px;border-bottom:1px solid #e5eaf0;border-radius:14px;position:relative;text-decoration:none;color:inherit;transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s cubic-bezier(.22,.61,.36,1),background-color .3s ease,border-color .2s ease}
.bc_feed .bc_row:hover,.bc_feed .bc_row:focus-visible{transform:translateY(-4px);background:#fff;border-bottom-color:transparent;box-shadow:0 22px 44px -26px rgba(12,28,45,.5),0 3px 10px rgba(12,28,45,.06);z-index:1}
.bc_feed .blog_card_media{aspect-ratio:16/10;margin:0;border:1px solid #edf0f4;border-radius:6px;background:#fff;overflow:hidden}
.bc_feed .blog_card_media>img{transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.bc_feed .bc_row:hover .blog_card_media>img{transform:scale(1.05)}
.bc_row_copy{display:flex;flex-direction:column;min-width:0}
.bc_row_meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;margin-bottom:9px;font-size:11px}
.bc_row_cat{display:inline-flex;align-items:center;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--ss-orange,#ee6723)}
.bc_row_date{color:#64758b}
.bc_row_title{font-size:22px;line-height:1.34;letter-spacing:-.45px;margin:0 0 10px;color:#172d47;transition:color .18s ease}
.bc_feed .bc_row:hover .bc_row_title{color:#a8491d}
.bc_row_dek{font-size:14.5px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 12px;color:#4b5b6e}
.bc_row_byline{margin:0;font-size:12px;line-height:1.7;color:#64758b}
.bc_count{max-width:1132px;margin:0 auto;padding:22px 24px 0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#708096}

@media(prefers-reduced-motion:reduce){
  .bc_feed .bc_row,.bc_feed .blog_card_media>img{transition:none}
  .bc_feed .bc_row:hover{transform:none}
  .bc_feed .bc_row:hover .blog_card_media>img{transform:none}
}
@media(max-width:760px){
  .bc_feed .bc_row{grid-template-columns:1fr;row-gap:15px;padding:22px 0;margin:0}
  .bc_row_title{font-size:19px}
  .bc_feed .blog_card_media{aspect-ratio:2/1}
}


/* Featured cards at the tighter width: trim the type and padding so two whole
   cards read comfortably instead of one and a fragment. */
.bi2_story .bi2_card_title{font-size:19px;line-height:1.32}
.bi2_story .bi2_card_body{padding:20px;gap:10px}
.bi2_story .blog_card_media{aspect-ratio:16/9}
.bi2_story .bi2_card_meta{font-size:11.5px}
.bi2_story .bi2_read{font-size:11.5px}
@media(max-width:1050px){.bi2_story .bi2_card_title{font-size:18px}}


/* Hero footer: a quiet fact line, not a second navigation. The label stays muted
   and only the count carries brand colour, so it does not compete with the H1. */
.bi2_hero_footer{align-items:baseline}
.bi2_hero_footer_label{color:rgba(255,255,255,.45)}
.bi2_hero_footer_meta{color:rgba(255,255,255,.58);display:inline-flex;align-items:baseline;gap:8px}
.bi2_hero_footer_meta strong{color:var(--ss-orange,#ee6723);font-weight:600}
.bi2_hero_footer_sep{color:rgba(255,255,255,.22)}
.bi2_hero_footer_meta time{color:inherit}


/* Autoplay needs snapping off while it runs: with scroll-snap-type:x mandatory
   still active, every scrollLeft step snaps straight back and the rail never
   moves. Restored with the rest of the autoplay machinery. */
.bi2_story_rail.is-autoplay{scroll-snap-type:none;scroll-behavior:auto}
.bi2_story[data-rail-copy][hidden]{display:none}
.bi2_rail_buttons .bi2_rail_autoplay{font-size:13px;letter-spacing:-2px}
/* The pause control is required (WCAG 2.2.2) but should not shout: it is
   visually hidden until focused, and the rail also stops on hover and touch. */
.bi2_rail_buttons .bi2_rail_autoplay:not(:focus-visible){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}


/* The rail's control strip is two arrows; it was reserving 52px plus a 56px gap
   before the filter tabs, which left a dead band between the cards and the
   archive. Smaller targets (still above the 24px minimum) and tighter spacing. */
.bi2_rail_footer{padding-top:2px;gap:16px}
.bi2_rail_buttons{gap:6px}
.bi2_rail_buttons button{width:34px;height:34px;font-size:16px}
.bi2_story_rail{padding-bottom:10px}
.bi2_filters{margin-top:26px}
@media(max-width:640px){
  .bi2_rail_buttons button{width:32px;height:32px;font-size:15px}
  .bi2_filters{margin-top:18px}
}


/* The hero footer is gone. Its left half duplicated the standfirst ("from the
   team building split-key file exchange") and its right half had no job — first a
   hardcoded list of three of six categories sitting above the real category tabs,
   then a stat line whose date the first card already shows. The hero is now the
   aurora, the H1 and the standfirst, and the content starts sooner. */
.bi2_top_inner{padding-bottom:84px}
@media(max-width:1050px){.bi2_top_inner{padding-bottom:64px}}
@media(max-width:640px){.bi2_top_inner{padding-bottom:52px}}


/* Rail progress: spans the strip, arrows stay right. The track carries a tick per
   featured article so it doubles as a position indicator; the fill is a gradient
   with a lit leading edge and a slow sheen travelling across it. All motion is
   dropped under prefers-reduced-motion, where it degrades to a plain bar. */
.bi2_rail_footer{justify-content:space-between;gap:20px}
.bi2_rail_progress{
  flex:1 1 auto;min-width:0;height:3px;border-radius:99px;position:relative;overflow:hidden;
  background:
    repeating-linear-gradient(90deg,transparent 0 calc(12.5% - 1px),rgba(23,45,71,.13) calc(12.5% - 1px) 12.5%),
    #eaeef3;
}
.bi2_rail_progress span{
  display:block;height:100%;width:0;border-radius:inherit;position:relative;
  background:linear-gradient(90deg,#f5a878 0%,var(--ss-orange,#ee6723) 55%,#ff8548 100%);
  box-shadow:0 0 8px rgba(238,103,35,.5),0 0 2px rgba(238,103,35,.9);
  transition:width .18s linear;
}
/* sheen travelling across the filled portion */
.bi2_rail_progress span::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(90deg,transparent 0,rgba(255,255,255,.85) 50%,transparent 100%);
  background-size:40% 100%;background-repeat:no-repeat;
  animation:railSheen 2.4s cubic-bezier(.45,0,.25,1) infinite;
}
@keyframes railSheen{0%{background-position:-45% 0}100%{background-position:145% 0}}
/* the leading edge gets a brighter cap so the head of the bar reads clearly */
.bi2_rail_progress span::before{
  content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);
  width:3px;height:7px;border-radius:99px;background:#ffb488;
  box-shadow:0 0 8px rgba(255,140,80,.95);
}
@media(prefers-reduced-motion:reduce){
  .bi2_rail_progress span{transition:none;box-shadow:none}
  .bi2_rail_progress span::after{animation:none;display:none}
  .bi2_rail_progress span::before{box-shadow:none}
}
@media(max-width:640px){.bi2_rail_footer{gap:14px}.bi2_rail_progress{height:3px}}

/* Hover: a subtle orange glow instead of lifting the card. Applies to the main
   feed rows, category-page rows and the featured carousel cards. */
#blog-posts .bi2_row:hover,#blog-posts .bi2_row:focus-visible,
.bc_feed .bc_row:hover,.bc_feed .bc_row:focus-visible,
.bi2_card:hover,.bi2_card:focus-visible{
  transform:none;
  background:#fff;
  border-color:rgba(238,103,35,.35);
  box-shadow:0 0 0 1px rgba(238,103,35,.28),0 16px 40px -22px rgba(238,103,35,.42);
}
#blog-posts .bi2_row:hover,#blog-posts .bi2_row:focus-visible,
.bc_feed .bc_row:hover,.bc_feed .bc_row:focus-visible{border-bottom-color:transparent}
