/* ScalerSuite rendering hardening — v61.4
   Explicit component classes are used for recommendation sections so generic
   Tailwind/grid rules cannot collapse or visually clip the content. */

/* Framework compatibility used by the static export. */
/* These utility classes are missing from the compiled per-page purged
   stylesheet on a handful of pages (apollo.html, custom-contact-list-
   building.html, verified-linkedin-profiles-for-outreach.html), which
   silently drops the padding/min-height on their short-feature-point
   card grids. Defined globally here so they always work regardless of
   which page's purge happens to include them. */
.p-5{padding:1.25rem}
.min-h-\[88px\]{min-height:88px}
.flex-1{flex:1 1 0%}.flex-wrap{flex-wrap:wrap}.flex-none{flex:none}.shrink-0{flex-shrink:0}
.flex-grow{flex-grow:1}.grow{flex-grow:1}.min-w-0{min-width:0}.w-auto{width:auto}.h-auto{height:auto}
.overflow-x-auto{overflow-x:auto}.border-collapse{border-collapse:collapse}.border-b-2{border-bottom-width:2px}
.bottom-0{bottom:0}.z-0{z-index:0}.z-40{z-index:40}
.mt-3{margin-top:.75rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}
.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-x-3{column-gap:.75rem}.gap-y-1\.5{row-gap:.375rem}
.pl-\[3\.25rem\]{padding-left:3.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}
.text-base{font-size:1rem;line-height:1.5}.leading-snug{line-height:1.375}

