.elementor-9987 .elementor-element.elementor-element-c88038e{--display:flex;}.elementor-9987 .elementor-element.elementor-element-c88038e:not(.elementor-motion-effects-element-type-background), .elementor-9987 .elementor-element.elementor-element-c88038e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#E9E8F6;}.elementor-9987 .elementor-element.elementor-element-e9914fe{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-9987 .elementor-element.elementor-element-e9914fe.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-9987 .elementor-element.elementor-element-e9914fe .eael-breadcrumbs .eael-breadcrumbs__content{background-color:#f8f8fa;font-family:"Poppins", Sans-serif;font-size:12px;font-weight:400;line-height:16px;}.elementor-9987 .elementor-element.elementor-element-e9914fe .eael-breadcrumbs .eael-breadcrumb-separator svg path{fill:#A5A4B0;}.elementor-9987 .elementor-element.elementor-element-e9914fe .eael-breadcrumbs .eael-breadcrumb-separator{color:#A5A4B0;margin:0 10px;}.elementor-9987 .elementor-element.elementor-element-b6df13f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-9987 .elementor-element.elementor-element-b6df13f:not(.elementor-motion-effects-element-type-background), .elementor-9987 .elementor-element.elementor-element-b6df13f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#E9E8F6;}.elementor-9987 .elementor-element.elementor-element-8cd5593{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9987 .elementor-element.elementor-element-44dab9c{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9987 .elementor-element.elementor-element-b886ea0 .elementor-toc__header-title{text-align:start;}.elementor-9987 .elementor-element.elementor-element-b886ea0 .elementor-toc__header, .elementor-9987 .elementor-element.elementor-element-b886ea0 .elementor-toc__header-title{font-family:"Poppins", Sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0.6px;}.elementor-9987 .elementor-element.elementor-element-b886ea0{--toggle-button-color:#111827;--item-text-color:#E8006E;--item-text-hover-decoration:underline;}.elementor-9987 .elementor-element.elementor-element-b886ea0 .elementor-toc__header{flex-direction:row;}.elementor-9987 .elementor-element.elementor-element-b886ea0 .elementor-toc__list-item{font-family:"Poppins", Sans-serif;font-size:14px;font-weight:500;line-height:20px;}.elementor-9987 .elementor-element.elementor-element-4c00e1b{--display:flex;--gap:10px 10px;--row-gap:10px;--column-gap:10px;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#E5E7EB;--border-color:#E5E7EB;--border-radius:12px 12px 12px 12px;--margin-top:1rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;--padding-top:4rem;--padding-bottom:2rem;--padding-left:1rem;--padding-right:1rem;}.elementor-9987 .elementor-element.elementor-element-4c00e1b:not(.elementor-motion-effects-element-type-background), .elementor-9987 .elementor-element.elementor-element-4c00e1b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9987 .elementor-element.elementor-element-8b68ce7 .elementor-icon-wrapper{text-align:start;}.elementor-9987 .elementor-element.elementor-element-8b68ce7 .elementor-icon{font-size:48px;}.elementor-9987 .elementor-element.elementor-element-8b68ce7 .elementor-icon svg{height:48px;}.elementor-9987 .elementor-element.elementor-element-568b19a .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:700;line-height:24px;color:#020A0A;}.elementor-9987 .elementor-element.elementor-element-8f9b335{font-family:"Poppins", Sans-serif;font-size:14px;line-height:20px;color:#020A0A;}.elementor-9987 .elementor-element.elementor-element-07c9818 .elementor-button{background-color:#FFFFFF;font-family:"Poppins", Sans-serif;font-size:14px;font-weight:500;line-height:20px;text-shadow:0px 0px 10px rgba(0,0,0,0.3);fill:#020A0A;color:#020A0A;border-style:solid;border-width:1px 1px 1px 1px;border-color:#DEDFDF;border-radius:6px 6px 6px 6px;}.elementor-9987 .elementor-element.elementor-element-07c9818 .elementor-button-content-wrapper{flex-direction:row;}.elementor-9987 .elementor-element.elementor-element-07c9818 .elementor-button .elementor-button-content-wrapper{gap:13px;}.elementor-9987 .elementor-element.elementor-element-407a62b{--display:flex;}.elementor-9987 .elementor-element.elementor-element-814eb31 > .elementor-widget-container{background-color:#FFFFFF;padding:5px 30px 5px 30px;border-radius:20px 20px 20px 20px;}.elementor-9987 .elementor-element.elementor-element-814eb31.elementor-element{--align-self:center;}.elementor-9987 .elementor-element.elementor-element-814eb31 .elementor-icon-list-icon{width:14px;}.elementor-9987 .elementor-element.elementor-element-814eb31 .elementor-icon-list-icon i{font-size:14px;}.elementor-9987 .elementor-element.elementor-element-814eb31 .elementor-icon-list-icon svg{--e-icon-list-icon-size:14px;}.elementor-9987 .elementor-element.elementor-element-814eb31 .elementor-icon-list-text, .elementor-9987 .elementor-element.elementor-element-814eb31 .elementor-icon-list-text a{color:#4B2E9E;}.elementor-9987 .elementor-element.elementor-element-814eb31 .elementor-icon-list-item{font-family:"Poppins", Sans-serif;font-size:15px;font-weight:600;}.elementor-9987 .elementor-element.elementor-element-544df83{width:var( --container-widget-width, 1040px );max-width:1040px;--container-widget-width:1040px;--container-widget-flex-grow:0;z-index:1;text-align:center;}.elementor-9987 .elementor-element.elementor-element-544df83.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-9987 .elementor-element.elementor-element-544df83 .elementor-heading-title{font-family:"Lora", Sans-serif;font-size:56px;line-height:1.2em;color:#020A0A;}.elementor-9987 .elementor-element.elementor-element-b22cd14{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9987 .elementor-element.elementor-element-ba06892 .elementor-icon-list-icon i{color:#555A5A;font-size:14px;}.elementor-9987 .elementor-element.elementor-element-ba06892 .elementor-icon-list-icon svg{fill:#555A5A;--e-icon-list-icon-size:14px;}.elementor-9987 .elementor-element.elementor-element-ba06892 .elementor-icon-list-icon{width:14px;}.elementor-9987 .elementor-element.elementor-element-ba06892 .elementor-icon-list-text, .elementor-9987 .elementor-element.elementor-element-ba06892 .elementor-icon-list-text a{color:#555A5A;}.elementor-9987 .elementor-element.elementor-element-ba06892 .elementor-icon-list-item{font-family:"Poppins", Sans-serif;font-size:14px;}.elementor-9987 .elementor-element.elementor-element-40327fb{--display:flex;--min-height:355px;--border-radius:8px 8px 8px 8px;--margin-top:1rem;--margin-bottom:1rem;--margin-left:0rem;--margin-right:0rem;}.elementor-9987 .elementor-element.elementor-element-40327fb:not(.elementor-motion-effects-element-type-background), .elementor-9987 .elementor-element.elementor-element-40327fb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-9987 .elementor-element.elementor-element-40327fb.e-con{--align-self:center;}.elementor-9987 .elementor-element.elementor-element-7e9d07b{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:1rem;--margin-bottom:5rem;--margin-left:0rem;--margin-right:0rem;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9987 .elementor-element.elementor-element-7e9d07b:not(.elementor-motion-effects-element-type-background), .elementor-9987 .elementor-element.elementor-element-7e9d07b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://auptimate.com/wp-content/uploads/2026/07/Big_Logo.webp");}.elementor-9987 .elementor-element.elementor-element-53ddb0d{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9987 .elementor-element.elementor-element-53ddb0d.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-9987 .elementor-element.elementor-element-77bb9c6{width:var( --container-widget-width, 101.461% );max-width:101.461%;--container-widget-width:101.461%;--container-widget-flex-grow:0;text-align:start;}.elementor-9987 .elementor-element.elementor-element-77bb9c6.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-9987 .elementor-element.elementor-element-77bb9c6 .elementor-heading-title{font-family:"Lora", Sans-serif;font-size:40px;-webkit-text-stroke-color:#000;stroke:#000;color:#312782;}.elementor-9987 .elementor-element.elementor-element-1560499{width:var( --container-widget-width, 842px );max-width:842px;--container-widget-width:842px;--container-widget-flex-grow:0;text-align:start;font-family:"Poppins", Sans-serif;font-size:18px;font-weight:500;color:#312782;}.elementor-9987 .elementor-element.elementor-element-1560499 > .elementor-widget-container{margin:1rem 0rem 1rem 0rem;}.elementor-9987 .elementor-element.elementor-element-1560499.elementor-element{--align-self:flex-start;--flex-grow:0;--flex-shrink:0;}.elementor-9987 .elementor-element.elementor-element-9182055{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:0rem;--margin-bottom:2rem;--margin-left:0rem;--margin-right:0rem;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9987 .elementor-element.elementor-element-cb783c2 .elementor-button{background-color:var( --e-global-color-075eb07 );font-family:"Poppins", Sans-serif;font-size:16px;font-weight:600;border-radius:40px 40px 40px 40px;padding:20px 30px 20px 30px;}.elementor-9987 .elementor-element.elementor-element-cb783c2.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-9987 .elementor-element.elementor-element-2c2c5d1 .elementor-button{background-color:#E61B7200;font-family:"Poppins", Sans-serif;font-size:16px;font-weight:600;fill:#020A0A;color:#020A0A;border-style:solid;border-width:1px 1px 1px 1px;border-color:#E61B72;border-radius:40px 40px 40px 40px;padding:15px 27px 15px 27px;}.elementor-9987 .elementor-element.elementor-element-2c2c5d1{width:var( --container-widget-width, 250px );max-width:250px;--container-widget-width:250px;--container-widget-flex-grow:0;}.elementor-9987 .elementor-element.elementor-element-2c2c5d1.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}@media(max-width:1024px){.elementor-9987 .elementor-element.elementor-element-544df83 .elementor-heading-title{font-size:48px;}}@media(min-width:768px){.elementor-9987 .elementor-element.elementor-element-8cd5593{--width:30%;}.elementor-9987 .elementor-element.elementor-element-40327fb{--width:400px;}.elementor-9987 .elementor-element.elementor-element-53ddb0d{--width:100%;}}@media(max-width:767px){.elementor-9987 .elementor-element.elementor-element-544df83 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-9987 .elementor-element.elementor-element-544df83{text-align:start;}.elementor-9987 .elementor-element.elementor-element-544df83 .elementor-heading-title{font-size:30px;}.elementor-9987 .elementor-element.elementor-element-77bb9c6 .elementor-heading-title{font-size:30px;}.elementor-9987 .elementor-element.elementor-element-2c2c5d1{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-9987 .elementor-element.elementor-element-2c2c5d1.elementor-element{--align-self:stretch;}}/* Start custom CSS for html, class: .elementor-element-687ecbb *//* ==========================================================================
   Auptimate — Blog post styles  (v2)
   Targets: .blog-container / .toc-container / .breadcrumbs-container
   Replaces v1 entirely — paste this one in place of the old file.
   ========================================================================== */

