:root {
  --color-link: #8fa6d0;
  --color-link-grey: #a7a9b8;
  --color-link-hover: #6da1ff;
  --blue: #377dff;
  --indigo: #2d1582;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #ed4c78;
  --orange: #fd7e14;
  --yellow: #f5ca99;
  --green: #28a745;
  --teal: #00c9a7;
  --cyan: #09a5be;
  --white: #fff;
  --gray: #8F95A0;
  --gray-dark: #737373;
  --primary: #84B761;
  --secondary: #577CC0;
  --success: #28a745;
  --info: #007bff;
  --warning: #ffc107;
  --danger: #dc3545;
  --light: #F5F7FA;
  --dark: #1D1D1D;
  --light-2: #FBFBFB;
  --tertiary: #3E7FEA;
  --primary-master: #D0021B;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --breakpoint-xxl: 1600px;
  --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* Radius scale (web-design-skill / tokens.css) */
  --radius-sm: 0.25rem;   /*  4px — favicons, tiny badges */
  --radius-md: 0.375rem;  /*  6px — tags, compact controls */
  --radius-lg: 0.5rem;    /*  8px — buttons, inputs, nested media */
  --radius-xl: 0.75rem;   /* 12px — compact cards, tables */
  --radius-2xl: 1rem;     /* 16px — cards, panels, hero media */
  --radius-3xl: 1.5rem;   /* 24px — reserved; prefer 2xl for uniformity */
  --radius-full: 9999px;  /* pills, chips, eyebrows */
  /* Semantic aliases (layouts.md / components.md) */
  --radius-surface: var(--radius-2xl);  /* cards, images, panels */
  --radius-control: var(--radius-lg);   /* buttons, inputs, nested thumbs */
  --radius-pill: var(--radius-full);    /* chips, eyebrows, circle CTAs */

  /* Section rhythm (layouts.md) */
  --space-1: 0.25rem;   /*  4px */
  --space-2: 0.5rem;    /*  8px */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --section-py: clamp(2.5rem, 6vw, 5rem);       /* ~40–80px between bands */
  --section-py-tight: clamp(2rem, 4vw, 3rem);   /* logo strips */
  --section-divider-height: 150px;
  --section-divider-crest: 8.5rem; /* wave crest sits ~88% up the 150px SVG */
  --section-shadow-bleed: 2.5rem;  /* room for card / image drop shadows */
  --section-divider-inset: calc(var(--section-divider-crest) + var(--section-shadow-bleed));
  --block-gap: clamp(1.5rem, 3vw, 2rem);        /* rows inside a section */
  --stack-gap: var(--space-4);                  /* related items in a stack */
  --header-gap: var(--space-6);                 /* section header → content */
  --card-gap: var(--space-6);                   /* between cards in a grid */

  /* Motion (press / hover feedback) */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --dur-press: 140ms;
  --dur-fast: 160ms;
  --dur-base: 200ms;

  /* Typography tokens (web-design-skill / typography.md) */
  --font-sans: poppins, var(--font-family-sans-serif);
  --text-xs: 0.75rem;      /* 12px — eyebrows, CTA subtext, micro labels */
  --text-sm: 0.875rem;     /* 14px — secondary copy, disclaimers */
  --text-base: 1rem;       /* 16px — UI minimum */
  --text-md: 1.0625rem;    /* 17px — homepage body default */
  --text-lg: 1.125rem;     /* 18px — button labels */
  --text-xl: 1.25rem;      /* 20px — intro / lead paragraphs */
  --text-2xl: 1.5rem;      /* 24px — subheads */
  --text-3xl: 1.875rem;    /* 30px — mobile display floor */
  --text-display: clamp(1.875rem, 3.5vw, 2.8125rem);  /* hero headline */
  --text-section: clamp(1.875rem, 2.8vw, 3.125rem);    /* section h2 */
  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --tracking-tight: -0.02em;
  --tracking-caps: 0.06em;
  --color-text: #1d1d1d;
  --color-text-body: #737373;
  --color-text-muted: #9ca3af;
  --color-text-secondary: #6b7280;
}

::selection {
  color: #fff;
  background-color: #fc692d;
}

*.unselectable {
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;

  /*
     Introduced in IE 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
  -ms-user-select: none;
  user-select: none;
}

#hero-section a:not(.btn) {
  color: var(--color-link-grey);
}

#hero-section a:not(.btn):hover {
  color: var(--color-link-hover);
}

#hero-section .hero-cta-subtext {
  margin-top: 0.25rem;
  margin-bottom: 1rem;
  padding-bottom: 0;
  line-height: 1.35;
}

#hero-section .hero-cta-group .btn,
#hero-section .lqd-column.col-lg-7 > a.btn.btn-solid {
  min-height: 3rem;
  height: 3rem;
  max-height: 3.125rem;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-caps);
  line-height: 1.2;
  text-transform: uppercase;
}

#hero-section .hero-cta-group .btn > span {
  display: inline-flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 100%;
  height: 100%;
  padding: 2rem;
}

#hero-section .lqd-column.col-lg-7 > a.btn.btn-solid > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 100%;
  height: 100%;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

#hero-section .hero-cta-group .btn .btn-txt,
#hero-section .lqd-column.col-lg-7 > a.btn.btn-solid .btn-txt {
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}

#hero-section .hero-cta-group .btn-video-explainer .fa-play {
  font-size: 0.625rem;
  margin-right: 0 !important;
}

#hero-section .hero-cta-group .btn.bg-white .btn-txt,
#hero-section .hero-cta-group .btn.btn-white .btn-txt {
  color: var(--color-text);
}

@media (min-width: 768px) {
  #hero-section .hero-cta-group .btn.btn-white,
  #hero-section .hero-cta-group .btn.bg-white:not(.btn-gradient) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }

  #hero-section .hero-cta-group .btn.btn-white > span,
  #hero-section .hero-cta-group .btn.bg-white:not(.btn-gradient) > span {
    display: inline-flex !important;
    align-items: center !important;
    align-content: center !important;
    justify-content: center !important;
    width: 100%;
    height: 100%;
    min-height: 100%;
    padding: 0 2rem !important;
    box-sizing: border-box;
  }
}

#hero-section .hero-cta-group .btn.btn-white .btn-txt {
  display: block;
  width: 100%;
  text-align: center;
  line-height: 1.2;
  margin: 0;
}

#hero-section .hero-cta-group .btn-solid.btn-gradient > span {
  width: 100%;
}

#hero-section .hero-cta-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

#hero-section .hero-cta-group .btn {
  margin: 0 !important;
}

@media (min-width: 768px) {
  #hero-section .hero-cta-subtext {
    margin-top: 0.375rem;
  }
}

#hero-section .hero-trust-block {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#hero-section .hero-review-row {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
}

#hero-section .hero-review-avatar {
  display: block;
  flex: 0 0 auto;
  width: calc(3 * 1.45em);
  height: calc(3 * 1.45em);
  font-size: var(--text-sm);
  border-radius: 50%;
  object-fit: cover;
}

#hero-section .hero-review-copy {
  flex: 1;
  min-width: 0;
  margin-bottom: 0;
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
}

#hero-section .hero-review-attribution {
  margin-top: 0.15rem;
  white-space: nowrap;
}

#hero-section .hero-review-attribution-inner {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

#hero-section .hero-review-company-logo {
  display: block;
  height: 1.2em;
  width: auto;
  flex: 0 0 auto;
  margin-right: -2px;
}

#hero-section .hero-eyebrow-wrap {
  margin-bottom: calc(var(--space-6) + 0.125rem);
}

#hero-section .hero-eyebrow-trustpilot {
  display: inline-flex;
  align-items: center;
  line-height: 1;
  margin-bottom: 0;
  padding: 0.65rem;
  max-width: 100%;
}

/* Clip pill sides: iframe stays 420px; viewport crops internal Trustpilot whitespace */
#hero-section .hero-eyebrow-trustpilot-clip {
  display: block;
  position: relative;
  width: 378px;
  max-width: calc(100vw - 3rem);
  min-height: 20px;
  overflow: hidden;
  line-height: 0;
}

#hero-section .hero-eyebrow-trustpilot-skeleton {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0 0.15rem;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

#hero-section .hero-eyebrow-trustpilot-skeleton-stars {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  flex: 0 0 auto;
}

#hero-section .hero-eyebrow-trustpilot-skeleton-bar {
  position: relative;
  overflow: hidden;
  flex: 0 0 auto;
  background: #eceff3;
  border-radius: 3px;
}

#hero-section .hero-eyebrow-trustpilot-skeleton-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
  animation: hero-trustpilot-skel-shimmer 1.3s ease-in-out infinite;
}

#hero-section .hero-eyebrow-trustpilot-skeleton-star {
  width: 14px;
  height: 14px;
  border-radius: 2px;
}

#hero-section .hero-eyebrow-trustpilot-skeleton-text {
  width: 72px;
  height: 12px;
}

#hero-section .hero-eyebrow-trustpilot-skeleton-meta {
  width: 118px;
  height: 12px;
  margin-left: auto;
}

@keyframes hero-trustpilot-skel-shimmer {
  100% {
    transform: translateX(100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  #hero-section .hero-eyebrow-trustpilot-skeleton-bar::after {
    animation: none;
  }
}

#hero-section .hero-eyebrow-trustpilot-clip.is-loaded .hero-eyebrow-trustpilot-skeleton {
  opacity: 0;
}

#hero-section .hero-eyebrow-trustpilot-widget {
  width: 420px !important;
  max-width: none !important;
  line-height: 1;
  margin-left: -20px;
  opacity: 0;
  transition: opacity 0.2s ease;
}

#hero-section .hero-eyebrow-trustpilot-clip.is-loaded .hero-eyebrow-trustpilot-widget {
  opacity: 1;
}

#hero-section .hero-eyebrow-trustpilot-widget iframe {
  display: block !important;
  width: 420px !important;
  max-width: none !important;
}

#hero-section .hero-trustpilot-widget {
  display: block;
  position: relative;
  left: -23px;
  width: 420px !important;
  max-width: 100%;
  margin-top: var(--space-4);
  margin-left: 0 !important;
  margin-right: auto;
  padding-top: 0;
  text-align: left !important;
  align-self: flex-start;
}

#hero-section .hero-trustpilot-widget iframe {
  display: block !important;
  margin: 0 !important;
}

@media (max-width: 767px) {
  #hero-section .hero-review-attribution {
    white-space: normal;
  }

  #hero-section .hero-cta-group .hidden-xs,
  #hero-section .hero-cta-group .btn.btn-white.hidden-xs,
  #hero-section .hero-cta-group .btn.bg-white.hidden-xs {
    display: none !important;
  }

  /* Both hero-cta-group buttons are hidden-xs, so the group is empty on mobile —
     collapse it so the pricing subtext sits directly under the mobile buttons */
  #hero-section .hero-cta-group {
    display: none !important;
  }

  /* Only show the dynamic delivery date on mobile, not the "Fast Delivery:" label */
  #hero-section .hero-fast-delivery-label {
    display: none;
  }

  #hero-section .hero-trust-block {
    width: 100%;
    align-items: stretch;
    margin-top: var(--space-8);
    padding-left: var(--space-4);
    padding-right: var(--space-4);
    box-sizing: border-box;
  }

  #hero-section .hero-review-row {
    width: 100%;
  }

  #hero-section .hero-review-copy {
    margin-right: 0 !important;
  }

  #hero-section .hero-cta-subtext {
    margin-top: 0 !important;
    margin-left: 0;
    padding-left: var(--space-4);
    padding-right: var(--space-4);
    text-align: center;
  }

  #hero-section .hero-trustpilot-widget.visible-xs {
    margin-top: var(--space-5);
    margin-left: 0;
    left: 0;
  }
}

@media (min-width: 992px) {
  #hero-section .hero-trust-block {
    margin-top: 1.75rem;
  }
}

h2,
.h2 {
  font-size: var(--text-section) !important;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight, -0.02em);
}

h1,
.h1 {
  font-size: var(--text-display) !important;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight, -0.02em);
}

.icon-circle {
  background: #c0daf7;
  color: #87aed3;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  text-align: center;
  line-height: 100px;
  vertical-align: middle;
  padding: 30px;
  position: absolute;
  left: -20px;
  top: -20px;
  font-size: 40px;
  padding: 2px 0 0 2px;
}

.icon-circle i {
  padding: 0;
  margin: 0;
}

.how-it-works-heading-num {
  display: -ms-flexbox;
  display: flex;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #87a2db;
  color: #fff;
  font-size: 18px;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.how-it-works-heading-dots {
  font-size: 38px;
  color: #c4d1ed;
  letter-spacing: -2.69px;
  line-height: .5;
  white-space: nowrap;
}

.how-it-works-heading strong {
  font-size: 24px;
}

.how-it-works-heading {
  position: relative;
  margin-bottom: 39px;
  display: flex;
  overflow: hidden;
}

.text-lh-xxs {
  line-height: 1.;
}

.text-lh-xs {
  line-height: 1.1;
}

.text-lh-xs2 {
  line-height: 1.2;
}

.text-lh-xxs:not(.heading-with-icon),
.text-lh-xs,
.text-lh-xs2 {
  text-wrap: balance !important;
}

.lead {
  font-size: var(--text-xl);
  font-weight: var(--weight-regular);
  line-height: var(--leading-relaxed);
  color: var(--color-text-body);
}

.fw-700 {
  font-weight: var(--weight-bold);
}

.fw-600 {
  font-weight: var(--weight-semibold);
}

.fw-500 {
  font-weight: var(--weight-medium);
}

.fw-400 {
  font-weight: var(--weight-regular);
}

.font-size-1-15 {
  font-size: 1.15rem;
}

#hero-section {
  position: relative;
  background-color: #f5f7fa;
  background-image: url(/assets/img/theme/bg-1.svg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  padding-top: 130px;
  padding-bottom: clamp(2rem, 4vw, 2.5rem) !important;
  margin-bottom: 0;
  overflow: visible;
}

#hero-section .container {
  position: relative;
  z-index: 2;
}

#hero-section .custom-shape-divider-bottom-1621016099 {
  z-index: 1;
  bottom: -1.25rem;
  pointer-events: none;
}

#how-it-works,
#news_sites,
#packages,
#money-back-guarantee,
#benefits,
#case-studies,
#reviews,
#why-brand-push,
#results {
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(245, 247, 250, 1) 80%, rgba(245, 247, 250, 1) 100%);
  position: relative;
}

.main-footer {
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgba(245, 247, 250, 1) 0%, rgba(245, 247, 250, 1) 20%, rgba(255, 255, 255, 1) 100%);
  position: relative;
}

.main-nav .link-txt .txt {
  color: #737373;
}

body,
.lqd-column {
  z-index: 0;
  font-family: poppins, sans-serif;
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.6;
  color: #737373;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  margin-bottom: .5rem;
  font-weight: var(--weight-bold);
  line-height: var(--leading-snug);
  color: var(--color-text);
}

h2 {
  font-weight: var(--weight-bold);
}

.prepend {
  font-size: 30px;
  font-variant: small-caps;
  line-height: 1.5em !important;
  font-weight: 800;
  color: #a5a5a5;
  margin-top: 0;
  margin-bottom: -8px;
}

.main {
  line-height: 0.8em !important;
  font-size: 55px;
  font-weight: 800;
}

.append {
  font-size: 42px !important;
  position: relative;
  top: -10px;
  font-weight: 800;
}

.font-size-25 {
  font-size: 25px !important;
}

.main-nav>li>a {
  color: #a7a9b8;
}

.main-nav>li>a .link-ext {
  background: #ff798e !important;
}

.main-nav>li>a:hover {
  color: #ff798e;
}

.main-nav li a .link-txt .txt {
  font-size: var(--text-base);
  color: var(--color-text-body);
}

.mega-menu-sub-link {
  font-size: var(--text-base);
  /* background: #f5f7fa; */
  padding: 4px 0px;
  border-radius: var(--radius-md);
  margin-bottom: 0px !important;
}

.mega-menu-sub-link::before {
  content: "\f054";
  font-family: "Font Awesome 5 Free";
  margin-right: 8px;
  float: left;
  color: var(--color-link);
  font-weight: var(--weight-bold);
  font-size: var(--text-xs);
  position: relative;
  top: 6px;
}

/* Keep the megamenu sub-links uniform: the one-page localscroll adds .is-active
   to the current-section link, which the theme tints with --color-primary (pink).
   That made e.g. "Verified Reviews" stand out from its siblings — match it to the
   normal --color-link instead. Specificity beats the theme's
   `.lqd-custom-menu li.is-active a` without needing !important. */
.lqd-custom-menu li.mega-menu-sub-link.is-active a {
  color: var(--color-link);
}

.navbar-network-icon {
  max-height: 34px;
}

.nowrap {
  white-space: nowrap;
}

.light-grey-border {
  border: 1px solid #ededed !important;
}


ul.main-nav li:hover .txt {
  color: #1d1d1d;
}

#hero-blob {
  position: absolute;
  width: 750px;
  left: -145px;
  top: -50px;
}

#hero-blob2 {
  position: absolute;
  left: -143px;
  top: -93px;
  width: 600px;
}

.news-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.news-grid .contents {
  width: 100%;
}

.news-grid .contents a {
  text-align: center;
}

.news-grid .contents a img {
  height: 35px;
  max-width: 150px;
}



.bg-yellow-light {
  background: #f9fdf9;
}

.star-rating {
  color: #e2e242;
}

.blob3 {
  position: absolute;
  width: 500px;
  height: 500px;
  left: -50px;
  top: -37px;
  z-index: -1;
}

.underline-highlight {
  display: inline-block;
  line-height: 0em;
  padding-bottom: .8em;
  padding-top: 0em;
  color: inherit;
}

.bg-zircon-light {
  background: #fafbff;
}

.bg-header-blue {
  background-color: #231b66;
  background-image: url(/theme/ave/assets/demo/bg/bg-14.jpg);
}

