/* Blog and glossary hubs - search-first editorial navigation, 2026-08-13. */
body.editorial-page {
  --editorial-dark: #090e17;
  --editorial-dark-2: #101827;
  --editorial-blue: #6f8bff;
}
body.editorial-page .site-nav { background: rgba(238,241,243,.92); }
body.editorial-index .page-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 430px;
  padding: clamp(58px,7vw,92px) 0 clamp(68px,8vw,104px);
  color: var(--dark-text);
  background: radial-gradient(90% 130% at 88% 8%,rgba(42,79,203,.34),transparent 58%),linear-gradient(145deg,var(--editorial-dark-2),var(--editorial-dark) 68%);
  border-bottom: 1px solid rgba(111,139,255,.22);
}
body.editorial-index .page-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 0 58%;
  opacity: .2;
  background-image: linear-gradient(rgba(143,166,242,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(143,166,242,.18) 1px,transparent 1px);
  background-size: 52px 52px;
  -webkit-mask-image: linear-gradient(90deg,transparent,#000);
  mask-image: linear-gradient(90deg,transparent,#000);
}
body.editorial-index .page-hero::after {
  content: "FIELD / NOTES";
  position: absolute;
  right: clamp(26px,6vw,88px);
  bottom: 28px;
  z-index: -1;
  font-family: var(--mono);
  font-size: clamp(34px,6vw,82px);
  line-height: 1;
  letter-spacing: -.06em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(143,166,242,.2);
}
body.editorial-glossary-index .page-hero::after { content: "A / Z"; }
body.editorial-index .page-hero .breadcrumb { color: rgba(205,214,229,.58); }
body.editorial-index .page-hero .breadcrumb a { color: rgba(237,241,248,.82); }
body.editorial-index .page-hero .eyebrow { display: flex; align-items: center; gap: 14px; color: #9aafff; }
body.editorial-index .page-hero .eyebrow::before { content: ""; width: 48px; height: 1px; background: var(--editorial-blue); }
body.editorial-index .page-hero h1 {
  max-width: 13ch;
  font-family: var(--sans);
  font-size: clamp(42px,6vw,74px);
  font-weight: 800;
  line-height: .98;
  letter-spacing: -.045em;
  color: #f5f7fb;
}
body.editorial-index .page-hero p:not(.eyebrow) { max-width: 56ch; color: rgba(211,220,235,.74); }
body.editorial-index > main > .section { background: linear-gradient(180deg,#eef1f3,#f6f8fa); }

/* Blog hub */
body.editorial-blog-index .blog-hero { min-height: 0; padding: clamp(42px,5vw,68px) 0 clamp(58px,7vw,92px); }
body.editorial-blog-index .blog-hero::after { content: "JOURNAL / 01"; bottom: 20px; font-size: clamp(28px,4.5vw,62px); }
body.editorial-blog-index .blog-hero__grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(300px,.8fr); gap: clamp(44px,8vw,118px); align-items: end; }
body.editorial-blog-index .blog-hero__copy { max-width: 760px; }
body.editorial-blog-index .blog-hero h1 { max-width: 11ch; font-size: clamp(42px,5.4vw,70px); }
body.editorial-blog-index .blog-hero__copy > p:not(.eyebrow) { max-width: 58ch; font-size: clamp(16px,1.35vw,19px); }
body.editorial-blog-index .blog-hero__archive { display: inline-flex; gap: 10px; align-items: center; min-height: 44px; margin-top: 24px; border-bottom: 1px solid rgba(154,175,255,.46); font-family: var(--mono); font-size: 12px; color: #dce5ff; }
body.editorial-blog-index .blog-topic-map { border-top: 1px solid rgba(180,195,225,.28); color: #f5f7fb; }
body.editorial-blog-index .blog-topic-map > p { margin: 0; padding: 0 0 14px; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(211,220,235,.62); }
body.editorial-blog-index .blog-topic-map a { display: grid; grid-template-columns: minmax(0,1fr) auto 20px; gap: 14px; align-items: center; min-height: 56px; border-top: 1px solid rgba(180,195,225,.16); color: #f5f7fb; transition: padding-left .22s var(--ease),color .18s ease; }
body.editorial-blog-index .blog-topic-map a:hover { padding-left: 8px; color: #afc0ff; }
body.editorial-blog-index .blog-topic-map a span { font-size: 15px; font-weight: 650; }
body.editorial-blog-index .blog-topic-map a small { font-family: var(--mono); font-size: 10px; color: rgba(211,220,235,.55); }
body.editorial-blog-index .blog-topic-map a b { font-family: var(--mono); font-size: 14px; font-weight: 400; color: #9aafff; }
body.editorial-blog-index .blog-hub { padding-bottom: clamp(76px,10vw,140px); }
body.editorial-blog-index .blog-start { margin: 0 0 clamp(70px,9vw,118px); }
body.editorial-blog-index .blog-start__head,
body.editorial-blog-index .blog-archive-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.72fr); gap: clamp(28px,6vw,84px); align-items: start; margin-bottom: clamp(28px,4vw,46px); }
body.editorial-blog-index .blog-start__head .eyebrow,
body.editorial-blog-index .blog-archive-head .eyebrow { margin: 0 0 12px; }
body.editorial-blog-index .blog-start__head h2,
body.editorial-blog-index .blog-archive-head h2 { max-width: 14ch; margin: 0; font-family: var(--sans); font-size: clamp(31px,4.5vw,54px); font-weight: 780; line-height: 1.02; letter-spacing: -.04em; color: var(--ink); }
body.editorial-blog-index .blog-start__head > p,
body.editorial-blog-index .blog-archive-head > p { margin: 0; max-width: 52ch; font-size: 16px; line-height: 1.65; color: var(--body); }
body.editorial-blog-index .blog-start__layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(290px,.72fr); gap: clamp(22px,3vw,38px); align-items: stretch; }
body.editorial-blog-index .blog-start__layout--single { grid-template-columns: 1fr; }
body.editorial-blog-index .blog-lead { display: grid; grid-template-rows: auto 1fr; min-width: 0; border-bottom: 2px solid var(--ink); background: var(--card); color: var(--ink); transition: transform .25s var(--ease),box-shadow .25s ease; }
body.editorial-blog-index .blog-lead:hover { transform: translateY(-3px); box-shadow: 0 28px 60px -42px rgba(27,36,48,.58); }
body.editorial-blog-index .blog-lead__visual { display: block; aspect-ratio: 16/8.5; overflow: hidden; background: #dce2e7; }
body.editorial-blog-index .blog-lead__visual img,
body.editorial-blog-index .blog-rail-card__visual img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease),filter .3s ease; }
body.editorial-blog-index .blog-lead:hover .blog-lead__visual img,
body.editorial-blog-index .blog-rail-card:hover .blog-rail-card__visual img { transform: scale(1.025); filter: saturate(1.04); }
body.editorial-blog-index .blog-lead__body { display: flex; flex-direction: column; padding: clamp(24px,3vw,38px); }
body.editorial-blog-index .blog-lead__meta,
body.editorial-blog-index .blog-rail-card__body > span,
body.editorial-blog-index .post-row__category { font-family: var(--mono); font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--accent); }
body.editorial-blog-index .blog-lead strong { display: block; max-width: 22ch; margin-top: 13px; font-family: var(--sans); font-size: clamp(27px,3.2vw,42px); line-height: 1.03; letter-spacing: -.035em; }
body.editorial-blog-index .blog-lead__copy { display: block; max-width: 66ch; margin-top: 16px; font-size: 15.5px; line-height: 1.62; color: var(--body); }
body.editorial-blog-index .blog-lead__link { display: inline-flex; gap: 9px; align-items: center; min-height: 44px; margin-top: 18px; font-family: var(--mono); font-size: 12px; color: var(--accent); }
body.editorial-blog-index .blog-start__rail { display: grid; grid-template-rows: repeat(2,minmax(0,1fr)); border-top: 1px solid var(--line-strong); }
body.editorial-blog-index .blog-rail-card { display: grid; grid-template-columns: minmax(116px,.72fr) minmax(0,1fr); gap: clamp(16px,2vw,24px); align-items: center; padding: 20px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
body.editorial-blog-index .blog-rail-card__visual { display: block; aspect-ratio: 16/11; overflow: hidden; background: #dce2e7; }
body.editorial-blog-index .blog-rail-card__body { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
body.editorial-blog-index .blog-rail-card__body strong { margin-top: 10px; font-family: var(--sans); font-size: clamp(18px,1.7vw,23px); line-height: 1.12; letter-spacing: -.02em; }
body.editorial-blog-index .blog-rail-card__body small { margin-top: 14px; font-family: var(--mono); font-size: 11px; color: var(--accent); }
body.editorial-blog-index .blog-archive-head { scroll-margin-top: 96px; padding-top: clamp(42px,6vw,72px); border-top: 1px solid var(--line-strong); }
body.editorial-blog-index .post-list { counter-reset: hub-post; margin-top: 32px; border-top: 1px solid var(--line-strong); }
body.editorial-blog-index .post-row { counter-increment: hub-post; grid-template-columns: 42px 112px minmax(160px,205px) minmax(0,1fr) auto; gap: clamp(16px,3vw,42px); align-items: start; padding: clamp(28px,3.5vw,44px) 0; border-top: 0; border-bottom: 1px solid var(--line); }
body.editorial-blog-index .post-row::before { content: counter(hub-post,decimal-leading-zero); font-family: var(--mono); font-size: 12px; color: var(--accent); }
body.editorial-blog-index .post-row__date { display: flex; flex-direction: column; gap: 7px; }
body.editorial-blog-index .post-row__date small { font-family: var(--mono); font-size: 10px; color: var(--muted); }
body.editorial-blog-index .post-row__visual { position: relative; display: block; aspect-ratio: 16/10; overflow: hidden; border: 1px solid rgba(27,36,48,.12); background: #e3e8ec; }
body.editorial-blog-index .post-row__visual img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.88) contrast(1.02); transition: transform .55s var(--ease); }
body.editorial-blog-index .post-row:hover .post-row__visual img { transform: scale(1.035); }
body.editorial-blog-index .post-row__body h3 { margin: 8px 0 0; font-family: var(--sans); font-size: clamp(23px,2.5vw,32px); font-weight: 750; line-height: 1.08; letter-spacing: -.025em; color: var(--ink); }
body.editorial-blog-index .post-row__body p { max-width: 68ch; margin-top: 11px; font-size: 14.5px; line-height: 1.55; }
body.editorial-blog-index .blog-nav { padding-bottom: 28px; border-bottom: 1px solid var(--line); }

/* Glossary hub */
body.editorial-glossary-index .page-hero h1 { max-width: 12ch; }
body.editorial-glossary-index .glossary-hub { padding-top: 0; }
body.editorial-glossary-index .glossary-lookup { position: relative; z-index: 3; display: grid; grid-template-columns: minmax(240px,.72fr) minmax(320px,1.28fr); gap: clamp(32px,6vw,88px); align-items: end; padding: clamp(32px,4.5vw,56px); color: #f5f7fb; background: radial-gradient(80% 130% at 100% 0%,rgba(67,99,216,.42),transparent 62%),var(--editorial-dark-2); box-shadow: 0 24px 70px -54px rgba(16,22,35,.9); }
body.editorial-glossary-index .glossary-lookup__intro .eyebrow { margin: 0 0 14px; color: #9aafff; }
body.editorial-glossary-index .glossary-lookup__intro h2 { max-width: 11ch; margin: 0; font-family: var(--sans); font-size: clamp(30px,4vw,48px); font-weight: 780; line-height: 1.02; letter-spacing: -.04em; }
body.editorial-glossary-index .glossary-lookup__intro > p:last-child { max-width: 43ch; margin: 18px 0 0; color: rgba(211,220,235,.72); font-size: 15px; line-height: 1.55; }
body.editorial-glossary-index .glossary-controls { margin: 0; }
body.editorial-glossary-index .glossary-controls label { display: block; margin-bottom: 11px; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: rgba(237,241,248,.68); }
body.editorial-glossary-index .glossary-search-wrap { position: relative; }
body.editorial-glossary-index .glossary-search-wrap > span { position: absolute; left: 0; top: 50%; z-index: 2; transform: translateY(-50%); font-family: var(--mono); font-size: 21px; color: #9aafff; }
body.editorial-glossary-index .glossary-search { max-width: none; min-height: 66px; padding: 16px 8px 16px 34px; border: 0; border-bottom: 1px solid rgba(237,241,248,.46); border-radius: 0; background: transparent; color: #fff; font-size: clamp(16px,1.6vw,20px); }
body.editorial-glossary-index .glossary-search::placeholder { color: rgba(211,220,235,.48); }
body.editorial-glossary-index .glossary-search:focus { border-color: #9aafff; box-shadow: none; }
body.editorial-glossary-index .glossary-result-count { margin: 10px 0 0; font-size: 12px; color: rgba(211,220,235,.6); }
body.editorial-glossary-index .glossary-start { display: grid; grid-template-columns: minmax(220px,.55fr) minmax(0,1.45fr); gap: clamp(28px,6vw,84px); padding: clamp(56px,8vw,104px) 0; border-bottom: 1px solid var(--line-strong); }
body.editorial-glossary-index .glossary-start__head .eyebrow { margin: 0 0 14px; }
body.editorial-glossary-index .glossary-start__head > p:last-child { max-width: 32ch; margin: 0; font-size: 16px; line-height: 1.6; color: var(--body); }
body.editorial-glossary-index .glossary-start__links { border-top: 1px solid var(--line-strong); }
body.editorial-glossary-index .glossary-start__links a { display: grid; grid-template-columns: 36px minmax(170px,.8fr) minmax(210px,1.2fr) 28px; gap: 16px; align-items: center; min-height: 82px; border-bottom: 1px solid var(--line); transition: padding-left .2s var(--ease),border-color .2s ease; }
body.editorial-glossary-index .glossary-start__links a:hover { padding-left: 10px; border-color: var(--accent); }
body.editorial-glossary-index .glossary-start__links a > span,
body.editorial-glossary-index .glossary-start__links a > b { font-family: var(--mono); font-size: 11px; font-weight: 500; color: var(--accent); }
body.editorial-glossary-index .glossary-start__links small { font-size: 13px; line-height: 1.4; color: var(--muted); }
body.editorial-glossary-index .glossary-start__links strong { font-size: 17px; line-height: 1.25; color: var(--ink); }
body.editorial-glossary-index .glossary-register { padding: clamp(64px,9vw,116px) 0 0; }
body.editorial-glossary-index .glossary-register__head { display: grid; grid-template-columns: minmax(260px,.8fr) minmax(320px,1.2fr); gap: clamp(30px,6vw,84px); align-items: end; margin-bottom: clamp(34px,5vw,58px); }
body.editorial-glossary-index .glossary-register__head .eyebrow { margin: 0 0 12px; }
body.editorial-glossary-index .glossary-register__head h2 { margin: 0; font-family: var(--sans); font-size: clamp(36px,5vw,60px); font-weight: 780; line-height: 1; letter-spacing: -.04em; color: var(--ink); }
body.editorial-glossary-index .glossary-alphabet { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
body.editorial-glossary-index .glossary-alphabet a { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line); font-family: var(--mono); font-size: 12px; color: var(--body); }
body.editorial-glossary-index .glossary-alphabet a:hover { border-color: var(--accent); color: var(--accent); }
body.editorial-glossary-index .glossary-groups { border-top: 1px solid var(--line-strong); }
body.editorial-glossary-index .glossary-letter-group { display: grid; grid-template-columns: minmax(120px,.28fr) minmax(0,1.72fr); gap: clamp(24px,5vw,72px); padding: clamp(34px,5vw,64px) 0; border-bottom: 1px solid var(--line-strong); scroll-margin-top: 96px; }
body.editorial-glossary-index .glossary-letter-group > header { display: flex; flex-direction: column; align-items: flex-start; }
body.editorial-glossary-index .glossary-letter-group > header h3 { margin: 0; font-family: var(--sans); font-size: clamp(54px,7vw,86px); font-weight: 800; line-height: .82; letter-spacing: -.06em; color: var(--ink); }
body.editorial-glossary-index .glossary-letter-group > header span { margin-top: 18px; font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
body.editorial-glossary-index .glossary-letter-group__terms { border-top: 1px solid var(--line); }
body.editorial-glossary-index .glossary-term { display: grid; grid-template-columns: minmax(190px,.72fr) minmax(250px,1.28fr) 28px; gap: clamp(18px,3vw,42px); align-items: start; padding: 24px 0; border-bottom: 1px solid var(--line); transition: padding-left .2s var(--ease),border-color .2s ease; }
body.editorial-glossary-index .glossary-term:hover { padding-left: 10px; border-color: var(--accent); }
body.editorial-glossary-index .glossary-term__name { display: flex; flex-direction: column; gap: 7px; }
body.editorial-glossary-index .glossary-term__name strong { font-size: clamp(18px,1.7vw,22px); line-height: 1.15; letter-spacing: -.02em; color: var(--ink); }
body.editorial-glossary-index .glossary-term__name small { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; color: var(--accent); }
body.editorial-glossary-index .glossary-term__desc { font-size: 14px; line-height: 1.55; color: var(--body); }
body.editorial-glossary-index .glossary-term__arrow { font-family: var(--mono); font-size: 12px; color: var(--accent); }
body.editorial-glossary-index .glossary-empty { margin: 0; padding: 40px 0; border-bottom: 1px solid var(--line-strong); font-size: 16px; }

@media (max-width: 980px) {
  body.editorial-blog-index .blog-hero__grid,
  body.editorial-blog-index .blog-start__layout { grid-template-columns: 1fr; }
  body.editorial-blog-index .blog-topic-map { max-width: 680px; }
  body.editorial-blog-index .blog-start__rail { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: none; gap: 24px; border-top: 0; }
  body.editorial-glossary-index .glossary-lookup,
  body.editorial-glossary-index .glossary-start,
  body.editorial-glossary-index .glossary-register__head { grid-template-columns: 1fr; }
  body.editorial-glossary-index .glossary-alphabet { justify-content: flex-start; }
}
@media (max-width: 700px) {
  body.editorial-index .page-hero { min-height: 390px; padding-top: 44px; }
  body.editorial-index .page-hero::after { display: none; }
  body.editorial-blog-index .blog-hero h1 { max-width: 12ch; font-size: clamp(40px,11vw,56px); }
  body.editorial-blog-index .blog-start__head,
  body.editorial-blog-index .blog-archive-head { grid-template-columns: 1fr; gap: 16px; }
  body.editorial-blog-index .blog-start__rail { grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--line-strong); }
  body.editorial-blog-index .blog-lead__visual { aspect-ratio: 16/10; }
  body.editorial-blog-index .blog-rail-card { grid-template-columns: 112px minmax(0,1fr); }
  body.editorial-blog-index .post-row { grid-template-columns: 30px minmax(0,1fr); }
  body.editorial-blog-index .post-row__date,
  body.editorial-blog-index .post-row__visual,
  body.editorial-blog-index .post-row__body { grid-column: 2; }
  body.editorial-blog-index .post-row__visual { width: min(100%,420px); }
  body.editorial-glossary-index .glossary-start__links a { grid-template-columns: 32px minmax(0,1fr) 24px; padding: 18px 0; }
  body.editorial-glossary-index .glossary-start__links small { grid-column: 2; }
  body.editorial-glossary-index .glossary-start__links strong { grid-column: 2; grid-row: 1; }
  body.editorial-glossary-index .glossary-start__links b { grid-column: 3; grid-row: 1; }
}
@media (max-width: 620px) {
  body.editorial-glossary-index .glossary-lookup { margin-inline: -20px; padding: 34px 20px 38px; }
  body.editorial-glossary-index .glossary-search { min-height: 58px; font-size: 16px; }
  body.editorial-glossary-index .glossary-letter-group { grid-template-columns: 54px minmax(0,1fr); gap: 18px; }
  body.editorial-glossary-index .glossary-letter-group > header h3 { font-size: 48px; }
  body.editorial-glossary-index .glossary-letter-group > header span { display: none; }
  body.editorial-glossary-index .glossary-term { grid-template-columns: minmax(0,1fr) 24px; gap: 10px; padding: 20px 0; }
  body.editorial-glossary-index .glossary-term__name,
  body.editorial-glossary-index .glossary-term__desc { grid-column: 1; }
  body.editorial-glossary-index .glossary-term__arrow { grid-column: 2; grid-row: 1; }
}