.blog-hero{position:relative;overflow:hidden;isolation:isolate}.blog-hero__line{position:absolute;z-index:0;pointer-events:none;top:7rem;left:50%;width:170%;max-width:none;height:auto;opacity:.73;transform:translate(-50%)}.blog-hero__content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1.4rem;max-width:72rem;margin:0 auto;text-align:center}.blog-hero__eyebrow{margin:0;font-size:1.6rem;line-height:2.6rem;color:var(--learn-ink)}.blog-hero__title{margin:0;font-family:var(--learn-serif);font-size:3.6rem;line-height:4.4rem;font-weight:700;color:var(--learn-ink)}.blog-hero__title-line{display:block}.blog-hero__title-line--italic{font-style:italic;font-weight:400}.blog-hero__text{font-size:1.6rem;line-height:2.6rem;color:var(--learn-gray)}.blog-hero__text p{margin:0}.blog-hero__nav{position:relative;z-index:1;margin-top:2.8rem}.blog-hero__pills{display:flex;gap:.8rem;margin:0 -1.5rem;padding:0 1.5rem;list-style:none;overflow-x:auto;scrollbar-width:none}.blog-hero__pills::-webkit-scrollbar{display:none}.blog-hero__pills li{flex:0 0 auto}.blog-hero__pill{display:inline-flex;align-items:center;padding:1rem 2rem;border-radius:10rem;background-color:#fff;font-size:1.5rem;line-height:2rem;font-weight:500;color:var(--learn-ink);text-decoration:none;white-space:nowrap;transition:background-color .2s ease,color .2s ease}.blog-hero__pill:hover{background-color:var(--learn-cream)}.blog-hero__pill.is-active{background-color:var(--learn-ink);color:#fff}.blog-hero__pill:focus-visible{outline:.2rem solid var(--learn-teal);outline-offset:.2rem}@media screen and (min-width:750px){.blog-hero__line{width:130%;top:9rem}.blog-hero__content{gap:2rem}.blog-hero__eyebrow{font-size:1.8rem}.blog-hero__title{font-size:7rem;line-height:8rem}.blog-hero__text{font-size:1.8rem;line-height:2.8rem}.blog-hero__nav{margin-top:4rem}.blog-hero__pills{flex-wrap:wrap;justify-content:center;gap:1rem;margin:0;padding:0;overflow:visible}.blog-hero__pill{padding:1.2rem 2.4rem;font-size:1.6rem}}@media screen and (min-width:1920px){.blog-hero__line{width:100%}}@media screen and (max-width:749px){.blog-hero__pills{margin-inline:-20px;padding-inline:20px}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/section-blog-hero.css.map */