.bg-gradient-dark-br {
  background: -webkit-gradient(linear, left top, right bottom, from(#000000), to(#00c6ff)) !important;
  background: linear-gradient(to bottom right, #000000 0, #00c6ff 100%) !important;
}

.inline-review-top-center {
  margin-top: -14px;
  width: 100%;
  max-width: 778px;
  text-align: center;
}

.inline-reviews a:last-child {
  margin-right: 15px;
}

.cta-buttons {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.custom-shape-divider-bottom-1621016099 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}

.custom-shape-divider-bottom-1621016099 svg {
  position: relative;
  display: block;
  width: calc(150% + 1.3px);
  height: 150px;
}

.custom-shape-divider-bottom-1621016099 .shape-fill {
  fill: #FFFFFF;
}


.custom-shape-divider-top-1621081063 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  transform: rotate(180deg);
}

.custom-shape-divider-top-1621081063 svg {
  position: relative;
  display: block;
  width: calc(150% + 1.3px);
  height: 65px;
}

.custom-shape-divider-top-1621081063 .shape-fill {
  fill: #FFFFFF;
}

.pricing-table-colorful .pricing-table-header,
.bg-red {
  background-color: #fae2cc;
  opacity: 1;
}

.pricing-table-colorful.color-blue .pricing-table-header,
.bg-blue {
  background-color: #c0daf7;
}

.pricing-table-colorful.color-green .pricing-table-header,
.bg-green {
  background-color: #b3e2c5;
}

.pro-pricing-option::before {
  content: "";
  position: absolute;
  top: -49px;
  right: 7rem;
  width: 94px;
  height: 71px;
  background-image: url(/assets/img/most-popular-brandpush-press-release.png);
  z-index: 10;
}

.bg-pink {
  background-color: #f6ccdf;
}

.pricing-table-header small {
  font-weight: 600;
}

.pricing-table-colorful h5 small {
  font-size: 1.1em;
}

.pricing-table {
  border-radius: var(--radius-surface);
  overflow: hidden;
}

.pricing-emoji {
  width: 42px;
  margin-right: 8px;
  margin-top: -6px;
}

.pricing-table-colorful.color-blue .featured-tag,
.pricing-table-colorful.color-green h5 small {
  color: #194929;
}

.pricing-table-colorful.color-blue .featured-tag,
.pricing-table-colorful.color-blue h5 small {
  color: #1B4367;
}

.pricing-table-colorful h5 small {
  color: #6F3C22;
}

.append2 {
  margin-top: 0;
  margin-bottom: var(--stack-gap);
  color: var(--color-text-body);
}

.icon-blue {
  background-color: #c0daf7;
  color: #87aed3;
}

.icon-red {
  background-color: #fae2cc;
  color: #d29b6e;
}

.icon-green {
  background-color: #b3e2c5;
  color: #70a986;
}

.icon-pink {
  background-color: #f6ccdf;
  color: #d482a7;
}

.mobile-news-logo {
  border: 1px solid #ededed;
  background: #fff;
  box-shadow: 0 25px 30px rgba(0, 0, 0, .04);
  border-radius: var(--radius-xl);
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em;
}

.mobile-news-logo img {
  padding: 5px 0;
  max-height: 50px;
}

.mobile-news-logo-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Mobile news-outlet grid: cards fade in one at a time, in reading order
   (row 1 left-to-right, then row 2, etc.) when the grid scrolls into view. */
@keyframes mobileNewsCardReveal {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 767px) {
  #how-it-works .mobile-news-grid.mobile-news-grid-anim .col-xs-4 {
    opacity: 0;
    transform: translateY(12px);
  }

  #how-it-works .mobile-news-grid.mobile-news-grid-anim.is-revealed .col-xs-4 {
    opacity: 1;
    transform: translateY(0);
    animation: mobileNewsCardReveal 0.32s cubic-bezier(0.23, 1, 0.32, 1) backwards;
  }

  /* Parent row custom-animation must not pre-show the cards. */
  #how-it-works .how-it-works-layout > .how-it-works-content-col,
  #how-it-works .how-it-works-layout > .how-it-works-content-col > .mobile-news-grid {
    opacity: 1 !important;
    transform: none !important;
  }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  #how-it-works .mobile-news-grid.mobile-news-grid-anim .col-xs-4,
  #how-it-works .mobile-news-grid.mobile-news-grid-anim.is-revealed .col-xs-4 {
    opacity: 1;
    animation: none;
  }
}

.mobile-news-logo-link .mobile-news-logo {
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.mobile-news-logo-link:active .mobile-news-logo {
  box-shadow: 0 12px 20px rgba(0, 0, 0, 0.08);
  transform: translateY(1px);
}

.review-box {
  border-radius: var(--radius-surface);
  box-shadow: 0 25px 70px rgba(0, 0, 0, .07);
  font-size: var(--text-base);
  padding: 2.5rem 1.5rem 1.5rem 1.5rem;
  color: var(--color-text-body) !important;
  text-decoration: none;
  position: relative;
  border: 1px solid #ededed;
  margin-bottom: var(--card-gap);
  background-color: #fff;
}

.review-box img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  left: 24px;
  bottom: 27px;
}

.review-footer {
  display: flex;
  align-items: center;
  gap: 10px;
}

.review-footer-meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.review-footer-name {
  line-height: 1.35;
}

.review-footer-rating {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
  line-height: 1.2;
}

.review-box img.review-favicon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-control);
  object-fit: contain;
  flex-shrink: 0;
  position: static;
  left: auto;
  bottom: auto !important;
  float: none;
  margin: 0;
  padding: 4px;
  box-sizing: border-box;
  background: #f5f7fa;
}

.review-box img.review-favicon.review-favicon--default {
  padding: 7px;
  object-fit: contain;
}

.review-box img.star-rating {
  width: 97px;
  top: 31px;
  right: 25px !important;
  position: absolute;
  border-radius: 0;
  left: auto;
}

.review-box span span {
  margin: 25px 0 15px 65px;
  display: block;
}

.review-box:before {
  display: block;
  width: 103px;
  height: 40px;
  content: "";
  background: url(/assets/img/TrustPilot-Logo.svg) no-repeat 0 0;
  background-size: 100%;
}

#reviews .carousel-item {
  margin-bottom: 45px;
}

#reviews .reviews-cards-shell {
  width: 100%;
}

#wrap #reviews .reviews-verified-note {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: var(--space-2);
}

#wrap #reviews .reviews-verified-note-icon {
  flex-shrink: 0;
  margin-top: 0.125rem;
  color: var(--color-text-muted);
  font-size: 0.95em;
  line-height: 1;
}

@media (max-width: 767px) {
  #wrap #reviews .reviews-verified-note {
    justify-content: flex-start;
  }
}

#reviews .reviews-carousel-viewport {
  width: 100%;
}

#reviews .reviews-carousel-track {
  column-count: 3;
  column-gap: 1.5rem;
  width: 100%;
}

#reviews .reviews-carousel-track .review-box {
  display: inline-block;
  width: 100%;
  max-width: 100%;
  margin: 0 0 1.5rem !important;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  vertical-align: top;
  height: auto !important;
  min-height: 0 !important;
  align-self: auto !important;
}

#reviews .reviews-carousel-track .review-box .review-text {
  height: auto !important;
  min-height: 0 !important;
  display: block;
}

@media (max-width: 991px) {
  #reviews .reviews-carousel-track {
    column-count: 2;
  }
}

@media (max-width: 767px) {
  #reviews .reviews-carousel-track {
    column-count: unset;
    column-gap: unset;
    display: flex;
    gap: 0;
  }

  #reviews .reviews-carousel-track .review-box {
    display: flex;
    margin: 0 !important;
  }
}

.bp_rating .fa-star {
  font-size: 19px;
  color: #fff;
}

.bp_rating .fa-square {
  color: #00b67a;
}

.bp_rating.fa-stack {
  width: 1.67em;
}

.bp_rating .fa-square.star5 {
  color: #00b67a;
}

.bp_rating .fa-square.star4 {
  color: #72cf10;
}

.bp_rating .fa-square.star3 {
  color: #fece00;
}

.bp_rating .fa-square.star2 {
  color: #ff8621;
}

.bp_rating .fa-square.star1 {
  color: #ff3315;
}

.bp_rating .fa-square.star-null {
  color: #dcdce6;
}


.accordion-expander {
  right: 13px;
}

.accordion-expander .fa-caret-down {
  color: #87a9c8;
}

#faq .accordion-title a {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding-right: 0;
}

#faq .accordion-expander {
  position: static;
  top: auto;
  right: auto;
  left: auto;
  order: -1;
  flex-shrink: 0;
  margin-top: 0.1em;
  font-size: 1em;
  line-height: inherit;
  color: inherit;
  transform: none;
}

#faq .accordion-expander > i {
  color: inherit;
}

.gdpr_checkbox {
  width: 20px;
  height: 20px;
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-right: 10px !important;
  float: left;
}


#news_sites .iconbox {
  min-height: 182px;
}

#money-back-guarantee img {
  max-width: 450px;
}

.news-network-heading-flex {
  display: flex;
  justify-content: space-between;
  align-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

.news-network-pricing-label {
  background: #70a986;
  padding: 5px 12px;
  border-radius: var(--radius-md);
  color: #fff;
  font-size: 15px;
}

.carousel-container {
  overflow: hidden;
}

.carousel-items:not(.flickity-enabled) {
  overflow-x: hidden !important;
}

#news-carousel .carousel-items:not(.flickity-enabled) {
  overflow-x: hidden !important;
}

.logo-default,
.logo-dark,
.logo-sticky,
.mobile-logo-default {
  width: 170px;
}

.heading-news-logo {
  height: 30px;
  margin-right: 0.90em;
  opacity: 0.45;
  /* filter: grayscale(100%);*/
}

.heading-news-logo:hover {
  opacity: 1;
}

.screenshot-arrow {
  position: absolute;
  left: -48px;
  bottom: -52px;
}

.shadowed {
  box-shadow: 0 18px 50px rgb(0 0 0 / 7%);
  -webkit-transition: box-shadow 0.3s;
}

.testimonial-footer-right {
  position: absolute;
  right: 35px;
}

.testimonial-footer-right img {
  height: 20px;
}

.testimonial-footer-right p {
  font-size: 11px;
  color: #a7a9b8;
}

.flickity-slider .fancy-box-tour {
  margin-bottom: 0px;
}

.browser-bar:before {
  content: '';
  display: inline-block;
  width: 100%;
  padding-top: 5.25%;
  z-index: 1;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url(/theme/ave/assets/img/misc/browser-bar.jpg);
  background-position: center top;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.flickity-viewport {
  top: -7px;
}

#news-carousel {
  overflow: visible;
}

#news-carousel .news-carousel-heading-wrap {
  overflow: visible;
  padding-top: 4px;
  margin-bottom: 1.25rem;
}

#news-carousel .news-carousel-heading-wrap span {
  margin-bottom: 0 !important;
  display: inline-block;
}

#news-carousel .news-outlet-scroller-shell {
  position: relative;
}

#news-carousel .news-outlet-scroller-shell::after {
  content: '';
  position: absolute;
  top: 8px;
  right: 0;
  bottom: 16px;
  width: 5rem;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.92) 62%, #fff 100%);
  opacity: 0;
  transition: opacity 0.2s ease;
}

#news-carousel .news-outlet-scroller-shell.is-scrollable:not(.is-at-end)::after {
  opacity: 1;
}

#news-carousel .news-outlet-scroller {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-x;
  cursor: grab;
  padding: 8px 0 16px;
  margin: 0;
}

#news-carousel .news-outlet-scroller::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

#news-carousel .news-outlet-scroller.is-dragging {
  cursor: grabbing;
  user-select: none;
}

#news-carousel .news-outlet-track {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.75rem;
  width: max-content;
  min-width: 100%;
  padding: 2px 2rem 6px 2px;
}

#news-carousel .news-outlet-chip {
  padding: 0.8rem 1.2rem;
  font-size: 0.9375rem;
  gap: 0.625rem;
  flex-shrink: 0;
}

#news-carousel .news-outlet-favicon {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
}

#news-carousel .flickity-viewport {
  top: 0;
}

#news-carousel .carousel-container {
  padding: 6px 0 14px;
}

.carousel-logos .flickity-slider {
  display: flex;
  align-items: center;
}

.carousel-item-outlet {
  width: auto;
  min-width: 0;
  padding: 0.35rem 0.35rem;
}

.news-outlet-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 1rem;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius-full);
  background: #fff;
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  box-sizing: border-box;
}

a.news-outlet-chip {
  text-decoration: none;
  cursor: pointer;
}

a.news-outlet-chip:hover,
a.news-outlet-chip:focus {
  color: #374151;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .carousel-logos a.news-outlet-chip,
  #news-carousel .news-outlet-scroller a.news-outlet-chip {
    transition:
      transform var(--dur-base, 200ms) var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
      box-shadow var(--dur-base, 200ms) ease,
      border-color var(--dur-base, 200ms) ease,
      color var(--dur-fast, 160ms) ease;
  }

  .carousel-logos a.news-outlet-chip:hover,
  #news-carousel .news-outlet-scroller a.news-outlet-chip:hover {
    transform: translateY(-1px) scale(1.02);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    border-color: #0587ed;
    color: #0587ed;
  }
}

a.news-outlet-chip:focus-visible {
  outline: 2px solid rgba(5, 135, 237, 0.35);
  outline-offset: 2px;
}

/* "Get Seen On" chips: staggered fade + slide-up reveal on scroll-in
   (mirrors the index.php "Publish Your Story on:" logo carousel animation:
   translateY 30 -> 0, opacity 0 -> 1, easeOutQuint, 75ms stagger per item) */
@keyframes gsoChipReveal {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

#news-carousel.gso-chips-anim .news-outlet-chip {
  opacity: 0;
}

#news-carousel.gso-chips-anim.gso-chips-in .news-outlet-chip {
  opacity: 1;
  animation: gsoChipReveal 1s cubic-bezier(0.23, 1, 0.32, 1) backwards;
}

@media (prefers-reduced-motion: reduce) {
  #news-carousel.gso-chips-anim .news-outlet-chip,
  #news-carousel.gso-chips-anim.gso-chips-in .news-outlet-chip {
    opacity: 1;
    animation: none;
  }
}

.news-outlet-favicon {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: var(--radius-sm);
  object-fit: contain;
}

.news-outlet-name {
  display: inline-block;
}

#news-carousel .carousel-logos .news-outlet-chip {
  margin: 0;
}

#official-reviews .industry-review-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem 2.5rem;
  margin: 0;
  padding: 0;
  overflow: visible;
}

#official-reviews .industry-review-logo {
  flex: 0 0 auto;
  width: auto;
  max-width: 170px;
  margin: 0;
  padding: 0;
}

#official-reviews .industry-review-logo figure {
  margin: 0;
}

#official-reviews .industry-review-logo img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-height: 50px;
  width: auto;
  max-width: 100%;
}



.fancy-box-offer-header h3 {
  text-transform: none !important;
}

.fancy-title h6 {
  color: var(--color-font);
}

.fancy-box-compare .fancy-box-offer {
  padding-bottom: 0px !important;
  margin-bottom: 20px !important;
}

.fancy-box-compare .fancy-box-offer .fancy-box-cell:last-child {
  align-items: flex-start !important;
}

.fancy-box-offer small.iconbox-tag {
  display: inline-block;
  margin-left: 5px;
}

@media screen and (min-width: 992px) {
  .fancy-box-compare .fancy-box-offer .fancy-box-cell:first-child {
    -webkit-box-flex: 1 !important;
    flex-grow: 1 !important;
  }
}

@media screen and (max-width: 991px) {
  .fancy-box-compare .fancy-box-offer .fancy-box-cell {
    margin-bottom: 0.5em !important;
  }

  .custom-shape-divider-bottom-1621016099 {
    display: none;
  }
}

@media only screen and (min-width: 992px) {
  #fancy-box-news-networks {
    background-image: url(./assets/img/Brand-Push-News-Networks.png);
  }
}

@media only screen and (min-width: 992px) {
  #fancy-box-sample-report-pnn {
    background-image: url(./assets/img/BrandPush-Sample-Report-1-961.png);
  }
}

@media only screen and (min-width: 992px) {
  #fancy-box-sample-report-ann {
    background-image: url(./assets/img/BrandPush-Sample-Report-2-961.png);
  }
}

@media only screen and (min-width: 992px) {
  #fancy-box-case-study {
    background-image: url(./assets/img/BrandPush-Case-Study-Affiliate-Bay-961.png);
  }
}

@media only screen and (min-width: 992px) {
  #fancy-box-video-case-study {
    background-image: url(./assets/img/BrandPush-Case-Study-Video-740.png);
  }
}



.pricing-table-colorful {
  margin-left: 0px;
  margin-right: 0px;
}

.pricing-table-body img {
  height: 100%;
  max-height: 22px;
  margin-right: 6px;
}

.pricing-table-body img.google-news {
  max-height: 20px;
  margin-top: -6px;
  margin-left: 4px;
}



.pricing-table-colorful .pricing-table-body {
  padding: 10px 0;
}

.fancy-box-offer {
  border-bottom: 0px;
}

#ld-tab-pane-featured .iconbox .contents a img {
  max-height: 68px;
}

.iconbox .avatar img {
  max-width: 50px;
  border-radius: 50%;
}

.iconbox-round {
  /* border: 1px solid #ededed; */
}


.fancy-box-offer small {
  text-align: left;
}

.iconbox .fancy-box-offer:not(:first-child) .text-primary a.text-primary::before {
  content: "";
  border-left: 1px solid #ededed;
  height: 35px;
  top: 5px;
  position: absolute;
  left: -13px;
  color: #ededed;
}

.inline-circle img {
  width: 40px;
  border-radius: 50%;
  z-index: 10;
  border: 3px #fff solid;
  margin-right: -15px;
  margin-top: -5px;
  background: #fff;
}

.inline-circle:hover img {
  z-index: 15;
  margin-top: -15px;
  margin-bottom: -10px;
  margin-left: -5px;
  width: 50px;
  position: relative;
}

.inline-circle,
.inline-circle-color-nohover {
  padding-top: 00px;
  color: #808291;
}

.inline-circle-color-nohover img {
  width: 38px;
  border-radius: 50%;
  z-index: 10;
  border: 3px #fff solid;
  margin-right: 4px;
  margin-top: -1px;
  filter: grayscale(0%) !important;
  background: #fff;
}

.inline-circle:has(.inline-circle:hover) {
  top: -10px;
}

.modal-foot-nopadding {
  margin-left: -34px;
  margin-right: -34px;
  margin-bottom: -25px;
}

/* Package modals: one scroll region, clipped inside rounded container */
.lity-opened .lity-wrap .lity-container:has(.lqd-modal-sticky-foot) {
  border-radius: var(--radius-surface);
  overflow: hidden;
  max-height: 90vh;
}

.lity-content:has(.lqd-modal-sticky-foot) {
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  max-height: 90vh;
  border-radius: var(--radius-surface);
  display: flex;
  flex-direction: column;
}

.lity-content .lqd-modal-sticky-foot,
.lity-opened .lqd-modal-sticky-foot {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  max-height: 90vh;
  width: 100%;
  overflow: hidden;
}

.lqd-modal-sticky-foot {
  width: 100%;
}

.lqd-modal-sticky-foot .lqd-modal-inner {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  max-height: 90vh;
  overflow: hidden !important;
  padding: 25px 0 0;
  width: 100%;
}

#modal-news-networks .lqd-modal-inner {
  padding-top: 0;
}

.lqd-modal-sticky-foot .lqd-modal-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
  padding-left: 2em;
  padding-right: 2em;
}

#modal-news-networks .lqd-modal-content {
  padding-top: 2rem;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.lqd-modal-sticky-foot .package-modal-body {
  max-width: 100%;
  overflow: visible;
  text-align: left;
}

.package-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.package-modal-title {
  margin: 0;
  padding: 0;
  text-align: left;
  flex: 1;
  min-width: 0;
}