/* 1. Fonts — remove if Lora / Poppins are already enqueued
   -------------------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap');

/* 2. Tokens
   -------------------------------------------------------------------------- */
:root {
  --au-ink:      #020A0A;
  --au-body:     #020A0A;
  --au-muted:    #6B7070;
  --au-pink:     #E61B72;
  --au-rule:     #DCDAE6;
  --au-display:  'Lora', Georgia, serif;
  --au-ui:       'Poppins', -apple-system, 'Segoe UI', sans-serif;
}

/* ==========================================================================
   3. BLOG CONTENT — .blog-container
   ========================================================================== */

.blog-container,
.blog-container article { font-family: var(--au-ui); }

.blog-container article { margin: 0; padding: 0; }

.blog-container h1,
.blog-container h2, .blog-container h3 {
  font-family: var(--au-display);
  font-weight: 600;
  font-size: 40px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--au-ink);
  margin: 56px 0 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--au-rule);
}

.blog-container > *:first-child,
.blog-container article > *:first-child { margin-top: 0; }

/*.blog-container h3 {
  font-family: var(--au-ui);
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
  color: var(--au-ink);
  margin: 32px 0 12px;
}*/

.blog-container h4,
.blog-container h5,
.blog-container h6 {
  font-family: var(--au-ui);
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
  color: var(--au-ink);
  margin: 28px 0 12px;
}

