
:root{
  --ivy-wz-accent:#7CFF6B;
  --ivy-wz-bg:#05070C;
  --ivy-wz-surface:rgba(14,18,28,.78);
  --ivy-wz-surface2:rgba(14,18,28,.62);
  --ivy-wz-border:rgba(255,255,255,.08);
  --ivy-wz-text:rgba(255,255,255,.92);
  --ivy-wz-muted:rgba(255,255,255,.62);
  --ivy-wz-shadow:0 28px 90px rgba(0,0,0,.60);
  --ivy-wz-radius:22px;
  /* Provide the accent colour in RGB so alpha values can be computed.
   * Defaults to the Neon Ivy green. Child themes/presets override this. */
  --ivy-wz-accent-rgb:124,255,107;
}
.ivy-wz{
  position:relative;
  width:100%;
  min-height:var(--ivy-wz-hero-height,760px);
  overflow:hidden;
  isolation:isolate;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  background:var(--ivy-wz-bg);
}
.ivy-wz[data-theme="clean-light"]{
  --ivy-wz-bg:#F6F7FB;
  --ivy-wz-surface:rgba(255,255,255,.92);
  --ivy-wz-surface2:rgba(255,255,255,.82);
  --ivy-wz-border:rgba(13,18,32,.10);
  --ivy-wz-text:rgba(13,18,32,.92);
  --ivy-wz-muted:rgba(13,18,32,.62);
  --ivy-wz-shadow:0 26px 80px rgba(0,0,0,.18);
}

/* Preset themes (set in Admin → Ivy Wizard → Theme preset) */
.ivy-wz[data-preset="os_black"]{
  --ivy-wz-bg:#05070C;
  --ivy-wz-surface:rgba(14,18,28,.78);
  --ivy-wz-surface2:rgba(14,18,28,.62);
  --ivy-wz-border:rgba(255,255,255,.08);
  --ivy-wz-text:rgba(255,255,255,.92);
  --ivy-wz-muted:rgba(255,255,255,.62);
  --ivy-wz-shadow:0 28px 90px rgba(0,0,0,.60);
}
.ivy-wz[data-preset="graphite"]{
  --ivy-wz-bg:#060810;
  --ivy-wz-surface:rgba(18,22,34,.82);
  --ivy-wz-surface2:rgba(18,22,34,.66);
  --ivy-wz-border:rgba(255,255,255,.10);
  --ivy-wz-text:rgba(255,255,255,.92);
  --ivy-wz-muted:rgba(255,255,255,.60);
  --ivy-wz-shadow:0 30px 95px rgba(0,0,0,.62);
}
.ivy-wz[data-preset="midnight_violet"]{
  --ivy-wz-bg:#05060E;
  --ivy-wz-surface:rgba(18,16,36,.78);
  --ivy-wz-surface2:rgba(18,16,36,.62);
  --ivy-wz-border:rgba(255,255,255,.08);
}
.ivy-wz[data-preset="mono"]{
  --ivy-wz-bg:#070A10;
  --ivy-wz-surface:rgba(15,18,26,.80);
  --ivy-wz-surface2:rgba(15,18,26,.64);
  --ivy-wz-border:rgba(255,255,255,.10);
}
.ivy-wz[data-preset="nebula_dark"]{
  /* Nebula Dark – refined SaaS palette. See admin settings. */
  --ivy-wz-bg:#070B14;
  --ivy-wz-surface:rgba(16,22,36,.85);
  --ivy-wz-surface2:rgba(16,22,36,.70);
  --ivy-wz-border:rgba(255,255,255,.08);
  --ivy-wz-text:#E6EDF3;
  --ivy-wz-muted:rgba(255,255,255,.60);
  --ivy-wz-shadow:0 30px 90px rgba(0,0,0,.60);
  --ivy-wz-accent:#8B5CF6;
  --ivy-wz-accent-rgb:139,92,246;
}
.ivy-wz[data-preset="clean_light"]{
  /* Use with Theme = Clean (light) */
  --ivy-wz-shadow:0 26px 80px rgba(0,0,0,.16);
}

