/* TheySaid footer (Footer V4), the one footer component on the site (homepage and every inner page; /v4 keeps its own
   Footer LP). Loaded by the embed inside Footer V4.
   Part 0: what the inner pages need and the homepage gets from its own bundle: the variables it defines on :root, and
           resets against the inner pages' tag styles (site CSS + the legacy a{} rule, which the same embed inlines just
           before this file).
   Part 1: the footer rules of theysaid-home-v32.css (homepage bundle, only loaded on the homepage), unchanged.
   Part 2: px type sizes (inner pages scale rem with the viewport) and the homepage-only letter-spacing tweak.
   Part 3: spacing after the inner pages' closing CTA. */

/* Part 0 */
.footer-v4_component{--ease-standard:cubic-bezier(.4,0,.2,1);--g200:var(--_colors---gray-scale--gray-200,#e5e7eb);--g300:var(--_colors---gray-scale--gray-300,#d1d5db)}
:where(.footer-v4_component) :is(h1,h2,h3,h4,h5,h6){color:revert;letter-spacing:revert;font-family:revert;font-size:revert;font-weight:revert;line-height:revert;margin:0;padding:0}
:where(.footer-v4_component) p{color:revert;font-size:revert;line-height:revert;margin:0;padding:0}
:where(.footer-v4_component) a{color:inherit;text-decoration:none;letter-spacing:inherit;font-size:inherit;line-height:inherit;margin-bottom:0}
:where(.footer-v4_component) :is(ul,ol){margin:0;padding:0;list-style:none;font-size:revert;line-height:revert}
:where(.footer-v4_component) li{list-style-type:none;margin:0;padding:0}
:where(.footer-v4_component) img{color:revert;padding:0;display:block;max-width:100%}
.footer-v4_component .sr-only{position:absolute!important}
.footer-v4_component .logo-v4>span{position:absolute;display:block}
.footer-v4_component .logo-v4>span:nth-child(1){inset:29.65% 55.88% 2.14% 0}
.footer-v4_component .logo-v4>span:nth-child(2){inset:28.09% 14.57% 0 44.91%}
.footer-v4_component .logo-v4>span:nth-child(3){inset:0 0 1.04% 55.36%}
.footer-v4_component .logo-v4 img{position:absolute;inset:0;width:100%;height:100%;max-width:none}
@media(min-width:480px){.footer-v4_component .logo-v4{--logo-w:139.62px;width:var(--logo-w)}}

/* Part 1 */
.footer-v4_component{--ft-line: var(--_colors---theme--border-on-dark, #3f434c) }
.footer-v4_component p,.footer-v4_component h2,.footer-v4_component h3{margin:0}
.footer-v4_hr{background:var(--ft-line)}
.footer-v4_blurb,.footer-v4_follow-title{text-box:trim-both cap alphabetic}
.footer-v4_social-link:before{content:"";position:absolute;inset:0;border-radius:50%;background:#ffffff14;opacity:0;transition:opacity .25s var(--ease-standard)}
.footer-v4_i{translate:-50% -50%}
.footer-v4_i.is-yt{scale:1 -1}
.footer-v4_social-link:hover:before{opacity:1}
.footer-v4_social-link:focus-visible:before{opacity:1}
.footer-v4_social-link:hover .footer-v4_sico{filter:brightness(1.35)}
.footer-v4_social-link:focus-visible .footer-v4_sico{filter:brightness(1.35)}
.footer-v4_social-link:active:before{background:#ffffff24}
.footer-v4_social-link:focus-visible{outline-offset:2px;border-radius:50%}
.footer-v4_vr{background:var(--ft-line)}
.footer-v4_col-title,.footer-v4_link{text-box:trim-both cap alphabetic}
.footer-v4_link:before{content:"";position:absolute;inset:-12px -8px}
.footer-v4_link:after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:currentColor;opacity:0;transition:opacity .25s var(--ease-standard)}
.footer-v4_link:focus-visible{color:#fff}
.footer-v4_link:hover:after{opacity:1}
.footer-v4_link:focus-visible:after{opacity:1}
.footer-v4_link:active{color:var(--g200)}
.footer-v4_copy{text-box:trim-both cap alphabetic}
.footer-v4_link.is-sm{font:inherit}
.footer-v4_link.is-sm:before{inset:-10px -6px}
.footer-v4_totop{translate:-50% -50%}
.footer-v4_totop:focus-visible{opacity:1;transform:none}
.footer-v4_totop:active{color:var(--g300)}
.footer-v4_totop:focus-visible{color:#fff}
@media(min-width:480px)and (max-width:991px){.footer-v4_col{border-top:1px solid var(--ft-line)}.footer-v4_col:nth-child(-n+4){border-top:0}.footer-v4_col:nth-child(3n+2) .footer-v4_col-body{padding-left:0}}
@media(min-width:480px)and (max-width:767px){.footer-v4_col{border-top:1px solid var(--ft-line)}.footer-v4_col:nth-child(-n+3){border-top:0}.footer-v4_col:nth-child(4){border-top:1px solid var(--ft-line)}.footer-v4_col:nth-child(3n+2) .footer-v4_col-body{padding-left:28px}.footer-v4_col:nth-child(2n) .footer-v4_col-body.footer-v4_col-body{padding-left:0}.footer-v4_totop{translate:none}}
@media(prefers-reduced-motion:reduce){.footer-v4_totop{opacity:1;transform:none}}
.footer-v4_logo.w-inline-block,.footer-v4_social-link.w-inline-block,.footer-v4_totop.w-inline-block,.nav-v4_dd-item.w-inline-block,.nav-v4_link.w-inline-block,.nav-v4_logo.w-inline-block{max-width:none}
.footer-v4_col-title.is-blank:before{content:"\a0"}

/* Part 2 */
.footer-v4_component{font-size:16px;line-height:1.5}
.footer-v4_component .text-size-regular{font-size:16px}
.footer-v4_component .text-size-small{font-size:14px}
.footer-v4_bar,.footer-v4_link.is-sm{letter-spacing:-.28px}

/* Part 3: inner pages. The closing CTA blocks (home_section-cta, home_section-cta-white, banner-cta-product-v2) overlap 120px
   down into the footer (margin-bottom:-120px, made for the old light footer, which had 188px of top padding). After them the
   footer keeps that 120px plus a gap (the margins collapse to the gap), so the card ends on the page above the dark footer. */
:is(.home_section-cta,.home_section-cta-white,.banner-cta-product-v2)~.footer-v4_component{margin-top:calc(120px + clamp(48px,6vw,80px))}
/* Same when the block right before the footer ENDS with one of those CTAs (e.g. /blog: page-wrapper > main-wrapper > CTA, the
   footer after page-wrapper): the CTA's negative margin collapses through the wrappers, so the footer needs the same margin. */
:has(> :is(.home_section-cta,.home_section-cta-white,.banner-cta-product-v2):last-child)+.footer-v4_component,
:has(> :last-child > :is(.home_section-cta,.home_section-cta-white,.banner-cta-product-v2):last-child)+.footer-v4_component{margin-top:calc(120px + clamp(48px,6vw,80px))}
