/* Titles and subtitles on SEO and tools pages match VidAU AI Image / AI Video.
   Those two pages keep their own styles. */

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .seo-modals-hero:not(.seo-modals-hero--ai-image)
  .seo-modals-hero-inner
  h1 {
  margin-bottom: 10px;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-size: clamp(28px, 4.2vw, 48px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.96px;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .seo-modals-hero:not(.seo-modals-hero--ai-image)
  .seo-modals-hero-title-line:not(.seo-modals-hero-title-line--gradient) {
  background: none;
  background-image: none;
  color: #fff;
  -webkit-text-fill-color: #fff;
}

/* Blue fills and blue control marks on SEO and tools pages use the signup purple. */
.seo-tools-type :is([class*="bg-blue-solid-600"], [class*="bg-blue-600"]) {
  background-color: #5f34ff !important;
}

/* Blue borders on SEO and tools pages are purple. Hover and focus borders
   change only in that state, so a gray resting border stays gray. */
.seo-tools-type :is(
  [class^="border-brand"],
  [class*=" border-brand"],
  [class*="sm:border-brand"],
  [class*="md:border-brand"],
  [class*="lg:border-brand"],
  [class*="xl:border-brand"],
  [class*="2xl:border-brand"],
  [class^="border-bdr-brand"],
  [class*=" border-bdr-brand"],
  [class*="sm:border-bdr-brand"],
  [class*="md:border-bdr-brand"],
  [class*="lg:border-bdr-brand"],
  [class^="border-blue-"],
  [class*=" border-blue-"],
  [class*="sm:border-blue-"],
  [class*="md:border-blue-"],
  [class*="lg:border-blue-"],
  [class*="border-[var(--brand-primary)]"],
  [class*="border-[#3459ff]"],
  [class*="border-[#425dff]"],
  [class*="border-[#153ef0]"],
  [class*="border-[#1570ef]"],
  [class*="border-[#2563"],
  [class*="border-[#3b82"]
) {
  border-color: #8b6cff !important;
}

.seo-tools-type :is(
  [class*="hover:border-brand"],
  [class*="hover:border-bdr-brand"],
  [class*="hover:border-blue"]
):hover,
.seo-tools-type :is(
  [class*="focus:border-brand"],
  [class*="focus:border-bdr-brand"],
  [class*="focus:border-blue"]
):focus,
.seo-tools-type :is(
  [class*="focus-visible:border-brand"],
  [class*="focus-visible:border-blue"]
):focus-visible {
  border-color: #8b6cff !important;
}

/* Checked checkbox fills on SEO and tools pages are purple. */
.seo-tools-type input[type="checkbox"] {
  accent-color: #5f34ff;
}

.seo-tools-type :is(
  input[type="checkbox"]:checked,
  [role="checkbox"][aria-checked="true"],
  [role="checkbox"][data-state="checked"],
  [role="checkbox"][class*="bg-blue"],
  [role="checkbox"][class*="bg-brand"],
  [role="checkbox"][class*="bg-[#3459"],
  [role="checkbox"][class*="bg-[#153e"],
  [role="checkbox"][class*="bg-[#425d"]
) {
  background-color: #5f34ff !important;
  border-color: #8b6cff !important;
}

.seo-tools-type svg :is(path, circle, rect):is(
  [fill="#153EF0"],
  [fill="#153ef0"],
  [fill="#3459ff"],
  [fill="#3459FF"],
  [fill="#425dff"],
  [fill="#425DFF"],
  [fill*="blue-solid"],
  [fill*="brand-500"],
  [fill*="brand-primary"]
) {
  fill: #5f34ff !important;
}

.seo-tools-type .ai-avatar-handled-assign i.is-on,
.seo-tools-type .ai-image-switch.is-on {
  background: #5f34ff !important;
  border-color: #8b6cff !important;
}

/* Blue text on SEO, tools, and feature pages is purple. AI Image and AI Video keep their type styles. */
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(
    [class*="text-blue-solid-600"],
    [class*="text-txt-main-blue"],
    [class*="text-blue-600"],
    [class*="text-brand-500"]
  ),
.seo-feature-type
  :is(
    [class*="text-blue-solid-600"],
    [class*="text-txt-main-blue"],
    [class*="text-blue-600"],
    [class*="text-brand-500"]
  ) {
  color: #8b6cff !important;
}

/* Last hero line keeps the purple gradient the type rules had flattened. */
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .seo-modals-hero:not(.seo-modals-hero--ai-image):not(.seo-modals-hero--ttv):not(
    .seo-modals-hero--photo-editor
  ):not(.seo-modals-hero--art-gen)
  .seo-modals-hero-title-line--gradient {
  background-image: linear-gradient(90deg, #8b6cff, #a66cff, #e984da);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .seo-modals-hero:not(.seo-modals-hero--ai-image):not(.seo-modals-hero--rtv)
  .seo-modals-hero-inner
  > .seo-modals-sub {
  color: #fff;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .seo-modals-hero--rtv
  .seo-modals-hero-inner
  > .seo-modals-sub {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) h1 {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-size: clamp(28px, 4.2vw, 48px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.96px;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) :is(h2, h3) {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-weight: 500;
  letter-spacing: -0.96px;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) h1 + div.font-normal,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) h1 + p {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) h2 + div.font-normal,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) h2 + p {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.seo-tools-type .ai-video-editor-hero h1 {
  font-size: 32px;
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -0.03em;
}

@media (min-width: 640px) {
  .seo-tools-type .ai-video-editor-hero h1 {
    font-size: 48px;
    line-height: 1.1;
  }
}

.seo-tools-type .ai-video-editor-hero h1,
.seo-tools-type .ai-video-editor-hero h1 + p {
  width: 100%;
  max-width: 820px;
}

.seo-tools-type .ai-video-editor-hero h1 + p {
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
}

.ai-video-editor-page .iu-home-end .hv3-t-heading,
.ai-video-editor-page .iu-home-end .hv3-faq h2,
.ai-video-editor-page .iu-home-end .hv3-cta-panel h2,
.ai-video-editor-page .iu-home-end .hv3-cta-panel p,
.ai-video-editor-page .iu-home-end .hv3-testimonials .sub {
  width: 100%;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* Even line lengths on the video editor page, without stretching word spacing. */
.ai-video-editor-page {
  text-wrap: balance;
}

/* Same even wrapping and 820px title/subtitle measure on the other SEO and tools pages.
   AI Image and AI Video keep their own layout. Headings that already set a tighter
   max-width keep it. Centered sections keep center alignment inside the 820px box. */
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(h1, h2):not([class*="max-w-"]):not([class*="keep-all"]):not([class*="whitespace-nowrap"]) {
  max-width: 820px;
  text-wrap: balance;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(.text-center, .items-center)
  > :is(h1, h2):not([class*="keep-all"]):not([class*="whitespace-nowrap"]),
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(h1, h2)[class*="text-center"]:not([class*="keep-all"]):not([class*="whitespace-nowrap"]) {
  width: 100%;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  text-wrap: balance;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(h1, h2)
  + :is(p, div.font-normal) {
  width: 100%;
  max-width: 820px;
  white-space: normal !important;
  text-wrap: balance;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(.text-center, .items-center)
  > :is(h1, h2)
  + :is(p, div.font-normal) {
  width: 100%;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  white-space: normal !important;
  text-wrap: balance;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  :is(.text-center, .items-center)
  > h2
  + p.listicle-howto-oneline {
  white-space: nowrap !important;
  text-wrap: nowrap !important;
}

/* Section copy with saved line breaks reflows to the real width on every screen. */
.seo-tools-type
  :is(p, div.font-normal)[class*="whitespace-pre-line"]:not(
    .seo-modals-hero *,
    .ai-video-editor-hero *,
    [class*="uppercase"]
  ) {
  max-width: min(820px, 100%);
  white-space: normal !important;
  text-wrap: balance;
}

.seo-tools-type .ai-video-editor-hero h1 + p,
.seo-tools-type .seo-modals-hero-inner > :is(.seo-modals-sub, .seo-modals-hero-kicker) {
  white-space: pre-line !important;
}

/* Section subtitle stays at most 20px under its title. */
.seo-tools-type
  :is(
    .gap-6,
    .gap-8,
    .gap-10,
    .gap-12,
    .gap-14,
    .gap-16,
    .gap-20,
    .gap-24,
    .gap-\[24px\],
    .gap-\[28px\],
    .gap-\[30px\],
    .gap-\[32px\],
    .gap-\[40px\],
    .gap-\[48px\],
    .gap-\[50px\]
  ):not(.seo-modals-hero, .seo-modals-hero *, .ai-video-editor-hero, .ai-video-editor-hero *):has(
    > :is(h1, h2) + :is(p, div.font-normal)
  ) {
  row-gap: 20px !important;
}

@media (min-width: 640px) {
  .seo-tools-type
    :is(
      .sm\:gap-6,
      .sm\:gap-8,
      .sm\:gap-10,
      .sm\:gap-12,
      .sm\:gap-14,
      .sm\:gap-16,
      .sm\:gap-\[24px\],
      .sm\:gap-\[30px\],
      .sm\:gap-\[32px\],
      .sm\:gap-\[40px\],
      .sm\:gap-\[48px\],
      .sm\:gap-\[50px\]
    ):not(.seo-modals-hero, .seo-modals-hero *, .ai-video-editor-hero, .ai-video-editor-hero *):has(
      > :is(h1, h2) + :is(p, div.font-normal)
    ) {
    row-gap: 20px !important;
  }
}

@media (min-width: 1024px) {
  .seo-tools-type
    :is(
      .lg\:gap-6,
      .lg\:gap-8,
      .lg\:gap-10,
      .lg\:gap-12,
      .lg\:gap-16,
      .lg\:gap-\[24px\],
      .lg\:gap-\[30px\],
      .lg\:gap-\[32px\],
      .lg\:gap-\[40px\],
      .lg\:gap-\[50px\]
    ):not(.seo-modals-hero, .seo-modals-hero *, .ai-video-editor-hero, .ai-video-editor-hero *):has(
      > :is(h1, h2) + :is(p, div.font-normal)
    ) {
    row-gap: 20px !important;
  }
}

.seo-tools-type
  :is([class*="gap-"], [class*="gap-["]):not(
    .seo-modals-hero,
    .seo-modals-hero *,
    .ai-video-editor-hero,
    .ai-video-editor-hero *
  )
  > :is(h1, h2)
  + :is(p, div.font-normal) {
  margin-top: 0 !important;
}

.seo-tools-type
  :not([class*="gap-"]):not([class*="gap-["]):not(.seo-modals-hero):not(.seo-modals-hero *)
  > :is(h1, h2)
  + :is(p, div.font-normal):is(
    [class*="mt-6"],
    [class*="mt-8"],
    [class*="mt-10"],
    [class*="mt-12"],
    [class*="mt-14"],
    [class*="mt-16"],
    [class*="mt-20"],
    [class*="mt-24"]
  ) {
  margin-top: 20px !important;
}

.seo-tools-type
  :is(.space-y-6, .space-y-8, .space-y-10, .space-y-12, .space-y-16):not(
    .seo-modals-hero,
    .seo-modals-hero *
  )
  > :is(h1, h2)
  + :is(p, div.font-normal) {
  margin-top: 20px !important;
}

@media (min-width: 640px) {
  .seo-tools-type
    :is(.sm\:space-y-6, .sm\:space-y-8, .sm\:space-y-10, .sm\:space-y-12):not(
      .seo-modals-hero,
      .seo-modals-hero *
    )
    > :is(h1, h2)
    + :is(p, div.font-normal) {
    margin-top: 20px !important;
  }
}

@media (min-width: 1024px) {
  .seo-tools-type
    :is(.lg\:space-y-6, .lg\:space-y-8, .lg\:space-y-10, .lg\:space-y-12):not(
      .seo-modals-hero,
      .seo-modals-hero *
    )
    > :is(h1, h2)
    + :is(p, div.font-normal) {
    margin-top: 20px !important;
  }
}

/* Instagram discover subtitle: keep the authored 3 lines from reflowing. */
.seo-tools-type .ig-discover-sub {
  text-wrap: wrap !important;
}

.seo-tools-type .ig-discover-sub > span {
  display: block;
}

@media (min-width: 768px) {
  .seo-tools-type .ig-discover-sub > span {
    white-space: nowrap;
  }
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .seo-modals-hero:not(.seo-modals-hero--ai-image)
  .seo-modals-hero-inner
  > :is(h1, .seo-modals-hero-kicker, .seo-modals-sub) {
  width: 100%;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  text-wrap: balance;
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) :is(
  p.max-w-\[1280px\],
  .max-w-\[1100px\].text-center:not([class*="max-w-none"]),
  .max-w-\[1100px\].items-center:not([class*="max-w-none"]),
  .max-w-\[980px\].text-center,
  .max-w-\[980px\].items-center,
  .max-w-\[960px\].text-center,
  .max-w-\[960px\].items-center,
  .max-w-\[920px\].text-center,
  .max-w-\[920px\].items-center,
  .max-w-\[900px\].text-center,
  .max-w-\[900px\].items-center,
  .max-w-\[860px\]
) {
  max-width: 820px;
}

/* Section headings that are exactly 48px become 36px. Hero titles and any
   heading larger or smaller than 48px stay as they are. */
@media (min-width: 640px) {
  .seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
    :is(h1, h2, h3, h4, h5, h6).sm\:text-\[48px\]:not(
      [class*="lg:text-"],
      [class*="xl:text-"],
      [class*="2xl:text-"],
      .seo-modals-hero *,
      .ai-video-editor-hero *
    ) {
    font-size: 36px;
    line-height: 44px;
  }
}

@media (min-width: 901px) {
  .seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
    .iu-home-end
    :is(.hv3-faq h2, .hv3-cta-panel h2, .hv3-testimonials h2) {
    font-size: 36px;
    line-height: 44px;
  }
}

/* Image to video hero: keep "Video" on the first line and pull the two lines closer. */
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
  .image-to-video-page
  .seo-modals-hero
  .seo-modals-hero-inner
  h1 {
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.seo-tools-type .image-to-video-page .seo-modals-hero-title-line {
  letter-spacing: -0.045em;
  white-space: nowrap;
  text-wrap: nowrap;
}

@media (max-width: 400px) {
  .seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
    .image-to-video-page
    .seo-modals-hero
    .seo-modals-hero-inner
    h1 {
    font-size: 24px;
  }
}

.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-t-heading,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-testimonials h2,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-faq h2,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-cta-panel,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-cta-panel h2,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-cta-panel p,
.seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page)) .iu-home-end .hv3-testimonials .sub {
  width: 100%;
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-wrap: balance;
}

/* Every SEO and tools page stays inside the viewport, including fans and
   full-bleed galleries that are wider than the screen. */
.seo-tools-type > * {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

.seo-tools-type :is(p, li, h1, h2, h3) {
  overflow-wrap: break-word;
}

/* Below the xl rail, authored one-line breaks wrap. From 1280px, including 2xl,
   those lines stay as written. Image-to-video hero lines stay one line. */
@media (max-width: 1279px) {
  .seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
    :is(h1, h2, h3, p)[class*="whitespace-nowrap"]:not(.seo-modals-hero-title-line),
  .seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
    :is(h1, h2, h3, p)
    [class*="whitespace-nowrap"]:not(.seo-modals-hero-title-line) {
    white-space: normal !important;
  }
}

@media (max-width: 767px) {
  .seo-tools-type:not(:has(.vidau-ai-image-page, .vidau-ai-video-page))
    h1:not(.image-to-video-page *) {
    font-size: clamp(28px, 8.2vw, 40px) !important;
    line-height: 1.15 !important;
    max-width: 100%;
  }

  .seo-tools-type .ai-video-editor-page .ai-video-editor-hero h1 {
    font-size: 32px !important;
    line-height: 1.12 !important;
  }

  .seo-tools-type
    .seo-modals-hero:not(.seo-modals-hero--ai-image):not(.seo-modals-hero--ai-video) {
    height: auto;
    min-height: 100dvh;
    overflow-x: clip;
  }

  .seo-tools-type .iu-home-end .hv3-cta-btn {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
  }

  .seo-tools-type .iu-home-end .hv3-faq,
  .seo-tools-type .iu-home-end .hv3-testimonials {
    padding-left: 16px;
    padding-right: 16px;
  }

  .seo-tools-type section :is(h1, h2, h3):not(.seo-modals-prompt *, .iu-hero-title, .vu-hero-title, .bg-remover-hero-title),
  .seo-feature-type section :is(h1, h2, h3):not(.seo-modals-prompt *, .iu-hero-title, .vu-hero-title, .bg-remover-hero-title) {
    text-align: center !important;
  }

  .seo-tools-type section h1.iu-hero-title,
  .seo-tools-type section h1.vu-hero-title {
    align-self: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
  }

  .seo-feature-type section h1.bg-remover-hero-title {
    margin-top: 20px !important;
  }

  .seo-tools-type section :is(h1, h2, h3) + :is(p, div.font-normal),
  .seo-feature-type section :is(h1, h2, h3) + :is(p, div.font-normal) {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .seo-tools-type section .grid > :is(article, li, a, div):not(.seo-modals-prompt *),
  .seo-feature-type section .grid > :is(article, li, a, div):not(.seo-modals-prompt *) {
    text-align: center;
  }

  .seo-tools-type section .flex.items-start:not(.seo-modals-prompt, .seo-modals-prompt *),
  .seo-feature-type section .flex.items-start:not(.seo-modals-prompt, .seo-modals-prompt *) {
    align-items: center;
  }
}

/* 2xl (1536px): clip the hero fan to the viewport, and on short 2xl screens
   let the hero grow so the prompt is not trapped in 100dvh. */
@media (min-width: 1536px) {
  .seo-tools-type .seo-modals-hero {
    overflow-x: clip;
  }
}

@media (min-width: 1536px) and (max-height: 960px) {
  .seo-tools-type
    .seo-modals-hero:not(.seo-modals-hero--ai-image):not(.seo-modals-hero--ai-video) {
    height: auto;
    min-height: 100dvh;
  }
}

/* Beats the purple text remap on bordered labels above a title. */
.seo-tools-type
  :is(
    [class*='rounded-[4.8px]'][class*='border'],
    [class*='rounded-md'][class*='border-brand'][class*='px-'],
    [class*='rounded-md'][class*='border-bdr-brand'][class*='px-'],
    [class*='rounded-sm'][class*='border-brand'][class*='px-'],
    [class*='rounded-[4px]'][class*='border-brand'],
    [class*='rounded-[5px]'][class*='border']
  ),
.seo-feature-type
  :is(
    [class*='rounded-[4.8px]'][class*='border'],
    [class*='rounded-md'][class*='border-brand'][class*='px-'],
    [class*='rounded-md'][class*='border-bdr-brand'][class*='px-'],
    [class*='rounded-sm'][class*='border-brand'][class*='px-'],
    [class*='rounded-[4px]'][class*='border-brand'],
    [class*='rounded-[5px]'][class*='border']
  ),
.seo-tools-type
  :is(
    [class*='rounded-[4.8px]'][class*='border'],
    [class*='rounded-md'][class*='border-brand'][class*='px-'],
    [class*='rounded-md'][class*='border-bdr-brand'][class*='px-'],
    [class*='rounded-sm'][class*='border-brand'][class*='px-'],
    [class*='rounded-[4px]'][class*='border-brand'],
    [class*='rounded-[5px]'][class*='border']
  )
  :is(span, p, div, h4),
.seo-feature-type
  :is(
    [class*='rounded-[4.8px]'][class*='border'],
    [class*='rounded-md'][class*='border-brand'][class*='px-'],
    [class*='rounded-md'][class*='border-bdr-brand'][class*='px-'],
    [class*='rounded-sm'][class*='border-brand'][class*='px-'],
    [class*='rounded-[4px]'][class*='border-brand'],
    [class*='rounded-[5px]'][class*='border']
  )
  :is(span, p, div, h4) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background-image: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
}