.blog-container p,
.blog-container li,
.blog-container td,
.blog-container th {
  font-family: var(--au-ui);
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  color: var(--au-body);
}

.blog-container p { margin: 0 0 20px; }

.blog-container strong,
.blog-container b { font-weight: 600; color: var(--au-ink); }

.blog-container article > article > article > strong:first-child {
  display: block;
  margin-bottom: 12px;
}

.blog-container a {
  color: var(--au-pink);
  text-decoration: none;
  border-bottom: 1px solid rgba(230, 27, 114, 0.35);
  transition: border-color 0.2s ease, color 0.2s ease;
}

.blog-container a:hover,
.blog-container a:focus-visible { border-bottom-color: var(--au-pink); }

.blog-container ul,
.blog-container ol { margin: 0 0 20px; padding-left: 22px; }

.blog-container li { margin-bottom: 10px; }
.blog-container li::marker { color: var(--au-pink); }

.blog-container blockquote {
  margin: 32px 0;
  padding: 4px 0 4px 24px;
  border-left: 3px solid var(--au-pink);
  font-family: var(--au-display);
  font-size: 20px;
  line-height: 32px;
  color: var(--au-ink);
}

.blog-container img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 32px 0;
}

.blog-container hr {
  border: 0;
  border-top: 1px solid var(--au-rule);
  margin: 40px 0;
}