.ivy-wz__bg{
  position:absolute;inset:0;
  background:var(--ivy-wz-bg);
  background-position:center;
  background-size:cover;
  z-index:0;
}
.ivy-wz__overlay{
  position:absolute;inset:0;
  background:rgba(0,0,0,.55);
  opacity:var(--ivy-wz-overlay,.55);
  z-index:1;
}
.ivy-wz__inner{
  position:relative;z-index:2;
  min-height:var(--ivy-wz-hero-height,760px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:56px 18px;
  gap:22px;
}
.ivy-wz[data-layout="split-left"] .ivy-wz__inner{justify-content:flex-start;}
.ivy-wz[data-layout="split-right"] .ivy-wz__inner{justify-content:flex-end;flex-direction:row-reverse;}
.ivy-wz[data-layout="card-only"] .ivy-wz__ivy{display:none;}

.ivy-wz__card{
  width:min(var(--ivy-wz-card-width,660px),100%);
  border-radius:var(--ivy-wz-radius);
  background:var(--ivy-wz-surface);
  color:var(--ivy-wz-text);
  border:1px solid var(--ivy-wz-border);
  box-shadow:var(--ivy-wz-shadow);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  position:relative;

  display:flex;
  flex-direction:column;
  max-height:min(720px, calc(100vh - 120px));
}
.ivy-wz__card:before{
  content:"";
  position:absolute;inset:0;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.ivy-wz__top{padding:18px 18px 10px;}
.ivy-wz__body{padding:10px 18px 18px;
  flex:1;
  min-height:0;
  overflow:auto;
  padding-bottom:22px;
}
.ivy-wz__bottom{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 18px 18px;
  border-top:1px solid var(--ivy-wz-border);
}
.ivy-wz__brand{display:flex;align-items:center;gap:10px;}
.ivy-wz__dot{
  width:10px;height:10px;border-radius:999px;background:var(--ivy-wz-accent);
  box-shadow:0 0 0 6px rgba(var(--ivy-wz-accent-rgb,124,255,107),.10), 0 0 22px rgba(var(--ivy-wz-accent-rgb,124,255,107),.22);
}
.ivy-wz__brandname{font-weight:850;font-size:14px;letter-spacing:.02em;}
.ivy-wz__tagline{font-size:12px;color:var(--ivy-wz-muted);margin-top:2px;}

.ivy-wz__progress{
  margin-top:12px;height:8px;border-radius:999px;background:rgba(255,255,255,.06);
  overflow:hidden;border:1px solid rgba(255,255,255,.06);
}
.ivy-wz[data-theme="clean-light"] .ivy-wz__progress{background:rgba(13,18,32,.06);border-color:rgba(13,18,32,.06);}
.ivy-wz__progressbar{
  height:100%;width:0%;
  background:var(--ivy-wz-accent);
  border-radius:999px;
  transition:width 260ms ease;
}
.ivy-wz__title{
  margin:10px 0 6px;
  font-size:clamp(24px,3.4vw,36px);
  letter-spacing:-.02em;line-height:1.06;
}
.ivy-wz__help{margin:0 0 16px;color:var(--ivy-wz-muted);font-size:14px;line-height:1.55;}
.ivy-wz__error{
  margin-top:14px;padding:10px 12px;border-radius:14px;
  border:1px solid rgba(255,77,77,.35);
  background:rgba(255,77,77,.10);
  color:var(--ivy-wz-text);
  font-size:13px;
}

.ivy-wz__choices{display:grid;grid-template-columns:1fr;gap:12px;}
@media(min-width:560px){.ivy-wz__choices{grid-template-columns:1fr 1fr;}}
.ivy-wz__choice{
  text-align:left;padding:14px;border-radius:18px;
  border:1px solid var(--ivy-wz-border);
  background:rgba(255,255,255,.03);
  color:var(--ivy-wz-text);
  cursor:pointer;
  transition:transform 140ms ease, border-color 140ms ease, background 140ms ease;
}
.ivy-wz__choice:hover{transform:translateY(-1px);border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.22);background:rgba(255,255,255,.04);} 
.ivy-wz__choice.is-selected{border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.50);background:rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);box-shadow:0 0 0 1px rgba(var(--ivy-wz-accent-rgb,124,255,107),.06);} 
.ivy-wz__choiceTitle{font-weight:800;}

.ivy-wz__chips{display:flex;flex-wrap:wrap;gap:10px;}
.ivy-wz__chip{
  border-radius:999px;padding:10px 12px;
  border:1px solid var(--ivy-wz-border);
  background:rgba(255,255,255,.03);
  color:var(--ivy-wz-text);
  cursor:pointer;
  transition:background 130ms ease,border-color 130ms ease,transform 130ms ease;
  font-size:13px;
}
.ivy-wz__chip:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.12);}
.ivy-wz__chip.is-selected{border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.50);background:rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);} 

.ivy-wz__field{position:relative;}
.ivy-wz__textarea,.ivy-wz__input{
  width:100%;border-radius:18px;
  border:1px solid var(--ivy-wz-border);
  background:rgba(255,255,255,.03);
  color:var(--ivy-wz-text);
  padding:12px 12px;
  font-size:14px;
  outline:none;
}
.ivy-wz__textarea:focus,.ivy-wz__input:focus{border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.38);box-shadow:0 0 0 4px rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);} 

.ivy-wz__ai{
  position:absolute;right:10px;top:10px;
  border-radius:14px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--ivy-wz-text);
  padding:8px 10px;
  font-weight:800;
  cursor:pointer;
  transition:transform 140ms ease,background 140ms ease,border-color 140ms ease;
}
.ivy-wz__ai:hover{transform:translateY(-1px);background:rgba(255,255,255,.06);border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.22);} 

/*
 * Responsive grid for input fields and controls. Use auto-fit to adjust the
 * number of columns based on available width. Align items to the start so
 * labels and inputs line up neatly. Increase the gap for better breathing
 * room on mobile devices and provide consistent spacing at all breakpoints.
 */
.ivy-wz__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:16px;
  align-items:flex-start;
}

@media(min-width:560px){
  .ivy-wz__grid{
    gap:16px;
  }
}
.ivy-wz__label{display:block;font-size:12px;color:var(--ivy-wz-muted);margin-bottom:6px;}

.ivy-wz__plans{display:grid;grid-template-columns:1fr;gap:12px;}
@media(min-width:560px){.ivy-wz__plans{grid-template-columns:1fr 1fr;}}
@media(min-width:860px){.ivy-wz__plans{grid-template-columns:1fr 1fr 1fr;}}
/*
 * Plan card styles
 * Each card stretches to fill its grid cell and uses flexbox to
 * distribute content vertically. A relative positioning context
 * allows us to absolutely position the recommendation ribbon.
 */
.ivy-wz__plan{
  text-align:left;
  padding:14px;
  border-radius:18px;
  border:1px solid var(--ivy-wz-border);
  background:rgba(255,255,255,.03);
  cursor:pointer;
  transition:transform 140ms ease,border-color 140ms ease, background 140ms ease;
  display:flex;
  flex-direction:column;
  height:100%;
  position:relative;
}
/* Hover and selected states use the accent colour rather than hard‑coded green. */
.ivy-wz__plan:hover{
  transform:translateY(-1px);
  border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.22);
  background:rgba(255,255,255,.04);
}
.ivy-wz__plan.is-selected{
  border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.50);
  background:rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);
  box-shadow:0 0 0 1px rgba(var(--ivy-wz-accent-rgb,124,255,107),.06);
}

.ivy-wz__planTop{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px;}
.ivy-wz__planName{font-weight:900;font-size:14px;}
.ivy-wz__planPrice{font-weight:950;letter-spacing:-.01em;}
.ivy-wz__badge{
  display:inline-block;margin-left:8px;font-size:11px;padding:4px 8px;border-radius:999px;
  border:1px solid rgba(var(--ivy-wz-accent-rgb,124,255,107),.28);
  background:rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);
  font-weight:900;
}
.ivy-wz__planList{margin:0;padding-left:18px;color:var(--ivy-wz-muted);font-size:13px;line-height:1.5;}