/* Compacted mega-menu / mobile nav accordion (desktop "Services" dropdown and
   its mobile equivalent) rely on these utilities; defined globally here so
   the tighter spacing renders correctly regardless of a given page's purge. */
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.pb-2{padding-bottom:.5rem}
.p-2{padding:.5rem}
.w-8{width:2rem}.h-8{height:2rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.mt-0{margin-top:0}
.gap-y-1{row-gap:.25rem}
.text-blue-300{--tw-text-opacity:1;color:rgb(147 197 253/var(--tw-text-opacity,1))}
.text-red-400{--tw-text-opacity:1;color:rgb(248 113 113/var(--tw-text-opacity,1))}
.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}
.text-yellow-300{--tw-text-opacity:1;color:rgb(253 224 71/var(--tw-text-opacity,1))}
.opacity-80{opacity:.8}.max-w-5xl{max-width:64rem}.max-w-xl{max-width:36rem}.max-w-\[720px\]{max-width:720px}
.max-h-\[75vh\]{max-height:75vh}.max-h-\[calc\(100vh-80px\)\]{max-height:calc(100vh - 80px)}
.w-\[92vw\]{width:92vw}.min-w-\[640px\]{min-width:640px}.sm\:w-\[720px\]{width:720px}
.from-blue-500{--tw-gradient-from:#3b82f6 var(--tw-gradient-from-position);--tw-gradient-to:rgba(59,130,246,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-emerald-500{--tw-gradient-from:#10b981 var(--tw-gradient-from-position);--tw-gradient-to:rgba(16,185,129,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-gray-900{--tw-gradient-from:#111827 var(--tw-gradient-from-position);--tw-gradient-to:rgba(17,24,39,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-indigo-500{--tw-gradient-from:#6366f1 var(--tw-gradient-from-position);--tw-gradient-to:rgba(99,102,241,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-purple-500{--tw-gradient-from:#a855f7 var(--tw-gradient-from-position);--tw-gradient-to:rgba(168,85,247,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.from-slate-500{--tw-gradient-from:#64748b var(--tw-gradient-from-position);--tw-gradient-to:rgba(100,116,139,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.to-blue-600{--tw-gradient-to:#2563eb var(--tw-gradient-to-position)}.to-blue-700{--tw-gradient-to:#1d4ed8 var(--tw-gradient-to-position)}
.to-blue-900{--tw-gradient-to:#1e3a8a var(--tw-gradient-to-position)}.to-fuchsia-600{--tw-gradient-to:#c026d3 var(--tw-gradient-to-position)}
.to-slate-700{--tw-gradient-to:#334155 var(--tw-gradient-to-position)}.to-teal-600{--tw-gradient-to:#0d9488 var(--tw-gradient-to-position)}
@media (min-width:640px){.sm\:block{display:block}.sm\:inline{display:inline}.sm\:flex-none{flex:none}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:w-\[720px\]{width:720px}}
@media (min-width:768px){.md\:flex{display:flex}.md\:flex-row{flex-direction:row}.md\:gap-6{gap:1.5rem}.md\:text-left{text-align:left}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:text-2xl{font-size:1.5rem;line-height:2rem}}
@media (min-width:1024px){.lg\:hidden{display:none}.lg\:inline-block{display:inline-block}}
.gradient-text{background:linear-gradient(to right,#2563eb,#9333ea);-webkit-background-clip:text;background-clip:text;color:transparent}
.card-hover{transition:transform .3s ease,box-shadow .3s ease}.card-hover:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,.12)}
/* Reveal animations must never hide page content if JS is unavailable. */
.fade-up{opacity:1!important;transform:none!important}

/* Navigation stability. */
.services-wrap{position:relative}.mega{max-width:720px;max-height:75vh;overflow-y:auto}
#plans{min-height:0!important}

/* Payment-methods trust strip, shown once beneath a service page's pricing
   table (not repeated per plan). Hand-written scoped classes rather than
   page-local Tailwind so it renders correctly regardless of any page's
   purged stylesheet. */
.scaler-payment-strip{
  max-width:42rem;
  margin:2.5rem auto 0;
  text-align:center;
}
.scaler-payment-strip-label{
  font-size:.6875rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#9ca3af;
  margin:0 0 .75rem;
}
.scaler-payment-strip-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:1.5rem;
}
.scaler-payment-strip-item{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-size:.8125rem;
  font-weight:500;
  color:#6b7280;
}
.scaler-payment-strip-cards{
  display:inline-flex;
  align-items:center;
  gap:.375rem;
}
.scaler-payment-strip-item svg{
  height:1.5rem;
  width:auto;
  flex-shrink:0;
  display:block;
}
.scaler-payment-strip-item svg.scaler-payment-strip-crypto{
  height:1.375rem;
}
.scaler-payment-strip-item svg.scaler-payment-strip-stripe-mark{
  height:1rem;
  margin-left:.125rem;
}
@media (max-width:479px){
  .scaler-payment-strip-row{
    gap:1rem;
  }
  .scaler-payment-strip-item svg{
    height:1.25rem;
  }
}

/* Trust-stat bar (10,000+ mailboxes / 500+ campaigns / etc): show all 6
   stats in a single row from a much lower breakpoint than the previous
   lg: (1024px) tier — the owner wants 6-in-a-row on any normal laptop/
   desktop width, not just very wide screens. !important guarantees this
   wins regardless of which Tailwind breakpoint utilities happen to be
   compiled into a given page's purged inline stylesheet. */
.scaler-stats-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (min-width:640px){
  .scaler-stats-grid{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
}

/* Anchor jumps (e.g. the header's Pricing/Reviews links pointing at a
   service page's own #pricing/#testimonials section) need to clear the
   fixed 80px header. */
[id]{
  scroll-margin-top:6rem;
}

/* Footer social icons — hand-written scoped classes rather than relying on
   Tailwind utilities being present in every page's purged inline stylesheet. */
.scaler-social-links{
  display:flex;
  align-items:center;
  gap:.75rem;
  margin-top:1.25rem;
}
.scaler-social-links a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  border-radius:9999px;
  background:#1f2937;
  color:#d1d5db;
  transition:background-color .15s ease,color .15s ease;
}
.scaler-social-links a:hover{
  background:#2563eb;
  color:#fff;
}
.scaler-social-links a svg{
  width:1.125rem;
  height:1.125rem;
}


/* -------------------------------------------------------------------------
   CONTEXTUAL RECOMMENDATION / UPSELL
   Single unified component used on every service page (see domains.html for
   the reference markup). Scoped entirely to the [data-scalersuite-contextual-
   upsell] section so it never depends on, or fights with, page-level styles.
   No !important is needed here: this is the only rule set targeting these
   selectors, and it sizes itself naturally with no fixed/min heights.
   ------------------------------------------------------------------------- */
[data-scalersuite-contextual-upsell="true"]{
  background:linear-gradient(135deg,#2563eb 0%,#7c3aed 100%);
  color:#fff;
}
/* Force generous, FAQ-matching vertical rhythm regardless of whatever
   py-* utility class the exported markup happens to carry on the
   <section> tag itself — specificity here (tag+class+attribute) beats
   a bare .py-14/.py-16 utility class no matter the cascade order. */
section[data-scalersuite-contextual-upsell="true"]{
  padding-top:5rem;
  padding-bottom:5rem;
}
@media (max-width:639px){
  section[data-scalersuite-contextual-upsell="true"]{
    padding-top:3.5rem;
    padding-bottom:3.5rem;
  }
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-inner{
  width:100%;
  max-width:64rem;
  margin:0 auto;
}
/* -------------------------------------------------------------------------
   CONTEXTUAL RECOMMENDATION — two-tier layout (eyebrow/heading/body, then a
   row of primary pill buttons, then a divider and a row of secondary text
   links). Mirrors the original gworkspace.html reference design, now used
   as the standard pattern on every service page. Scoped the same way as
   the classes above so it never depends on any page's purged utility CSS.
   ------------------------------------------------------------------------- */
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-eyebrow{
  font-size:.8125rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#dbeafe;
  margin:0 0 .75rem;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-heading{
  font-size:2rem;
  line-height:1.25;
  font-weight:800;
  color:#fff;
  margin:0 0 1rem;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-body{
  font-size:1.0625rem;
  line-height:1.65;
  color:#dbeafe;
  max-width:42rem;
  margin:0 auto 2rem;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-top{
  max-width:52rem;
  margin:0 auto 2.5rem;
  text-align:center;
}
@media (min-width:768px){
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-heading{
    font-size:2.75rem;
  }
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-primary{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  justify-content:center;
  align-items:center;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-primary-btn{
  display:inline-block;
  background:#fff;
  color:#1d4ed8;
  font-weight:600;
  font-size:.875rem;
  padding:.65rem 1.25rem;
  border-radius:.5rem;
  text-decoration:none;
  border:2px solid #fff;
  box-sizing:border-box;
  transition:background-color .15s ease,border-color .15s ease;
  white-space:normal;
  overflow-wrap:anywhere;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-primary-btn:hover{
  background:#eff6ff;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-primary-btn--outline{
  background:transparent;
  color:#fff;
  border-color:rgba(255,255,255,.7);
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-primary-btn--outline:hover{
  background:rgba(255,255,255,.1);
}

/* Boxed card grid — the main, prominent way recommendations are shown.
   Matches the site's existing "white card, rounded-2xl, shadow-lg"
   visual language used elsewhere on every service page (see the
   feature/pricing cards on the same pages), rebuilt here as hand-written
   CSS so it always renders regardless of any page's purged utility set.
   Column count follows card count: 1 col mobile, 2 col tablet, up to
   3 col desktop. */
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.25rem;
  max-width:64rem;
  margin:0 auto;
}
@media (min-width:640px){
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-grid[data-card-count="1"]{
    grid-template-columns:minmax(0,26rem);
    justify-content:center;
  }
}
@media (min-width:1024px){
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-grid[data-card-count="3"],
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-grid[data-card-count="6"]{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.5rem;
  min-width:0;
  height:100%;
  padding:1.5rem 1.5rem 1.375rem;
  border-radius:1rem;
  background:rgba(255,255,255,.96);
  color:#111827;
  text-decoration:none;
  box-sizing:border-box;
  box-shadow:0 10px 25px rgba(15,23,42,.15);
  border:1px solid rgba(255,255,255,.5);
  transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 34px rgba(15,23,42,.22);
  background:#fff;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-kicker{
  font-size:.6875rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#7c3aed;
  margin:0;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-title{
  min-width:0;
  display:block;
  color:#111827;
  font-size:1.0625rem;
  line-height:1.4;
  font-weight:700;
  overflow-wrap:anywhere;
  margin:0;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-desc{
  min-width:0;
  display:block;
  color:#4b5563;
  font-size:.875rem;
  line-height:1.55;
  overflow-wrap:anywhere;
  margin:0;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-card-arrow{
  margin-top:auto;
  padding-top:.5rem;
  flex:0 0 auto;
  color:#2563eb;
  font-weight:700;
  font-size:.9rem;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-secondary{
  max-width:48rem;
  margin:2.5rem auto 0;
  text-align:center;
  padding-top:1.75rem;
  border-top:1px solid rgba(255,255,255,.2);
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-secondary-label{
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#dbeafe;
  margin:0 0 .75rem;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-secondary-row{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.5rem;
  justify-content:center;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-secondary-link{
  color:rgba(255,255,255,.9);
  text-decoration:underline;
  font-size:.875rem;
  font-weight:500;
  overflow-wrap:anywhere;
}
[data-scalersuite-contextual-upsell="true"] .scaler-contextual-secondary-link:hover{
  color:#fff;
}
@media (max-width:639px){
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-heading{
    font-size:1.625rem;
  }
  [data-scalersuite-contextual-upsell="true"] .scaler-contextual-primary-btn{
    width:100%;
    text-align:center;
  }
}

/* Shared testimonial card pattern: consistent width/padding/typography with a
   min-height (not fixed) so short quotes stay tidy and long quotes never clip. */
.scaler-testimonial-card{
  display:flex;
  flex-direction:column;
  min-height:280px;
  padding:2rem;
  box-sizing:border-box;
}
.scaler-testimonial-card .scaler-testimonial-stars{
  flex:0 0 auto;
}
.scaler-testimonial-card p{
  flex:1 1 auto;
}
.scaler-testimonial-card .scaler-testimonial-meta{
  flex:0 0 auto;
  margin-top:auto;
}

/* -------------------------------------------------------------------------
   PURGE-GAP FALLBACKS
   These Tailwind utility classes are used somewhere in the site's markup
   but were never compiled into that particular page's own inline purged
   stylesheet (this static export has no live Tailwind build — each page's
   <style> block only contains classes already used elsewhere on that same
   page). Defined once here, globally, using the exact same values Tailwind
   itself would generate, so every page renders correctly regardless of its
   own purge coverage.
   ------------------------------------------------------------------------- */
.underline{text-decoration-line:underline}
.font-normal{font-weight:400}
.last\:border-0:last-child{border-width:0}
.border-b-0{border-bottom-width:0}
.border-l{border-left-width:1px}
.pl-5{padding-left:1.25rem}
.pb-6{padding-bottom:1.5rem}
.pr-16{padding-right:4rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}
.mr-1{margin-right:.25rem}
.mt-6{margin-top:1.5rem}
.ml-auto{margin-left:auto}
.-ml-6{margin-left:-1.5rem}
.mt-\[-2\.5rem\]{margin-top:-2.5rem}
.gap-2\.5{gap:.625rem}
.max-w-lg{max-width:32rem}
.max-w-\[150px\]{max-width:150px}
.max-w-\[90\%\]{max-width:90%}
.min-w-\[560px\]{min-width:560px}
.min-w-\[600px\]{min-width:600px}
.min-w-\[680px\]{min-width:680px}
.min-w-\[720px\]{min-width:720px}
.min-h-\[72px\]{min-height:72px}
.min-h-\[80px\]{min-height:80px}
.w-\[85vw\]{width:85vw}
.top-1\/2{top:50%}
.left-0{left:0}
.right-0{right:0}
.rounded-tl-sm{border-top-left-radius:.125rem}
.rounded-tr-sm{border-top-right-radius:.125rem}
.scroll-smooth{scroll-behavior:smooth}
.snap-x{scroll-snap-type:x var(--tw-scroll-snap-strictness,proximity)}
.snap-mandatory{--tw-scroll-snap-strictness:mandatory}
.snap-center{scroll-snap-align:center}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem*var(--tw-space-y-reverse))}
.translate-x-5{--tw-translate-x:1.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
.-translate-x-5{--tw-translate-x:-1.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
.-translate-y-1\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
.bg-blue-50\/50{background-color:rgb(239 246 255/.5)}
.bg-blue-100{--tw-bg-opacity:1;background-color:rgb(219 234 254/var(--tw-bg-opacity,1))}
.bg-green-50{--tw-bg-opacity:1;background-color:rgb(240 253 244/var(--tw-bg-opacity,1))}
.bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}
.bg-green-100{--tw-bg-opacity:1;background-color:rgb(220 252 231/var(--tw-bg-opacity,1))}
.border-white\/20{border-color:hsla(0,0%,100%,.2)}
.border-blue-200{--tw-border-opacity:1;border-color:rgb(191 219 254/var(--tw-border-opacity,1))}
.border-blue-600{--tw-border-opacity:1;border-color:rgb(37 99 235/var(--tw-border-opacity,1))}
.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}
.text-blue-800{--tw-text-opacity:1;color:rgb(30 64 175/var(--tw-text-opacity,1))}
.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}
@media (min-width:640px){
  .sm\:w-\[420px\]{width:420px}
  .sm\:text-sm{font-size:.875rem;line-height:1.25rem}
  .sm\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
}
@media (min-width:768px){
  .md\:gap-4{gap:1rem}
  .md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .md\:col-span-2{grid-column:span 2/span 2}
  .md\:hidden{display:none}
  .md\:w-auto{width:auto}
}
@media (min-width:1024px){
  .lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
}
.to-indigo-600{--tw-gradient-to:#4f46e5 var(--tw-gradient-to-position)}