.blog-container p:empty { display: none; }

/* ==========================================================================
   4. TABLE OF CONTENTS — .toc-container
   FIX: Elementor draws the border / background / min-height on
   .elementor-widget-container, not on the widget element. Reset it there.
   ========================================================================== */

.toc-container .elementor-widget-container {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.toc-container .elementor-toc__header,
.toc-container .elementor-toc__body {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0;
  max-height: none !important;
  overflow: visible !important;
}

/* "ON THIS PAGE" label — needs real breathing room below it */
.toc-container .elementor-toc__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 28px !important;
}

.toc-container .elementor-toc__header-title {
  font-family: var(--au-ui);
  font-weight: 600;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--au-ink);
  margin: 0;
}

/* Hide the collapse chevron on desktop — the mockup has no chrome */
.toc-container .elementor-toc__toggle-button { display: none; }

/* --- The spine ------------------------------------------------------------- */
.toc-container .elementor-toc__body > .elementor-toc__list-wrapper {
  position: relative;
  margin: 0;
  padding: 2px 0 2px 18px;
  list-style: none;
  border-left: 2px solid var(--au-rule);
}

/* FIX: nested h3/h4 entries were stepping in — keep every level on one axis */
.toc-container .elementor-toc__list-wrapper {
  list-style: none;
  margin: 0;
  padding: 0;
  border-left: 0;
}

.toc-container .elementor-toc__list-item .elementor-toc__list-wrapper {
  margin-top: 22px;
  padding-left: 0;
}

.toc-container .elementor-toc__list-item {
  position: relative;
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
}

.toc-container .elementor-toc__list-item:last-child { margin-bottom: 0; }

/* FIX: kill every marker Elementor can render (numbers, bullets, icons) */
.toc-container .elementor-toc__list-item-text-wrapper::before,
.toc-container .elementor-toc__list-item-text-wrapper::marker,
.toc-container .elementor-toc__list-item::before,
.toc-container .elementor-toc__list-item::marker,
.toc-container .elementor-toc__list-item-text-wrapper > i,
.toc-container .elementor-toc__list-item-text-wrapper > svg,
.toc-container .elementor-toc__list-item-text-wrapper > .elementor-toc__list-item-text-marker {
  content: none !important;
  display: none !important;
  counter-increment: none !important;
}

.toc-container .elementor-toc__list-item-text-wrapper {
  display: block;
  gap: 0;
  padding: 0;
}

.toc-container .elementor-toc__list-item-text {
  display: block;
  font-family: var(--au-ui);
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
  color: var(--au-ink);
  text-decoration: none;
  border: 0;
  transition: color 0.2s ease;
}

.toc-container .elementor-toc__list-item-text:hover { color: var(--au-pink); }