/*
 * Remove internal scrollbars on the plan selection step. By default the
 * wizard card sets a max-height and scroll on the body to keep the
 * footprint compact. For the plan page this results in an awkward
 * scrollbar when there are multiple plans. Allow the card to grow
 * naturally for this step by removing the height restriction and
 * disabling overflow.
 */
.ivy-wz[data-step-type="plan"] .ivy-wz__card {
  max-height: none;
}
.ivy-wz[data-step-type="plan"] .ivy-wz__body {
  overflow: visible;
}

/*
 * Buttons: ensure text is centered both vertically and horizontally using
 * inline flexbox. This resolves alignment issues on various devices. We
 * also set a consistent border radius and padding so that the clickable
 * area feels balanced. Line height is reset to avoid awkward baseline
 * offsets.
 */
.ivy-wz__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.2;
  border-radius:16px;
  padding:10px 14px;
  font-weight:900;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform 140ms ease,filter 140ms ease,background 140ms ease,border-color 140ms ease;
}
.ivy-wz__btn:active{transform:translateY(1px);}
.ivy-wz__btn--primary{background:var(--ivy-wz-accent);color:#0A0F18;}
.ivy-wz__btn--primary:hover{filter:brightness(0.97);}
.ivy-wz__btn--ghost{background:transparent;border-color:var(--ivy-wz-border);color:var(--ivy-wz-text);}
.ivy-wz__btn--ghost:hover{border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.22);} 
.ivy-wz__terms{color:var(--ivy-wz-muted);font-size:12px;text-decoration:none;}
.ivy-wz__terms:hover{text-decoration:underline;}

.ivy-wz__tiles{position:absolute;inset:0;pointer-events:none;z-index:0;transition:transform 260ms ease;}
.ivy-wz__tile{
  position:absolute;width:180px;max-width:28vw;aspect-ratio:4/3;
  border-radius:18px;overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 20px 70px rgba(0,0,0,.38);
  background:rgba(255,255,255,.02);
  opacity:0;
  transform:translate3d(0,0,0) scale(.96);
  transition:transform 680ms cubic-bezier(.2,.9,.2,1),opacity 520ms ease;
  will-change:transform;
}
.ivy-wz__tile img{width:100%;height:100%;object-fit:cover;display:block;opacity:.96;}
.ivy-wz__tile.is-hot{
  border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.26);
  box-shadow:0 20px 70px rgba(0,0,0,.38), 0 0 0 1px rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);
}

.ivy-wz__prep{display:flex;align-items:center;gap:14px;margin-top:6px;}
.ivy-wz__spinner{width:20px;height:20px;border-radius:999px;border:2px solid rgba(255,255,255,.16);border-top-color:var(--ivy-wz-accent);animation:ivyWzSpin 1s linear infinite;}
@keyframes ivyWzSpin{to{transform:rotate(360deg);}}
.ivy-wz__checklist{margin:0;padding-left:18px;color:var(--ivy-wz-muted);font-size:13px;line-height:1.65;}
.ivy-wz__checklist li.on{color:var(--ivy-wz-text);font-weight:900;}

.ivy-wz__ivy{
  width:min(360px,35vw);
  display:flex;flex-direction:column;align-items:center;gap:12px;
  filter:drop-shadow(0 22px 60px rgba(0,0,0,.55));
}
.ivy-wz__ivyFrame{
  width:100%;
  aspect-ratio:4/5;
  border-radius:26px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  overflow:hidden;
  position:relative;
}
.ivy-wz__ivyMedia{width:100%;height:100%;object-fit:contain;display:block;}
.ivy-wz__ivyPlaceholder{
  width:100%;height:100%;
  background:
    radial-gradient(circle at 30% 25%, rgba(124,255,107,.14), transparent 55%),
    radial-gradient(circle at 70% 60%, rgba(167,139,250,.14), transparent 60%),
    rgba(255,255,255,.02);
}
.ivy-wz__hud{
  width:100%;
  border-radius:18px;
  background:var(--ivy-wz-surface2);
  border:1px solid var(--ivy-wz-border);
  padding:12px 14px;
  display:flex;align-items:center;justify-content:space-between;
}
.ivy-wz__hudName{font-weight:950;letter-spacing:-.01em;}
.ivy-wz__hudSub{font-size:12px;color:var(--ivy-wz-muted);font-weight:800;}

.ivy-wz__toast{
  position:absolute;
  left:50%;
  top:18px;
  transform:translateX(-50%);
  pointer-events:none;
  z-index:3;
  font-weight:950;
  letter-spacing:-.01em;
}
.ivy-wz__toastItem{
  display:inline-block;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color:var(--ivy-wz-text);
  box-shadow:0 18px 60px rgba(0,0,0,.30);
  opacity:0;
  transform:translateY(8px);
  animation:ivyWzToast 900ms ease forwards;
}
@keyframes ivyWzToast{
  20%{opacity:1;transform:translateY(0);}
  80%{opacity:1;transform:translateY(-8px);}
  100%{opacity:0;transform:translateY(-14px);}
}

@media (max-width:980px){
  .ivy-wz__inner{flex-direction:column;}
  .ivy-wz__ivy{width:min(420px,100%);}
}

@media (prefers-reduced-motion: reduce){
  .ivy-wz__progressbar,.ivy-wz__tile,.ivy-wz__btn,.ivy-wz__choice,.ivy-wz__plan,.ivy-wz__tiles{transition:none!important;}
  .ivy-wz__spinner{animation:none!important;}
  .ivy-wz__toastItem{animation:none!important;opacity:1;transform:none;}
}