.lqd-modal-sticky-foot .package-modal-header .package-modal-close.modal-inline-close {
  position: static !important;
  top: auto !important;
  right: auto !important;
  flex-shrink: 0;
  width: 35px;
  height: 35px;
  min-width: 35px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  font-size: 22px;
  line-height: 1;
  box-shadow: none;
  text-shadow: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.lqd-modal-sticky-foot .package-modal-body > h2 {
  margin-bottom: 0.75rem;
  text-align: left;
}

.lqd-modal-sticky-foot .package-modal-body > p {
  color: var(--color-text-secondary);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  margin-bottom: 1.25rem;
  text-align: left;
}

.package-modal-sample {
  text-align: left;
}

.package-modal-sample .btn {
  display: inline-flex;
}

.lqd-modal-sticky-foot .news-list-table-scroll {
  width: 100%;
  overflow: visible;
}

/* Mobile: scroll the table horizontally within its wrapper instead of the whole modal */
@media (max-width: 767px) {
  .lqd-modal-sticky-foot .news-list-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

.lqd-modal-sticky-foot .news-list-table {
  width: 100%;
  min-width: 720px;
  margin-bottom: 1.5rem;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e3e8ef;
  border-radius: var(--radius-xl);
  overflow: hidden;
  font-size: var(--text-sm);
  background: #fff;
}

.lqd-modal-sticky-foot .news-list-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f4f7fa;
  color: var(--color-text);
  font-weight: var(--weight-semibold);
  font-size: var(--text-xs);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 12px 14px;
  border-bottom: 1px solid #e3e8ef;
  text-align: center;
  white-space: nowrap;
}

.lqd-modal-sticky-foot .news-list-table thead th:first-child {
  text-align: left;
}

.lqd-modal-sticky-foot .news-list-table tbody td {
  padding: 11px 14px;
  border-bottom: 1px solid #eef1f5;
  border-left: none;
  border-right: none;
  border-top: none;
  color: var(--color-text-body);
  text-align: center;
  vertical-align: middle;
  line-height: 1.45;
}

.lqd-modal-sticky-foot .news-list-table tbody td.text-left {
  text-align: left;
}

.lqd-modal-sticky-foot .news-list-table tbody tr:nth-child(even) td {
  background: #fafbfc;
}

.lqd-modal-sticky-foot .news-list-table tbody tr:hover td {
  background: #f0f6fc;
}

.lqd-modal-sticky-foot .news-list-table tbody tr:last-child td {
  border-bottom: none;
}

.lqd-modal-sticky-foot .news-list-table td a {
  color: #0587ed;
  font-weight: 500;
  text-decoration: none;
}

.lqd-modal-sticky-foot .news-list-table td a:hover {
  text-decoration: underline;
}

.lqd-modal-sticky-foot .news-list-table td.text-left > a:first-of-type {
  color: #1d1d1d;
  font-weight: 600;
}

.lqd-modal-sticky-foot .news-list-table td.text-left small a {
  color: #6b7280;
  font-weight: 500;
  font-size: 11px;
}

.lqd-modal-sticky-foot .news-list-table .fab {
  font-size: 13px;
  margin-right: 4px;
  opacity: 0.9;
}

.lqd-modal-sticky-foot .news-list-table,
.lqd-modal-sticky-foot .news-list-table thead,
.lqd-modal-sticky-foot .news-list-table tbody,
.lqd-modal-sticky-foot .news-list-table tr,
.lqd-modal-sticky-foot .news-list-table th,
.lqd-modal-sticky-foot .news-list-table td {
  border-left: none;
  border-right: none;
  border-top: none;
}

.lqd-modal-sticky-foot .news-list-table {
  border: 1px solid #e3e8ef;
}

.lqd-modal-sticky-foot .news-list-table thead th {
  border-bottom: 1px solid #e3e8ef;
}

.lqd-modal-sticky-foot #modal_news_list,
.lqd-modal-sticky-foot .accepted-niches-container {
  max-width: 100%;
  overflow: visible;
}

.lqd-modal-sticky-foot .lqd-modal-foot {
  flex-shrink: 0;
  position: relative;
  z-index: 3;
  width: 100%;
  margin: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 0 0 var(--radius-2xl) var(--radius-2xl);
  box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.05);
}

.lqd-modal-sticky-foot .modal-foot-nopadding {
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
}

.lqd-modal-sticky-foot .lqd-modal-content .row {
  margin-left: 0;
  margin-right: 0;
}

.lqd-modal-sticky-foot .lqd-modal-foot p {
  margin-bottom: 0;
}

.main-footer a:not(.btn) {
  color: #a7a9b8;
}

.main-footer a:not(.btn):hover {
  color: #181b31;
}

.main-footer .footer-community-stack {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.main-footer .footer-community-stack > * {
  margin: 0;
}

.main-footer .footer-community-stack .trustpilot-widget {
  min-height: 109px;
  line-height: 0;
}

.main-footer .footer-community-stack .trustpilot-widget iframe {
  display: block;
}

.main-footer .footer-community-facebook {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.main-footer .footer-community-facebook .inline-reviews,
.main-footer .footer-community-facebook .footer-avatar-stack {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  margin: 0;
}

.main-footer .footer-community-facebook .inline-circle {
  position: relative;
  line-height: 0;
  flex-shrink: 0;
}

.main-footer .footer-community-facebook .inline-circle + .inline-circle {
  margin-left: -14px;
}

.main-footer .footer-community-facebook .inline-circle img {
  width: 40px;
  height: 40px;
  margin: 0;
  object-fit: cover;
  display: block;
  position: relative;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #fff;
  box-shadow: none;
  transition: transform var(--dur-press, 140ms) var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
}

.main-footer .footer-community-facebook .inline-circle:hover {
  z-index: 3;
  transform: none;
  box-shadow: none;
}

.main-footer .footer-community-facebook .inline-circle:hover img {
  z-index: 3;
  margin: 0;
  width: 40px;
  transform: translateY(-2px) scale(1.05);
  position: relative;
}

.main-footer .footer-community-facebook .inline-reviews a:last-child {
  margin-right: 0;
}

.main-footer .footer-community-facebook p {
  margin: 0;
}

.main-footer .footer-gdpr-link {
  display: inline-block;
  border-radius: var(--radius-lg);
  line-height: 0;
  transition:
    transform var(--dur-base, 200ms) var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
    box-shadow var(--dur-base, 200ms) ease;
}

.main-footer .footer-gdpr-badge {
  display: block;
  width: 100%;
  max-width: 100px;
  height: auto;
}

@media (hover: hover) and (pointer: fine) {
  .main-footer .footer-gdpr-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
  }

  .main-footer .footer-gdpr-link:hover .footer-gdpr-badge {
    opacity: 0.92;
  }
}

.main-footer .footer-gdpr-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(111, 168, 214, 0.35);
}

.main-footer {
  color: #5b6674;
}

.header-youtube-button:hover i {
  color: var(--color-gradient-stop);
}

.header-youtube-button:hover span {
  color: var(--color-gradient-stop);
}

.iconbox .contents {
  overflow: visible !important;
}

/* Press feedback for buttons and button-like controls (all viewports) */
#wrap .btn,
#wrap button.btn,
#wrap a.btn,
#wrap button:not(:disabled):not(.navbar-toggle),
#wrap input[type="submit"]:not(:disabled),
#wrap input[type="button"]:not(:disabled),
#wrap .buy-now-button,
#wrap .mobile-banner-chat,
#wrap .intercom-faceade,
#wrap .search-button,
#wrap a.btn-icon,
#wrap .pricing-topics-toggle,
#wrap .accordion-title > a,
#wrap .reviews-carousel-arrow:not(:disabled),
#wrap .nav-get-started-btn > a {
  transition:
    background-color var(--dur-fast) ease,
    border-color var(--dur-fast) ease,
    color var(--dur-fast) ease,
    box-shadow var(--dur-base) ease,
    transform var(--dur-press) var(--ease-out);
}

.mobile-banner .buy-now-button,
.mobile-banner-chat,
.intercom-faceade {
  transition:
    background-color var(--dur-fast) ease,
    border-color var(--dur-fast) ease,
    color var(--dur-fast) ease,
    box-shadow var(--dur-base) ease,
    transform var(--dur-press) var(--ease-out);
}

#wrap .btn:active,
#wrap button.btn:active,
#wrap a.btn:active,
#wrap button:not(:disabled):not(.navbar-toggle):active,
#wrap input[type="submit"]:not(:disabled):active,
#wrap input[type="button"]:not(:disabled):active,
#wrap .buy-now-button:active,
#wrap .mobile-banner-chat:active,
#wrap .intercom-faceade:active,
#wrap .search-button:active,
#wrap a.btn-icon:active,
#wrap .pricing-topics-toggle:active,
#wrap .accordion-title > a:active,
#wrap .reviews-carousel-arrow:not(:disabled):active,
#wrap .nav-get-started-btn > a:active,
#wrap .btn.is-pressing,
#wrap button.btn.is-pressing,
#wrap a.btn.is-pressing,
#wrap button:not(:disabled):not(.navbar-toggle).is-pressing,
#wrap input[type="submit"]:not(:disabled).is-pressing,
#wrap input[type="button"]:not(:disabled).is-pressing,
#wrap .buy-now-button.is-pressing,
#wrap .mobile-banner-chat.is-pressing,
#wrap .intercom-faceade.is-pressing,
#wrap .search-button.is-pressing,
#wrap a.btn-icon.is-pressing,
#wrap .pricing-topics-toggle.is-pressing,
#wrap .accordion-title > a.is-pressing,
#wrap .reviews-carousel-arrow:not(:disabled).is-pressing,
#wrap .nav-get-started-btn > a.is-pressing {
  transform: scale(0.96);
}

.mobile-banner .buy-now-button:active,
.mobile-banner-chat:active,
.intercom-faceade:active,
.mobile-banner .buy-now-button.is-pressing,
.mobile-banner-chat.is-pressing,
.intercom-faceade.is-pressing {
  transform: scale(0.96);
}

@media (hover: hover) and (pointer: fine) {
  #wrap .btn.btn-gradient:hover,
  #wrap .btn.btn-solid.btn-gradient:hover {
    transform: translateY(-1px);
  }

  #wrap .btn.btn-gradient:active,
  #wrap .btn.btn-solid.btn-gradient:active,
  #wrap .btn.btn-gradient.is-pressing,
  #wrap .btn.btn-solid.btn-gradient.is-pressing {
    transform: scale(0.96) translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  #wrap .btn,
  #wrap button:not(:disabled),
  #wrap a.btn,
  #wrap .buy-now-button,
  #wrap .mobile-banner-chat,
  #wrap .intercom-faceade,
  #wrap .search-button,
  #wrap a.btn-icon,
  #wrap .pricing-topics-toggle,
  #wrap .accordion-title > a,
  #wrap .reviews-carousel-arrow:not(:disabled),
  #wrap .nav-get-started-btn > a {
    transition: background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease, box-shadow var(--dur-base) ease;
  }

  .mobile-banner .buy-now-button,
  .mobile-banner-chat,
  .intercom-faceade {
    transition: background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease, box-shadow var(--dur-base) ease;
  }

  #wrap .btn:active,
  #wrap button:not(:disabled):active,
  #wrap a.btn:active,
  #wrap .buy-now-button:active,
  #wrap .mobile-banner-chat:active,
  #wrap .intercom-faceade:active,
  #wrap .search-button:active,
  #wrap a.btn-icon:active,
  #wrap .pricing-topics-toggle:active,
  #wrap .accordion-title > a:active,
  #wrap .reviews-carousel-arrow:not(:disabled):active,
  #wrap .nav-get-started-btn > a:active,
  .mobile-banner .buy-now-button:active,
  .mobile-banner-chat:active,
  .intercom-faceade:active,
  #wrap .is-pressing,
  .is-pressing {
    transform: none;
  }
}

.liquid-counter,
.btn-gradient-border {
  z-index: 0;
}

/* Solid gradient buttons: no SVG stroke border (broken global gradient renders black) */
.btn-solid.btn-gradient {
  border: none !important;
  background: transparent !important;
  color: #fff;
  padding: 0 !important;
  overflow: hidden;
}

.btn-solid.btn-gradient:hover,
.btn-solid.btn-gradient:focus,
.btn-solid.btn-gradient:active {
  background: transparent !important;
  background-color: transparent !important;
  color: #fff !important;
}

.btn-solid.btn-gradient > span {
  position: relative;
  overflow: hidden;
  border-radius: inherit;
  isolation: isolate;
}

.btn-solid.btn-gradient .btn-gradient-bg,
.btn-solid.btn-gradient .btn-gradient-bg-hover {
  pointer-events: none;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: 100% 100% !important;
  border-radius: inherit;
}

.btn-solid.btn-gradient .btn-gradient-bg {
  z-index: 0;
}

.btn-solid.btn-gradient .btn-gradient-bg-hover {
  z-index: 1;
}

.btn-solid.btn-gradient .btn-txt {
  position: relative;
  z-index: 2;
  color: #fff;
}

.btn-solid.btn-gradient .btn-txt > * {
  position: relative;
  z-index: 1;
}

.btn-solid.btn-gradient .btn-gradient-border {
  display: none !important;
}

.liquid-img-group-browser {
  background-image: url(/theme/ave/assets/img/misc/browser-bar.jpg) !important;
  background-size: contain !important;
}



/* Custom Radio */

/* Remove default radio button styles */
.avatar-radio input[type="radio"] {
  display: none;
}

/* Style the container for radio buttons */
.radio-avatar-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Style the custom radio buttons */
.avatar-radio {
  display: inline-block;
  margin: 0 -5px;
  cursor: pointer;
}

/* Define the appearance of unselected radio buttons */
.avatar-radio {
  width: 60px;
  /* Adjust the size of the circle image */
  height: 60px;
  border: 4px solid #fff;
  /* Initial border color */
  border-radius: 50%;
  /* Create a circular shape */
  overflow: hidden;
}

/* Define the appearance of the selected radio button */
.avatar-radio:has(input[type="radio"]:checked) {
  border: 4px solid #0587ed;
  /* Blue border for the selected option */
  height: 60px;
  width: 60px;
  z-index: 50;
  position: relative;
}



/* Tooltip container */
.tooltip {
  position: relative;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;

  background-color: #fff;
  color: #5b6674;
  text-align: left;
  padding: 5px 0;
  border-radius: var(--radius-surface);

  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 9999;

  width: 400px;
  bottom: 38px;
  left: 50%;
  margin-left: -198px;
  /* Use half of the width (120/2 = 60), to center the tooltip */
  padding: 25px;
  box-shadow: 0 8px 20px rgb(0 0 0 / 15%);
}

.tooltip.tooltip-plain .tooltiptext {
  font-size: 17px;
  font-family: poppins, sans-serif;
  font-weight: 500;
}

.tooltip:not(.tooltip-plain) .tooltiptext span {
  color: #000;
  display: block;
  margin-top: 10px;
}

.tooltip:not(.tooltip-plain) .tooltiptext:before {
  display: block;
  width: 103px;
  height: 40px;
  content: "";
  background: url(/assets/img/TrustPilot-Logo.svg) no-repeat 0 0;
  background-size: 100%;
}



.tooltip:not(.tooltip-plain) .tooltiptext span:after {
  content: "";
  display: block;
  width: 123px;
  height: 23px;
  background-image: url(https://www.brandpush.co/assets/img/Brand-Push-TrustPilot-Rating.svg);
  background-size: cover;
  float: right;
  margin-top: 2px;
}

.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%;
  /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}

/* Pricing table tooltips — fade + lift on hover */
#pricing-comparison-table .tooltip .tooltiptext {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--dur-fast, 160ms) cubic-bezier(0.23, 1, 0.32, 1),
    transform var(--dur-fast, 160ms) cubic-bezier(0.23, 1, 0.32, 1),
    visibility 0s linear var(--dur-fast, 160ms);
  pointer-events: none;
}

#pricing-comparison-table .tooltip:hover .tooltiptext {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition:
    opacity var(--dur-fast, 160ms) cubic-bezier(0.23, 1, 0.32, 1),
    transform var(--dur-fast, 160ms) cubic-bezier(0.23, 1, 0.32, 1),
    visibility 0s linear 0s;
}

.ld-gradient-heading {
  background: -webkit-linear-gradient(300deg, rgb(250, 163, 97) 0.3184713375796178%, rgb(255, 135, 51) 1.910828025477707%, rgb(144, 69, 255) 99.36305732484075%);
  background: linear-gradient(300deg, rgb(250, 163, 97) 0.3184713375796178%, rgb(255, 135, 51) 1.910828025477707%, rgb(144, 69, 255) 99.36305732484075%);
}

.ld-gradient-heading {
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-fill-color: transparent !important;
}

.wrap {
  overflow: hidden;
}

.pointer {
  cursor: pointer;
}

.fancy-box-travel h3 {
  text-transform: none !important;
}

.fancy-box-overlay .fancy-box-contents {
  width: 100%;
  padding: 35px;
  margin: 0;
}

.badge {
  color: #fff;
  padding: 4px 8px;
  font-size: small;
  border-radius: var(--radius-md);
  font-weight: 600;
}

.emoji-icon {
  width: 20px;
  height: 20px;
  margin-right: 3px;
  display: inline-block;
  top: 4px;
  position: relative;
}

.emoji-check {
  background: url(https://www.brandpush.co/assets/img/emoji-check.png);
  background-size: contain;
}

.emoji-cross {
  background: url(https://www.brandpush.co/assets/img/emoji-cross.png);
  background-size: contain;
}

.nav.tabs-nav li.active a {
  border: 1px solid #ededed;
  border-radius: var(--radius-full);
}

.nav.tabs-nav li a {
  padding-right: 30px;
  padding-left: 30px;
}

#exit-popup {
  width: 600px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

#modal-join-newsletter {
  width: 900px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.hero-video-container {
  width: 424px;
  height: 524px;
  border-radius: var(--radius-surface);
  box-shadow: 0 25px 70px rgb(0 0 0 / 7%);
  overflow: hidden;
}

.hero-video {
  border-radius: var(--radius-surface);
  background: #fff;
}

.screenshot-arrow a:hover+svg path {
  stroke: #ff798e;
}

.screenshot-arrow a:hover {
  color: #ff798e;
}

.lity-opened .lity-wrap .lity-container,
#modal-join-newsletter,
#exit-popup {
  border-radius: var(--radius-surface);
  overflow: hidden;
}

.modal-inline-close {
  background: #ededed;
  border-radius: 50%;
  text-shadow: none;
  color: #8fa6d0;
}

.modal-position-close {
  position: absolute !important;
  top: -13px;
  right: -6px;
}

.modal-position-close:hover {
  position: absolute !important;
  top: -10px;
  right: -5px;
}

.modal-inline-close:hover {
  background: #6da1ff;
  color: #ffffff;
}

/* Video/lightbox modals use viewport close; content modals use in-modal close */
.lity-content + .lity-close {
  display: flex !important;
}

.lity-content:has(.lqd-modal-sticky-foot) + .lity-close,
.lity-content:has(#modal-join-newsletter) + .lity-close,
.lity-content:has(#exit-popup) + .lity-close {
  display: none !important;
}

/* Clicks on inner glyphs should hit the [data-lity-close] button */
.video-modal-close span {
  pointer-events: none;
}

/* Video modals use an in-panel close button; hide Lity's viewport close */
.lity-content:has(.hero-how-it-works-modal) + .lity-close,
.lity-content:has(#modal-video-review) + .lity-close {
  display: none !important;
}

/* Video overlays — above sticky navbar (999999), with clear close buttons */
.lity,
.lity-wrap,
.lity-container,
.lity-loader {
  z-index: 10000010 !important;
}

.fr-overlay {
  z-index: 10000010 !important;
}

.fr-window,
.fr-spinner {
  z-index: 10000011 !important;
}

/* Uniform close control for all video lightboxes (Lity + Fresco) */
.video-modal-close,
.fr-window .fr-close-outside,
.fr-window .fr-close-fullclick,
.lity-opened > .lity-close,
.lity-opened .lity-wrap > .lity-close {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.96);
  color: #181b31;
  font-size: 30px;
  font-family: Arial, sans-serif;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.28);
  z-index: 10000012 !important;
  opacity: 1 !important;
  -webkit-tap-highlight-color: transparent;
  transition: transform var(--dur-press, 140ms) cubic-bezier(0.23, 1, 0.32, 1), background-color var(--dur-fast, 160ms) ease;
}

