/* =========================================================
   KUBISSEYA / BloteK
   Isolated editorial experience for the news index + articles.
========================================================= */

body.kubisseya-blotek {
  --blotek-black: #070707;
  --blotek-panel: #101010;
  --blotek-paper: #f3f0e9;
  --blotek-orange: var(--orange);
  background: var(--blotek-black);
}

body.kubisseya-blotek .site-header,
body.kubisseya-blotek .site-header.is-scrolled {
  background: rgba(7, 7, 7, .94);
  color: #fff;
  border-bottom-color: rgba(255,255,255,.13);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body.kubisseya-blotek .site-scroll-progress {
  background: var(--blotek-orange);
}

/* ---------- Index / newsroom masthead ---------- */
.blotek-main { min-height: 100vh; overflow: clip; }
.blotek-index-main { background: var(--blotek-black); color: #fff; }

.blotek-masthead {
  position: relative;
  padding: calc(var(--header-h) + 7vh) 0 7vh;
  background:
    radial-gradient(circle at 82% 18%, rgba(245,154,0,.12), transparent 28%),
    radial-gradient(circle at 18% 72%, rgba(255,255,255,.045), transparent 25%),
    var(--blotek-black);
  color: #fff;
  isolation: isolate;
}

.blotek-masthead::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, var(--blotek-orange) 0 26%, rgba(255,255,255,.16) 26% 100%);
}

.blotek-masthead__inner { display: grid; gap: clamp(34px, 5vw, 74px); }
.blotek-masthead__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.13);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.blotek-masthead__top p { margin: 0; color: rgba(255,255,255,.64); }
.blotek-live { display: inline-flex; align-items: center; gap: 9px; }
.blotek-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--blotek-orange);
  box-shadow: 0 0 0 5px rgba(245,154,0,.08);
}

.blotek-masthead__title-row {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(270px, .55fr);
  gap: clamp(40px, 7vw, 130px);
  align-items: end;
}
.blotek-masthead h1 {
  margin: 0 0 -.07em;
  font-family: var(--display);
  font-size: clamp(7rem, 19vw, 21rem);
  font-weight: 760;
  line-height: .72;
  letter-spacing: -.095em;
  text-transform: none;
  white-space: nowrap;
}
.blotek-masthead h1 span { color: var(--blotek-orange); }
.blotek-masthead__statement { max-width: 470px; padding-bottom: 1.4vw; }
.blotek-masthead__statement strong {
  display: block;
  margin-bottom: 18px;
  font-family: var(--display);
  font-size: clamp(1.7rem, 2.5vw, 3.1rem);
  line-height: .95;
  letter-spacing: -.04em;
  text-transform: uppercase;
}
.blotek-masthead__statement p { margin: 0; color: rgba(255,255,255,.6); font-size: clamp(.94rem, 1.15vw, 1.08rem); line-height: 1.65; }

.blotek-masthead__rail {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto 1fr auto;
  align-items: center;
  gap: 17px;
  color: rgba(255,255,255,.54);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.blotek-masthead__rail i { height: 1px; background: rgba(255,255,255,.17); }

/* ---------- Index / feed ---------- */
.blotek-feed {
  padding: clamp(70px, 10vh, 140px) 0 14vh;
  background: var(--blotek-paper);
  color: var(--ink);
}
.blotek-feed__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 40px;
  align-items: end;
  margin-bottom: clamp(52px, 7vw, 105px);
}
.blotek-kicker { margin: 0 0 16px; color: #8a5600; font-size: .68rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.blotek-feed__head h2 {
  max-width: 850px;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(3rem, 6.7vw, 7.5rem);
  line-height: .84;
  letter-spacing: -.066em;
  text-transform: uppercase;
}
.blotek-category-nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 620px; }
.blotek-category-nav a {
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #66625c;
  font-size: .65rem;
  font-weight: 750;
  letter-spacing: .05em;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.blotek-category-nav a:hover,
.blotek-category-nav a.is-current { background: var(--ink); color: #fff; border-color: var(--ink); }

.blotek-news-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: clamp(58px, 7vw, 115px) clamp(26px, 4vw, 64px); }
.blotek-story { min-width: 0; border-top: 1px solid var(--ink); padding-top: 12px; }
.blotek-story--featured {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, .72fr);
  gap: clamp(36px, 5vw, 80px);
  align-items: stretch;
  padding-top: 14px;
}

