.cr-twi{--cr-gutter:20px;--cr-sp:48px;--cr-h6:16px;--cr-base:14px;--cr-twi-gap:20px;--cr-twi-list-gap:24px;padding-inline:max(var(--cr-gutter),50% - 800px);overflow:hidden}
.cr-twi__inner{display:grid;gap:32px;text-align:center}
.cr-twi__list{display:grid;grid:auto / auto-flow 100%;row-gap:var(--cr-twi-list-gap);align-items:start;min-width:0;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;overflow:auto hidden;scrollbar-width:none;padding-block:1px;margin-inline:calc(-1 * var(--cr-outer,0px));padding-inline:var(--cr-outer,0px);scroll-padding-inline:var(--cr-outer,0px)}
.cr-twi__list::-webkit-scrollbar{display:none}
.cr-twi__item{display:grid;gap:var(--cr-twi-gap);justify-items:center;padding-inline:24px;scroll-snap-align:center;scroll-snap-stop:always}
.cr-twi__icon{display:block;width:24px;height:24px;color:currentColor}
.cr-twi__icon svg{display:block;width:24px;height:24px}
.cr-twi__title{margin:0;font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:var(--cr-h6);line-height:1.4;letter-spacing:-0.02em}
.cr-twi__text{margin:16px 0 0;font-size:var(--cr-base);line-height:1.6}
.cr-twi__dots{display:flex;justify-content:center;gap:10px 16px;flex-wrap:wrap}
.cr-twi__dot{width:6px;height:6px;padding:0;border:0;border-radius:9999px;opacity:.3;background:currentColor;cursor:pointer;position:relative;transition:opacity .2s ease-in-out}
.cr-twi__dot:before{content:"";position:absolute;inset:-0.625rem}
.cr-twi__dot[aria-current="true"]{opacity:1}
.cr-twi:not(.is-scrollable) .cr-twi__dots{display:none}
@media screen and (min-width:700px){
  .cr-twi{--cr-gutter:32px;--cr-sp:64px;--cr-base:16px}
}
@media screen and (min-width:1000px){
  .cr-twi{--cr-gutter:48px;--cr-sp:72px}
  .cr-twi:not(.is-scrollable) .cr-twi__list{gap:24px}
  .cr-twi:not(.is-scrollable) .cr-twi__item{padding-inline:0}
}
@media screen and (min-width:1150px){
  .cr-twi{--cr-sp:80px}
  .cr-twi__list{grid:auto / repeat(var(--cr-twi-columns,4),1fr);margin-inline:0;padding-inline:0;scroll-padding-inline:0}
  .cr-twi__dots{display:none}
}
@media screen and (min-width:1400px){
  .cr-twi{--cr-sp:96px;--cr-h6:20px}
  .cr-twi:not(.is-scrollable) .cr-twi__list{gap:40px}
}