/* Fresco: replace SVG icon with the same × glyph as Lity modals */
.fr-window .fr-close-outside .fr-close-background,
.fr-window .fr-close-outside .fr-close-icon,
.fr-window .fr-close-fullclick .fr-close-background,
.fr-window .fr-close-fullclick .fr-close-icon {
  display: none !important;
}

.fr-window .fr-close-outside::after,
.fr-window .fr-close-fullclick::after {
  content: "\00d7";
  display: block;
  margin-top: -2px;
  color: #181b31;
  font-size: 30px;
  font-family: Arial, sans-serif;
  line-height: 1;
  pointer-events: none;
}

.hero-how-it-works-modal-panel,
.lity-opened .video-modal-panel,
#modal-video-review .video-modal-panel {
  position: relative;
  width: min(960px, calc(100vw - 2.5rem));
  margin: 0 auto;
}

.lity-opened .hero-how-it-works-modal .video-modal-close,
.lity-opened .video-modal-panel .video-modal-close,
.hero-how-it-works-modal .video-modal-close,
#modal-video-review .video-modal-close {
  position: absolute !important;
  top: -52px;
  right: 0;
  left: auto;
  bottom: auto;
}

.video-modal-close {
  position: fixed;
  top: 20px;
  right: 20px;
}

.lity-opened > .lity-close,
.lity-opened .lity-wrap > .lity-close {
  position: fixed;
  top: 20px;
  right: 20px;
}

.video-modal-close:hover,
.fr-window .fr-close-outside:hover,
.fr-window .fr-close-fullclick:hover,
.lity-opened > .lity-close:hover,
.lity-opened .lity-wrap > .lity-close:hover {
  background: #fff;
  transform: scale(1.06);
  color: #181b31;
}

.video-modal-close span {
  display: block;
  margin-top: -2px;
}

.lity-opened .lity-wrap .lity-container:has(.hero-how-it-works-modal),
.lity-opened .lity-wrap .lity-container:has(#modal-video-review),
.lity-opened .lity-container:has(.video-modal-panel) {
  overflow: visible !important;
  padding-top: 3.25rem;
}

/* Fresco (YouTube) close — JS pins above the video frame top-right */
.fr-window-ui-outside .fr-close-fullclick {
  display: none !important;
}

.fr-window .fr-close-outside,
.fr-window .fr-close-fullclick {
  position: fixed !important;
  margin: 0 !important;
}

.fr-window.fr-toggle-ui .fr-close {
  opacity: 1 !important;
}

html.lity-active .main-header,
html.lity-active .main-header.is-sticky,
body:has(.fr-window) .main-header,
body:has(.fr-window) .main-header.is-sticky {
  z-index: 999990 !important;
}

.video-review {
  display: none;
  height: 100%;
  max-height: calc(100vh - 70px);
  width: auto;
  margin-left: auto;
  margin-right: auto;
}

/* Rounded frames for all video lightboxes (Lity + Fresco) */
.video-modal-frame,
.hero-how-it-works-video {
  border-radius: var(--radius-surface);
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
}

#modal-video-review .video-modal-frame {
  width: min(960px, calc(100vw - 2.5rem));
  margin: 0 auto;
  background: #000;
}

.fr-window .fr-content {
  border-radius: var(--radius-surface) !important;
  overflow: hidden !important;
}

.fr-window .fr-content-background,
.fr-window .fr-content-element iframe,
.fr-window .fr-content-element video {
  border-radius: var(--radius-surface);
}

.hero-how-it-works-modal.lqd-modal,
.hero-how-it-works-modal .lqd-modal-inner,
.hero-how-it-works-modal .lqd-modal-content,
#modal-video-review.lqd-modal,
#modal-video-review .lqd-modal-inner,
#modal-video-review .lqd-modal-content {
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  border-radius: 0 !important;
  border: 0 !important;
  padding: 0 !important;
}

.lity-content:has(.hero-how-it-works-modal),
.lity-content:has(#modal-video-review),
.lity-opened .lity-wrap .lity-container:has(.hero-how-it-works-modal),
.lity-opened .lity-wrap .lity-container:has(#modal-video-review) {
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  max-width: none;
  border-radius: 0 !important;
  border: 0 !important;
}

.lity-content:has(.hero-how-it-works-modal):after,
.lity-content:has(#modal-video-review):after {
  display: none !important;
  content: none !important;
  box-shadow: none !important;
}

.hero-how-it-works-video {
  position: relative;
  width: 100%;
  margin: 0 auto;
  background: #000;
}

.hero-how-it-works-video::before {
  content: "";
  display: block;
  padding-top: 56.25%;
}

.hero-how-it-works-yt {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.hero-how-it-works-modal-cta {
  margin-top: var(--space-5);
}

.lity-opened .hero-how-it-works-modal-cta .btn {
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
}

.bottom-0 {
  bottom: 0% !important;
  top: inherit !important;
}

.bottom-05 {
  bottom: 5% !important;
  top: inherit !important;
}

.pricing-news-logo {
  max-height: 30px;
  max-width: 100px;
}

.pricing-news-icons-container {
  display: flex;
  justify-content: space-around;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;
}

.pricing-news-icons-container .pricing-news-logo {
  max-height: 25px;
  max-width: 100px;
}

.pricing-outlet-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: inherit;
  text-decoration: none;
  transition: color var(--dur-fast, 160ms) ease;
}

a.pricing-outlet-label:hover,
a.pricing-outlet-label:focus-visible {
  color: #0587ed;
  text-decoration: none;
}

.pricing-outlet-external-icon {
  font-size: 0.75rem;
  line-height: 1;
  margin-left: 0;
  width: 0;
  overflow: hidden;
  opacity: 0;
  flex-shrink: 0;
  transition:
    opacity var(--dur-fast, 160ms) ease,
    width var(--dur-fast, 160ms) ease,
    margin-left var(--dur-fast, 160ms) ease;
}

a.pricing-outlet-label:hover .pricing-outlet-external-icon,
a.pricing-outlet-label:focus-visible .pricing-outlet-external-icon {
  width: 0.75rem;
  margin-left: 0.35rem;
  opacity: 0.9;
}

.pricing-outlet-favicon {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: var(--radius-sm);
  object-fit: contain;
}

.pricing-select-container button {
  background: #fff;
}

.pricing-select-container .btn-group label:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.pricing-select-container .btn-group label:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.pricing-select-container .btn-group label {
  font-size: 12px;
  font-weight: 600;
  padding: 10px 17px;
  border: 1px solid #0587ed;
  color: #0587ed;
  text-transform: uppercase !important;
  list-style-type: none;
}

.pricing-select-container .writing-package-btn-group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0;
}

.pricing-select-container .writing-package-btn-group label.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin: 0;
  cursor: pointer;
  background: #fff;
  box-shadow: none;
}

.pricing-select-container .writing-package-btn-group label.btn input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}

.pricing-select-container .writing-package-btn-group label.btn.active,
.pricing-select-container .writing-package-btn-group label.btn:has(> input:checked) {
  background: #0587ed !important;
  color: #fff !important;
  border-color: #0587ed !important;
}

.pricing-select-container .btn-group label+label {
  border-left: none;
}

.pricing-select-container .btn-group label input {
  display: none;
}

.btn-group label.btn input[type="radio"]:checked+label,
.btn-group label.btn input[type="radio"]:checked {
  background: #0587ed !important;
  color: #fff !important;
}

.pricing-select-container label.btn:has(> input:checked),
.pricing-select-container label:hover {
  background: #0587ed !important;
  color: #fff !important;
  transform: none;
  box-shadow: none;
}

.pricing-select-container .btn-group label:selected,
.pricing-select-container .btn-group label:hover {
  background: #0587ed !important;
  color: #fff !important;
}

#pricing-select {
  padding: 10px 17px;
  border: 1px solid #0587ed;
  color: #0587ed;
  border-radius: var(--radius-md);
}


.btn-group .btn+.btn {
  margin-left: -5px;
}

.btn-white-blue {
  background: #fff;
  color: rgb(115, 115, 115);
  border: 1px solid #ededed;
}

.btn-white-blue:hover {
  background: #0287ed;
  color: #fff;
}


.list-no-icon {
  list-style-type: none;
}

.list-no-icon li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  align-content: center;
  margin-bottom: 15px;
}

.pricing-table {
  border-collapse: collapse;
  /* This hides the inner borders */
  display: block;
  width: 100%;
  margin: 0;
  border: 1px solid #ededed !important;
  table-layout: fixed;
  overflow: visible;
}

.pricing-table thead {
  position: sticky;
  top: var(--sticky-nav-height, 0px);
  z-index: 10000;
  background: #fff;
}

.pricing-table tbody tr td .fa-times-circle,
.pricing-table tbody tr td .fa-check-circle,
.pricing-table tbody tr td .fa-minus-circle {
  font-size: 1.6em;
}

.pricing-table tbody tr td {
  padding: 10px 0;
}

.pricing-table thead tr th {
  text-align: center !important;
}

.pricing-table-green-col {
  background: #f3f7f5;
}

th.pricing-table-green-col:after {
  content: "";
  display: block;
  width: 100%;
  height: 30px !important;
  background-color: #f3f7f5 !important;
  border-top-left-radius: 15px !important;
  top: -222px;
  border-top-right-radius: 15px !important;
  position: relative;
  margin-bottom: -13px;
}

.pricing-table td,
.pricing-table th,
.pricing-table tr {
  border: none !important;
}

.pricing-table tbody tr td:first-child {
  text-align: left;
}

.pricing-table tbody tr td:nth-child(2):not(.pricing-table-green-col) {
  text-align: left;
  padding-right: 10px;
}

.pricing-table tbody tr td.pricing-table-green-col {
  text-align: center !important;
}

.pricing-table tbody tr:last-of-type td {
  padding-bottom: 30px;
}

.pricing-table thead tr th {
  position: relative;
  padding: 54px 0 0 0;
}

.pricing-most-popular-badge {
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.3;
  white-space: nowrap;
}

.pricing-table thead th.pricing-col-popular {
  position: relative;
  overflow: visible;
}

.pricing-most-popular-badge--notch {
  --notch-bg: #70a986;
  --notch-ear: 14px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  margin: 0;
  padding: 8px 22px 12px;
  background: #70a986;
  border-radius: 0 0 var(--radius-2xl) var(--radius-2xl);
  box-shadow: 0 6px 14px rgba(112, 169, 134, 0.22);
  z-index: 3;
}

.pricing-most-popular-badge--notch::before,
.pricing-most-popular-badge--notch::after {
  content: "";
  position: absolute;
  top: 0;
  width: var(--notch-ear);
  height: var(--notch-ear);
  pointer-events: none;
}

.pricing-most-popular-badge--notch::before {
  left: calc(-1 * var(--notch-ear));
  background: radial-gradient(circle at 0 100%, transparent var(--notch-ear), var(--notch-bg) var(--notch-ear));
}

.pricing-most-popular-badge--notch::after {
  right: calc(-1 * var(--notch-ear));
  background: radial-gradient(circle at 100% 100%, transparent var(--notch-ear), var(--notch-bg) var(--notch-ear));
}

.pricing-most-popular-badge--card {
  display: inline-block;
  margin: 0 0 0 auto;
  font-size: 10px;
  padding: 6px 12px;
  flex-shrink: 0;
  align-self: flex-start;
  background: #70a986;
  border-radius: var(--radius-pill);
  box-shadow: 0 2px 10px rgba(112, 169, 134, 0.28);
}

/* Growth card badge: full "Most Popular" on mobile, shortened to "Popular" on
   tablet + desktop (>=768px). */
.pricing-most-popular-badge--card .pricing-popular-short {
  display: none;
}

@media (min-width: 768px) {
  .pricing-most-popular-badge--card .pricing-popular-full {
    display: none;
  }
  .pricing-most-popular-badge--card .pricing-popular-short {
    display: inline;
  }
}

.text-green {
  color: #70a986;
}

.text-red {
  color: #fc692e;
}

/*
.pricing-table-green-col .text-green, .pricing-table-green-col .text-red, .pricing-table-green-col h4{
  color: #fff;
}
*/
.pricing-select {
  height: 46px;
  font-size: 16px;
  padding: 0 10px 0 14px;
  border: 1px solid #f8f8f8;
  border-radius: var(--radius-md);
}

.pricing-select option span {
  display: none;
}

.d-block {
  display: block;
}

.btn-icon-circle.btn-icon-ripple .btn-icon:before {
  color: #ff798e;
}


.case-study-picture {
  display: inline-block;
  overflow: hidden;
}

.liquid-img-group-single[data-shadow-style="4"] .liquid-img-container-inner {
  box-shadow: 0 30px 30px rgba(0, 0, 0, .17);
}

/* INTERCOM FACADE */
.intercom-faceade {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  background-color: #0287ed;
  border-radius: 50%;
  cursor: pointer;
  z-index: 99999;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.intercom-faceade div {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  color: #fff;
}

.intercom-faceade svg {
  display: block;
  width: 22px;
  height: 25px;
}

html.intercom-ready .intercom-faceade {
  display: none !important;
}

.PopIn {
  position: fixed;
  opacity: 0;
  -webkit-transform: scale(0.96);
  transform: scale(0.96);
  -webkit-animation: popin var(--dur-base, 200ms) cubic-bezier(0.23, 1, 0.32, 1);
  animation: popin var(--dur-base, 200ms) cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes popin {
  to {
    opacity: 1;
    -webkit-transform: scale(1);
  }
}

@keyframes popin {
  to {
    opacity: 1;
    transform: scale(1);
  }
}



/*PILLS*/
.pill-container {

  display: flex;
  align-items: center;
  justify-content: center;
}

.pill-tabs {
  display: flex;
  position: relative;
  background-color: #fff;
  box-shadow: 0 0 1px 0 rgba(#185ee0, 0.15), 0 6px 12px 0 rgba(#185ee0, 0.15);
  padding: 0.75rem;
  border-radius: var(--radius-full);

  * {
    z-index: 2;
  }
}

.pill-container input[type="radio"] {
  display: none;
}

.pill-container label {
  margin-bottom: 0px;
}

.pill-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 54px;
  width: 200px;
  font-size: 1.25rem;
  font-weight: 500;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: color var(--dur-fast, 160ms) ease;
  z-index: 3;
}

.pill-notification {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin-left: 0.75rem;
  border-radius: 50%;
  background-color: var(--secondary);
  transition: background-color var(--dur-fast, 160ms) ease, color var(--dur-fast, 160ms) ease;
}

.pill-glider {
  position: absolute;
  display: flex;
  height: 54px;
  width: 200px;
  background-color: #0587ed;
  z-index: 1;
  border-radius: var(--radius-full);
  transition: transform var(--dur-base, 200ms) cubic-bezier(0.23, 1, 0.32, 1);
}

#pill-container-1 input[type="radio"]:checked+label {
  color: #fff;
}

#pill-container-1 input[type="radio"]:checked+label>.pill-notification {
  background-color: var(--primary);
  color: #fff;
}

#pill-container-1 input[id="radio-network-21"]:checked~.pill-glider {
  transform: translateX(0);
}

#pill-container-1 input[id="radio-network-7"]:checked~.pill-glider {
  transform: translateX(100%);
}

#pill-container-1 input[id="radio-network-8"]:checked~.pill-glider {
  transform: translateX(100%);
}

#pill-container-1 input[id="radio-network-9"]:checked~.pill-glider {
  transform: translateX(200%);
}

#pill-container-1 input[id="radio-network-10"]:checked~.pill-glider {
  transform: translateX(300%);
}

#pill-container-2 input[type="radio"]:checked+label {
  color: #fff;
}

#pill-container-2 input[type="radio"]:checked+label>.pill-notification {
  background-color: var(--primary);
  color: #fff;
}

#pill-container-2 input[id="radio-1-2"]:checked~.pill-glider {
  transform: translateX(0);
}

#pill-container-2 input[id="radio-2-2"]:checked~.pill-glider {
  transform: translateX(100%);
}



.horizontal-divided-list li {
  display: inline-block;
  position: relative;
  padding: 0 17px;
  line-height: 2;
}

.horizontal-divided-list li:not(:first-child)::before {
  content: "|";
  position: absolute;
  left: -4px;
  color: #ededed;
}

.network-select {
  width: 100%;
  font-size: 22px;
  padding: 0 14px;
  height: 60px;
  color: #737373;
  border: 1px solid #f2f2f2;
  border-radius: var(--radius-lg);
}


.fcc-logo {
  width: 13px;
  margin: -1px 5px 0 5px !important;
  padding: 0px;
}

.news-list-table,
.news-list-table thead,
.news-list-table tbody,
.news-list-table tr,
.news-list-table th,
.news-list-table td {
  border: 1px solid #f1f1f1;
}

.news-grid a:has(> img[src$=".svg"]) {
  display: flex;
  align-items: center;
  justify-content: flex-start;

}

.liquid-overlay-link {
  z-index: 1000;
}

.email-field {
  width: 100%;
  padding: 10px 15px;
  border: 1px solid #ededed;
  border-radius: var(--radius-md);
  outline: none;
}

#wrap .megamenu .inline-form > div:has(.login-forgot-password-link) {
  position: relative;
}

#wrap .login-forgot-password-link {
  position: absolute;
  top: 50%;
  right: 5px;
  transform: translateY(-50%);
  margin: 0;
  padding: 9px 6px;
  background: #fff;
  white-space: nowrap;
  z-index: 1;
  line-height: 1.2;
}

#wrap .megamenu .inline-form input[type="password"].email-field {
  padding-right: 8.75rem;
}

/* Login megamenu — compact form panel, right-aligned to account nav */
@media (min-width: 1200px) {
  #account-header-collapse,
  #account-primary-nav {
    position: relative;
  }

  #account-primary-nav > li.login-megamenu {
    position: static;
  }

  #account-primary-nav > li.login-megamenu > .nav-item-children {
    width: 24rem !important;
    max-width: min(24rem, calc(100vw - 2rem)) !important;
    left: auto !important;
    right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #account-primary-nav > li.login-megamenu .megamenu-container {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
  }
}

#account-primary-nav > li.login-megamenu .nav-item-children {
  width: auto;
  max-width: min(24rem, calc(100vw - 2rem));
  left: auto !important;
  right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#account-primary-nav > li.login-megamenu .megamenu-container {
  width: auto !important;
  max-width: min(24rem, calc(100vw - 2rem));
}

#account-primary-nav .megamenu-inner-row {
  border-radius: var(--radius-2xl, 1rem);
  overflow: hidden;
}

#account-primary-nav .megamenu-inner-row .ld-container {
  width: auto;
  max-width: none;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

#account-primary-nav .login-megamenu-form-col {
  display: block;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

#account-primary-nav .login-megamenu-panel {
  width: 100%;
  max-width: none;
  padding-right: 0;
}

#account-primary-nav .login-megamenu-title {
  margin: 0 0 0.5rem;
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-text, #1a1a1a);
}

#account-primary-nav .login-megamenu-lead {
  margin: 0 0 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--color-text-muted, #6b7280);
}

