/* BLOG TOPICS · package 1021
   Local component for /blog/ only. Loaded conditionally from main.tpl.
   Accepted composition: left label + open topic list.
   Refinement: no top rule; count + arrow stay with their topic. */

body section.blog.full .blog-topics{
  display:grid;
  grid-template-columns:173px minmax(0,1fr);
  gap:28px;
  width:100%;
  margin:4px 0 36px;
  padding:20px 0 18px 17px;
  border-bottom:1px solid #E8E3FF;
  box-sizing:border-box;
  font-family:"Manrope",Arial,sans-serif;
}
body section.blog.full .blog-topics__intro{
  position:relative;
  min-width:0;
  padding:0 24px 0 17px;
  border-right:1px solid #E8E3FF;
  box-sizing:border-box;
  text-align:left;
}
body section.blog.full .blog-topics__intro:before{
  content:"";
  position:absolute;
  left:0;
  top:1px;
  height:68px;
  width:3px;
  background:#C61959;
}
body section.blog.full .blog-topics__eyebrow{
  display:block;
  margin:0 0 8px;
  color:#C61959;
  font-size:11px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.08em;
}
body section.blog.full .blog-topics__title{
  margin:0;
  padding:0;
  color:#3923B5;
  font-size:19px;
  line-height:1.22;
  font-weight:700;
  text-align:left;
  text-transform:none;
}
body section.blog.full .blog-topics__nav{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:28px;
  row-gap:0;
  min-width:0;
  margin:0;
  padding:0;
}
body section.blog.full .blog-topics__link{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:48px;
  margin:0;
  padding:6px 0;
  border-bottom:1px solid #E6E2EA;
  color:#3923B5;
  text-decoration:none;
  box-sizing:border-box;
}
body section.blog.full .blog-topics__link:last-child{
  border-bottom-color:transparent;
}
body section.blog.full .blog-topics__index{
  color:#9B8FE6;
  font-size:11px;
  line-height:1;
  font-weight:700;
  letter-spacing:.04em;
}
body section.blog.full .blog-topics__label{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  column-gap:7px;
  row-gap:2px;
  min-width:0;
}
body section.blog.full .blog-topics__name{
  min-width:0;
  color:#3923B5;
  font-size:14px;
  line-height:1.32;
  font-weight:600;
  overflow-wrap:break-word;
}
body section.blog.full .blog-topics__meta{
  display:inline-flex;
  align-items:center;
  gap:5px;
  white-space:nowrap;
  flex:0 0 auto;
}
body section.blog.full .blog-topics__count{
  color:#9B8FE6;
  font-size:12px;
  line-height:1;
  font-weight:600;
}
body section.blog.full .blog-topics__arrow{
  display:inline-block;
  color:#6245DC;
  font-size:18px;
  line-height:1;
  font-weight:400;
  transform:translateX(0);
  transition:transform .16s ease;
}
body section.blog.full .blog-topics__link:hover .blog-topics__name,
body section.blog.full .blog-topics__link:focus .blog-topics__name{
  color:#C61959;
}
body section.blog.full .blog-topics__link:hover .blog-topics__arrow,
body section.blog.full .blog-topics__link:focus .blog-topics__arrow{
  transform:translateX(3px);
}
body section.blog.full .blog-topics__link:focus{
  outline:1px dotted #6245DC;
  outline-offset:4px;
}
body section.blog.full .blog-topics + ul.list{
  margin-top:0 !important;
}

@media only screen and (min-width:731px) and (max-width:1190px){
  body section.blog.full .blog-topics{
    grid-template-columns:148px minmax(0,1fr);
    gap:22px;
    margin-bottom:32px;
    padding:19px 0 18px 17px;
  }
  body section.blog.full .blog-topics__intro{
    padding-right:18px;
  }
  body section.blog.full .blog-topics__nav{
    column-gap:22px;
  }
  body section.blog.full .blog-topics__name{
    font-size:13px;
  }
}

@media only screen and (max-width:730px), only screen and (max-device-width:730px){
  body section.blog.full .blog-topics{
    grid-template-columns:1fr;
    gap:10px;
    margin:0 0 22px;
    padding:14px 0 12px;
  }
  body section.blog.full .blog-topics__intro{
    padding:0 0 9px 12px;
    border-right:0;
    border-bottom:1px solid #E8E3FF;
    text-align:left;
  }
  body section.blog.full .blog-topics__intro:before{
    height:42px;
  }
  body section.blog.full .blog-topics__eyebrow{
    margin-bottom:3px;
    font-size:10px;
  }
  body section.blog.full .blog-topics__title{
    font-size:16px;
    line-height:1.22;
    text-align:left;
  }
  body section.blog.full .blog-topics__nav{
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:18px;
    row-gap:0;
  }
  body section.blog.full .blog-topics__link{
    grid-template-columns:22px minmax(0,1fr);
    gap:4px;
    min-height:42px;
    padding:5px 0;
    border-bottom:1px solid #E6E2EA;
  }
  body section.blog.full .blog-topics__link:nth-last-child(-n+2){
    border-bottom-color:transparent;
  }
  body section.blog.full .blog-topics__index{
    font-size:10px;
  }
  body section.blog.full .blog-topics__label{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    column-gap:4px;
    row-gap:1px;
    min-width:0;
  }
  body section.blog.full .blog-topics__name{
    display:inline;
    font-size:12px;
    line-height:1.3;
  }
  body section.blog.full .blog-topics__meta{
    display:inline-flex;
    align-items:center;
    gap:0;
    white-space:nowrap;
  }
  body section.blog.full .blog-topics__count{
    font-size:11px;
  }
  body section.blog.full .blog-topics__arrow{
    display:none;
  }
}