/* ===== Term toggle ===== */
.pldp-term{display:inline-flex;background:#efece9;border-radius:999px;padding:5px;gap:2px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
.pldp-term button{border:0;background:transparent;font-family:inherit;font-weight:600;font-size:.875rem;color:rgba(35,34,34,.66);padding:9px 22px;border-radius:999px;cursor:pointer;transition:all .18s ease;display:inline-flex;align-items:center;gap:7px}
.pldp-term button.is-active{background:#fff;color:#232222;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.pldp-term__save{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:.6875rem;color:#0f7a4d;font-weight:500}

/* ===== Card ===== */
/* Make the Elementor widget wrapper chain full-height so cards in a flex row stretch to the tallest card */
.elementor-widget-pladinum_pricing_card,
.elementor-widget-pladinum_pricing_card > .elementor-widget-container{height:100%}
.pldp-c{background:#fff;border:1px solid #e4e4e7;border-radius:24px;box-shadow:0 0 1px 0 rgba(0,0,0,.15);padding:30px;display:flex;flex-direction:column;height:100%;align-self:stretch;width:100%;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}

/* header, with line clamps */
.pldp-c__eyebrow{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-weight:500;font-size:.8125rem;letter-spacing:-.025em;text-transform:uppercase;color:#d04841;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pldp-c__heading{font-weight:400;font-size:1.85rem;letter-spacing:-.04em;line-height:1.1;color:#232222;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pldp-c__desc{font-size:.92rem;color:rgba(35,34,34,.66);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* price */
.pldp-c__pricerow{display:flex;align-items:flex-start;gap:3px}
.pldp-c__cur{font-family:"Fjalla One",sans-serif;font-size:3rem;font-weight:400;line-height:.95;color:#232222}
.pldp-c__price{font-family:"Fjalla One",sans-serif;font-size:3rem;font-weight:400;line-height:.95;letter-spacing:-.02em;color:#232222}
.pldp-c__decwrap{display:flex;flex-direction:column;justify-content:flex-start;margin-top:6px}
.pldp-c__dec{font-family:"Fjalla One",sans-serif;font-size:14px;font-weight:400;line-height:1rem;letter-spacing:.5px;color:#232222;display:block;margin-bottom:-2px;text-align:left}
.pldp-c__per{font-size:.85rem;color:rgba(35,34,34,.5);line-height:1.1;margin-top:1px}
.pldp-c__renew{font-size:.78rem;color:rgba(35,34,34,.5);min-height:18px}

/* stops */
/* snap-to-tier slider (first design) */
.pldp-c__slider{padding:0}
.pldp-c__track{position:relative;height:20px;background:#efece9;border-radius:999px;cursor:pointer;margin:18px 0 0}
.pldp-c__fill{position:absolute;top:0;left:0;height:100%;background:#d04841;border-radius:999px;pointer-events:none;z-index:1;transition:width .22s cubic-bezier(.22,.61,.36,1)}
.pldp-c__dot{position:absolute;top:50%;width:5px;height:5px;border-radius:50%;background:#c4beb8;transform:translate(-50%,-50%);cursor:pointer;z-index:2}
.pldp-c__dot.is-passed{background:rgba(159,159,159,.8)}
.pldp-c__handle{-webkit-appearance:none !important;appearance:none !important;box-sizing:border-box !important;position:absolute;top:50%;left:0;width:25px !important;height:25px !important;min-width:0 !important;min-height:0 !important;max-width:none;transform:translate(-50%,-50%);background:#232222 !important;border:0 !important;border-radius:5px !important;cursor:grab;z-index:3;display:flex;align-items:center;justify-content:center;padding:0 !important;margin:0 !important;line-height:0;box-shadow:0 2px 6px rgba(0,0,0,.22);transition:left .22s cubic-bezier(.22,.61,.36,1) !important;outline:none}
.pldp-c__handle:hover,.pldp-c__handle:focus,.pldp-c__handle:active,.pldp-c__handle:focus-visible{background:#232222 !important;color:inherit !important;box-shadow:0 2px 6px rgba(0,0,0,.22) !important;transform:translate(-50%,-50%) !important;border:0 !important;outline:none !important;filter:none !important}
.pldp-c__handle:active{cursor:grabbing}
/* during active drag: light smoothing so motion interpolates between mouse events */
.pldp-c__slider.is-dragging .pldp-c__handle{transition:left .09s linear !important}
.pldp-c__slider.is-dragging .pldp-c__fill{transition:width .09s linear}
.pldp-c__handle-ico{color:#fff !important;line-height:0;display:inline-flex;align-items:center;justify-content:center}
.pldp-c__handle-ico svg{display:block}

/* button */
.pldp-c__cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;background:#232222;color:#fff !important;font-family:var(--pld-font-sans);font-weight:500;font-size:1rem;padding:14px 20px;border:0;border-radius:12px;cursor:pointer;text-decoration:none;transition:background-color .2s ease,transform .1s ease}
.pldp-c__cta:hover{background:rgba(17,17,17,.8);color:#fff !important;text-decoration:none}
/* The chevron and its hover animation are owned by Global CSS (.pld-btn-chevron).
   The button only carries the class; do NOT restyle ::after here or it will
   outspecify the global rule and kill the pld-arrow-slide hover animation. */

/* features */
.pldp-c__feats{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px}
.pldp-c__feat{display:flex;align-items:flex-start;gap:9px;font-size:14px;color:#232222;line-height:1.4;position:relative}
.pldp-c__feat-ico{color:#d04841;flex:0 0 auto;margin-top:1px;display:inline-flex;font-size:14px}
.pldp-c__feat-ico svg{width:1em;height:1em;fill:currentColor}
.pldp-c__feat-txt{flex:1}

/* tooltip */
.pldp-c__tip{flex:0 0 auto;width:15px;height:15px;border-radius:50%;background:#e4e4e7;color:#5f5e5a;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:help;margin-top:2px;position:relative}
.pldp-c__tip:hover::after{content:attr(data-tip);position:absolute;bottom:130%;left:50%;transform:translateX(-50%);background:#232222;color:#fff;font-size:12px;font-weight:400;line-height:1.4;padding:7px 10px;border-radius:8px;white-space:normal;width:max-content;max-width:220px;z-index:20;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.pldp-c__tip:hover::before{content:"";position:absolute;bottom:130%;left:50%;transform:translateX(-50%) translateY(6px);border:5px solid transparent;border-top-color:#232222;z-index:20}

/* responsive */
/* Note: column/grid behaviour (2-up at tablet, third centred) is owned by the
   site's own layout classes (.pld-c-cols-3 / .pld-c-card) in Global CSS, not here.
   This plugin only adjusts its own internal typography and padding. */
@media (max-width:600px){
  .pldp-c{padding:24px 20px}
  .pldp-c__heading{font-size:1.6rem}
  .pldp-c__price{font-size:3rem}
  .pldp-c__cur{font-size:3rem}
  .pldp-term button{padding:9px 16px;font-size:.875rem}
}

/* ===== Recommended / badge / featured-dark ===== */
.pldp-c{position:relative}
.pldp-c--rec{border-color:#d04841;border-width:2px}
.pldp-c__badge{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:#d04841;color:#fff;
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:.7rem;font-weight:500;letter-spacing:.02em;
  text-transform:uppercase;padding:5px 14px;border-radius:999px;white-space:nowrap;z-index:2}
.pldp-c--dark{background:#232222;border-color:#232222}
/* :where() = zero specificity, so any Elementor Style-tab colour pick overrides these dark defaults */
.pldp-c--dark :where(.pldp-c__heading),.pldp-c--dark :where(.pldp-c__price),.pldp-c--dark :where(.pldp-c__cur),
.pldp-c--dark :where(.pldp-c__per),.pldp-c--dark :where(.pldp-c__dec),.pldp-c--dark :where(.pldp-c__feat),
.pldp-c--dark :where(.pldp-c__desc){color:#fff}
.pldp-c--dark :where(.pldp-c__renew){color:rgba(255,255,255,.8)}
.pldp-c--dark :where(.pldp-c__stop){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);color:#fff}


.pldp-c--dark .pldp-c__track{background:rgba(255,255,255,.15)}
.pldp-c--dark .pldp-c__dot{background:rgba(255,255,255,.4)}
.pldp-c--dark .pldp-c__handle{background:#fff}
.pldp-c--dark .pldp-c__handle-ico{color:#232222}

/* dark-card button = hero secondary style: light bg, black text, border */
.pldp-c--dark :where(.pldp-c__cta){background:rgb(240,240,236);color:#000;border:1px solid #e4e4e7}
.pldp-c--dark :where(.pldp-c__cta:hover){background:rgb(232,229,227);color:#000}

/* ===== View more ===== */
.pldp-c__feat--hidden{display:none}
.pldp-c--expanded .pldp-c__feat--hidden{display:flex}
.pldp-c__viewmore{align-self:flex-start;background:none;border:0;padding:4px 0;cursor:pointer;
  font-family:inherit;font-weight:600;font-size:.85rem;color:#d04841;text-decoration:none}
.pldp-c__viewmore:hover{color:#b8352e;text-decoration:underline}
.pldp-c--dark .pldp-c__viewmore{color:rgba(255,255,255,.9)}
.pldp-c--dark .pldp-c__viewmore:hover{color:#fff}

/* ===== Plan name (above price) ===== */
.pldp-c__plan{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:.8rem;font-weight:500;letter-spacing:-.01em;text-transform:uppercase}
:where(.pldp-c__plan){color:rgba(35,34,34,.6)}
.pldp-c--dark :where(.pldp-c__plan){color:rgba(255,255,255,.7)}

/* ===== Feature section headers ===== */
.pldp-c__fhead{list-style:none;font-weight:700;font-size:.9rem;color:#232222;margin:14px 0 4px;padding:0}
.pldp-c__fhead:first-child{margin-top:0}
.pldp-c--dark .pldp-c__fhead{color:#fff}


/* ===== Savings banner (shown on monthly) ===== */
.pldp-c__banner{display:flex;align-items:center;gap:.5rem;width:100%;padding:15px;border-radius:12px;background-color:#e7f4ec;color:#0f7a3d;font-size:.85rem;line-height:1.25;font-weight:600;transition:background-color .3s,color .3s}
.pldp-c__banner[hidden]{display:none}
.pldp-c__banner-ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;line-height:0;color:#1a9d54}
.pldp-c__banner-ico svg{display:block;width:20px;height:20px}
.pldp-c--dark .pldp-c__banner{background-color:rgba(26,157,84,.16);color:#8ce0ac}
.pldp-c--dark .pldp-c__banner-ico{color:#8ce0ac}

/* ===== Promotional tag ===== */
.pldp-c__tagwrap{display:flex;justify-content:flex-start;margin:10px 0}
.pldp-c__tag{display:inline-flex;align-items:center;background:#e7f4ec;color:#0f7a3d;font-size:.78rem;font-weight:600;line-height:1.2;padding:5px 12px;border-radius:40px;white-space:nowrap}
.pldp-c--dark .pldp-c__tag{background:rgba(255,255,255,.14);color:#fff}

/* ===== Promo tag ===== */
.pldp-c__tag{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:#f3ede9;color:#232222;font-size:.85rem;font-weight:600;line-height:1.25;padding:8px 14px;border-radius:8px}
.pldp-c__tag-ico{display:inline-flex;align-items:center;justify-content:center;color:#d04841;line-height:0;flex:0 0 auto}
.pldp-c__tag-ico svg{width:15px;height:15px;fill:currentColor}
.pldp-c__tag-ico i{font-size:14px}
.pldp-c--dark .pldp-c__tag{background:rgba(255,255,255,.12);color:#fff}
.pldp-c--dark .pldp-c__tag-ico{color:#fff}

/* tag beside eyebrow or heading, top right position */
.pldp-c__headrow{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.pldp-c__headrow > .pldp-c__eyebrow,
.pldp-c__headrow > .pldp-c__heading{flex:1 1 auto;min-width:0}
.pldp-c__headrow > .pldp-c__tag{flex:0 0 auto}







/* ===== Animated button border =====
   The ring lives on ::before. ::after is reserved for the chevron that comes
   from the site Global CSS class pld-btn-chevron, so it must never be touched
   here. The ring sits on a pseudo-element positioned just outside the button,
   so the button's own size and padding are unchanged, and the mask keeps only
   the ring itself so the fill is never covered. A conic gradient rotates
   behind the mask, which reads as a lit segment travelling around the edge. */
@property --pldp-beam-angle{
  syntax:'<angle>';
  initial-value:0deg;
  inherits:false;
}

.pldp-c--beam .pldp-c__cta{
  --pldp-beam-1:#d04841;
  --pldp-beam-2:#b8352e;
  --pldp-beam-track:transparent;
  --pldp-beam-w:2px;
  --pldp-beam-dur:6s;
  --pldp-beam-len:60deg;
  --pldp-beam-glow:0px;
  --pldp-beam-radius:12px;
  position:relative;
}

.pldp-c--beam .pldp-c__cta::before{
  content:"";
  position:absolute;
  inset:calc(var(--pldp-beam-w) * -1);
  /* an outer ring needs a larger radius than the button, or the corners
     pull tight and leave gaps where the segment passes */
  border-radius:calc(var(--pldp-beam-radius) + var(--pldp-beam-w));
  padding:var(--pldp-beam-w);
  pointer-events:none;

  --pldp-beam-angle:0deg;
  background:conic-gradient(from var(--pldp-beam-angle) at 50% 50%,
    var(--pldp-beam-track) 0deg,
    var(--pldp-beam-track) calc(360deg - var(--pldp-beam-len)),
    var(--pldp-beam-2)     calc(360deg - var(--pldp-beam-len) * 0.75),
    var(--pldp-beam-1)     calc(360deg - var(--pldp-beam-len) * 0.25),
    var(--pldp-beam-track) 360deg);

  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
          mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;

  animation:pldp-beam-spin var(--pldp-beam-dur) linear infinite;
}

@keyframes pldp-beam-spin{
  from{ --pldp-beam-angle:0deg }
  to  { --pldp-beam-angle:360deg }
}

/* optional halo on the segment only */
.pldp-c--beam .pldp-c__cta::before{
  filter:drop-shadow(0 0 var(--pldp-beam-glow) var(--pldp-beam-1));
}

@media (prefers-reduced-motion: reduce){
  .pldp-c--beam .pldp-c__cta::before{ animation:none }
}

/* ===== View more link =====
   Rendered as a button for keyboard and screen reader behaviour, but styled as
   a plain link: no background in either state, so the theme's button styles
   cannot bleed in. The chevron is a rotated CSS square, pointing down when
   closed and up when open. */
.pldp-c__viewmore{
  --pldp-vm-ico:7px;
  --pldp-vm-ico-w:1.5px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  align-self:flex-start;
  
  padding:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
  font-family:inherit;
  font-size:.9rem;
  font-weight:500;
  line-height:1.2;
  color:#232222;
  text-transform:none;
  text-decoration:none;
  cursor:pointer;
  transition:color .2s ease;
}
.pldp-c__viewmore:hover,
.pldp-c__viewmore:focus-visible{
  background:none !important;
  text-decoration:none;
}
.pldp-c__viewmore-ico{
  display:inline-block;
  width:var(--pldp-vm-ico);
  height:var(--pldp-vm-ico);
  border-right:var(--pldp-vm-ico-w) solid currentColor;
  border-bottom:var(--pldp-vm-ico-w) solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);
  transform-origin:center;
  transition:transform .25s cubic-bezier(.4,0,.2,1);
  flex:0 0 auto;
}
.pldp-c--expanded .pldp-c__viewmore-ico{
  transform:rotate(-135deg) translate(-1px,-1px);
}

/* No margins are set on card elements here. Every gap comes from the Spacing
   section in the Style tab, so there is one place to look and nothing in this
   stylesheet to override it. */