#account-primary-nav .login-megamenu-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#account-primary-nav .login-megamenu-field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

#account-primary-nav .login-megamenu-label-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}

#account-primary-nav .login-megamenu-label {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text, #1a1a1a);
}

#account-primary-nav .login-megamenu-input {
  width: 100%;
  padding: 0.6875rem 0.875rem;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius-lg, 0.5rem);
  background: #fff;
  font-size: 0.9375rem;
  line-height: 1.4;
  color: var(--color-text, #1a1a1a);
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#account-primary-nav .login-megamenu-input::placeholder {
  color: #9ca3af;
}

#account-primary-nav .login-megamenu-input:hover {
  border-color: #d1d5db;
}

#account-primary-nav .login-megamenu-input:focus {
  border-color: #fe516b;
  box-shadow: 0 0 0 3px rgba(254, 81, 107, 0.12);
}

#account-primary-nav .login-megamenu-forgot {
  flex-shrink: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #0287ed;
  text-decoration: none;
  white-space: nowrap;
}

#account-primary-nav .login-megamenu-forgot:hover {
  text-decoration: underline;
}

#account-primary-nav .login-megamenu-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 0.25rem;
}

#account-primary-nav .login-megamenu-submit {
  min-width: 7.5rem;
  height: 3rem;
  min-height: 3rem;
  max-height: 3rem;
  margin: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden;
}

/* Make the gradient layer fill the whole button (no white pill artifact) and
   match the hero CTA button height (3rem) */
#account-primary-nav .login-megamenu-submit > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 100%;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#account-primary-nav .login-megamenu-remember {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-muted, #6b7280);
  cursor: pointer;
  user-select: none;
}

#account-primary-nav .login-megamenu-checkbox {
  width: 1rem;
  height: 1rem;
  margin: 0;
  flex-shrink: 0;
  accent-color: #fe516b;
}

.loading-spinner {
  width: 27px;
  height: 27px;
  border: 6px solid rgba(0, 0, 0, 0.2);
  border-top: 6px solid #f2b7ab;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
  display: inline-block;
  margin-bottom: -7px;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.search-form {
  display: flex;
  flex-direction: row;
  border: 1px solid #ededed;
  border-radius: var(--radius-full);
  /* Clip children to the pill: the .search-field has a white background but a
     global input rule forces its radius to 8px, so without clipping its square
     corners poke past the pill and make the rounded ends look cut off. */
  overflow: hidden;
  max-width: 500px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.search-field {
  width: 100%;
  padding: 10px 35px 10px 24px;
  border: none;
  border-radius: var(--radius-full);
  outline: none;
}

.search-button {
  background: transparent;
  border: none;
  outline: none;
  margin-left: -33px;
  padding: 0 24px;
  text-wrap: nowrap;
  border-radius: var(--radius-full);
}

.search-button:hover {
  background-color: var(--color-secondary);
  color: #fff;
}

/* ==========================================================================
   FAQ — mobile category tabs (desktop unchanged).
   initFaqTabs() in index-dev-perf.js builds a .faq-tabs pill row after the FAQ
   header and adds .faq-tabs-active to #faq. Everything here is mobile-only, so
   desktop keeps its full vertically-stacked category + question layout.
   ========================================================================== */
.faq-tabs {
  display: none;
}

@media (max-width: 767px) {
  #faq.faq-tabs-active .faq-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-2);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* full-bleed so the pills can scroll edge-to-edge past the column padding */
    padding: 0 var(--space-4) var(--space-2);
    margin: 0 calc(-1 * var(--space-4)) var(--space-4);
    scroll-padding-inline: var(--space-4);
  }

  #faq.faq-tabs-active .faq-tabs::-webkit-scrollbar {
    display: none;
  }

  #faq .faq-tab {
    flex: 0 0 auto;
    -webkit-appearance: none;
    appearance: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid #e2e6ea;
    background: #fff;
    color: #4a4a4a;
    border-radius: 999px;
    padding: 0.5rem 1.15rem;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.2;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  }

  #faq .faq-tab.is-active {
    background: #181b31;
    color: #fff;
    border-color: #181b31;
  }

  /* The vertical category headers are replaced by the pill tabs. */
  #faq.faq-tabs-active .lqd-column-inner > h3 {
    display: none;
  }

  /* Tab filter: show only the active category. */
  #faq.faq-tabs-active .faq-cat-hidden {
    display: none !important;
  }

  /* Search filter: hide non-matching questions. */
  #faq.faq-tabs-active .faq-item-hidden {
    display: none !important;
  }

  /* While searching (results span all categories), show category headers as
     result group labels. */
  #faq.faq-tabs-active.faq-search-active .lqd-column-inner:not(.faq-cat-hidden) > h3 {
    display: block;
    margin-bottom: 0.75rem;
  }

  /* Keep questions visible regardless of the theme's scroll-reveal animation, so
     switching to a category that was hidden never shows un-animated (opacity:0)
     content. */
  #faq.faq-tabs-active .accordion-item {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* FAQ (mobile): show the first 5 questions per group, with a "Show more" button
   that reveals the rest via a smooth height animation. Groups with <=5 questions
   get no wrapper/button. Desktop is untouched (wrapper is display:contents and
   the button is hidden), so every question shows as before. */
.faq-show-more {
  display: none;
}

@media (max-width: 767px) {
  #faq.faq-tabs-active .faq-extra-wrap {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  }

  /* Global search spans all questions, so reveal the collapsed group while
     searching (non-matches are still hidden by .faq-item-hidden). */
  #faq.faq-tabs-active.faq-search-active .faq-extra-wrap {
    max-height: none;
    overflow: visible;
  }

  #faq.faq-tabs-active .faq-show-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: -moz-fit-content;
    width: fit-content;
    margin: 1.1rem auto 0;
    padding: 0.6rem 1.35rem;
    font-family: var(--font-sans);
    font-size: var(--text-sm);
    font-weight: var(--weight-semibold);
    color: #181b31;
    background: #fff;
    border: 1px solid #e3e7ee;
    border-radius: 999px;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: background-color var(--dur-base) ease, border-color var(--dur-base) ease;
  }

  #faq.faq-tabs-active .faq-show-more:hover {
    background: #f5f7fa;
    border-color: #d5dae2;
  }

  #faq.faq-tabs-active .faq-show-more-icon {
    font-size: 0.8em;
  }

  /* Hide the button once its group is expanded, or while searching. */
  #faq.faq-tabs-active .faq-show-more--gone,
  #faq.faq-tabs-active.faq-search-active .faq-show-more {
    display: none !important;
  }
}

/* Desktop: the wrapper must not affect layout — render as if it weren't there. */
@media (min-width: 768px) {
  #faq .faq-extra-wrap {
    display: contents;
  }
}

.megamenu .submenu-expander {
  display: none !important;
}

.mini-review-link {
  color: #737373;
}

.grecaptcha-badge,
.grecaptcha-logo {
  display: none !important;
}

.news-card-summary-icon {
  margin-left: -5px;
  margin-top: -2px;
}

/* Pricing table — topics toggle & writing package transitions */
.pricing-topics-header-cell {
  cursor: pointer;
  user-select: none;
}

.pricing-topics-header-cell:hover h5 {
  color: #0587ed;
}

.pricing-topics-toggle {
  display: inline-flex;
  align-items: center;
  margin-top: 0.75rem;
  padding: 0;
  border: 0;
  background: none;
  color: #0587ed;
  font-size: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: color var(--dur-fast, 160ms) ease, transform var(--dur-press, 140ms) cubic-bezier(0.23, 1, 0.32, 1);
}

.pricing-topics-toggle:hover {
  color: #0369b3;
}

.pricing-topics-toggle:active {
  transform: scale(0.98);
}

.pricing-topics-toggle-icon {
  margin-right: 0.65rem;
  transition: transform var(--dur-base, 200ms) cubic-bezier(0.23, 1, 0.32, 1);
}

.pricing-topics-toggle.is-expanded .pricing-topics-toggle-icon {
  transform: rotate(90deg);
}

#pricing-comparison-table tr.pricing-topic-extra,
#pricing-comparison-table tr.pricing-table-writing {
  transition:
    opacity 220ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 220ms cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: var(--pricing-stagger, 0ms);
}

#pricing-comparison-table tr.pricing-topic-extra:not(.is-visible),
#pricing-comparison-table tr.pricing-table-writing:not(.is-visible) {
  opacity: 0;
  transform: translateY(10px);
}

#pricing-comparison-table tr.pricing-topic-extra.is-visible,
#pricing-comparison-table tr.pricing-table-writing.is-visible {
  opacity: 1;
  transform: translateY(0);
}

#pricing-comparison-table tr.pricing-topic-extra.is-hiding,
#pricing-comparison-table tr.pricing-table-writing.is-hiding {
  opacity: 0;
  transform: translateY(10px);
}

.pricing-value {
  display: inline-block;
  transition:
    opacity 220ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 220ms cubic-bezier(0.23, 1, 0.32, 1);
}

.pricing-value.is-updating {
  opacity: 0;
  transform: translateY(6px);
}

.pricing-select-container .writing-package-btn-group label.btn {
  transition:
    background-color var(--dur-fast, 160ms) ease,
    border-color var(--dur-fast, 160ms) ease,
    color var(--dur-fast, 160ms) ease,
    transform var(--dur-press, 140ms) cubic-bezier(0.23, 1, 0.32, 1);
}

@media (prefers-reduced-motion: reduce) {
  #pricing-comparison-table tr.pricing-topic-extra,
  #pricing-comparison-table tr.pricing-table-writing,
  .pricing-value,
  .pricing-topics-toggle-icon,
  .carousel-logos a.news-outlet-chip,
  #news-carousel .news-outlet-scroller a.news-outlet-chip {
    transition: none !important;
    transform: none !important;
  }

  .carousel-logos a.news-outlet-chip:hover,
  #news-carousel .news-outlet-scroller a.news-outlet-chip:hover {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    border-color: #e5e7eb;
    color: #374151;
  }

  #pricing-comparison-table tr.pricing-topic-extra:not(.is-visible),
  #pricing-comparison-table tr.pricing-table-writing:not(.is-visible) {
    opacity: 1;
  }

  #pricing-comparison-table .tooltip .tooltiptext {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Pricing Table animation */
.fade-in {
  animation: fadeIn var(--dur-fast, 160ms) cubic-bezier(0.23, 1, 0.32, 1);
}

/* Keyframes for the fade-in animation */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media (max-width: 700px) {
  .pill-tabs {
    flex-direction: column;
    border: none !important;
  }

  #pill-container-1 input[id="radio-network-7"]:checked~.pill-glider {
    transform: translateX(0);
    transform: translateY(0);
  }

  #pill-container-1 input[id="radio-network-8"]:checked~.pill-glider {
    transform: translateX(0);
    transform: translateY(100%);
  }

  #pill-container-1 input[id="radio-network-9"]:checked~.pill-glider {
    transform: translateX(0);
    transform: translateY(200%);
  }

  #pill-container-1 input[id="radio-network-10"]:checked~.pill-glider {
    transform: translateX(0);
    transform: translateY(300%);
  }
}


@media screen and (min-width: 1200px) {
  .liquid-img-group-browser {
    /*
      margin-left: 0px !important;
    */
  }
}

@media screen and (min-width: 992px) {
  .stretch-to-right {
    margin-right: -23vw !important;
  }

  .case-study-picture {
    height: 236px;
  }

}

@media screen and (max-width: 991px) {
  .screenshot-arrow {
    display: none;
  }

  #wrap #hero-section {
    padding-top: 30px !important;
    padding-bottom: var(--section-py-tight) !important;
    margin-top: 0;
  }

  .how-it-works-heading {
    margin-bottom: var(--stack-gap);
  }

  .pro-pricing-option::before {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .flickity-page-dots {
    top: 9px;
    bottom: unset;
  }

  #header-carousel {
    margin-bottom: -35%;
  }

  .btn-xs-block {
    width: 100%;
    white-space: normal;
    margin-left: 0 !important;
    top: 0 !important;
    margin-bottom: 5px;
  }

  .btn-xs-block>span {
    width: 100%;
    -webkit-box-pack: center;
    justify-content: center;
  }

  .container {
    /*margin-bottom: 150px;*/
  }

  .pro-pricing-option::before {
    background-image: none !important;
  }

  .hide-on-mobile,
  .d-flex.hide-on-mobile {
    display: none !important;
  }

  h1,
  h2 {
    font-size: 30px !important;
  }

  .news-grid-shrink .iconbox {
    padding: 10px 10px !important;
    margin: 0 0 15px 0;
    min-height: 85px !important;
  }

  .news-grid-shrink .contents a img {
    height: auto;
    max-width: 100%;
    max-height: 62px;
  }

  .liquid-counter-element.counter-animated {
    font-size: 25px !important;
  }

  .liquid-counter-text.liquid-text-bottom {
    font-size: 15px !important;
  }

  .liquid-counter {
    margin-bottom: 0px;
  }

  .fs-xs-16 {
    font-size: 18px;
  }

  .append2 {
    display: none;
  }

  .how-it-works-content p {
    text-align: left !important;
  }

  .btn-mobile-block {
    display: block;
  }
}

/* Primary hero CTA ("See Press Packages"): full width across the whole mobile
   range. The width:100% rules below only applied <=475px, so on wider phones the
   inner pill span stayed content-width (a narrow, centered pill). */
@media (max-width: 767px) {
  .btn-mobile-block {
    display: block;
    width: 100%;
    margin-left: 0 !important;
  }

  .btn-mobile-block > span {
    display: block;
    width: 100%;
  }

  .btn-mobile-block .btn-txt {
    text-align: center;
  }
}

@media screen and (max-width: 475px) {
  .main {
    /*font-size: 11.9vw !important;*/
    font-size: 10.8vw !important;
  }

  .append {
    font-size: 8.9vw !important;
  }

  .btn-mobile-block {
    width: 100%;
    margin-bottom: 15px;
    margin-left: 0 !important;
  }

  .btn-mobile-block .btn-txt {
    text-align: center;
  }

  .btn-mobile-block span {
    width: 100%;
    display: block;
  }

  .text-center-xs {
    text-align: center;
  }

  #pill-container-2 {
    scale: 1.2;
  }

}

@media screen and (max-width: 1199px) and (min-width: 768px) {
  #hero-section {
    padding-top: 30px !important;
  }

  #wrap #hero-section {
    padding-bottom: 3rem !important;
    margin-bottom: 0 !important;
  }

  #hero-section .hero-layout-spacer {
    display: none !important;
  }

  #wrap #news-carousel {
    padding-top: var(--section-py-tight) !important;
  }

  #how-it-works {
    padding-top: var(--section-py) !important;
  }

  #how-it-works > .container > .row.mb-6,
  #how-it-works .how-it-works-layout {
    margin-bottom: var(--block-gap) !important;
    padding-bottom: 0 !important;
  }

  #how-it-works .how-it-works-layout > .mb-30 {
    margin-bottom: var(--stack-gap) !important;
  }

  #how-it-works .how-it-works-media .liquid-img-container-inner {
    margin-bottom: 0 !important;
  }

  #how-it-works .how-it-works-sample-row {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  #how-it-works .how-it-works-sample-card {
    width: 100%;
    max-width: 100%;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-bottom: var(--block-gap) !important;
    float: none !important;
  }

  #how-it-works .how-it-works-sample-card > .iconbox {
    margin-top: 0 !important;
    width: 100%;
  }

  #hero-section .hero-cta-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
  }

  #hero-section .hero-cta-group .btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    max-width: 100%;
    margin: 0 !important;
    float: none !important;
  }

  #hero-section .hero-cta-group .btn-video-explainer .btn-txt br {
    display: none;
  }

  #how-it-works .heading-label,
  #benefits .heading-label,
  #results .heading-label,
  #reviews .heading-label,
  #packages .heading-label,
  #case-studies .heading-label,
  #money-back-guarantee .heading-label,
  #official-reviews .heading-label {
    text-align: center !important;
  }
}

/* Mobile: section headers & eyebrow pills left-align (tablet/desktop center them).
   NB: content sections are siblings of #wrap, not descendants, so no #wrap prefix.
   The heading elements are targeted directly too, because some carry their own
   .text-center class that would otherwise beat the wrapper's alignment. The only
   two headings kept centered are the hero (excluded here) and the closing CTA
   "Stop Waiting to Be Noticed" (handled below). Testimonial video-card names are
   left centered on purpose — they're overlaid captions under a centered button. */
@media (max-width: 767px) {
  section[id]:not(#hero-section):not(#news-carousel) .fancy-heading,
  section[id]:not(#hero-section):not(#news-carousel) .fancy-title,
  section[id]:not(#hero-section):not(#news-carousel) .heading-label,
  section[id]:not(#hero-section):not(#news-carousel) .fancy-heading :is(h1, h2, h3, h4, h5, h6),
  section[id]:not(#hero-section):not(#news-carousel) .fancy-title :is(h1, h2, h3, h4, h5, h6),
  #results .results-formats-block h4 {
    text-align: left !important;
  }

  /* "Stop Waiting to Be Noticed" lives in the id-less .cta1 section, whose column
     carries text-left-mob (left-aligns <=550px). Force it back to centered. */
  .cta1 .lqd-column.text-left-mob {
    text-align: center !important;
  }

  /* Product Benefits: left-align the whole section header on mobile. The pill and
     heading are handled by the rule above, but the subtitle <p> carries its own
     .text-center and was still centered in the 551–767px range (where the
     text-left-mob helper stops applying). */
  #benefits header.fancy-title,
  #benefits header.fancy-title .heading-label,
  #benefits header.fancy-title h2,
  #benefits header.fancy-title p {
    text-align: left !important;
  }
}

@media screen and (max-width: 767px) {
  [data-mobile-header-scheme=gray] .main-header .navbar-header {
    background-color: #f0f3f5;
  }

  #homepage-video img {
    width: 100%;
  }

  #hero-section .hero-layout-spacer {
    display: none !important;
  }

  #wrap #hero-section {
    padding-bottom: var(--space-4) !important;
  }

  #wrap #how-it-works {
    padding-top: var(--space-4) !important;
  }

  #wrap #how-it-works .how-it-works-header-row > .lqd-column {
    padding-bottom: 0 !important;
  }

  #wrap #how-it-works .how-it-works-header {
    padding-bottom: var(--space-3) !important;
  }
}

/* Benefits: vertical stacked cards — MOBILE ONLY (desktop/tablet unchanged).
   NB: #benefits is a sibling of #wrap, not a descendant, so no #wrap prefix. */
@media screen and (max-width: 767px) {
  /* One section gutter so cards match the header width (row negative margins were
     letting .feature-box bleed to the viewport edges). */
  #benefits .container {
    padding-left: max(var(--space-6), env(safe-area-inset-left, 0px)) !important;
    padding-right: max(var(--space-6), env(safe-area-inset-right, 0px)) !important;
  }

  #benefits .container > .px-2 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #benefits .benefits-cards-scroll {
    display: block;
  }

  #benefits .benefits-cards-scroll > .row {
    display: block !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: var(--space-6) !important;
  }

  #benefits .benefits-cards-scroll > .row:last-child {
    margin-bottom: 0 !important;
  }

  #benefits .benefits-cards-scroll > .row > .lqd-column {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #benefits .benefits-cards-scroll .feature-box {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Mobile cards: show only the first bullet paragraph per card. */
  #benefits .benefits-cards-scroll .feature-box div.visible-xs > p ~ p {
    display: none !important;
  }
}