.toc-container .elementor-toc__list-item-text.elementor-item-active,
.toc-container .elementor-toc__list-item-text.elementor-toc__list-item-text-active {
  color: var(--au-pink);
  font-weight: 500;
}

/* Active dot, centred on the 2px spine */
.toc-container
  .elementor-toc__list-item:has(> .elementor-toc__list-item-text-wrapper > .elementor-item-active)::after {
  content: '';
  position: absolute;
  left: -24px;
  top: 6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--au-pink);
}

/* Mobile: Elementor minimises the widget, so put the toggle back */
@media (max-width: 1024px) {
  .toc-container .elementor-toc__toggle-button { display: inline-flex; }
  .toc-container .elementor-toc__toggle-button i,
  .toc-container .elementor-toc__toggle-button svg {
    color: var(--au-ink);
    fill: var(--au-ink);
    font-size: 12px;
  }
}

/* ==========================================================================
   5. BREADCRUMBS — .breadcrumbs-container
   ========================================================================== */

.breadcrumbs-container .elementor-widget-container {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
}

.breadcrumbs-container .eael-breadcrumbs,
.breadcrumbs-container .eael-breadcrumbs__content {
  background: transparent !important;
  border: 0;
  padding: 0;
  font-family: var(--au-ui);
  font-size: 14px;
  line-height: 22px;
  color: var(--au-muted);
}

.breadcrumbs-container .eael-breadcrumbs__content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 40px;
}

/* FIX: theme link colour was winning — force the muted grey */
.breadcrumbs-container .eael-breadcrumbs__content a,
.breadcrumbs-container .eael-breadcrumbs__content a:visited {
  color: var(--au-muted) !important;
  text-decoration: none !important;
  border: 0 !important;
  background: none !important;
  transition: color 0.2s ease;
}

.breadcrumbs-container .eael-breadcrumbs__content a:hover {
  color: var(--au-pink) !important;
}

.breadcrumbs-container .eael-current {
  color: var(--au-ink);
  font-weight: 500;
  background: none !important;
  text-decoration: none !important;
}

/* Chevron in place of the "/" */
.breadcrumbs-container .eael-breadcrumb-separator {
  font-size: 0;
  line-height: 0;
  color: transparent;
  display: inline-flex;
  align-items: center;
}

.breadcrumbs-container .eael-breadcrumb-separator::after {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid #9CA0A0;
  border-bottom: 1.5px solid #9CA0A0;
  transform: rotate(-45deg);
  margin-top: -1px;
}

/* OPTIONAL — the full post title makes the trail run wide. Uncomment to clamp
   it to the sidebar width with an ellipsis, as in the mockup. */
/*
.breadcrumbs-container .eael-breadcrumbs__content { max-width: 300px; }
.breadcrumbs-container .eael-current {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}
*/

/* ==========================================================================
   6. Responsive
   ========================================================================== */

@media (max-width: 1024px) {
  .blog-container h1,
  .blog-container h2 { font-size: 32px; margin-top: 44px; }
}

@media (max-width: 767px) {
  .blog-container h1,
  .blog-container h2 { font-size: 28px; line-height: 1.3; margin-top: 36px; }
  .blog-container p,
  .blog-container li { font-size: 15px; line-height: 26px; }
  .breadcrumbs-container .eael-breadcrumbs__content {
    font-size: 13px;
    gap: 8px;
    margin-bottom: 24px;
  }
}

/* ==========================================================================
   7. OPTIONAL — mockup-accurate section headings
   Your section titles are <h3>/<h4>, so the Poppins 14px rule makes them
   smaller than body text. Change the markup to <h2>/<h3>, or uncomment this.
   ========================================================================== */
/*
.blog-container h3 {
  font-family: var(--au-display);
  font-weight: 600;
  font-size: 40px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--au-ink);
  margin: 56px 0 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--au-rule);
}

.blog-container h4 {
  font-family: var(--au-ui);
  font-weight: 600;
  font-size: 20px;
  line-height: 30px;
  color: var(--au-ink);
  margin: 32px 0 12px;
}
*/