/* === Plan step polish === */
.ivy-wz__plans{margin-top:6px; gap:14px;}
.ivy-wz__plan{
  padding:16px 16px 14px;
  border-radius:20px;
  background:rgba(255,255,255,.028);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border:1px solid var(--ivy-wz-border);
  cursor:pointer;
  transition:transform 140ms ease, border-color 140ms ease, background 140ms ease;
}
.ivy-wz__plan:hover{
  transform:translateY(-1px);
  border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.22);
  background:rgba(255,255,255,.04);
}
/* Selected plan inherits accent colour */
.ivy-wz__plan.is-selected{
  border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.50);
  background:rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);
  box-shadow:0 0 0 1px rgba(var(--ivy-wz-accent-rgb,124,255,107),.06);
}
.ivy-wz__planHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.ivy-wz__planName{font-weight:950;font-size:15px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px;}
.ivy-wz__planSub{font-size:12px;color:var(--ivy-wz-muted);font-weight:800;margin-top:3px;}
.ivy-wz__planMeta{display:flex;flex-direction:column;align-items:flex-end;gap:8px;}
.ivy-wz__planPrice{font-weight:950;letter-spacing:-.02em;font-size:14px;white-space:nowrap;}
.ivy-wz__planPrice span{font-size:11px;opacity:.7;font-weight:900;margin-left:4px;}
.ivy-wz__badge{
  margin:0;
  font-size:11px;
  padding:5px 10px;
  border-radius:999px;
}
.ivy-wz__planList{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
}
.ivy-wz__planList li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:var(--ivy-wz-muted);
}
.ivy-wz__planList li:before{
  content:"";
  width:8px;height:8px;border-radius:999px;
  margin-top:6px;
  background:rgba(var(--ivy-wz-accent-rgb,124,255,107),.85);
  box-shadow:0 0 0 4px rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);
  flex:none;
}
.ivy-wz__plan.is-selected .ivy-wz__planList li{color:var(--ivy-wz-text);}

/* Ribbon used to call out recommended plans */
.ivy-wz__ribbon{
  display:inline-block;
  background:var(--ivy-wz-accent);
  color:#0A0F18;
  padding:4px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
  white-space:nowrap;
  position:absolute;
  top:12px;
  right:12px;
}

.ivy-wz__bottom .ivy-wz__next{min-width:220px;}
.ivy-wz__bottom{background:rgba(0,0,0,0);}

/* Ivy panel placeholder: remove "old gradient" look */
.ivy-wz__ivyFrame{background:rgba(255,255,255,.02);}
.ivy-wz__ivyPlaceholder{
  background:rgba(255,255,255,.02);
}

.ivy-wz__ivy{width:min(320px,32vw);} 



/* === Cyber Ivy preset (slick game UI) === */
.ivy-wz[data-preset="cyber_ivy"]{
  --ivy-wz-bg:#03050A;
  --ivy-wz-surface:rgba(10,14,22,.78);
  --ivy-wz-surface2:rgba(10,14,22,.62);
  --ivy-wz-border:rgba(255,255,255,.10);
  --ivy-wz-shadow:0 34px 120px rgba(0,0,0,.70);
  --ivy-wz-radius:26px;
  --ivy-wz-accent2:#A78BFA;
}

/*
 * Start hero styles (used by the [ivy_wizard_start] shortcode). These
 * classes live outside of the main .ivy-wz card and replicate the hero
 * experience on a landing page. The design borrows variables from the
 * wizard theme to ensure visual consistency.
 */