/* ==========================================================================
   Mobile uniformity pass — consistent ~24px horizontal gutter for text/cards.
   Mobile only; desktop untouched.
   ========================================================================== */
@media (max-width: 767px) {
  /* Hero: one uniform horizontal gutter from the container. Bootstrap row/col
     gutters were stacking with mixed px-1/px-3 on children, giving uneven
     left/right insets (especially on iOS where 100vw ≠ content width). */
  #hero-section > .container {
    padding-left: max(var(--space-6), env(safe-area-inset-left, 0px)) !important;
    padding-right: max(var(--space-6), env(safe-area-inset-right, 0px)) !important;
  }

  #hero-section > .container > .row,
  #hero-section > .container .row .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #hero-section > .container > .row > .lqd-column,
  #hero-section > .container .row .row > .lqd-column {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Per-element px-* is redundant once the container owns the gutter. */
  #hero-section .ld-fancy-heading.visible-xs,
  #hero-section p.lead.visible-xs,
  #hero-section ul.hero-benefits-list.visible-xs,
  #hero-section .liquid-img-group-img-container.visible-xs {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #hero-section ul.hero-benefits-list.visible-xs li + li {
    margin-top: var(--space-2);
  }

  /* Trustpilot clip used 100vw — wider than the content box on iOS and can
     force horizontal overflow that #hero-section clips asymmetrically. */
  #hero-section .hero-eyebrow-trustpilot-clip {
    width: 100%;
    max-width: 100%;
  }

  /* One-sided margins that pull hero copy off-center on small screens. */
  #hero-section .hero-cta-subtext {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  #hero-section .hero-review-copy {
    margin-right: 0 !important;
  }

  /* How It Works: match header + logo grid to one section gutter (the content
     column was stacking pl-4 + grid px-2, making logos look narrower/inset). */
  section#how-it-works.benefits1 {
    padding-left: max(var(--space-6), env(safe-area-inset-left, 0px)) !important;
    padding-right: max(var(--space-6), env(safe-area-inset-right, 0px)) !important;
  }

  #how-it-works .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #how-it-works .container > .row,
  #how-it-works .how-it-works-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #how-it-works .how-it-works-header-row > .lqd-column,
  #how-it-works .how-it-works-content-col {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #how-it-works .mobile-news-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Inner column gutters only — keeps the 3-up grid spacing without extra inset. */
  #how-it-works .mobile-news-grid > .col-xs-4 {
    padding-left: var(--space-2);
    padding-right: var(--space-2);
  }
}

/* ==========================================================================
   Reviews + Case Studies: reuse the Product Benefits horizontal card carousel
   (native scroll-snap + pagination dots) — MOBILE ONLY. Desktop/tablet keep
   their existing layouts (masonry reviews / side-by-side case studies).
   #reviews and #case-studies are siblings of #wrap, so no #wrap prefix.
   ========================================================================== */
@media screen and (max-width: 767px) {
  /* --- Verified Reviews: swap the arrow/transform carousel for native scroll --- */
  #reviews .reviews-carousel-ui {
    display: none !important; /* old prev/next arrows — replaced by dots */
  }

  #reviews .reviews-carousel-track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: var(--space-6) !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 0;
    margin: 0 !important;
    /* bottom padding gives the card shadow room (overflow-y clips at the edge) */
    padding: var(--space-3) 0 var(--space-4) !important;
    transform: none !important; /* neutralise any stale transform-carousel offset */
    scrollbar-width: none;
  }

  #reviews .reviews-carousel-track::-webkit-scrollbar {
    display: none;
  }

  /* JS pairs short reviews into vertical stacks (.reviews-scroll-col) so slide
     heights feel even next to tall single-review columns. */
  #reviews .reviews-scroll-col {
    flex: 0 0 88% !important;
    max-width: 88% !important;
    min-width: 88% !important;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    scroll-snap-align: start;
    scroll-snap-stop: always;
    margin: 0 !important;
  }

  #reviews .reviews-scroll-col .review-box {
    flex: 0 0 auto;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  /* Fallback before JS groups columns (no-JS / desktop resize). */
  #reviews .reviews-carousel-track > .review-box {
    flex: 0 0 88% !important;
    max-width: 88% !important;
    min-width: 88% !important;
    margin: 0 !important;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  #reviews .reviews-cards-shell + .cards-dots {
    margin-top: var(--space-2);
    margin-bottom: var(--space-6) !important;
  }

  /* --- Case Studies: same native card scroll for the visible cards --- */
  #case-studies .case-studies-cards {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: var(--space-4);
    overflow-x: auto !important;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 0;
    margin: 0 !important;
    padding: 0 0 var(--space-4) !important;
    scrollbar-width: none;
  }

  #case-studies .case-studies-cards::-webkit-scrollbar {
    display: none;
  }

  #case-studies .case-studies-cards > .lqd-column {
    flex: 0 0 85% !important;
    max-width: 85% !important;
    min-width: 85% !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    align-self: flex-start;
  }

  #case-studies .case-studies-cards > .lqd-column.hidden {
    display: none !important;
  }

  #case-studies .case-studies-cards .case-study-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100%;
    /* self-contained shadow so it isn't clipped by the scroller's overflow */
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.09) !important;
  }

  /* Tighten the gap between the section header and the card carousel. */
  #case-studies > .container:first-child .lqd-column {
    margin-bottom: var(--space-4) !important;
  }

  #case-studies header.fancy-title {
    margin-bottom: var(--space-2) !important;
    padding-bottom: 0 !important;
  }

  #case-studies > .container:last-of-type {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  #case-studies .cards-dots {
    margin-top: 0 !important;
  }

  /* --- Shared pagination dots (same look as the #benefits dots) --- */
  .cards-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-2);
    margin-bottom: var(--space-2);
    padding: 0;
  }

  .cards-dot {
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    padding: 0;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #d5dae2;
    cursor: pointer;
    transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1),
                background-color 0.45s ease, background-image 0.45s ease;
  }

  .cards-dot.is-active {
    width: 26px;
    background-image: linear-gradient(to right, #fe506c, #fc6a2a);
  }
}

/* Pagination dots are a mobile-only affordance. */
@media (min-width: 768px) {
  .cards-dots {
    display: none !important;
  }
}

/* Report & Results: balanced card padding + symmetric inner content on mobile */
@media (max-width: 767px) {
  #results .report-feature-box {
    /* Match the 32px top and bottom insets while keeping 24px side padding. */
    padding: var(--space-8) var(--space-6) !important;
    margin-top: 0 !important;
    transform: none !important;
  }

  #results .report-feature-box + .report-feature-box {
    margin-top: var(--space-6) !important;
  }

  /* Remove the scroll animation on these cards on mobile: neutralize the parallax
     drift on the card (transform set inline by the theme) and the inview fade/
     slide reveal applied to its contents, so they sit static and fully visible. */
  #results .report-feature-box > * {
    opacity: 1 !important;
    transform: none !important;
  }

  #results .report-feature-box > h3:first-child {
    margin-top: 0 !important;
  }

  #results .report-feature-box > *:last-child {
    margin-bottom: 0 !important;
  }

  #results .report-feature-box .reach-stats {
    margin-bottom: 0 !important;
  }

  #results .report-feature-box .reach-stats p {
    margin-bottom: 0 !important;
  }

  /* Placement logo grid: drop the desktop right padding so logos sit evenly */
  #results #placement-box {
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: var(--space-2) !important;
  }

  #results #placement-box > a {
    padding-left: var(--space-2) !important;
    padding-right: var(--space-2) !important;
  }

  /* "And 400+ more" — remove right padding so it centers under the grid */
  #results .report-feature-box p.text-light {
    padding-right: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Reach stats: tighten the oversized gap between the two figures */
  #results .reach-stats .reach-stat-col.mr-5 {
    margin-right: var(--space-5) !important;
  }

  #results .results-formats-block {
    display: none !important;
  }
}

/* Desktop: stagger-reveal the Guaranteed Placements logo cards when they scroll
   into view (driven by initPlacementCardsReveal in index-dev-perf.js, which adds
   .cards-reveal on desktop and .is-in-view once in view). #results sits well
   below the fold, so the hidden state is applied off-screen — no flash. Mobile,
   tablet, and no-JS just show the cards. Per-card stagger delay is set inline. */
@media (min-width: 992px) {
  /* Hidden state is instant (no transition) so applying it off-screen at load
     never animates; the transition lives on the revealed state so only the
     scroll-in reveal animates. Per-card stagger delay is set inline in JS. */
  #placement-box.cards-reveal > a {
    opacity: 0;
    transform: translateY(16px);
  }

  #placement-box.cards-reveal.is-in-view > a {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.35s var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
                transform 0.35s var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
  }
}

@media (prefers-reduced-motion: reduce) {
  #placement-box.cards-reveal > a {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Mobile: hide the comparison-table section (goes packages -> money-back guarantee) */
@media (max-width: 767px) {
  #pricing {
    display: none !important;
  }
}

/* Mobile: hide the Package Addons block ("Supercharge Your Results") */
@media (max-width: 767px) {
  #package-addons {
    display: none !important;
  }
}

@media screen and (max-width: 414px) {
  .block-center-414 {
    display: block;
    margin-bottom: 10px;
    text-align: center;
    width: 100%;
    margin-left: 0px !important;
  }

  .block-center-414 span,
  .block-center-414 h6 {
    margin-left: 0 !important;
  }

}

@media screen and (min-width: 768px) {
  .benefits-image-tablet {
    transform: translateY(0px);
    opacity: 1;
    float: left;
    width: 40%;
    margin-right: var(--space-6);
    position: relative;
    margin-bottom: var(--block-gap) !important;
  }
}

@media screen and (min-width: 550px) {
  .mobile-news-logo {
    padding: 2em !important;
  }
}


/* ==========================================================================
   Mobile header: fixed overlay + auto-hide on scroll-down / reveal on scroll-up.
   Scoped to the mobile-nav breakpoint (<=1199); desktop (>=1200) is untouched
   and keeps its separate .is-sticky behavior.
   ========================================================================== */
@media (max-width: 1199px) {
  .main-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1001;
    transition: transform 0.32s cubic-bezier(0.22, 0.61, 0.36, 1);
    will-change: transform;
  }

  .main-header.m-nav-hidden {
    transform: translateY(-100%);
  }

  /* Reserve space for the fixed header so the hero isn't hidden behind it */
  #wrap {
    padding-top: var(--m-header-h, 73px);
  }

  html {
    scroll-padding-top: var(--m-header-h, 73px);
  }

  /* Keep the header behind open modals (override the desktop z-index bump) */
  html.lity-active .main-header,
  body:has(.fr-window) .main-header {
    z-index: 1001 !important;
  }
}

@media screen and (max-width: 1199px) {
  [data-mobile-header-scheme=gray] .main-header .navbar-header {
    background-color: #f5f7fa;
  }

  [data-mobile-nav-style=classic] .navbar-collapse,
  [data-mobile-nav-style=minimal] .navbar-collapse {
    max-height: 100vh;
  }

  .pricing-select-container .btn-group .btn {
    width: 100%;
    border-radius: var(--radius-md);
    margin-left: 0px;
    border-left: 1px solid #0587ed;
  }
}


@media screen and (min-width: 1200px) {
  #hero-section .custom-shape-divider-bottom-1621016099 {
    bottom: -2rem;
  }

  #wrap #hero-section {
    padding-bottom: 5.5rem !important;
  }

  #hero-section .hero-layout-spacer {
    padding-bottom: 3rem;
  }

  .is-stuck {
    background-color: rgb(245 247 250);
    box-shadow: none;
    -webkit-backdrop-filter: unset;
    backdrop-filter: blur(20px) saturate(180%);
  }
}

@media print {

  .no-print,
  .inline-nav,
  .logo-default,
  .logo-dark {
    display: none !important;
  }
}

/* ==========================================================================
   Design system — unified radius + section rhythm (index-dev homepage)
   Scale: sm 4 | md 6 | lg 8 | xl 12 | 2xl 16 | full pill
   Roles: --radius-surface (cards/media) · --radius-control (buttons/nested)
          · --radius-pill (chips/eyebrows/circle CTAs)
   Concentric rule: inner radius = outer radius − padding
   ========================================================================== */

/* Legacy theme utilities → token scale */
.border-radius-6 { border-radius: var(--radius-md) !important; }
.border-radius-8 { border-radius: var(--radius-control) !important; }
.border-radius-18 { border-radius: var(--radius-surface) !important; }
.radius-surface { border-radius: var(--radius-surface) !important; }
.radius-control { border-radius: var(--radius-control) !important; }
.radius-pill { border-radius: var(--radius-pill) !important; }

.circle,
.heading-label .circle,
.heading-label span.bg-white,
.heading-label.bg-white {
  border-radius: var(--radius-pill) !important;
}

.heading-label span.bg-white,
.heading-label.bg-white {
  display: inline-block;
  width: auto;
  max-width: 100%;
}

/* ── Tier 1: surfaces (16px) — cards, images, panels, hero media, modals ── */
#wrap .hero-video-container,
#wrap .hero-video,
#wrap #homepage-video,
#wrap #homepage-video img,
#wrap picture.border-radius-18,
#wrap img.border-radius-18,
#wrap video.border-radius-18,
#wrap .review-box,
#wrap .fancy-box-travel,
#wrap .fancy-box-travel .fancy-box-image,
#wrap .fancy-box-travel .fancy-box-contents,
#wrap .fancy-box-travel .cb-img-container,
#wrap .liquid-img-group-container,
#wrap .liquid-img-group-img-container,
#wrap .liquid-img-container-inner,
#wrap .review-container .liquid-img-group-img-container,
#wrap .review-container .liquid-img-container-inner,
#wrap picture.iconbox-round,
#wrap .review-container picture,
#wrap .review-container picture img,
#wrap .feature-box,
#wrap .report-feature-box,
#wrap .iconbox.light-grey-border,
#wrap .iconbox.iconbox-shadow,
#wrap .iconbox.iconbox-logo,
#wrap .iconbox.border-radius-8,
#wrap .iconbox.border-radius-18,
#wrap .testimonial.iconbox,
#wrap .iconbox-pricing,
#wrap .iconbox-filled.iconbox-lg,
#wrap #pricing-comparison-table,
#wrap .pricing-table,
#wrap .progress.bg-gray,
#wrap .ai-answer-card.ai-chatgpt-window,
#wrap .lqd-modal-inner,
#wrap .lqd-modal-content,
#wrap #exit-popup,
#wrap #modal-join-newsletter,
#wrap #modal-bulk-prices .lqd-modal-inner,
#wrap .lity-content .lqd-modal-sticky-foot {
  border-radius: var(--radius-surface) !important;
}

/* Clip media to rounded corners */
#wrap .hero-video-container,
#wrap .hero-video,
#wrap #homepage-video,
#wrap #homepage-video img,
#wrap picture.border-radius-18,
#wrap picture.iconbox-round,
#wrap .review-container picture,
#wrap .review-container picture img,
#wrap .liquid-img-group-container,
#wrap .liquid-img-group-img-container,
#wrap .liquid-img-container-inner,
#wrap .review-container .liquid-img-group-img-container,
#wrap .review-container .liquid-img-container-inner,
#wrap .fancy-box-travel .fancy-box-image,
#wrap .case-study-picture,
#wrap [data-roundness="8"] .liquid-img-group-img-container,
#wrap [data-roundness="8"] .liquid-img-container-inner {
  overflow: hidden;
}

/* ── Tier 2: controls (8px) — buttons, inputs, nested thumbs ── */
#wrap .btn:not(.circle),
#wrap .buy-now-button,
#wrap .iconbox.light-grey-border .btn:not(.circle),
#wrap .case-study-picture,
#wrap .case-study-picture img,
#wrap .review-favicon,
#wrap .review-box img.review-favicon,
#wrap .gdpr_checkbox,
#wrap input[type="text"],
#wrap input[type="email"],
#wrap input[type="password"],
#wrap input[type="search"],
#wrap input[type="tel"],
#wrap input[type="url"],
#wrap textarea,
#wrap select,
#wrap .email-field,
#wrap .form-control,
#wrap .megamenu-badge-popular,
#wrap .news-list-table {
  border-radius: var(--radius-control) !important;
}

/* Nested images inside padded iconboxes (concentric: 16 − 8 = 8) */
#wrap .iconbox.light-grey-border > a > img,
#wrap .iconbox.light-grey-border > a.btn > img,
#wrap .iconbox.light-grey-border img:not(.hero-benefit-tick),
#wrap .iconbox.light-grey-border img.case-study-picture {
  border-radius: var(--radius-control) !important;
}

/* Hero benefit ticks: green check icons (same as the pricing-card ticks),
   replacing the old brandpush-tick images. */
i.hero-benefit-tick {
  margin: 0 0.5rem 0 0;
  padding: 0;
  font-size: 1.15em;
  vertical-align: -0.1em;
}

/* ── Tier 3: pills — eyebrows, chips, circle CTAs, badges ── */
#wrap .btn.circle,
#wrap .pricing-most-popular-badge,
#wrap .pricing-most-popular-badge--notch,
#wrap .ai-chatgpt-source-chip,
#wrap .ai-chatgpt-composer,
#wrap .news-outlet-chip,
#wrap .review-tag,
#wrap .review-card-package,
#wrap .badge-pill,
#wrap #hero-section .badge-pill,
#wrap .nav.tabs-nav li.active a {
  border-radius: var(--radius-pill) !important;
}

/* Buttons: no leading chevrons (plain links keep theirs; carousel arrows unaffected) */
#wrap .btn .fa-chevron-right,
#wrap .btn > .fa-chevron-right,
#wrap button.btn .fa-chevron-right {
  display: none !important;
}

/* Modals opened via Lity (may render outside section flow) */
.lity-opened .lity-wrap .lity-container,
.lity-content:has(.lqd-modal-sticky-foot),
.lity-opened .lity-wrap .lity-container:has(.lqd-modal-sticky-foot) {
  border-radius: var(--radius-surface) !important;
  overflow: hidden;
}

.lity-content .lqd-modal-sticky-foot {
  border-radius: var(--radius-surface);
}

/* Close buttons stay circular */
.modal-inline-close,
.video-modal-close,
.fr-window .fr-close-outside,
.fr-window .fr-close-fullclick {
  border-radius: 50% !important;
}

/* Avatars & star icons — intentional exceptions */
#wrap .review-box img:not(.review-favicon):not(.star-rating):not(.yellow-star-rating-heading),
#wrap .hero-review-avatar,
#wrap .inline-circle img {
  border-radius: 50%;
}

#wrap .review-box img.star-rating,
#wrap .review-box img.yellow-star-rating-heading {
  border-radius: 0 !important;
}

/* Homepage section rhythm */
#wrap > section[id] {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#wrap > section[id]:not(#hero-section):not(#how-it-works-legacy) {
  padding-top: var(--section-py) !important;
  padding-bottom: var(--section-py) !important;
  overflow: visible !important;
}

#wrap #hero-section {
  padding-bottom: clamp(2.5rem, 5vw, 4rem) !important;
  margin-bottom: 0 !important;
}