.blotek-story__media {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16/11;
  background: #111;
}
.blotek-story--featured .blotek-story__media { aspect-ratio: 16/9; }
.blotek-story:nth-child(4n+2):not(.blotek-story--featured) .blotek-story__media { aspect-ratio: 4/5; }
.blotek-story:nth-child(4n+3):not(.blotek-story--featured) .blotek-story__media { aspect-ratio: 1/1; }
.blotek-story__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .9s var(--ease), filter .5s var(--ease); }
.blotek-story:hover .blotek-story__media > img { transform: scale(1.025); filter: saturate(1.08) contrast(1.02); }
.blotek-story__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 56%, rgba(0,0,0,.35));
  pointer-events: none;
}
.blotek-story__read {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 22px;
  padding: 10px 13px;
  background: rgba(7,7,7,.84);
  color: #fff;
  backdrop-filter: blur(10px);
  font-size: .62rem;
  font-weight: 850;
  letter-spacing: .09em;
}
.blotek-story__read b { color: var(--blotek-orange); font-size: .9rem; transition: transform .25s var(--ease); }
.blotek-story:hover .blotek-story__read b { transform: translate(3px,-3px); }
.blotek-story__placeholder { display: grid; place-items: center; width: 100%; height: 100%; background: #0d0d0d; }
.blotek-story__placeholder img { width: 25%; height: auto; object-fit: contain; opacity: .68; }

.blotek-story__body { display: flex; flex-direction: column; min-width: 0; padding-top: 20px; }
.blotek-story--featured .blotek-story__body { padding-top: 0; }
.blotek-story__meta { display: flex; flex-wrap: wrap; gap: 10px 20px; color: #77716a; font-size: .6rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.blotek-story__meta span:last-child { color: #8a5600; }
.blotek-story h3 {
  margin: 20px 0 0;
  font-family: var(--display);
  font-size: clamp(2.3rem, 4.4vw, 5.3rem);
  font-weight: 710;
  line-height: .88;
  letter-spacing: -.055em;
  text-transform: uppercase;
  text-wrap: balance;
}
.blotek-story--featured h3 { font-size: clamp(3.4rem, 6.8vw, 8rem); }
.blotek-story h3 a { transition: color .2s ease; }
.blotek-story h3 a:hover { color: #8a5600; }
.blotek-story__body > p { max-width: 660px; margin: 22px 0 0; color: #68645d; font-size: .98rem; line-height: 1.62; }
.blotek-story--featured .blotek-story__body > p { font-size: 1.05rem; }
.blotek-story__foot { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-top: auto; padding-top: 38px; }
.blotek-story__signals { display: flex; flex-wrap: wrap; gap: 20px; }
.blotek-story__signals span { display: grid; gap: 3px; }
.blotek-story__signals small { color: #89847b; font-size: .52rem; font-weight: 800; letter-spacing: .08em; }
.blotek-story__signals strong { font-family: var(--display); font-size: 1.25rem; line-height: 1; }
.blotek-story__number { color: #a5a097; font-family: var(--display); font-size: clamp(2rem,3vw,3.5rem); line-height: .8; }

.blotek-empty { grid-column: 1/-1; min-height: 360px; display: grid; align-content: end; padding: 42px; background: var(--ink); color: #fff; }
.blotek-empty span { color: var(--blotek-orange); font-size: .68rem; font-weight: 800; letter-spacing: .1em; }
.blotek-empty h3 { max-width: 850px; margin: 18px 0 0; font-family: var(--display); font-size: clamp(3rem,6vw,7rem); line-height: .88; letter-spacing: -.06em; text-transform: uppercase; }
.blotek-empty p { color: rgba(255,255,255,.62); }
.blotek-pagination { margin-top: 10vh; }
.blotek-pagination .nav-links { display: flex; justify-content: center; align-items: center; gap: 8px; }
.blotek-pagination .page-numbers { min-width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line); font-size: .72rem; font-weight: 800; }
.blotek-pagination .page-numbers.current,
.blotek-pagination a.page-numbers:hover { background: var(--ink); color: #fff; border-color: var(--ink); }

/* ---------- Individual story ---------- */
.blotek-article-main { background: var(--blotek-paper); }
.blotek-single-article { position: relative; }
.blotek-reading-progress {
  position: fixed;
  inset: var(--header-h) 0 auto;
  z-index: 1002;
  height: 2px;
  pointer-events: none;
}
.blotek-reading-progress i { display: block; width: 0; height: 100%; background: var(--blotek-orange); transition: width .08s linear; }

.blotek-article-hero {
  padding: calc(var(--header-h) + 36px) 0 clamp(60px, 9vh, 120px);
  background:
    radial-gradient(circle at 78% 20%, rgba(245,154,0,.1), transparent 28%),
    var(--blotek-black);
  color: #fff;
}
.blotek-article-hero__bar {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 28px;
  align-items: center;
  padding: 16px 0 22px;
  border-bottom: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.55);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.blotek-article-hero__bar a { color: #fff; }
.blotek-article-hero__bar span { display: inline-flex; align-items: center; gap: 8px; }
.blotek-article-hero__bar i { width: 6px; height: 6px; border-radius: 50%; background: var(--blotek-orange); }

.blotek-article-header { padding-top: clamp(55px, 8vh, 110px); }
.blotek-article-header .back-link { color: rgba(255,255,255,.6); }
.blotek-article-header > .eyebrow { color: var(--blotek-orange); }
.blotek-article-header h1 { color: #fff; font-size: clamp(3.8rem, 7.3vw, 8.8rem); }
.blotek-article-header .article-deck { color: rgba(255,255,255,.68); }
.blotek-article-header .article-meta { color: rgba(255,255,255,.5); border-color: rgba(255,255,255,.16); }

.blotek-article-cover { margin-top: 0; padding-top: 0; background: var(--blotek-black); }
.blotek-article-cover img { width: 100%; max-height: 78vh; object-fit: cover; display: block; }
.blotek-article-layout { padding-top: clamp(70px, 10vh, 130px); padding-bottom: 14vh; }
.blotek-article-content { min-width: 0; }
.blotek-article-content > p:first-of-type::first-letter {
  float: left;
  margin: .08em .11em 0 0;
  color: #8a5600;
  font-family: var(--display);
  font-size: 5.2em;
  font-weight: 750;
  line-height: .72;
}
.blotek-article-content blockquote { border-left-color: #8a5600; }
.blotek-stats-aside .article-aside-title::before { content: "BloteK / "; color: #8a5600; }
.blotek-related .article-related__head span::before { content: "BloteK / "; color: #8a5600; }
.blotek-article-vote { background: var(--blotek-paper); }

/* ---------- BloteK informational chat ---------- */
.blotek-chat {
  position: fixed;
  right: clamp(14px, 2vw, 30px);
  bottom: clamp(14px, 2vw, 28px);
  z-index: 1500;
  width: min(390px, calc(100vw - 28px));
  color: #fff;
  pointer-events: none;
  opacity: 0;
  transform: translateY(16px) scale(.98);
  transition: opacity .45s var(--ease), transform .45s var(--ease);
}
.blotek-chat[data-state="expanded"],
.blotek-chat[data-state="minimized"] { opacity: 1; transform: translateY(0) scale(1); }
.blotek-chat[data-state="expanded"] .blotek-chat__panel,
.blotek-chat[data-state="minimized"] .blotek-chat__launcher { pointer-events: auto; }
.blotek-chat[data-state="expanded"] .blotek-chat__panel { display: block; }
.blotek-chat[data-state="expanded"] .blotek-chat__launcher { display: none; }
.blotek-chat[data-state="minimized"] .blotek-chat__panel { display: none; }
.blotek-chat[data-state="minimized"] .blotek-chat__launcher { display: inline-flex; }

.blotek-chat__panel {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 18px;
  background: rgba(10,10,10,.96);
  box-shadow: 0 24px 80px rgba(0,0,0,.38);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
.blotek-chat__head {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.blotek-chat__brand { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.blotek-chat__mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--blotek-orange); overflow: hidden; }
.blotek-chat__mark img { width: 23px; height: 23px; object-fit: contain; filter: brightness(0); }
.blotek-chat__identity { display: grid; gap: 2px; }
.blotek-chat__identity strong { font-size: .82rem; letter-spacing: .01em; }
.blotek-chat__identity small { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,.48); font-size: .62rem; }
.blotek-chat__identity small i { width: 6px; height: 6px; border-radius: 50%; background: var(--blotek-orange); box-shadow: 0 0 0 4px rgba(245,154,0,.10); }
.blotek-chat__minimize { width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.07); color: #fff; cursor: pointer; }
.blotek-chat__minimize:hover { background: rgba(255,255,255,.13); }

.blotek-chat__body { max-height: min(58vh, 510px); overflow-y: auto; padding: 18px 14px 12px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; }
.blotek-chat__messages { display: grid; gap: 9px; }
.blotek-chat__message {
  width: fit-content;
  max-width: 92%;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 4px 13px 13px 13px;
  background: rgba(255,255,255,.065);
  color: rgba(255,255,255,.82);
  font-size: .77rem;
  line-height: 1.5;
  opacity: 0;
  transform: translateY(5px);
  animation: blotek-message-in .35s var(--ease) forwards;
}
.blotek-chat__message:first-child { background: rgba(245,154,0,.12); border-color: rgba(245,154,0,.2); color: #fff; }
.blotek-chat__typing { width: 50px; margin-top: 9px; padding: 10px 12px; display: flex; gap: 4px; border-radius: 4px 13px 13px 13px; background: rgba(255,255,255,.065); }
.blotek-chat__typing[hidden] { display: none; }
.blotek-chat__typing span { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.6); animation: blotek-dot 1s infinite ease-in-out; }
.blotek-chat__typing span:nth-child(2) { animation-delay: .13s; }
.blotek-chat__typing span:nth-child(3) { animation-delay: .26s; }
.blotek-chat__foot { display: flex; justify-content: space-between; gap: 10px; padding: 10px 14px; border-top: 1px solid rgba(255,255,255,.08); color: rgba(255,255,255,.3); font-size: .49rem; font-weight: 800; letter-spacing: .11em; }
.blotek-chat__foot span:last-child { color: var(--blotek-orange); }

.blotek-chat__launcher {
  display: none;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 7px 14px 7px 7px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: rgba(8,8,8,.95);
  color: #fff;
  box-shadow: 0 18px 48px rgba(0,0,0,.3);
  backdrop-filter: blur(18px);
  cursor: pointer;
}
.blotek-chat__launcher img { width: 38px; height: 38px; padding: 9px; object-fit: contain; border-radius: 50%; background: var(--blotek-orange); filter: brightness(0); }
.blotek-chat__launcher span { font-size: .74rem; font-weight: 800; }
.blotek-chat__launcher i { width: 7px; height: 7px; border-radius: 50%; background: var(--blotek-orange); }

@keyframes blotek-message-in { to { opacity: 1; transform: translateY(0); } }
@keyframes blotek-dot { 0%, 65%, 100% { opacity: .25; transform: translateY(0); } 35% { opacity: 1; transform: translateY(-2px); } }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
  .blotek-masthead__title-row { grid-template-columns: 1fr; gap: 32px; }
  .blotek-masthead h1 { font-size: clamp(7rem, 23vw, 14rem); }
  .blotek-masthead__statement { max-width: 620px; padding-bottom: 0; }
  .blotek-feed__head { grid-template-columns: 1fr; }
  .blotek-category-nav { justify-content: flex-start; }
  .blotek-story--featured { grid-template-columns: 1fr; }
  .blotek-story--featured .blotek-story__body { padding-top: 20px; }
  .blotek-article-hero__bar { grid-template-columns: 1fr auto; }
  .blotek-article-hero__bar span:last-child { display: none; }
}

@media (max-width: 680px) {
  .blotek-masthead { padding-top: calc(var(--header-h) + 5vh); padding-bottom: 6vh; }
  .blotek-masthead__inner { gap: 32px; }
  .blotek-masthead__top { align-items: flex-start; }
  .blotek-masthead__top p { max-width: 190px; }
  .blotek-masthead h1 { font-size: clamp(5.8rem, 28vw, 9rem); letter-spacing: -.085em; }
  .blotek-masthead__statement strong { font-size: 1.9rem; }
  .blotek-masthead__rail { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 5px; scrollbar-width: none; }
  .blotek-masthead__rail::-webkit-scrollbar { display: none; }
  .blotek-masthead__rail i { flex: 0 0 24px; }
  .blotek-masthead__rail span { flex: 0 0 auto; }

  .blotek-feed { padding-top: 70px; }
  .blotek-feed__head { margin-bottom: 48px; }
  .blotek-feed__head h2 { font-size: clamp(2.9rem, 14vw, 5rem); line-height: .89; }
  .blotek-category-nav { flex-wrap: nowrap; overflow-x: auto; margin-right: -14px; padding-right: 14px; scrollbar-width: none; }
  .blotek-category-nav::-webkit-scrollbar { display: none; }
  .blotek-category-nav a { flex: 0 0 auto; }

  .blotek-news-grid { grid-template-columns: 1fr; gap: 60px; }
  .blotek-story--featured { grid-column: auto; }
  .blotek-story__media,
  .blotek-story--featured .blotek-story__media,
  .blotek-story:nth-child(4n+2):not(.blotek-story--featured) .blotek-story__media,
  .blotek-story:nth-child(4n+3):not(.blotek-story--featured) .blotek-story__media { aspect-ratio: 4/3; }

.blotek-story:not(.blotek-story--featured) h3 {
  font-size: clamp(1.65rem, 7vw, 2.5rem);
  line-height: .95;
}


  .blotek-story__body > p,
  .blotek-story--featured .blotek-story__body > p { font-size: .94rem; }
  .blotek-story__foot { padding-top: 28px; }
  .blotek-story__signals { gap: 14px; }

  .blotek-article-hero { padding-top: calc(var(--header-h) + 18px); padding-bottom: 60px; }
  .blotek-article-hero__bar { padding-bottom: 15px; }
  .blotek-article-header { padding-top: 48px; }
  .blotek-article-header h1 { font-size: clamp(2.85rem, 12.5vw, 4.6rem) !important; line-height: .91 !important; letter-spacing: -.055em !important; }
  .blotek-article-header .article-deck { font-size: 1rem; }
  .blotek-article-cover { width: 100%; max-width: none; }
  .blotek-article-cover img { max-height: 62vh; }
  .blotek-article-layout { padding-top: 62px; }
  .blotek-article-content > p:first-of-type::first-letter { font-size: 4.2em; }

  /* Keep the mobile article sequence: story -> end/vote -> statistics -> related. */
  .blotek-article-layout .article-content { order: 1 !important; }
  .blotek-article-layout .article-footer--inside-layout { order: 2 !important; grid-column: 1 !important; grid-row: auto !important; margin-top: 7vh; }
  .blotek-article-layout .article-stats-aside { order: 3 !important; grid-column: 1 !important; grid-row: auto !important; margin-top: 6vh; }
  .blotek-article-layout .article-related { order: 4 !important; grid-column: 1 !important; grid-row: auto !important; margin-top: 7vh; }

  .blotek-chat { right: 12px; bottom: 12px; width: calc(100vw - 24px); }
  .blotek-chat__panel { border-radius: 15px; }
  .blotek-chat__body { max-height: min(56vh, 470px); }
  .blotek-chat__message { max-width: 95%; font-size: .75rem; }
}

@media (max-width: 420px) {
  .blotek-masthead h1 { font-size: clamp(5.2rem, 27vw, 7rem); }
  .blotek-masthead__top { font-size: .58rem; }
  .blotek-feed__head h2 { font-size: clamp(2.55rem, 13.3vw, 4rem); }
  
  .blotek-story:not(.blotek-story--featured) h3 {
  font-size: clamp(1.35rem, 6vw, 1.85rem);
  line-height: .96;
}
  
  .blotek-story__signals small { font-size: .48rem; }
  .blotek-chat__foot { font-size: .45rem; }
}

@media (prefers-reduced-motion: reduce) {
  .blotek-story__media img,
  .blotek-story__read b,
  .blotek-chat,
  .blotek-chat__message,
  .blotek-reading-progress i { transition: none !important; animation: none !important; }
}

/* =========================================================
   v1.6.1 — BloteK layout refinement
   Keeps the editorial system intact while simplifying the masthead,
   standardising the newsroom cards and improving article/mobile scale.
========================================================= */

/* Clean masthead: only the BloteK identity + editorial proposition. */
.blotek-masthead {
  padding: calc(var(--header-h) + 5vh) 0 clamp(58px, 8vh, 104px);
}
.blotek-masthead::after { display: none; }
.blotek-masthead__inner {
  width: var(--shell);
  gap: 0;
}
.blotek-masthead__title-row {
  grid-template-columns: minmax(0, 1.6fr) minmax(250px, .55fr);
  gap: clamp(42px, 7vw, 120px);
}
.blotek-masthead h1 {
  font-size: clamp(6.5rem, 17vw, 17rem);
  line-height: .76;
}
.blotek-masthead__statement {
  padding-bottom: .8vw;
}

/* Newsroom grid: consistent medium cards, four per row on desktop. */
.blotek-feed {
  padding-top: clamp(68px, 9vh, 118px);
}
.blotek-feed__head {
  margin-bottom: clamp(44px, 5vw, 76px);
}
.blotek-feed__head h2 {
  max-width: 760px;
  font-size: clamp(2.9rem, 5.2vw, 5.8rem);
  line-height: .88;
}
.blotek-news-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(46px, 5vw, 76px) clamp(18px, 2vw, 30px);
  align-items: start;
}
.blotek-story,
.blotek-story--featured {
  grid-column: auto;
  display: block;
  min-width: 0;
  padding-top: 10px;
}
.blotek-story__media,
.blotek-story--featured .blotek-story__media,
.blotek-story:nth-child(4n+2):not(.blotek-story--featured) .blotek-story__media,
.blotek-story:nth-child(4n+3):not(.blotek-story--featured) .blotek-story__media {
  aspect-ratio: 4 / 3;
}
.blotek-story--featured .blotek-story__body,
.blotek-story__body {
  padding-top: 16px;
}
.blotek-story__meta {
  gap: 7px 12px;
  font-size: .52rem;
}
.blotek-story h3,
.blotek-story--featured h3 {
  margin-top: 13px;
  font-size: clamp(1.5rem, 1.75vw, 2.05rem);
  line-height: .94;
  letter-spacing: -.038em;
  overflow-wrap: anywhere;
  word-break: normal;
}
.blotek-story__body > p,
.blotek-story--featured .blotek-story__body > p {
  margin-top: 13px;
  color: #6f6a62;
  font-size: .84rem;
  line-height: 1.52;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.blotek-story__foot {
  gap: 12px;
  padding-top: 22px;
}
.blotek-story__signals {
  gap: 11px;
}
.blotek-story__signals small { font-size: .43rem; }
.blotek-story__signals strong { font-size: 1rem; }
.blotek-story__number { font-size: 1.7rem; }
.blotek-story__read {
  right: 10px;
  bottom: 10px;
  gap: 12px;
  padding: 8px 10px;
  font-size: .54rem;
}

/* Individual story: remove the double top offset, simplify hierarchy and
   keep the feature image at an editorial, not billboard, scale. */
.blotek-article-main {
  padding: 0 !important;
}
.blotek-article-hero {
  padding: calc(var(--header-h) + clamp(34px, 5vh, 72px)) 0 clamp(54px, 7vh, 88px);
}
.blotek-article-header {
  grid-template-columns: minmax(115px, .55fr) minmax(0, 3.45fr);
  gap: 14px clamp(24px, 4vw, 58px);
  align-items: start;
}
.blotek-article-header .back-link {
  padding-top: 6px;
  color: rgba(255,255,255,.58);
}
.blotek-article-header > .eyebrow {
  margin: 0;
  color: var(--blotek-orange);
}
.blotek-article-header h1 {
  max-width: 980px !important;
  margin-top: 14px;
  font-size: clamp(3rem, 5.25vw, 6rem) !important;
  line-height: .9 !important;
  letter-spacing: -.052em !important;
  overflow-wrap: anywhere;
}
.blotek-article-header .article-deck {
  max-width: 720px;
  margin-top: 18px;
  font-size: clamp(1rem, 1.25vw, 1.18rem);
  line-height: 1.55;
}
.blotek-article-header .article-meta {
  margin-top: 24px;
}
.blotek-article-cover {
  width: min(86vw, 1120px);
  max-width: 1120px;
  margin: clamp(34px, 5vw, 68px) auto 0;
  padding: 0;
  background: transparent;
}
.blotek-article-cover img {
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 630px;
  object-fit: cover;
}
.blotek-article-layout {
  margin-top: 0;
  padding-top: clamp(62px, 8vh, 104px);
}
.blotek-stats-aside .article-aside-title::before,
.blotek-related .article-related__head span::before {
  content: none;
}

/* Align the assistant with the right edge of the main header shell,
   i.e. the same visual column as “Diagnóstico digital”. */
.blotek-chat {
  right: max(4vw, calc((100vw - 1480px) / 2));
}

@media (max-width: 1100px) {
  .blotek-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 56px 28px;
  }
  .blotek-story h3,
  .blotek-story--featured h3 {
    font-size: clamp(1.75rem, 3.5vw, 2.45rem);
  }
}

@media (max-width: 680px) {
  /* Give every BloteK text block a deliberate safe margin from the phone edge. */
  .blotek-masthead__inner,
  .blotek-feed .shell,
  .blotek-article-hero .shell,
  .blotek-article-layout.shell {
    width: calc(100vw - 44px);
    max-width: calc(100vw - 44px);
    margin-inline: auto;
  }

  .blotek-masthead {
    padding-top: calc(var(--header-h) + 30px);
    padding-bottom: 48px;
  }
  .blotek-masthead__title-row {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .blotek-masthead h1 {
    font-size: clamp(4.6rem, 22.5vw, 6.6rem);
    letter-spacing: -.078em;
    line-height: .82;
  }
  .blotek-masthead__statement {
    max-width: 100%;
  }
  .blotek-masthead__statement strong {
    margin-bottom: 12px;
    font-size: clamp(1.55rem, 7.4vw, 2rem);
  }
  .blotek-masthead__statement p {
    max-width: 34rem;
    font-size: .94rem;
    line-height: 1.6;
  }

  .blotek-feed {
    padding-top: 58px;
  }
  .blotek-feed__head {
    margin-bottom: 38px;
  }
  .blotek-feed__head h2 {
    max-width: 100%;
    font-size: clamp(2.5rem, 11.5vw, 3.8rem);
    line-height: .9;
  }
  .blotek-news-grid {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .blotek-story h3,
  .blotek-story--featured h3 {
    font-size: clamp(2rem, 9vw, 2.85rem);
    line-height: .94;
  }
  .blotek-story__body > p,
  .blotek-story--featured .blotek-story__body > p {
    font-size: .92rem;
  }

  .blotek-article-hero {
    padding-top: calc(var(--header-h) + 30px);
    padding-bottom: 48px;
  }
  .blotek-article-header {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .blotek-article-header .back-link,
  .blotek-article-header > .eyebrow,
  .blotek-article-header h1,
  .blotek-article-header .article-deck,
  .blotek-article-header .article-meta {
    grid-column: 1;
  }
  .blotek-article-header .back-link {
    margin-bottom: 32px;
    padding-top: 0;
  }
  .blotek-article-header > .eyebrow {
    margin-bottom: 12px;
  }
  .blotek-article-header h1 {
    margin-top: 0;
    font-size: clamp(2.35rem, 9.8vw, 3.55rem) !important;
    line-height: .94 !important;
    letter-spacing: -.045em !important;
  }
  .blotek-article-header .article-deck {
    margin-top: 17px;
    font-size: .98rem;
    line-height: 1.55;
  }
  .blotek-article-header .article-meta {
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 22px;
    font-size: .58rem;
  }
  .blotek-article-cover {
    width: calc(100vw - 44px);
    max-width: calc(100vw - 44px);
    margin-top: 28px;
  }
  .blotek-article-cover img {
    aspect-ratio: 4 / 3;
    max-height: none;
  }
  .blotek-article-layout {
    padding-top: 54px;
  }

  .blotek-chat {
    right: 18px;
    bottom: 14px;
    width: min(360px, calc(100vw - 36px));
  }
  .blotek-chat__panel { border-radius: 15px; }
  .blotek-chat__body { max-height: min(56vh, 470px); }
  .blotek-chat__message { max-width: 95%; font-size: .75rem; }
}

@media (max-width: 420px) {
  .blotek-masthead__inner,
  .blotek-feed .shell,
  .blotek-article-hero .shell,
  .blotek-article-layout.shell {
    width: calc(100vw - 36px);
    max-width: calc(100vw - 36px);
  }
  .blotek-masthead h1 { font-size: clamp(4.3rem, 21.5vw, 5.7rem); }
  .blotek-feed__head h2 { font-size: clamp(2.3rem, 11vw, 3.25rem); }
  .blotek-story h3,
  .blotek-story--featured h3 { font-size: clamp(1.9rem, 8.8vw, 2.55rem); }
  .blotek-article-header h1 { font-size: clamp(2.2rem, 9.3vw, 3.1rem) !important; }
  .blotek-article-cover {
    width: calc(100vw - 36px);
    max-width: calc(100vw - 36px);
  }
  .blotek-chat {
    right: 16px;
    width: calc(100vw - 32px);
  }
}

/* =========================================================
   v1.6.2 — equal BloteK cards, edge-aligned chat and article
   feature image integrated into the hero.
========================================================= */

/* All desktop/tablet cards share the same row height and align their signals
   at the bottom, regardless of title/excerpt length. */
.blotek-news-grid {
  align-items: stretch;
  grid-auto-rows: 1fr;
}
.blotek-story,
.blotek-story--featured {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.blotek-story__body,
.blotek-story--featured .blotek-story__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.blotek-story__foot {
  margin-top: auto;
}

/* The assistant belongs to the viewport edge on every device. */
.blotek-chat {
  right: max(10px, env(safe-area-inset-right));
}

/* The WordPress featured image now lives inside the existing hero dimensions.
   It never changes the section height and is protected by a dark editorial
   overlay for title readability. */
.blotek-article-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.blotek-article-hero.has-feature-image {
  background: var(--blotek-black);
}
.blotek-article-hero.has-feature-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: var(--blotek-article-hero-image);
  background-size: cover;
  background-position: center 45%;
  opacity: .58;
  filter: grayscale(.20) saturate(.78) contrast(1.08);
  transform: scale(1.012);
}
.blotek-article-hero.has-feature-image::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(5,5,5,.87) 0%, rgba(5,5,5,.70) 49%, rgba(5,5,5,.58) 100%),
    linear-gradient(180deg, rgba(5,5,5,.18) 0%, rgba(5,5,5,.42) 100%);
}
.blotek-article-hero .blotek-article-header {
  position: relative;
  z-index: 1;
}

@media (max-width: 680px) {
  .blotek-news-grid { grid-auto-rows: auto; }
  .blotek-story,
  .blotek-story--featured { height: auto; }
  .blotek-chat { right: max(10px, env(safe-area-inset-right)); }
  .blotek-article-hero.has-feature-image::before { background-position: center center; opacity: .52; }
  .blotek-article-hero.has-feature-image::after {
    background: linear-gradient(180deg, rgba(5,5,5,.72), rgba(5,5,5,.84));
  }
}


/* =========================================================
   v1.6.3 — BloteK chat containment + draggable remembered corners
========================================================= */
/* Keep the minimized launcher truly on the selected viewport edge. The parent
   used to remain 390px wide while minimized, so moving the parent to the right
   did not visually move the launcher to the right edge. */
.blotek-chat[data-state="minimized"] {
  width: max-content;
  max-width: calc(100vw - 20px);
}
.blotek-chat[data-state="expanded"] {
  width: min(390px, calc(100vw - 28px));
}

/* Four snap positions. Top positions sit below the fixed site header. */
.blotek-chat[data-position="bottom-right"] {
  right: max(10px, env(safe-area-inset-right)) !important;
  left: auto !important;
  bottom: max(10px, env(safe-area-inset-bottom)) !important;
  top: auto !important;
}
.blotek-chat[data-position="bottom-left"] {
  left: max(10px, env(safe-area-inset-left)) !important;
  right: auto !important;
  bottom: max(10px, env(safe-area-inset-bottom)) !important;
  top: auto !important;
}
.blotek-chat[data-position="top-right"] {
  right: max(10px, env(safe-area-inset-right)) !important;
  left: auto !important;
  top: calc(var(--header-h) + 10px) !important;
  bottom: auto !important;
}
.blotek-chat[data-position="top-left"] {
  left: max(10px, env(safe-area-inset-left)) !important;
  right: auto !important;
  top: calc(var(--header-h) + 10px) !important;
  bottom: auto !important;
}

.blotek-chat.is-dragging {
  transition: none !important;
  user-select: none;
  -webkit-user-select: none;
}
.blotek-chat.is-dragging * {
  cursor: grabbing !important;
}
.blotek-chat__head[data-blotek-chat-drag-handle],
.blotek-chat__launcher[data-blotek-chat-drag-handle] {
  touch-action: none;
}
.blotek-chat__head[data-blotek-chat-drag-handle] {
  cursor: grab;
}
.blotek-chat__launcher[data-blotek-chat-drag-handle] {
  cursor: grab;
}

@media (max-width: 680px) {
  .blotek-chat[data-state="expanded"] {
    width: min(360px, calc(100vw - 24px));
  }
  .blotek-chat[data-position="bottom-right"],
  .blotek-chat[data-position="top-right"] {
    right: max(12px, env(safe-area-inset-right)) !important;
  }
  .blotek-chat[data-position="bottom-left"],
  .blotek-chat[data-position="top-left"] {
    left: max(12px, env(safe-area-inset-left)) !important;
  }
}


/* =========================================================
   v1.6.5 — BloteK masthead media + identity guard
   Optional background image is visual only and never changes hero geometry.
   The permanent BloteK mark intentionally returns to the original typographic K.
========================================================= */
.blotek-masthead.has-blotek-hero-image {
  background:
    linear-gradient(90deg, rgba(7,7,7,.91) 0%, rgba(7,7,7,.80) 54%, rgba(7,7,7,.84) 100%),
    radial-gradient(circle at 82% 18%, rgba(245,154,0,.20), transparent 34%),
    var(--blotek-masthead-image) center 45% / cover no-repeat;
}

.blotek-masthead.has-blotek-hero-image .blotek-masthead__title-row {
  position: relative;
  z-index: 1;
}

/* Chat availability indicator follows the KUBISSEYA orange identity. */
.blotek-chat__identity small i,
.blotek-chat__launcher i {
  background: var(--blotek-orange) !important;
}
.blotek-chat__identity small i {
  box-shadow: 0 0 0 4px rgba(245,154,0,.10) !important;
}

@media (max-width: 680px) {
  .blotek-masthead.has-blotek-hero-image {
    background:
      linear-gradient(180deg, rgba(7,7,7,.88) 0%, rgba(7,7,7,.92) 100%),
      radial-gradient(circle at 75% 12%, rgba(245,154,0,.18), transparent 34%),
      var(--blotek-masthead-image) center center / cover no-repeat;
  }
}

/* =========================================================
   v1.8 — BloteK as a self-contained portal
========================================================= */
body.kubisseya-blotek .site-header--blotek .header-inner {
  grid-template-columns: 220px 1fr;
}
body.kubisseya-blotek .site-header--blotek .site-brand { justify-self: start; }
.blotek-exit {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: rgba(255,255,255,.72);
  font-size: .74rem;
  font-weight: 760;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.blotek-exit i {
  font-style: normal;
  font-size: 1.35rem;
  line-height: 1;
  transition: transform .25s var(--ease), color .25s var(--ease);
}
.blotek-exit:hover i { transform: rotate(90deg); color: var(--blotek-orange); }

/* The story itself owns the vote footer. Statistics and related news remain
   separate columns; this prevents overlap on long or short articles. */
.blotek-article-layout {
  grid-template-columns: minmax(190px,.82fr) minmax(0,3fr) minmax(230px,1.08fr);
}
.blotek-story-column { min-width: 0; grid-column: 2; }
.blotek-stats-aside { grid-column: 1; }
.blotek-related { grid-column: 3; }
.blotek-article-vote {
  width: 100%;
  margin-top: clamp(58px, 9vh, 110px);
  padding-top: clamp(28px, 4vh, 50px);
  border-top: 1px solid var(--line);
  background: transparent;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: end;
}
.blotek-article-vote h2 {
  max-width: 620px;
  font-size: clamp(2.15rem, 3.8vw, 4.6rem);
}
.blotek-article-vote .vote-box { justify-self: end; align-self: end; flex-wrap: nowrap; }
.blotek-article-vote .vote-button[data-vote="up"].is-selected {
  background: var(--blotek-black);
  border-color: var(--blotek-black);
  color: var(--blotek-orange);
}
.blotek-article-vote .vote-button[data-vote="up"].is-selected .vote-count { color: var(--blotek-orange); }

/* The deck/excerpt is intentionally absent from the internal story hero. */
.blotek-article-header .article-deck { display: none !important; }

@media (max-width: 1160px) {
  .blotek-article-layout { grid-template-columns: minmax(180px,.8fr) minmax(0,2.8fr); }
  .blotek-story-column { grid-column: 2; }
  .blotek-stats-aside { grid-column: 1; }
  .blotek-related { grid-column: 2; }
}

@media (max-width: 700px) {
  body.kubisseya-blotek .site-header--blotek .header-inner {
    grid-template-columns: minmax(0,1fr) auto;
    gap: 18px;
  }
  .blotek-exit { font-size: 0; gap: 0; }
  .blotek-exit i { font-size: 1.55rem; }

  .blotek-article-layout {
    display: flex !important;
    flex-direction: column;
  }
  .blotek-story-column { order: 1; width: 100%; }
  .blotek-stats-aside { order: 2; width: 100%; margin-top: 6vh; position: static; }
  .blotek-related { order: 3; width: 100%; margin-top: 7vh; position: static; }
  .blotek-article-vote {
    margin-top: 7vh;
    padding-top: 30px;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 18px;
  }
  .blotek-article-vote h2 { font-size: clamp(1.75rem, 7.6vw, 2.6rem); line-height: .94; }
  .blotek-article-vote .vote-box { gap: 5px; }
  .blotek-article-vote .vote-button { min-width: 46px; padding-inline: 8px; }
}

/* =========================================================
   v1.9.4 — BloteK entry, advertising, featured lead & sharing
========================================================= */

/* ---------- Advertising rail shared by index and articles ---------- */
.blotek-ads {
  min-width: 0;
  align-self: start;
}
.blotek-ads__head {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 13px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.blotek-ads__head span {
  font-size: .66rem;
  font-weight: 850;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.blotek-ads__list {
  display: grid;
  gap: 18px;
  padding-top: 18px;
}
.blotek-ad-card {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--line);
  background: #fff;
}
.blotek-ad-card > a,
.blotek-ad-card__image {
  display: block;
  width: 100%;
  height: 100%;
}
.blotek-ad-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .35s var(--ease);
}
.blotek-ad-card > a:hover img { transform: scale(1.015); }

/* ---------- BloteK index: editorial content at left, ads at right ---------- */
.blotek-feed { padding-bottom: 12vh; }
.blotek-index-main .blotek-feed { padding-top: clamp(36px, 5vh, 60px); }
.blotek-portal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px);
  gap: clamp(28px, 4vw, 66px);
  align-items: start;
}
.blotek-newsroom { grid-column: 1; grid-row: 1; min-width: 0; }
.blotek-ads--index { grid-column: 2; grid-row: 1; }
.blotek-featured-wrap {
  margin-bottom: clamp(28px, 3vw, 42px);
}
.blotek-newsroom .blotek-news-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(46px, 5vw, 76px) clamp(18px, 2vw, 30px);
}
.blotek-newsroom .blotek-pagination { margin-top: 10vh; }

/* Lead story: image is the card, with the requested title/meta inside it. */
.blotek-story--featured {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
}
.blotek-featured-card {
  position: relative;
  display: block;
  min-height: clamp(430px, 54vw, 650px);
  overflow: hidden;
  background: #090909;
  color: #fff;
}
.blotek-featured-card__media,
.blotek-featured-card__shade {
  position: absolute;
  inset: 0;
  display: block;
}
.blotek-featured-card__media img,
.blotek-featured-card__media .blotek-story__placeholder {
  width: 100%;
  height: 100%;
}
.blotek-featured-card__media img {
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform .9s var(--ease), filter .5s var(--ease);
}
.blotek-featured-card:hover .blotek-featured-card__media > img {
  transform: scale(1.025);
  filter: saturate(1.06) contrast(1.02);
}
.blotek-featured-card__shade {
  background:
    linear-gradient(180deg, rgba(0,0,0,.08) 12%, rgba(0,0,0,.22) 45%, rgba(0,0,0,.88) 100%),
    linear-gradient(90deg, rgba(0,0,0,.38), transparent 60%);
}
.blotek-featured-card__content {
  position: absolute;
  z-index: 2;
  inset: auto clamp(22px, 3.5vw, 54px) clamp(24px, 4vw, 52px);
  display: grid;
  gap: 18px;
}
.blotek-featured-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 20px;
  color: rgba(255,255,255,.72);
  font-size: .6rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.blotek-featured-card__meta span:nth-child(2) { color: var(--blotek-orange); }
.blotek-featured-card__meta strong { color: #fff; font-weight: 850; }
.blotek-featured-card h2 {
  max-width: 1060px;
  margin: 0;
  color: #fff;
  font-family: var(--display);
  font-size: clamp(2.55rem, 4.25vw, 5.35rem);
  font-weight: 720;
  line-height: .86;
  letter-spacing: -.06em;
  text-transform: uppercase;
  text-wrap: balance;
}
.blotek-featured-card__read {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  padding-top: 2px;
  color: rgba(255,255,255,.86);
  font-size: .62rem;
  font-weight: 850;
  letter-spacing: .09em;
}
.blotek-featured-card__read b { color: var(--blotek-orange); font-size: .95rem; }

/* ---------- Single article: related news under statistics, ads at right ---------- */
.blotek-article-layout {
  grid-template-columns: minmax(190px,.82fr) minmax(0,3fr) minmax(210px,1.02fr);
}
.blotek-left-rail {
  grid-column: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(42px, 6vh, 72px);
  align-self: start;
}
.blotek-left-rail .blotek-stats-aside,
.blotek-left-rail .blotek-related {
  position: static;
  grid-column: auto;
  margin: 0;
}
.blotek-left-rail .blotek-related { border-top: 1px solid var(--line); }
.blotek-left-rail .related-story {
  grid-template-columns: 54px minmax(0,1fr);
  gap: 10px;
  padding: 11px 0;
}
.blotek-left-rail .related-story__media {
  width: 54px;
  height: 54px;
}
.blotek-left-rail .related-story h3 {
  font-size: clamp(.88rem, .9vw, 1.08rem);
  line-height: 1;
  overflow-wrap: anywhere;
}
.blotek-left-rail .article-related__head {
  display: grid;
  gap: 4px;
}
.blotek-left-rail .article-related__more { font-size: .58rem; }
.blotek-story-column { grid-column: 2; }
.blotek-ads--article { grid-column: 3; }

/* Vote controls and social sharing sit together at the end of the story. */
.blotek-engagement-actions {
  justify-self: end;
  align-self: end;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  max-width: 360px;
}
.blotek-engagement-actions .vote-box {
  justify-self: auto;
  flex-wrap: nowrap;
}
.blotek-share {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 5px;
}
.blotek-share__button {
  position: relative;
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 38px;
  padding: 0;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.blotek-share__button:hover,
.blotek-share__button:focus-visible,
.blotek-share__button.is-copied {
  background: var(--blotek-black);
  border-color: var(--blotek-black);
  color: var(--blotek-orange);
  transform: translateY(-1px);
}
.blotek-share__button svg {
  width: 17px;
  height: 17px;
  fill: currentColor;
}
.blotek-share__feedback {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 7px);
  transform: translateX(-50%);
  padding: 4px 6px;
  background: var(--blotek-black);
  color: #fff;
  font-size: .5rem;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
}
.blotek-share__button.is-copied .blotek-share__feedback { opacity: 1; }

@media (max-width: 1160px) {
  .blotek-portal-grid { grid-template-columns: minmax(0,1fr) minmax(170px, 210px); }
  .blotek-newsroom .blotek-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .blotek-article-layout { grid-template-columns: minmax(175px,.8fr) minmax(0,2.8fr); }
  .blotek-left-rail { grid-column: 1; grid-row: 1 / span 2; }
  .blotek-story-column { grid-column: 2; grid-row: 1; }
  .blotek-ads--article { grid-column: 2; grid-row: 2; margin-top: clamp(52px, 7vh, 84px); }
  .blotek-ads--article .blotek-ads__list { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 800px) {
  .blotek-feed { padding-top: clamp(52px, 8vh, 82px); }
  .blotek-portal-grid { display: flex; flex-direction: column; gap: 0; }
  .blotek-newsroom { order: 1; width: 100%; }
  .blotek-ads--index { order: 2; width: 100%; margin-top: 10vh; }
  .blotek-ads--index .blotek-ads__list { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .blotek-featured-card { min-height: clamp(390px, 94vw, 560px); }
  .blotek-featured-card h2 { font-size: clamp(2.15rem, 7.2vw, 3.7rem); }

  .blotek-article-layout {
    display: flex !important;
    flex-direction: column;
  }
  .blotek-story-column { order: 1; width: 100%; }
  .blotek-left-rail { order: 2; width: 100%; margin-top: 7vh; gap: 7vh; }
  .blotek-ads--article { order: 3; width: 100%; margin-top: 8vh; }
  .blotek-left-rail .article-stat-summary { grid-template-columns: repeat(3, 1fr); }
  .blotek-left-rail .article-stat-summary > div {
    display: grid;
    justify-items: center;
    justify-content: center;
    text-align: center;
    border-right: 1px solid var(--line);
    border-bottom: 0;
  }
  .blotek-left-rail .article-stat-summary > div:last-child { border-right: 0; }
  .blotek-left-rail .article-stat-summary span,
  .blotek-left-rail .article-stat-summary strong { width: 100%; text-align: center; }
  .blotek-left-rail .article-related__list { grid-template-columns: 1fr; }
  .blotek-left-rail .related-story {
    grid-template-columns: 68px minmax(0,1fr);
    gap: 13px;
    padding: 13px 0;
  }
  .blotek-left-rail .related-story__media { width: 68px; height: 68px; }
  .blotek-left-rail .related-story h3 { font-size: clamp(1rem, 4.3vw, 1.35rem); }
  .blotek-ads--article .blotek-ads__list { grid-template-columns: repeat(2, minmax(0,1fr)); }

  .blotek-article-vote {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .blotek-engagement-actions {
    justify-self: start;
    justify-content: flex-start;
    max-width: 100%;
  }
}

@media (max-width: 560px) {
  .blotek-newsroom .blotek-news-grid { grid-template-columns: 1fr; gap: 60px; }
  .blotek-featured-wrap { margin-bottom: 64px; }
  .blotek-featured-card {
    min-height: 410px;
    aspect-ratio: auto;
  }
  .blotek-featured-card__content {
    inset: auto 18px 22px;
    gap: 14px;
  }
  .blotek-featured-card__meta { gap: 7px 12px; font-size: .53rem; }
  .blotek-featured-card h2 {
    font-size: clamp(1.9rem, 8.7vw, 3rem);
    line-height: .9;
  }
  .blotek-featured-card__read { font-size: .56rem; }

  .blotek-ads--index .blotek-ads__list,
  .blotek-ads--article .blotek-ads__list { grid-template-columns: 1fr; }
  .blotek-ad-card { max-width: 100%; }

  .blotek-engagement-actions { gap: 10px 6px; }
  .blotek-share { width: 100%; }
  .blotek-share__button { width: 36px; height: 36px; flex-basis: 36px; }
}

/* Keep the K placeholder proportional when a lead story has no featured image. */
.blotek-featured-card__media .blotek-story__placeholder img {
  width: min(180px, 26%);
  height: auto;
  object-fit: contain;
  opacity: .72;
}

/* =========================================================
   v1.9.7 — Sticky article rails + compact vote/share group
========================================================= */

/* On full desktop the two auxiliary rails remain visible while the reader
   moves through the story, without escaping the article grid. */
@media (min-width: 1161px) {
  .blotek-left-rail,
  .blotek-ads--article {
    position: sticky;
    top: calc(var(--header-h) + 24px);
    align-self: start;
  }
}

/* Keep sharing beside the vote controls. The label belongs only to sharing. */
.blotek-engagement-actions {
  align-items: flex-end;
  gap: 18px;
}
.blotek-share {
  width: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  align-items: end;
}
.blotek-share__label {
  display: block;
  color: var(--muted);
  font-size: .58rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.blotek-share__buttons {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 5px;
}

@media (max-width: 800px) {
  .blotek-engagement-actions {
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 16px;
  }
  .blotek-share { width: auto; }
}

@media (max-width: 560px) {
  .blotek-engagement-actions {
    width: 100%;
    flex-wrap: nowrap;
    gap: 14px;
  }
  .blotek-share { width: auto; min-width: 0; }
  .blotek-share__buttons { gap: 4px; }
}

@media (max-width: 420px) {
  .blotek-engagement-actions { gap: 12px; }
  .blotek-article-vote .vote-box { gap: 5px; }
  .blotek-article-vote .vote-button {
    min-width: 42px;
    padding-inline: 6px;
  }
  .blotek-share__button {
    width: 30px;
    height: 34px;
    flex-basis: 30px;
  }
  .blotek-share__button svg {
    width: 15px;
    height: 15px;
  }
}

/* =========================================================
   v1.9.8 — Sticky index advertising + refined lead story
========================================================= */

/* On the BloteK index the advertising rail follows the reader on desktop,
   while remaining constrained by the portal grid. */
@media (min-width: 801px) {
  .blotek-ads--index {
    position: sticky;
    top: calc(var(--header-h) + 24px);
    align-self: start;
  }
}

/* A quieter lead headline preserves the image and editorial hierarchy. */
.blotek-featured-card h2 {
  font-size: clamp(2rem, 3.25vw, 4rem);
  line-height: .9;
}

/* Short lead summary below the image. It is intentionally concise and
   generated from the post excerpt/content with an explicit ellipsis. */
.blotek-featured-card__excerpt {
  max-width: 72ch;
  margin: 18px 0 0;
  color: #55514b;
  font-size: clamp(.9rem, 1vw, 1rem);
  line-height: 1.55;
}

@media (max-width: 800px) {
  .blotek-featured-card h2 {
    font-size: clamp(1.8rem, 5.3vw, 2.7rem);
    line-height: .92;
  }
  .blotek-featured-card__excerpt {
    margin-top: 16px;
    font-size: .94rem;
    line-height: 1.5;
  }
}

@media (max-width: 560px) {
  .blotek-featured-wrap { margin-bottom: 28px; }
  .blotek-featured-card h2 {
    font-size: clamp(1.55rem, 6.7vw, 2.15rem);
    line-height: .94;
  }
  .blotek-featured-card__excerpt {
    margin-top: 14px;
    font-size: .9rem;
    line-height: 1.48;
  }
}