.ivy-wz-start{
  position:relative;
  /* Break out of theme containers to span the full viewport width.
     Using 100vw ensures the hero always touches the screen edges, while
     the negative margin centres it relative to the page content. */
  width:100vw;
  margin-left:calc(50% - 50vw);
  min-height:var(--ivy-wz-hero-height,760px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:56px 18px;
  overflow:hidden;
  color:var(--ivy-wz-text);
  background:var(--ivy-wz-bg);
  isolation:isolate;
}
.ivy-wz-start[data-theme="clean-light"]{
  /* Override background for light theme */
  --ivy-wz-bg:#F6F7FB;
  --ivy-wz-text:rgba(13,18,32,.92);
  --ivy-wz-muted:rgba(13,18,32,.62);
  --ivy-wz-border:rgba(13,18,32,.10);
}
.ivy-wz-start__bg,
.ivy-wz-start__overlay{
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  z-index:0;
}
.ivy-wz-start__overlay{
  background:rgba(0,0,0,.55);
  opacity:var(--ivy-wz-overlay,.55);
  z-index:1;
}
.ivy-wz-start__inner{
  position:relative;
  z-index:2;
  max-width:820px;
  width:100%;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.ivy-wz-start__headline{
  margin:0 0 12px;
  font-size:clamp(28px,5vw,48px);
  font-weight:900;
  letter-spacing:-.02em;
}
.ivy-wz-start__subhead{
  margin:0 0 24px;
  font-size:16px;
  line-height:1.45;
  color:var(--ivy-wz-muted);
  max-width:640px;
}
.ivy-wz-start__form{
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:stretch;
  width:100%;
  max-width:640px;
  margin-bottom:12px;
}
@media(min-width:560px){
  .ivy-wz-start__form{
    flex-direction:row;
  }

/* ---------------------------------------------------------------------
 * Plan layout modifiers
 *
 * Administrators can choose how plans are arranged using the Plan
 * Layout option in the settings. These classes adjust the grid
 * structure. Default (no modifier) uses mobile-first styles defined
 * above. The grid variation mimics the default behaviour. Cards
 * emphasises up to two per row at medium breakpoints and three at
 * larger sizes. Stacked displays a single column regardless of
 * viewport width.
 */
/* Grid layout: favour larger cards by capping at two columns on wider screens. */
.ivy-wz__plans--grid{
  grid-template-columns:1fr;
}
@media(min-width:560px){.ivy-wz__plans--grid{grid-template-columns:1fr 1fr;}}
@media(min-width:860px){.ivy-wz__plans--grid{grid-template-columns:1fr 1fr;}}

/* Cards layout: same as grid – two columns when space permits */
.ivy-wz__plans--cards{
  grid-template-columns:1fr;
}
@media(min-width:680px){.ivy-wz__plans--cards{grid-template-columns:1fr 1fr;}}
@media(min-width:1024px){.ivy-wz__plans--cards{grid-template-columns:1fr 1fr;}}

.ivy-wz__plans--stacked{
  grid-template-columns:1fr;
}
.ivy-wz__plans--stacked .ivy-wz__plan{
  margin-bottom:16px;
}
}
.ivy-wz-start__input{
  flex:1;
  border-radius:18px;
  border:1px solid var(--ivy-wz-border);
  background:rgba(255,255,255,.03);
  color:var(--ivy-wz-text);
  padding:12px 14px;
  font-size:16px;
  outline:none;
  min-width:0;
}
.ivy-wz-start__input::placeholder{
  color:var(--ivy-wz-muted);
}
.ivy-wz-start__input:focus{
  border-color:rgba(var(--ivy-wz-accent-rgb,124,255,107),.38);
  box-shadow:0 0 0 4px rgba(var(--ivy-wz-accent-rgb,124,255,107),.10);
}
.ivy-wz-start__btn{
  white-space:nowrap;
}
.ivy-wz-start__note{
  margin-top:12px;
  font-size:14px;
  color:var(--ivy-wz-text);
}
.ivy-wz-start__suggestions{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
}
.ivy-wz-start__chips button{
  margin-top:8px;
}
.ivy-wz-start__cta{
  min-width:240px;
}
.ivy-wz-start__cta-note{
  margin-top:20px;
  font-size:12px;
  color:var(--ivy-wz-muted);
}

/*
 * Two‑column layout for the Ivy Start hero. When the [ivy_wizard_start]
 * shortcode is used with the Ivy Start settings, the hero displays an
 * illustration on the left and text/form on the right. On small screens
 * the columns stack vertically for better readability. The illustration is
 * constrained to a reasonable width and maintains its aspect ratio. The
 * right column inherits the standard headline and form styling but
 * re‑aligns text to the left on larger viewports.
 */
.ivy-wz-start__cols{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:32px;
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:20px;
  box-sizing:border-box;
}
@media(min-width:880px){
  .ivy-wz-start__cols{
    flex-direction:row;
    align-items:center;
  }
}
.ivy-wz-start__left,
.ivy-wz-start__right{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  box-sizing:border-box;
}
.ivy-wz-start__left{
  padding:20px;
}
.ivy-wz-start__illustration{
  width:100%;
  max-width:480px;
  height:auto;
  border-radius:var(--ivy-wz-radius);
  object-fit:contain;
}
.ivy-wz-start__left video,
.ivy-wz-start__left img{
  width:100%;
  height:auto;
  border-radius:var(--ivy-wz-radius);
}
.ivy-wz-start__right{
  padding:20px;
  text-align:center;
}
@media(min-width:880px){
  .ivy-wz-start__right{
    align-items:flex-start;
    text-align:left;
  }
  .ivy-wz-start__headline{
    text-align:left;
  }
  .ivy-wz-start__subhead{
    text-align:left;
  }
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__overlay{opacity:.62;}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__card{
  background:
    radial-gradient(1200px 420px at 25% -10%, rgba(124,255,107,.10), transparent 60%),
    radial-gradient(900px 360px at 85% 0%, rgba(167,139,250,.10), transparent 62%),
    rgba(10,14,22,.82);
  border:1px solid rgba(255,255,255,.10);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__card:before{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(255,255,255,.06);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__top{
  padding:20px 22px 12px;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__body{
  padding:12px 22px 20px;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__bottom{
  padding:16px 22px 22px;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__brandname{
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:13px;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__tagline{
  text-transform:uppercase;
  letter-spacing:.10em;
  font-weight:800;
  opacity:.72;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__progress{
  height:10px;
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.06);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__progressbar{
  box-shadow:0 0 0 6px rgba(124,255,107,.10), 0 0 26px rgba(124,255,107,.18);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__title{
  font-size:clamp(22px,2.8vw,32px);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__help{
  opacity:.78;
}

/* Ivy panel polish */
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__ivyFrame{
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(520px 220px at 30% 15%, rgba(124,255,107,.10), transparent 55%),
    rgba(255,255,255,.02);
  box-shadow:0 28px 90px rgba(0,0,0,.55);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__hud{
  background:rgba(10,14,22,.62);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__hudName{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:12px;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__hudSub{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
}

/* Plan accents by key */
.ivy-wz__plan{--plan-accent:var(--ivy-wz-accent);}
.ivy-wz__plan[data-plan="vine"]{--plan-accent:var(--ivy-wz-accent2,#A78BFA);}
.ivy-wz__plan[data-plan="seed"]{--plan-accent:var(--ivy-wz-accent);}
.ivy-wz__plan[data-plan="canopy"]{--plan-accent:var(--ivy-wz-accent);}
.ivy-wz__plan[data-plan="sprout"]{--plan-accent:#38BDF8;}
.ivy-wz__plan[data-plan="arbor"]{--plan-accent:#38BDF8;}
.ivy-wz__plan[data-plan="evergreen"]{--plan-accent:var(--ivy-wz-accent);}

.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__plan{
  border-color:rgba(255,255,255,.10);
  background:rgba(255,255,255,.02);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__plan:hover{
  border-color:rgba(255,255,255,.14);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__plan.is-selected{
  border-color:color-mix(in srgb, var(--plan-accent) 55%, rgba(255,255,255,.10));
  box-shadow:
    0 18px 70px rgba(0,0,0,.35),
    0 0 0 1px rgba(0,0,0,.20),
    0 0 0 6px color-mix(in srgb, var(--plan-accent) 14%, transparent);
  background:color-mix(in srgb, var(--plan-accent) 10%, rgba(255,255,255,.02));
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__planName{
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:13px;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__planPrice{
  font-size:13px;
  font-weight:950;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__planList li:before{
  background:var(--plan-accent);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--plan-accent) 16%, transparent);
}

/* Recommended ribbon */
.ivy-wz__ribbon{
  position:absolute;
  top:12px; right:12px;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:950;
  letter-spacing:.10em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
}
.ivy-wz[data-preset="cyber_ivy"] .ivy-wz__ribbon{
  border-color:color-mix(in srgb, var(--plan-accent) 35%, rgba(255,255,255,.10));
  background:color-mix(in srgb, var(--plan-accent) 12%, rgba(255,255,255,.02));
}

/* Checkout CTA button with price */
.ivy-wz__next.is-checkout{
  min-width:320px;
  padding:14px 16px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:950;
}
.ivy-wz__next .ivy-wz__ctaPrice{
  font-size:18px;
  letter-spacing:-.02em;
}
.ivy-wz__next .ivy-wz__ctaLabel{
  font-size:12px;
  opacity:.95;
}

/*
 * Plan images and layout adjustments
 *
 * Each plan card now supports a top image representing the plan. We make
 * the image area responsive by using a padding‑bottom trick to preserve
 * the aspect ratio. When no image is provided, the placeholder class
 * applies a subtle gradient so cards remain cohesive. The plan info
 * container holds the heading and feature list.
 */
.ivy-wz__plan{
  display:flex;
  flex-direction:column;
  align-items:stretch;
}
/* Plan image container: maintain a 5:3 aspect ratio for more visual breathing room */
.ivy-wz__planImg{
  width:100%;
  height:0;
  padding-bottom:60%;
  border-radius:16px;
  overflow:hidden;
  background:linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  margin-bottom:14px;
}
.ivy-wz__planImg img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.ivy-wz__planImg--placeholder{
  /* fallback gradient for plans without images */
  background:linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}
.ivy-wz__planInfo{
  flex:1;
}


.ivy-wz__btn--primary{box-shadow:0 10px 40px rgba(0,0,0,.30), 0 0 0 1px rgba(0,0,0,.25);} 
/**
 * Ivy Wizard Enhanced Styles
 * v2.0.0
 */

:root {
  --ivy-wz-accent: #7CFF6B;
  --ivy-wz-bg: #05070C;
  --ivy-wz-surface: rgba(14, 18, 28, 0.78);
  --ivy-wz-surface2: rgba(14, 18, 28, 0.62);
  --ivy-wz-border: rgba(255, 255, 255, 0.08);
  --ivy-wz-text: rgba(255, 255, 255, 0.92);
  --ivy-wz-muted: rgba(255, 255, 255, 0.62);
  --ivy-wz-shadow: 0 28px 90px rgba(0, 0, 0, 0.60);
  --ivy-wz-radius: 22px;
  --ivy-wz-transition: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Start Hero Section */
.ivy-wz-start {
  position: relative;
  width: 100%;
  min-height: var(--ivy-wz-hero-height, 100vh);
  overflow: hidden;
  isolation: isolate;
  font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ivy-wz-start__bg {
  position: absolute;
  inset: 0;
  background: var(--ivy-wz-bg);
  background-position: center;
  background-size: cover;
  z-index: 0;
}

.ivy-wz-start__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.6) 0%, rgba(5, 7, 12, 0.4) 100%);
  opacity: var(--ivy-wz-overlay, 0.4);
  z-index: 1;
}

/* Particle Animation */
.ivy-wz-start__particles {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

.particle {
  position: absolute;
  background: radial-gradient(circle, rgba(124, 255, 107, 0.8) 0%, rgba(124, 255, 107, 0) 70%);
  border-radius: 50%;
  animation: float linear infinite;
  opacity: 0.3;
}

@keyframes float {
  0% {
    transform: translateY(0) translateX(0) scale(1);
    opacity: 0;
  }
  10% {
    opacity: 0.3;
  }
  90% {
    opacity: 0.3;
  }
  100% {
    transform: translateY(-100vh) translateX(50px) scale(0.5);
    opacity: 0;
  }
}

.ivy-wz-start__inner {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 40px 24px;
}

.ivy-wz-start__content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 60px;
}

.ivy-wz-start__left {
  flex: 0 0 400px;
  display: none;
}

@media (min-width: 1024px) {
  .ivy-wz-start__left {
    display: block;
  }
}

.ivy-wz-start__illustration {
  width: 100%;
  height: auto;
  max-height: 600px;
  object-fit: contain;
  filter: drop-shadow(0 20px 60px rgba(0, 0, 0, 0.4));
  animation: floatIllustration 6s ease-in-out infinite;
}

@keyframes floatIllustration {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-20px);
  }
}

.ivy-wz-start__main {
  flex: 1;
  max-width: 680px;
  margin: 0 auto;
}

.ivy-wz-start__card {
  background: var(--ivy-wz-surface);
  border: 1px solid var(--ivy-wz-border);
  border-radius: 24px;
  padding: 48px 40px;
  box-shadow: var(--ivy-wz-shadow);
  backdrop-filter: blur(20px);
  position: relative;
  overflow: hidden;
}

.ivy-wz-start__glow {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(124, 255, 107, 0.15) 0%, transparent 50%);
  animation: glowPulse 8s ease-in-out infinite;
  pointer-events: none;
}

@keyframes glowPulse {
  0%, 100% {
    opacity: 0.3;
    transform: scale(1);
  }
  50% {
    opacity: 0.6;
    transform: scale(1.1);
  }
}

.ivy-wz-start__headline {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--ivy-wz-text);
  margin: 0 0 16px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.ivy-wz-start__subhead {
  font-size: 1.125rem;
  color: var(--ivy-wz-muted);
  margin: 0 0 40px;
  line-height: 1.6;
}

/* Search Section */
.ivy-wz-start__search-wrapper {
  margin-bottom: 24px;
}

.ivy-wz-start__search-container {
  position: relative;
  margin-bottom: 16px;
}

.ivy-wz-start__input {
  width: 100%;
  padding: 18px 52px 18px 20px;
  font-size: 1.125rem;
  border: 2px solid var(--ivy-wz-border);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  color: var(--ivy-wz-text);
  transition: all 0.3s var(--ivy-wz-transition);
  font-family: 'Monaco', 'Courier New', monospace;
}

.ivy-wz-start__input:focus {
  outline: none;
  border-color: var(--ivy-wz-accent);
  background: rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 4px rgba(124, 255, 107, 0.1);
}

.ivy-wz-start__input::placeholder {
  color: var(--ivy-wz-muted);
  opacity: 0.5;
}

.ivy-wz-start__search-btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--ivy-wz-muted);
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s;
}

.ivy-wz-start__search-btn:hover {
  color: var(--ivy-wz-accent);
}

.ivy-wz-start__search-icon {
  width: 20px;
  height: 20px;
  stroke-width: 2;
}

.ivy-wz-start__check-btn {
  width: 100%;
  padding: 18px 32px;
  font-size: 1rem;
  font-weight: 600;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: all 0.3s var(--ivy-wz-transition);
}

.ivy-wz-start__arrow {
  width: 20px;
  height: 20px;
  transition: transform 0.3s var(--ivy-wz-transition);
}

.ivy-wz-start__check-btn:hover .ivy-wz-start__arrow {
  transform: translateX(4px);
}

.ivy-wz-start__spinner {
  width: 20px;
  height: 20px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* Results Section */
.ivy-wz-start__results {
  margin-top: 32px;
  animation: slideIn 0.3s var(--ivy-wz-transition);
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ivy-wz-start__status-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 10px;
  font-weight: 500;
  font-size: 0.95rem;
  margin-bottom: 16px;
}

.ivy-wz-start__status-badge svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.ivy-wz-start__status--success {
  background: rgba(124, 255, 107, 0.15);
  color: #7CFF6B;
  border: 1px solid rgba(124, 255, 107, 0.3);
}

.ivy-wz-start__status--warning {
  background: rgba(255, 193, 7, 0.15);
  color: #FFC107;
  border: 1px solid rgba(255, 193, 7, 0.3);
}

.ivy-wz-start__status--error {
  background: rgba(244, 67, 54, 0.15);
  color: #F44336;
  border: 1px solid rgba(244, 67, 54, 0.3);
}

.ivy-wz-start__domain-info {
  margin-top: 16px;
}

.ivy-wz-start__selected-domain {
  background: rgba(124, 255, 107, 0.08);
  border: 1px solid rgba(124, 255, 107, 0.2);
  border-radius: 12px;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.ivy-wz-start__selected-label {
  font-size: 0.875rem;
  color: var(--ivy-wz-muted);
  font-weight: 500;
}

.ivy-wz-start__selected-name {
  font-size: 1.125rem;
  color: var(--ivy-wz-accent);
  font-weight: 600;
  font-family: 'Monaco', 'Courier New', monospace;
}

.ivy-wz-start__info-text {
  color: var(--ivy-wz-muted);
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: 16px;
}

.ivy-wz-start__info-text--small {
  font-size: 0.875rem;
  margin-top: 20px;
  margin-bottom: 12px;
}

.ivy-wz-start__select-anyway-btn {
  width: 100%;
  padding: 14px 24px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--ivy-wz-border);
  border-radius: 10px;
  color: var(--ivy-wz-text);
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  margin-top: 16px;
}

.ivy-wz-start__select-anyway-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--ivy-wz-accent);
}

/* Suggestions Grid */
.ivy-wz-start__suggestions {
  margin-top: 32px;
  animation: slideIn 0.3s var(--ivy-wz-transition);
}

.ivy-wz-start__suggestion-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.ivy-wz-start__suggestion-card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--ivy-wz-border);
  border-radius: 12px;
  padding: 16px;
  transition: all 0.3s var(--ivy-wz-transition);
  cursor: pointer;
}

.ivy-wz-start__suggestion-card:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--ivy-wz-accent);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(124, 255, 107, 0.1);
}

.ivy-wz-start__suggestion-card.is-selected {
  background: rgba(124, 255, 107, 0.1);
  border-color: var(--ivy-wz-accent);
  box-shadow: 0 0 0 3px rgba(124, 255, 107, 0.2);
}

.ivy-wz-start__suggestion-domain {
  font-size: 1rem;
  font-weight: 600;
  color: var(--ivy-wz-text);
  margin-bottom: 8px;
  font-family: 'Monaco', 'Courier New', monospace;
  word-break: break-all;
}

.ivy-wz-start__suggestion-price {
  font-size: 0.875rem;
  color: var(--ivy-wz-accent);
  margin-bottom: 12px;
}

.ivy-wz-start__suggestion-btn {
  width: 100%;
  padding: 8px 16px;
  background: var(--ivy-wz-accent);
  color: #000;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.ivy-wz-start__suggestion-btn:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 12px rgba(124, 255, 107, 0.3);
}

.ivy-wz-start__suggestion-btn svg {
  width: 16px;
  height: 16px;
}

/* TLD Filters */
.ivy-wz-start__tld-filters {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--ivy-wz-border);
}

.ivy-wz-start__filter-label {
  display: block;
  font-size: 0.875rem;
  color: var(--ivy-wz-muted);
  margin-bottom: 12px;
  font-weight: 500;
}

.ivy-wz-start__tld-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ivy-wz-start__tld-btn {
  padding: 8px 16px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--ivy-wz-border);
  border-radius: 8px;
  color: var(--ivy-wz-text);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.ivy-wz-start__tld-btn:hover {
  background: rgba(124, 255, 107, 0.1);
  border-color: var(--ivy-wz-accent);
  color: var(--ivy-wz-accent);
}

/* CTA Button */
.ivy-wz-start__cta {
  width: 100%;
  padding: 20px 32px;
  margin-top: 32px;
  font-size: 1.125rem;
  font-weight: 600;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  position: relative;
  overflow: hidden;
  animation: slideIn 0.3s var(--ivy-wz-transition);
}

.ivy-wz-start__cta svg {
  width: 20px;
  height: 20px;
  transition: transform 0.3s var(--ivy-wz-transition);
}

.ivy-wz-start__cta:hover svg {
  transform: translateX(4px);
}

.ivy-wz-start__cta-note {
  text-align: center;
  font-size: 0.875rem;
  color: var(--ivy-wz-muted);
  margin-top: 20px;
  margin-bottom: 0;
}

/* Button Styles */
/*
 * Override base button styles to ensure vertical text alignment. We
 * explicitly define display:flex to inherit our earlier flexbox
 * centering and avoid inconsistent spacing on certain devices.
 */
.ivy-wz__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  font-size: 1rem;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.3s var(--ivy-wz-transition);
  font-family: inherit;
}

.ivy-wz__btn--primary {
  background: var(--ivy-wz-accent);
  color: #000;
}

.ivy-wz__btn--primary:hover:not(:disabled) {
  background: #6EE85B;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(124, 255, 107, 0.3);
}

.ivy-wz__btn--primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ivy-wz__btn--glow {
  position: relative;
  background: var(--ivy-wz-accent);
  color: #000;
}

.ivy-wz__btn--glow::before {
  content: '';
  position: absolute;
  inset: -2px;
  background: linear-gradient(45deg, var(--ivy-wz-accent), #6EE85B, var(--ivy-wz-accent));
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s;
}

.ivy-wz__btn--glow:hover::before {
  opacity: 1;
  animation: borderGlow 2s linear infinite;
}

@keyframes borderGlow {
  0% {
    filter: hue-rotate(0deg);
  }
  100% {
    filter: hue-rotate(360deg);
  }
}

/* Responsive */
@media (max-width: 768px) {
  .ivy-wz-start__card {
    padding: 32px 24px;
  }

  .ivy-wz-start__headline {
    font-size: 2rem;
  }

  .ivy-wz-start__subhead {
    font-size: 1rem;
  }

  .ivy-wz-start__suggestion-grid {
    grid-template-columns: 1fr;
  }

  .ivy-wz-start__content {
    gap: 32px;
  }
}

@media (max-width: 480px) {
  .ivy-wz-start__headline {
    font-size: 1.75rem;
  }

  .ivy-wz-start__input {
    font-size: 1rem;
    padding: 16px 48px 16px 16px;
  }

  .ivy-wz-start__check-btn {
    font-size: 0.95rem;
    padding: 16px 24px;
  }
}

/* Loading States */
.ivy-wz-start__loading {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 3px solid rgba(255, 255, 255, 0.1);
  border-top-color: var(--ivy-wz-accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Focus styles */
.ivy-wz-start__input:focus,
.ivy-wz-start__check-btn:focus,
.ivy-wz-start__suggestion-btn:focus,
.ivy-wz-start__tld-btn:focus,
.ivy-wz-start__cta:focus {
  outline: 2px solid var(--ivy-wz-accent);
  outline-offset: 2px;
}

/* Apply custom colors and sizing from admin settings */
.ivy-wz-start__card {
  background: var(--start-card-bg, rgba(14, 18, 28, 0.85)) !important;
  padding: var(--start-card-padding, 60px 48px) !important;
  border-radius: var(--start-card-radius, 24px) !important;
  max-width: var(--start-card-max-width, 680px) !important;
  margin: 0 auto;
}

.ivy-wz-start__headline {
  color: var(--start-text, #FFFFFF) !important;
  font-size: var(--start-headline-size, 3rem) !important;
  margin-bottom: 20px !important;
}

.ivy-wz-start__subhead {
  color: var(--start-text, rgba(255, 255, 255, 0.75)) !important;
  font-size: var(--start-subhead-size, 1.125rem) !important;
  margin-bottom: 40px !important;
}

.ivy-wz-start__check-btn,
.ivy-wz-start__cta {
  background: var(--start-button-bg, #7CFF6B) !important;
  color: var(--start-button-text, #000000) !important;
  border-radius: var(--start-button-radius, 12px) !important;
  font-size: var(--start-button-size, 1.125rem) !important;
  font-weight: 600 !important;
}

.ivy-wz-start__input {
  border-radius: var(--start-input-radius, 12px) !important;
  padding: 18px 52px 18px 20px !important;
  font-size: 1.125rem !important;
}

.ivy-wz-start__suggestion-btn {
  background: var(--start-accent, #7CFF6B) !important;
  color: #000 !important;
}

.ivy-wz-start__status--success {
  background: rgba(124, 255, 107, 0.15) !important;
  color: var(--start-accent, #7CFF6B) !important;
  border-color: var(--start-accent, #7CFF6B) !important;
}

.ivy-wz-start__selected-name {
  color: var(--start-accent, #7CFF6B) !important;
}

.ivy-wz-start__tld-btn:hover {
  color: var(--start-accent, #7CFF6B) !important;
  border-color: var(--start-accent, #7CFF6B) !important;
}

/* Improved spacing */
.ivy-wz-start__search-wrapper {
  margin-bottom: 32px;
}

.ivy-wz-start__results {
  margin-top: 32px;
}

.ivy-wz-start__suggestions {
  margin-top: 32px;
}

.ivy-wz-start__cta {
  margin-top: 40px;
  padding: 20px 40px !important;
  width: 100%;
}

/* Better mobile spacing */
@media (max-width: 768px) {
  .ivy-wz-start__card {
    padding: 40px 24px !important;
  }
  
  .ivy-wz-start__headline {
    font-size: 2rem !important;
  }
}


/* === Ivy Wizard Pro v2.0.2 additions === */

/* Fix: Start hero should never be cut off on front page (theme headers/footers/admin bar) */
.ivy-wz-start{
  width: 100vw;
  max-width: 100vw;
  min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
  overflow: hidden;
}
.ivy-wz-start__inner{
  min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
}

/* Fix: button label centering (theme overrides) */
.ivy-wz__btn,
.ivy-wz__choice,
.ivy-wz__chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.1;
}

/* Plan cards: Image left large + bullets right */
.ivy-wz__plan{
  display:flex !important;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  width:100%;
}
.ivy-wz__planImg{
  width: 160px;
  height: 120px;
  margin-right: 0;
}
.ivy-wz__planImg img{
  width:100%;
  height:100%;
  object-fit: cover;
}
.ivy-wz__planInfo{
  flex:1;
  min-width: 0;
}
.ivy-wz__planList{
  margin-top: 10px;
}