@media screen and (max-width: 767px) {
  /* Hero → News Outlets: section rhythm (--section-py) was adding too much gap on mobile */
  #wrap > section#hero-section.vc_row {
    padding-bottom: var(--space-5) !important;
  }

  /* Mobile: drop the bg-1.svg diagonal (its gray blob cut across / above the
     review at some widths). Solid gray keeps the whole hero — including the
     review — on the hero background, so the gray→white divider falls cleanly
     below the review at the section boundary. */
  #wrap #hero-section {
    background-image: none;
  }

  /* #how-it-works is a sibling of #wrap (not a descendant), so no #wrap prefix.
     Adds breathing room above the header so it isn't tight against the hero/review. */
  section#how-it-works.benefits1 {
    padding-top: var(--space-8) !important;
  }
}

/* ==========================================================================
   Mobile: uniform section rhythm.
   Every content section is a direct child of <body> (not inside #wrap), so the
   #wrap-scoped rhythm rules above never matched them — each section fell back to
   its own assorted theme padding/margins, giving uneven gaps (0–128px) and
   uneven space above headers (0–72px). Give every content section the same
   vertical padding so the space above each header (~32px) and between sections
   (~64px) is consistent. Hero (in #wrap) and the hidden logo/pricing strips are
   excluded; the footer (id-less sections) is untouched.
   ========================================================================== */
@media (max-width: 767px) {
  body > section[id]:not(#news-carousel):not(#pricing),
  body > section.cta1.vc_row {
    padding-top: var(--space-8) !important;
    padding-bottom: var(--space-8) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Reviews header carries a -30px top margin (used to overlap a preceding
     element on desktop); on mobile it crams the header against the top edge, so
     reset it to sit at the section padding like every other header. */
  #reviews .fancy-title {
    margin-top: 0 !important;
  }

  /* Recommendations header row adds an extra 24px (.pt-4) on top of the section
     padding; drop it so the header aligns with the others. */
  #recommendations > .container > .row:first-of-type {
    padding-top: 0 !important;
  }
}

#wrap #news-carousel,
#wrap #official-reviews {
  padding-top: var(--section-py-tight) !important;
  padding-bottom: var(--section-py) !important;
}

/* Sections with bottom wave dividers — crest + shadow clearance (desktop only; dividers hidden below 992px) */
@media (min-width: 992px) {
  #wrap > section[id]:has(> .custom-shape-divider-bottom-1621016099) {
    padding-bottom: var(--section-divider-inset) !important;
    overflow: visible !important;
  }

  /* Tighter top on sections that follow a wave — avoids double band of whitespace */
  #wrap > section[id]:has(> .custom-shape-divider-bottom-1621016099) + section[id]:not(#hero-section):not(#how-it-works-legacy) {
    padding-top: var(--section-py-tight) !important;
  }

  #wrap > section[id]:has(> .custom-shape-divider-bottom-1621016099) > .container {
    position: relative;
    z-index: 2;
    overflow: visible;
    padding-bottom: var(--space-2);
  }

  #wrap > section[id]:has(> .custom-shape-divider-bottom-1621016099) .row,
  #wrap > section[id]:has(> .custom-shape-divider-bottom-1621016099) .news-grid {
    overflow: visible;
  }

  #wrap > section[id]:has(> .custom-shape-divider-bottom-1621016099) > .custom-shape-divider-bottom-1621016099 {
    z-index: 1;
    pointer-events: none;
  }

  #wrap #hero-section:has(> .custom-shape-divider-bottom-1621016099) {
    padding-bottom: calc(clamp(2.5rem, 5vw, 4rem) + var(--section-divider-crest)) !important;
  }
}

/* Shadow-bearing cards must not clip their own drop shadow */
#wrap .iconbox.iconbox-shadow,
#wrap .iconbox.light-grey-border.iconbox-shadow,
#wrap #packages .iconbox-pricing,
#wrap #case-studies .iconbox.light-grey-border,
#wrap .news-grid .iconbox.iconbox-shadow,
#wrap #pricing .iconbox.iconbox-shadow {
  overflow: visible !important;
}

#wrap .iconbox.iconbox-shadow > .contents,
#wrap .iconbox.light-grey-border.iconbox-shadow > .contents {
  overflow: hidden;
  border-radius: inherit;
}

#wrap .liquid-img-group-single[data-shadow-style] .liquid-img-group-img-container,
#wrap .review-preview-stage .liquid-img-group-img-container {
  overflow: visible !important;
}

/* Last content blocks before wave dividers */
@media (min-width: 992px) {
  #wrap #results .results-formats-block {
    padding-bottom: var(--space-10);
    margin-bottom: var(--space-4);
  }

  #wrap #packages .news-grid {
    padding-bottom: var(--section-shadow-bleed);
    margin-bottom: var(--space-4);
  }

  #wrap #case-studies > .container:last-of-type {
    padding-bottom: var(--section-shadow-bleed);
  }

  #wrap #money-back-guarantee > .container {
    padding-bottom: var(--space-8);
  }

  #wrap #pricing > .container {
    padding-bottom: var(--section-shadow-bleed);
  }
}

/* Comparison table → agency / credit-pack cards: padding avoids margin collapse + shadow bleed */
#wrap #pricing .pricing-table-row {
  padding-bottom: var(--space-4);
}

#wrap #pricing #pricing-comparison-table {
  margin-bottom: 0 !important;
}

#wrap #pricing .pricing-upsell-row {
  margin-top: 0 !important;
  padding-top: calc(var(--space-10) + var(--section-shadow-bleed)) !important;
}

/* #pricing is a body-level sibling of #wrap on index-dev.php. */
@media (min-width: 992px) {
  #pricing .pricing-upsell-row {
    margin-top: 0 !important;
    padding-top: var(--space-8) !important;
  }
}

#wrap #pricing {
  padding-bottom: calc(var(--section-py) + var(--section-shadow-bleed)) !important;
}

/* Recommendations → case studies: no wave between; extra clearance for card shadows */
#wrap #recommendations {
  padding-bottom: calc(var(--section-py) + var(--section-shadow-bleed)) !important;
}

#wrap #recommendations + #case-studies {
  padding-top: var(--section-py-tight) !important;
}

#wrap #recommendations .fancy-title.mb-40 {
  margin-bottom: var(--header-gap) !important;
}

#wrap #case-studies header.fancy-title.mb-md-50,
#wrap #case-studies header.fancy-title {
  margin-bottom: var(--header-gap) !important;
}

#wrap #money-back-guarantee .btn {
  margin-bottom: var(--space-2);
}

/* Container gutters — consistent horizontal inset */
#wrap > section[id] .container {
  padding-left: var(--space-4);
  padding-right: var(--space-4);
}

@media (min-width: 768px) {
  #wrap > section[id] .container {
    padding-left: var(--space-6);
    padding-right: var(--space-6);
  }
}

@media (min-width: 992px) {
  #wrap > section[id] .container {
    padding-left: var(--space-8);
    padding-right: var(--space-8);
  }
}

/* Section headers — eyebrow → title → lead → content */
#wrap .fancy-heading,
#wrap .fancy-title {
  margin-bottom: var(--header-gap) !important;
}

#wrap .heading-label {
  margin-bottom: var(--stack-gap) !important;
}

#wrap .heading-label span.bg-white {
  margin-bottom: 0 !important;
}

#wrap .fancy-heading h2,
#wrap .fancy-title h2,
#wrap header.fancy-title h2 {
  margin-top: 0 !important;
  margin-bottom: var(--stack-gap) !important;
}

/* Eyebrow pill → section title: match How it Works rhythm */
#wrap section[id]:not(#hero-section):not(#news-carousel) .fancy-heading .heading-label + h2,
#wrap section[id]:not(#hero-section):not(#news-carousel) .fancy-title .heading-label + h2 {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (min-width: 768px) {
  #wrap section[id]:not(#hero-section):not(#news-carousel) .fancy-heading .heading-label + h2,
  #wrap section[id]:not(#hero-section):not(#news-carousel) .fancy-title .heading-label + h2 {
    padding-top: var(--space-2) !important;
  }
}

#wrap .fancy-heading > .lead,
#wrap .fancy-title > .lead,
#wrap .fancy-heading p.lead,
#wrap .fancy-title p.lead,
#wrap header.fancy-title p.lead,
#wrap header.fancy-heading + p.lead,
#wrap header.fancy-title + p.lead,
#wrap h2 + p.lead,
#wrap h3 + p.lead {
  margin-top: 0 !important;
  margin-bottom: var(--header-gap) !important;
}

/* Rows inside sections */
#wrap > section[id] .container > .row {
  margin-bottom: var(--block-gap);
}

#wrap > section[id] .container > .row:last-child {
  margin-bottom: 0;
}

/* Hero internal rhythm */
#wrap #hero-section .hero-eyebrow-wrap {
  margin-bottom: calc(var(--space-6) + 0.125rem) !important;
}

#wrap #hero-section .hero-headline {
  margin-top: 0 !important;
  margin-bottom: var(--space-3) !important;
  padding-top: 0 !important;
}

#wrap #hero-section .hero-subheading {
  margin-top: var(--space-3) !important;
  margin-bottom: var(--space-4) !important;
}

#wrap #hero-section .hero-benefits-list {
  margin-top: 0;
  margin-bottom: var(--space-5);
}

@media (min-width: 768px) {
  #hero-section .hero-benefits-list li + li {
    margin-top: var(--space-1);
  }
}

#wrap #hero-section .hero-cta-subtext {
  margin-bottom: var(--space-4) !important;
}

#wrap #hero-section .heading-label {
  margin-bottom: var(--space-4) !important;
}

/* Cards & feature blocks */
#wrap .feature-box,
#wrap .report-feature-box {
  margin-bottom: var(--block-gap) !important;
  padding: var(--space-8) var(--space-8) var(--space-6);
  border-radius: var(--radius-surface);
  overflow: visible;
}

#wrap .iconbox.light-grey-border:not(.testimonial) {
  margin-bottom: var(--card-gap);
}

#wrap .testimonial.iconbox {
  margin-bottom: var(--card-gap) !important;
}

#wrap #case-studies .iconbox.light-grey-border {
  margin-bottom: var(--card-gap);
}

#wrap #case-studies .case-study-card {
  position: relative;
  cursor: pointer;
}

#wrap #case-studies .case-study-card .liquid-overlay-link {
  border-radius: inherit;
}

/* Case study cards: the emphasis line uses .h5 (700 weight) — dial it back to
   600 per request. Scoped to .case-study-card (no #wrap/#case-studies prefix,
   since #case-studies sits outside #wrap) so it reliably applies. */
.case-study-card .text-primary {
  font-weight: 600;
}

/* Card hover-grow is provided by the shared .iconbox-hover-zoom class (same as
   the pricing cards). The full-card overlay <a> means the CTA's own :hover can
   never fire, so drive the button highlight from the card hover instead — with
   a transition so it animates smoothly rather than snapping. */
@media (hover: hover) and (pointer: fine) {
  .case-study-card .btn-white-blue {
    transition: background-color var(--dur-base) var(--ease-out),
                color var(--dur-base) var(--ease-out);
  }

  .case-study-card:hover .btn-white-blue {
    background: #0287ed;
    color: #fff;
  }
}

#wrap #packages .iconbox-pricing {
  margin-bottom: var(--card-gap);
}

/* Benefit / feature rows */
#wrap #benefits .row.d-flex.flex-wrap.align-items-center,
#wrap #benefits .row[id],
#wrap #how-it-works .how-it-works-layout,
#wrap #how-it-works .how-it-works-item,
#wrap #how-it-works .how-it-works-sample-row,
#wrap #results .row,
#wrap #recommendations .row,
#wrap #case-studies .row,
#wrap #reviews .row,
#wrap #packages .row {
  margin-bottom: var(--block-gap) !important;
}

/* NB: #packages is a sibling of #wrap (not a descendant), so the previous
   `#wrap #packages ...` prefix never matched and this styling — including the
   icon's margin-top nudge — wasn't applying. */
#packages .packages-delivery-copy-inner {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

#packages .packages-delivery-copy-icon {
  height: 26px;
  width: 26px;
  margin-top: -5px;
  flex-shrink: 0;
  display: block;
}

/* Mobile: slightly smaller delivery line + icon (icon shown at a reduced size). */
@media (max-width: 767px) {
  #packages .packages-delivery-copy {
    font-size: 17px;
    line-height: 1.5;
  }

  #packages .packages-delivery-copy-icon {
    display: block;
    height: 22px;
    width: 22px;
    margin-top: -2px;
  }
}

/* ==========================================================================
   Mobile pricing cards (<=767px): full-width, KPI-forward layout.
   Desktop/tablet keep the original card design untouched.
   ========================================================================== */

/* Mobile-only pieces stay hidden on desktop/tablet. */
#packages .pricing-kpis,
#packages .pricing-cta-mobile,
#packages .pricing-foot-mbg {
  display: none;
}

@media (max-width: 767px) {
  /* Hide the desktop pieces we relocate/replace on mobile. */
  #packages .pricing-hide-mob {
    display: none !important;
  }

  /* Cards stack full width — don't stretch to equal height. */
  #packages .col-sm-6.col-md-3.d-flex {
    flex: 0 0 100%;
    max-width: 100%;
    align-items: flex-start !important;
  }

  #packages .iconbox-pricing.d-flex.flex-column {
    height: auto !important;
  }

  #packages .iconbox-pricing .flex-grow-1 {
    flex-grow: 0 !important;
  }

  /* Three headline KPI tiles: Placements / Monthly Reach / Max DA. */
  #packages .pricing-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-2);
    margin: 0 0 var(--space-4);
  }

  #packages .pricing-kpi {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
    padding: var(--space-3) var(--space-2);
    text-align: center;
    background: var(--light);
    border: 1px solid rgba(29, 29, 29, 0.06);
    border-radius: var(--radius-lg);
  }

  #packages .pricing-kpi-label {
    font-size: 10px;
    line-height: 1.2;
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--color-text-muted);
  }

  #packages .pricing-kpi-value {
    margin-top: auto;
    font-size: var(--text-xl);
    line-height: 1.1;
    font-weight: var(--weight-bold);
    color: var(--color-text);
  }

  /* Full-width CTA sits below the stats (like the reference layout). */
  #packages .pricing-cta-mobile {
    display: block;
    width: 100%;
    margin-bottom: 0;
  }

  /* Footer: sample-report button below the CTA (no mt-auto gap). */
  #packages .pricing-card-foot {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: var(--space-3);
    width: 100%;
    margin-top: var(--space-3) !important;
  }

  /* Money-back guarantee — top-right label aligned with the header row. */
  #packages .iconbox-pricing {
    position: relative;
  }

  #packages .pricing-foot-mbg {
    display: inline-flex;
    align-items: center;
    position: absolute;
    top: var(--space-6);
    right: var(--space-6);
    z-index: 3;
    margin: 0;
    padding: 6px 12px;
    font-size: 10px;
    font-weight: var(--weight-semibold);
    line-height: 1.4;
    white-space: nowrap;
    color: #1d1d1d;
    background: #fff;
    border: 1px solid rgba(29, 29, 29, 0.08);
    border-radius: var(--radius-pill);
    box-shadow: none;
    text-decoration: none;
  }

  /* Growth card: show "Popular" (not "Most Popular") on mobile. */
  #packages .pricing-most-popular-badge--card .pricing-popular-full {
    display: none !important;
  }

  #packages .pricing-most-popular-badge--card .pricing-popular-short {
    display: inline !important;
  }

  /* Growth's "Popular" pill sits inline by the plan name so it clears the
     top-right money-back label. */
  #packages .iconbox-pricing .p-4 > div:first-child {
    align-items: center;
    column-gap: var(--space-2);
  }

  #packages .iconbox-pricing .p-4 > div:first-child h4 {
    width: auto !important;
    flex: 0 1 auto;
  }

  #packages .pricing-most-popular-badge--card {
    margin: 0 !important;
  }

  /* View Sample Report — white secondary button matching the Get Started CTA. */
  #packages .pricing-sample-report-link {
    display: block;
    width: 100%;
    padding: 0.4rem 1rem;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
    color: var(--color-text, #1d1d1d) !important;
    background: #fff;
    border: 1px solid #ededed;
    border-radius: var(--radius-control, 8px);
    box-shadow: none;
  }

  #packages .pricing-sample-report-link i {
    display: none !important;
  }

  /* Trim the gap below the feature list. */
  #packages .iconbox-pricing ul {
    margin-bottom: var(--space-2) !important;
  }
}

/* Tablet/desktop pricing cards: anchor the sample-report action at the card
   bottom and give it the same horizontal inset as the primary CTA. */
@media (min-width: 768px) {
  #packages .iconbox-pricing .flex-grow-1 {
    flex: 1 1 auto !important;
  }

  #packages .pricing-card-foot {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: auto !important;
  }

  #packages .pricing-sample-report-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 38px;
    padding: 0 1rem;
    box-sizing: border-box;
    color: var(--color-text, #1d1d1d) !important;
    background: #fff;
    border: 1px solid #ededed;
    border-radius: var(--radius-control, 8px);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    box-shadow: none;
  }
}

#wrap .secure-checkout-lock-icon {
  height: 22px;
  width: auto;
  vertical-align: -0.3em;
  margin-right: 0.125rem;
}

#wrap .cta1 .cta-delivery-copy {
  margin-top: 0.25rem;
  font-size: var(--text-base, 1rem);
  line-height: var(--leading-snug, 1.375);
}

#wrap .reach-stats .reach-stat-number {
  display: inline-block;
}

#wrap .reach-stats.is-inview .reach-stat-number {
  animation: reachStatIn 560ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)) both;
}

#wrap .reach-stats.is-inview .reach-stat-col:nth-child(2) .reach-stat-number {
  animation-delay: 110ms;
}

@keyframes reachStatIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  #wrap .reach-stats.is-inview .reach-stat-number {
    animation: none;
  }
}

@media (min-width: 1200px) {
  #wrap .cta1 .btn.btn-gradient {
    min-width: 12.5rem;
    padding-left: var(--space-8);
    padding-right: var(--space-8);
  }
}

#wrap #how-it-works .how-it-works-header-row {
  margin-bottom: 0 !important;
}

#wrap #how-it-works .how-it-works-header {
  margin-bottom: 0 !important;
  padding-bottom: var(--space-6);
}

#wrap #how-it-works {
  padding-bottom: calc(var(--section-py) + var(--space-12) + var(--space-12) + var(--space-12) + var(--space-10)) !important;
}

@media (min-width: 992px) {
  #wrap #how-it-works {
    padding-bottom: calc(var(--section-divider-inset) + var(--space-12) + var(--space-12) + var(--space-12) + var(--space-12) + var(--space-10)) !important;
  }

  #wrap #how-it-works > .container {
    padding-bottom: calc(var(--space-12) + var(--space-12));
  }
}

.how-it-works-layout {
  margin-top: 0;
}

.how-it-works-media-col {
  display: flex;
  justify-content: center;
}

.how-it-works-media {
  width: 100%;
  max-width: 555px;
  margin-left: auto;
  margin-right: auto;
}

.how-it-works-media .liquid-img-group-img-container {
  cursor: pointer;
}

.how-it-works-media .liquid-img-group-content {
  pointer-events: none;
}