:root {
  /* Distance from the top of the viewport. Increase if your header is taller
     or if it's sticky itself. */
  --au-sticky-top: 100px;
}
 
/* 1. Ancestors must not create a scroll container, or sticky dies silently.
      `overflow-x: hidden` on html/body is the single most common cause —
      `clip` gives the same overflow protection without breaking sticky.
   -------------------------------------------------------------------------- */
html,
body {
  overflow-x: clip;
}
 
body:has(.sticky-sidebar-container) .e-con:has(.sticky-sidebar-container),
body:has(.sticky-sidebar-container) .e-con-inner:has(.sticky-sidebar-container) {
  overflow: visible;
}
 
/* 2. Make the sidebar column sticky.
      This targets the OUTER column (8cd5593) — the direct flex child of the
      row — not the inner one you tagged, because the sticky element has to be
      a direct child of the scrolling parent to have travel.
   -------------------------------------------------------------------------- */
@media (min-width: 1025px) {
  .e-con:has(> .sticky-sidebar-container) {
    position: sticky;
    top: var(--au-sticky-top);
 
    /* Critical: without this the column stretches to the full row height,
       so there is no range left for it to stick through. */
    align-self: flex-start;
    height: auto !important;
 
    /* If the TOC + CTA card ever get taller than the viewport, scroll them
       internally instead of clipping. */
    max-height: calc(100vh - var(--au-sticky-top) - 32px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
 
  .e-con:has(> .sticky-sidebar-container)::-webkit-scrollbar {
    width: 4px;
  }
 
  .e-con:has(> .sticky-sidebar-container)::-webkit-scrollbar-thumb {
    background: var(--au-rule, #DCDAE6);
    border-radius: 4px;
  }
 
  /* The inner container just flows normally inside the sticky column. */
  .sticky-sidebar-container {
    position: static !important;
    top: auto !important;
  }
}
 
/* 3. Defensive: if Elementor's JS sticky is still switched on, neutralise the
      fixed positioning it applies so the two don't compete.
   -------------------------------------------------------------------------- */
.sticky-sidebar-container.elementor-sticky--active,
.e-con:has(> .sticky-sidebar-container).elementor-sticky--active {
  position: sticky !important;
  top: var(--au-sticky-top) !important;
  width: auto !important;
  inset-inline: auto !important;
}
 
/* 4. Mobile / tablet: normal flow, no sticking.
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .e-con:has(> .sticky-sidebar-container),
  .sticky-sidebar-container {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
  }
}
 
/* 5. Anchor links need clearance so headings don't land under a sticky header.
   -------------------------------------------------------------------------- */
html {
  scroll-behavior: smooth;
}
 
.blog-container :is(h1, h2, h3, h4),
.elementor-menu-anchor {
  scroll-margin-top: calc(var(--au-sticky-top) + 20px);
}
 
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-544df83 */.font-lora {
    font-family: 'Lora' !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-b22cd14 */.post-info-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  padding: 0;
}

/* Elementor widgets are full-width block by default — shrink to content */
.post-info-container > .elementor-widget {
  width: auto !important;
  max-width: none;
  flex: 0 0 auto;
  margin: 0;
}

.post-info-container > .elementor-widget > .elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
}

/* 2. Divider between the two widgets
   -------------------------------------------------------------------------- */
.post-info-container > .elementor-widget + .elementor-widget {
  display: flex;
  align-items: center;
}

.post-info-container > .elementor-widget + .elementor-widget::before {
  content: '';
  flex: 0 0 auto;
  width: 1px;
  height: 16px;
  background: #D5D7D7;
  margin: 0 18px;
}

/* 3. Shared type treatment
   -------------------------------------------------------------------------- */
.post-info-container,
.post-info-container .elementor-post-info,
.post-info-container .elementor-icon-list-text,
.post-info-container .elementor-icon-list-text time,
.post-info-container .au-reading-time,
.post-info-container .elementor-shortcode {
  font-family: 'Poppins', -apple-system, 'Segoe UI', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #555A5A;
}

/* 4. Date item
   -------------------------------------------------------------------------- */
.post-info-container .elementor-post-info {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.post-info-container .elementor-post-info .elementor-icon-list-item {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

.post-info-container .elementor-post-info .elementor-icon-list-item::after,
.post-info-container .elementor-post-info .elementor-inline-item::after {
  content: none !important;   /* kills Elementor's own inline divider */
  border: 0 !important;
}

.post-info-container .elementor-post-info .elementor-icon-list-item > a {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #555A5A !important;
  text-decoration: none !important;
  border: 0 !important;
  transition: color 0.2s ease;
}

.post-info-container .elementor-post-info .elementor-icon-list-item > a:hover {
  color: #020A0A !important;
}

.post-info-container .elementor-icon-list-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
}

.post-info-container .elementor-icon-list-icon i {
  font-size: 14px;
  line-height: 1;
  color: #555A5A;
}

.post-info-container .elementor-icon-list-icon svg {
  width: 16px;
  height: 16px;
  fill: #555A5A;
}

/* 5. Reading time item
   -------------------------------------------------------------------------- */
.post-info-container .elementor-shortcode {
  display: flex;
  align-items: center;
}

.post-info-container .au-reading-time {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.post-info-container .au-reading-time__icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: #555A5A;         /* the SVG uses stroke: currentColor */
  stroke-width: 1.75;
}

/* 6. Mobile
   -------------------------------------------------------------------------- */
@media (max-width: 480px) {
  .post-info-container > .elementor-widget + .elementor-widget::before {
    margin: 0 12px;
  }

  .post-info-container,
  .post-info-container .elementor-icon-list-text,
  .post-info-container .au-reading-time {
    font-size: 13px;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-7e9d07b *//* ============================================================
   CTA CARD — .gradient-purple
   Paste in Elementor → Site Settings → Custom CSS
   ============================================================ */

/* ---- The gradient card ---- */
.gradient-purple {
    background: linear-gradient(313.9deg,
        rgba(209, 204, 249, 0.86) 4.3%,
        rgba(242, 242, 242, 0.60) 56.45%,
        rgba(255, 229, 251, 0.37) 100%) !important;
    --border-radius: 18px;
    border-radius: 18px !important;
    overflow: hidden;
    position: relative;
    padding: 64px 70px !important;
}

/* ---- Watermark logo, lower right, behind everything ---- */
.gradient-purple::after {
    content: "";
    position: absolute;
    right: -1%;
    bottom: -6%;
    width: 34%;
    height: 118%;
    background-image: url("https://auptimate.com/wp-content/uploads/2026/07/Big_Logo.webp");
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: contain;
    opacity: 0.85;
    z-index: 0;
    pointer-events: none;
}

/* ---- Content sits above the watermark ---- */
.gradient-purple > .e-con {
    position: relative;
    z-index: 2;
    max-width: 100%;
}

/* ---- Heading ---- */
.gradient-purple h2.elementor-heading-title {
    color: #3b2fa3 !important;
    margin: 0 0 16px !important;
}

/* ---- Paragraph ---- */
.gradient-purple .elementor-widget-text-editor p {
   /* color: #1e1b4b !important;
    margin: 0 0 28px !important;
    max-width: 560px;*/
}

/* ---- Button row: side by side ---- */
.gradient-purple .elementor-element-2795396 {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px;
    width: auto !important;
}
.gradient-purple .elementor-element-2795396 > .elementor-widget {
    width: auto !important;
}

/* ---- Primary button only (Start your first SPV) ---- */
.gradient-purple .elementor-element-e1bca82 .elementor-button {
    background-color: #E61B72 !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    padding: 16px 36px !important;
    border: none !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}
.gradient-purple .elementor-element-e1bca82 .elementor-button:hover {
    background-color: #c9145f !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* Contact Sales (4b8520c) intentionally left alone — styled in Elementor */

/* ---- Mobile ---- */
@media (max-width: 767px) {
    .gradient-purple {
        padding: 40px 24px 150px !important;
    }
    .gradient-purple > .e-con {
        max-width: 100%;
    }
    .gradient-purple::after {
        width: 62%;
        height: 58%;
        right: -6%;
        bottom: -4%;
        opacity: 0.7;
    }
    .gradient-purple .elementor-element-2795396 {
        flex-wrap: wrap;
        gap: 12px;
    }
}/* End custom CSS */