.how-it-works-media .hover-glow {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.how-it-works-media .liquid-img-group-img-container:hover .hover-glow,
.how-it-works-media .liquid-img-group-img-container:focus-within .hover-glow {
  box-shadow: 0 0 15px rgb(254 81 107), 0 0 25px rgb(254 81 107 / 60%);
  transform: scale(1.05);
}

.how-it-works-media .how-it-works-video-trigger {
  border-radius: inherit;
}

/* Mobile hero review video: whole thumbnail is the tap target */
#hero-section .liquid-img-group-img-container.visible-xs {
  position: relative;
  cursor: pointer;
}

#hero-section .liquid-img-group-img-container.visible-xs .liquid-img-group-content {
  pointer-events: none;
}

#hero-section .hero-mobile-video-trigger {
  border-radius: inherit;
}

.how-it-works-subhead {
  margin-bottom: var(--stack-gap) !important;
}

#wrap #how-it-works .how-it-works-subhead h3 {
  margin-bottom: 0 !important;
}

.how-it-works-actions {
  margin-top: var(--header-gap);
}

#wrap #how-it-works .how-it-works-cta-row {
  margin-top: var(--space-8);
  padding-bottom: calc(var(--space-12) + var(--space-8));
}

#wrap #how-it-works .how-it-works-cta-row .how-it-works-actions {
  margin-top: 0;
}

@media (min-width: 992px) {
  #wrap #how-it-works .how-it-works-cta-row {
    margin-top: var(--space-10);
    padding-bottom: 10rem;
  }
}

.how-it-works-trustpilot {
  margin-top: var(--space-4);
  max-width: 100%;
}

.how-it-works-trustpilot iframe {
  max-width: 100%;
}

#wrap #benefits header.fancy-title .heading-label {
  display: block !important;
  width: fit-content;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}

@media (max-width: 767px) {
  #wrap #benefits header.fancy-title .heading-label {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left;
  }
}

#wrap #benefits #ai-authority-framework {
  padding-top: var(--section-py) !important;
  padding-bottom: var(--space-10) !important;
  margin-top: var(--block-gap) !important;
  margin-bottom: 0 !important;
  position: relative;
  z-index: 2;
}

#wrap #benefits #ai-authority-framework .ai-authority-header {
  padding-top: var(--header-gap);
  padding-bottom: var(--space-6);
}

#wrap #benefits #ai-authority-framework .ai-authority-layout {
  margin-top: 0;
  margin-bottom: 0 !important;
}

@media (min-width: 992px) {
  #wrap #how-it-works .how-it-works-header {
    padding-bottom: var(--space-8);
  }

  #wrap #benefits #ai-authority-framework .ai-authority-header {
    padding-bottom: var(--space-8);
  }

  #wrap #benefits #ai-authority-framework .ai-authority-card-col {
    padding-bottom: var(--space-2);
  }
}

#wrap .ai-authority-signals {
  gap: var(--header-gap);
}

#wrap #how-it-works .how-it-works-steps {
  margin-bottom: 0;
}

#wrap #how-it-works .how-it-works-cta {
  text-align: center;
  margin-top: 0;
}

@media (min-width: 992px) {
  #how-it-works .how-it-works-layout {
    align-items: center !important;
  }

  #how-it-works .how-it-works-media-col {
    justify-content: flex-end;
    padding-right: 1rem;
  }

  #how-it-works .how-it-works-media-col .how-it-works-media {
    margin-left: auto;
    margin-right: 0;
    max-width: 720px;
  }

  #how-it-works .how-it-works-media .liquid-img-container-inner {
    max-width: 720px;
    margin-left: auto;
    margin-right: 0;
  }

  #how-it-works .how-it-works-media .liquid-img-container-inner picture,
  #how-it-works .how-it-works-media .liquid-img-container-inner img {
    width: 100%;
    height: auto;
  }

  #how-it-works .how-it-works-content-col {
    padding-left: 2.75rem !important;
  }

  #wrap #how-it-works .how-it-works-subhead {
    margin-bottom: var(--space-5) !important;
  }

  #wrap #how-it-works .how-it-works-trustpilot {
    margin-top: var(--space-4);
  }
}

/* Testimonial / review grids */
#wrap #recommendations {
  overflow: visible !important;
}

#wrap #recommendations > .container {
  overflow: visible;
}

#wrap #recommendations .review-container,
#wrap #recommendations .lqd-column.review-container {
  margin-bottom: var(--card-gap);
}

@media (max-width: 767px) {
  /* Mobile reviews carousel: the PLAY button sat flush against the name (0px),
     while name→subtitle was 8px. The caption block is bottom-anchored, so a
     top margin on the name lifts the button up and evens out the spacing.
     NB: #recommendations is a sibling of #wrap, so no #wrap prefix. */
  #recommendations .review-container .liquid-img-group-content h4 {
    margin-top: 10px;
  }
}

@media (min-width: 768px) {
  #wrap #recommendations .review-preview-stage {
    overflow: visible;
    padding-bottom: var(--space-12);
    margin-bottom: var(--block-gap);
  }

  #wrap #recommendations .review-container .liquid-img-container-inner {
    margin-bottom: var(--space-4) !important;
  }
}

#wrap #results .results-formats-block {
  padding-top: var(--block-gap);
  margin-bottom: 0;
}

#wrap #reviews .reviews-cards-shell {
  margin-bottom: var(--stack-gap);
}

/* Kill legacy negative / arbitrary offsets inside sections */
#wrap #recommendations .fancy-title[style*="margin-top"],
#wrap #recommendations header.fancy-title,
#wrap #case-studies .fancy-title[style*="margin-top"],
#wrap #case-studies header.fancy-title {
  margin-top: 0 !important;
}

@media screen and (min-width: 992px) {
  #wrap #news-carousel {
    margin-top: 0;
  }
}

.ai-authority-layout {
  margin-top: 0;
}

.ai-authority-card-col {
  display: flex;
  justify-content: center;
}

.ai-answer-card-wrap {
  width: 100%;
  max-width: 430px;
  margin-left: auto;
  margin-right: auto;
  overflow: visible;
  padding-bottom: var(--space-2);
}

@media (min-width: 768px) {
  .ai-authority-card-col {
    justify-content: flex-start;
  }

  .ai-authority-card-col .ai-answer-card-wrap {
    margin-left: 0;
    margin-right: auto;
  }
}

.ai-answer-card.ai-chatgpt-window {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 430px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius-surface);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.07);
  overflow: hidden;
  padding: 0;
}

.ai-answer-card-image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: calc(var(--radius-surface) - 2px);
}

.ai-chatgpt-header {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #eceff3;
  background: #fff;
}

.ai-chatgpt-logo {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.ai-chatgpt-title {
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  line-height: 1.2;
}

.ai-chatgpt-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem 1.5rem 1.25rem;
}

.ai-chatgpt-question-wrap {
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.4rem;
  max-width: 92%;
  width: 100%;
}

.ai-chatgpt-question {
  width: 100%;
  padding: 0.75rem 0.9rem;
  border-radius: var(--radius-surface) var(--radius-surface) var(--radius-control) var(--radius-surface);
  background: #f3f4f6;
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-regular);
  line-height: var(--leading-normal);
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity 0.62s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.62s cubic-bezier(0.23, 1, 0.32, 1);
}

.ai-chatgpt-source-check {
  margin: 0;
  padding: 0 0.1rem;
  color: var(--color-text-muted);
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  font-weight: var(--weight-regular);
  line-height: 1.2;
  letter-spacing: 0.01em;
  opacity: 0;
  transform: translateY(4px);
  transition:
    opacity 0.42s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.42s cubic-bezier(0.23, 1, 0.32, 1);
}

.ai-chatgpt-window.is-revealing .ai-chatgpt-source-check.is-visible,
.ai-chatgpt-window.is-reveal-complete .ai-chatgpt-source-check {
  opacity: 1;
  transform: translateY(0);
}

.ai-chatgpt-window.is-revealing .ai-chatgpt-question.is-visible,
.ai-chatgpt-window.is-reveal-complete .ai-chatgpt-question {
  opacity: 1;
  transform: translateY(0);
}

.ai-chatgpt-window.is-measuring .ai-chatgpt-question,
.ai-chatgpt-window.is-measuring .ai-chatgpt-source-check,
.ai-chatgpt-window.is-measuring .ai-chatgpt-sources,
.ai-chatgpt-window.is-measuring .ai-chatgpt-source-chip {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.ai-chatgpt-answer {
  align-self: flex-start;
  max-width: 100%;
  padding: 0;
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  font-weight: var(--weight-regular);
  line-height: var(--leading-relaxed);
  min-height: 4.5rem;
}

.ai-chatgpt-answer-typed {
  display: inline;
  color: var(--color-text);
  word-break: normal;
  overflow-wrap: break-word;
}

.ai-chatgpt-word {
  display: inline;
  white-space: nowrap;
}

.ai-chatgpt-char {
  display: inline;
  opacity: 0;
  animation: ai-chatgpt-char-in 0.08s ease forwards;
}

@keyframes ai-chatgpt-char-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.ai-answer-card-brand {
  color: #0587ed;
  font-weight: 500;
}

.ai-chatgpt-sources {
  margin-top: 0.15rem;
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity 0.32s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.32s cubic-bezier(0.23, 1, 0.32, 1);
}

.ai-chatgpt-window.is-reveal-complete .ai-chatgpt-sources.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.ai-chatgpt-source-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.65rem;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius-full);
  background: #fff;
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  line-height: 1.2;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(4px);
  transition:
    opacity 0.28s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.28s cubic-bezier(0.23, 1, 0.32, 1);
}

.ai-chatgpt-source-chip.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .ai-chatgpt-question,
  .ai-chatgpt-source-check,
  .ai-chatgpt-sources,
  .ai-chatgpt-source-chip {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .ai-chatgpt-char {
    opacity: 1 !important;
    animation: none !important;
  }
}

.ai-chatgpt-sources-label {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--color-text-muted);
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.ai-chatgpt-source-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.ai-chatgpt-source-favicon {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  border-radius: var(--radius-sm);
  object-fit: contain;
}

.ai-chatgpt-composer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  margin: auto 1rem 0.9rem;
  padding: 0.4rem 0.4rem 0.4rem 0.95rem;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius-full);
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  flex: 0 0 auto;
}

.ai-chatgpt-composer-placeholder {
  color: var(--color-text-muted);
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
  line-height: 1;
}

.ai-chatgpt-composer-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: var(--radius-full);
  background: #1f2937;
  color: #fff;
  font-size: 0.6875rem;
  flex: 0 0 1.5rem;
}

.ai-authority-signals {
  display: flex;
  flex-direction: column;
  gap: var(--header-gap);
}

@media (max-width: 767px) {
  /* Only the benefits (AI Authority Framework) signals are hidden on mobile;
     the how-it-works steps are shown as cards (see below). */
  #ai-authority-framework .ai-authority-signals {
    display: none !important;
  }

  /* #benefits is a sibling of #wrap (a direct child of body), so the intended
     #wrap #benefits #ai-authority-framework spacing rules never match. On mobile
     the framework's pill ended up flush against the benefit card above it, so
     add a clear gap here. */
  #benefits #ai-authority-framework {
    margin-top: calc(var(--space-12) + var(--space-4));
  }

  /* Match the ChatGPT mockup's width to the header/subtitle above it. The
     .ai-authority-layout row's Bootstrap negative margins combined with the card
     column's pl-4/pr-4 double-inset the card (9px narrower each side); zero both
     so the card lines up edge-to-edge with the heading. */
  #ai-authority-framework .ai-authority-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #ai-authority-framework .ai-authority-card-col {
    padding-left: 0 !important;
    padding-right: 0 !important;
    /* Pull the sample-report link closer to the card (was mb-5 = 48px). */
    margin-bottom: var(--space-6) !important;
  }

  /* Pull the card up closer to the heading/subtitle (was mb-6 = 72px) so the
     mockup doesn't feel detached from the copy above it. */
  #ai-authority-framework .ai-authority-header {
    margin-bottom: var(--space-8) !important;
  }

  #ai-authority-framework .ai-authority-sample-link {
    text-align: center;
    padding-left: 0 !important;
  }
}

/* Mobile: how-it-works "Build Authority in 7 Days" heading + steps as cards */
@media (max-width: 767px) {
  #how-it-works-mob .how-it-works-subhead-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.12;
    color: var(--color-text, #1d1d1d);
    margin: 0 0 var(--space-4);
  }

  #how-it-works .how-it-works-steps {
    gap: var(--space-4);
  }

  #how-it-works .how-it-works-steps .ai-authority-signal {
    background: #fff;
    border: 1px solid #ededed;
    border-radius: var(--radius-surface);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
    padding: 1.15rem 1.25rem;
  }
}

.ai-authority-signal {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

.ai-authority-signal-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 1.8em;
  width: 1.8em;
  height: 1.8em;
  border-radius: 50%;
  background-color: #71a986;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}

.ai-authority-signal-title {
  margin: 0 0 0.25rem;
}

.ai-authority-signal-desc {
  margin: 0;
}

#wrap .ai-authority-sample-link {
  margin-top: var(--space-10);
  text-align: left;
}

/* Desktop: align the benefits "See it in a sample report" button with the
   signal headers, i.e. past the numbered circle (1.8em @ 15px = 27px) + 1rem gap.
   NB: #ai-authority-framework is a sibling of #wrap, not a descendant. */
@media (min-width: 768px) {
  #ai-authority-framework .ai-authority-sample-link {
    padding-left: calc(27px + 1rem);
  }
}

@media (min-width: 992px) {
  .ai-authority-signals-col {
    padding-left: 2.75rem !important;
  }
}

/* ==========================================================================
   Homepage typography system (#wrap)
   Scale: xs 12 · sm 14 · base 16 · md 17 · xl 20 · display/section fluid
   Colors: --color-text · --color-text-body · --color-text-muted
   ========================================================================== */

#wrap {
  font-family: var(--font-sans);
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  line-height: var(--leading-normal);
  color: var(--color-text-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

#wrap h1,
#wrap h2,
#wrap h3,
#wrap h4,
#wrap h5,
#wrap h6 {
  color: var(--color-text);
  text-wrap: balance;
}

#wrap p,
#wrap li {
  text-wrap: pretty;
}

#wrap .hero-headline {
  font-size: var(--text-display) !important;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
}

#wrap .hero-subheading {
  font-size: var(--text-xl) !important;
  font-weight: var(--weight-medium);
  line-height: var(--leading-snug);
  color: var(--color-text-secondary);
  max-width: 95%;
}

#wrap .hero-cta-subtext {
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
  margin-top: 0.85rem;
}

#wrap .hero-benefits-list {
  font-size: var(--text-base);
  line-height: var(--leading-snug);
  color: var(--color-text-body);
}

#wrap .hero-review-copy,
#wrap .hero-review-quote,
#wrap .hero-review-attribution {
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
}

#wrap .hero-review-attribution {
  color: var(--color-text-muted);
}

#wrap .heading-label .font-size-13,
#wrap .font-size-13.text-uppercase {
  font-size: var(--text-xs) !important;
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--color-text-body);
}

#wrap .font-size-10 { font-size: var(--text-xs) !important; }
#wrap .font-size-12 { font-size: var(--text-xs) !important; }
#wrap .font-size-13 { font-size: var(--text-xs) !important; }
#wrap .font-size-14 { font-size: var(--text-sm) !important; }
#wrap .font-size-15 { font-size: var(--text-base) !important; }
#wrap .font-size-16 { font-size: var(--text-base) !important; }
#wrap .font-size-17 { font-size: var(--text-md) !important; }
#wrap .font-size-18 { font-size: var(--text-lg) !important; }
#wrap .font-size-20 { font-size: var(--text-xl) !important; }

#wrap .lead {
  font-size: var(--text-xl);
  line-height: var(--leading-relaxed);
  color: var(--color-text-body);
}

#wrap .lead.font-size-14,
#wrap .lead.font-size-16 {
  font-size: var(--text-sm) !important;
}

#wrap .text-light {
  color: var(--color-text-muted) !important;
}

#wrap .text-black {
  color: var(--color-text) !important;
}

#wrap .text-dark {
  color: var(--color-text) !important;
}

#wrap .fancy-heading > p.lead,
#wrap section > .container > .row > .lqd-column > p.lead {
  font-size: var(--text-xl);
  color: var(--color-text-body);
}

#wrap .iconbox-heading-sm h3,
#wrap .ai-authority-signal-title {
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
}

#wrap .iconbox-heading-sm p,
#wrap .ai-authority-signal-desc {
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
  color: var(--color-text-body);
}

/* ── Extended homepage typography (sizes, weights, colors from tokens) ── */

#wrap h2,
#wrap .h2 {
  font-size: var(--text-section) !important;
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
}

#wrap h3,
#wrap .h3 {
  font-size: var(--text-2xl);
  font-weight: var(--weight-bold);
  line-height: var(--leading-snug);
  color: var(--color-text);
}

#wrap h4,
#wrap .h4 {
  font-size: var(--text-xl);
  font-weight: var(--weight-bold);
  color: var(--color-text);
}

#wrap .ld-fancy-heading.visible-xs h1,
#wrap .ld-fancy-heading.visible-xs h1 span {
  font-size: var(--text-display) !important;
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
}

#wrap .append2.hero-headline {
  color: var(--color-text);
  font-size: var(--text-display) !important;
}

#wrap .hero-trust-block .hero-review-copy,
#wrap .hero-trust-block .hero-review-copy.lead {
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-regular);
  line-height: var(--leading-snug);
  color: var(--color-text-body);
}

#wrap .hero-trust-block .hero-review-attribution,
#wrap .hero-trust-block .hero-review-attribution.lead {
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-regular);
  color: var(--color-text);
}

#wrap .hero-trust-block .hero-review-attribution a {
  color: var(--color-link);
}

#wrap #hero-section .badge-pill {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-body) !important;
}

#wrap .how-it-works-content ul,
#wrap .benefits1 ul:not(.hero-benefits-list) {
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--color-text-body);
}

#wrap p.font-size-15 {
  font-size: var(--text-base) !important;
  line-height: var(--leading-normal);
  color: var(--color-text-body);
}

#wrap .btn {
  font-family: var(--font-sans);
}

#wrap .btn .btn-txt.font-size-18 {
  font-size: var(--text-lg) !important;
}

#wrap .btn.font-size-14,
#wrap .btn .btn-txt.font-size-14 {
  font-size: var(--text-sm) !important;
}

#wrap .font-weight-bold { font-weight: var(--weight-bold) !important; }
#wrap .font-weight-normal { font-weight: var(--weight-regular) !important; }

#wrap .review-card-name a {
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
}

#wrap .review-card-score {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  color: var(--color-text-secondary);
}

#wrap .review-card-package {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  color: var(--color-text-secondary);
}

#wrap .review-card-body {
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
  color: var(--color-text);
}

#wrap .reviews-carousel-counter {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  color: var(--color-text-muted);
}

#wrap .news-outlet-chip {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text);
}

#wrap .fancy-heading > p:not(.lead) {
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--color-text-body);
}

#wrap .iconbox-pricing,
#wrap .pricing-table {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  color: var(--color-text-body);
}

#wrap .iconbox-pricing h3,
#wrap .iconbox-pricing h4,
#wrap .pricing-table h4 {
  color: var(--color-text);
}

#wrap .lqd-modal-sticky-foot .package-modal-body > h2 {
  font-size: var(--text-section);
  color: var(--color-text);
}

#wrap .lqd-modal-sticky-foot .package-modal-body > p,
#wrap .lqd-modal-sticky-foot .news-list-table td small {
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
}