/* ==========================================================================
   start.css — "Get Listed" onboarding wizard (/start)
   Layered on top of style.css. Classes are unique to /start.

   Layout: form left (slim ring stepper above the fields), live preview right.
   The preview mirrors the real profile page (see company.css):
     hero(wave) → status cards → about+logo → gallery → services →
     highlights → contacts (sidebar on desktop, below on mobile) → reviews
   ========================================================================== */

:root{
  --s-brand:#6865e7;
  --s-brand-d:#524fd4;
  --s-ink:#150d15;        /* corporate text colour */
  --s-body:#5a5560;
  --s-muted:#8a8590;
  --s-line:#e6e9f2;
  --s-soft:#f1edfa;
  --s-pastel:#f7f7fb;
  --s-wave:#f4f2fb;       /* neutral hero fill in the preview */
  --s-green:#1f9d55;
}

/* Wider than the site's 1200px .container: /start is a working tool, and the
   form + live preview need the room. Capped so the form never gets unreadable
   on very wide monitors. */
.start-container{max-width:1500px}

.start-wrap{background:var(--s-pastel);padding:22px 0 80px;min-height:60vh}
.start-shell{max-width:1500px;margin:0 auto}

/* ---------- in-content page intro (replaces the gradient hero) ----------
   A white card on the pastel page: it separates the intro from the dark header
   above and the wizard below without the vertical cost of a hero band. */
.start-intro{margin:0 0 20px;background:#fff;border:1px solid var(--s-line);
  border-radius:14px;padding:18px 22px;box-shadow:0 1px 2px rgba(21,13,21,.04)}
/* On the type-choice step the content is a single centred 940px column, so the
   intro follows it; from step 1 the grid is full width and the intro is too. */
.start-intro.is-narrow{max-width:940px;margin-inline:auto}
.start-crumbs{margin-bottom:9px}
/* style.css paints breadcrumbs white for the gradient banner - repaint them
   for this light page. */
.start-crumbs a{color:var(--s-muted)}
.start-crumbs a:hover{color:var(--s-brand)}
.start-crumbs li[aria-current]{color:var(--s-body)}
/* the dot is drawn on ::before with a white fill for the gradient banner -
   recolour the pseudo-element, not the li, or it stays invisible here. */
.start-crumbs .breadcrumbs__sep::before{background:#c2c7d6}
.start-title{font-size:1.5rem;font-weight:800;color:var(--s-ink);margin:0 0 5px;line-height:1.25}
.start-lede{font-size:.92rem;color:var(--s-body);margin:0;max-width:760px;line-height:1.6}

/* ==========================================================================
   STEPPER — ring + pills
   ========================================================================== */
.wz-top{display:flex;align-items:center;gap:20px;background:#fff;border:1px solid var(--s-line);
  border-radius:16px;padding:14px 20px;margin-bottom:18px;flex-wrap:wrap}
.wz-top[hidden]{display:none}
.wz-ring{position:relative;width:74px;height:74px;flex:0 0 74px}
.wz-ring svg{width:74px;height:74px;transform:rotate(-90deg)}
.wz-ring circle{fill:none;stroke-width:6;stroke-linecap:round}
.wz-ring .wz-ring__bg{stroke:var(--s-line)}
.wz-ring .wz-ring__fg{stroke:url(#wzGrad);transition:stroke-dashoffset .5s cubic-bezier(.4,0,.2,1)}
.wz-ring__txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.wz-ring__txt b{font-size:1.02rem;font-weight:800;color:var(--s-ink);line-height:1}
.wz-ring__txt span{font-size:.55rem;font-weight:700;color:var(--s-muted);text-transform:uppercase;letter-spacing:.05em}

.wz-pills{display:flex;gap:7px;flex-wrap:wrap;flex:1}
.wz-pill{display:flex;align-items:center;gap:8px;padding:8px 13px;border-radius:10px;background:var(--s-pastel);
  border:1.5px solid transparent;transition:.25s;font:inherit;cursor:default}
.wz-pill i{width:19px;height:19px;border-radius:50%;background:#fff;border:1.5px solid var(--s-line);flex:0 0 19px;
  display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:800;color:var(--s-muted);
  font-style:normal;transition:.25s}
.wz-pill span{font-size:.8rem;font-weight:700;color:var(--s-muted);transition:.25s}
.wz-pill.is-active{background:var(--s-soft);border-color:var(--s-brand)}
.wz-pill.is-active i{background:var(--s-brand);border-color:var(--s-brand);color:#fff}
.wz-pill.is-active span{color:var(--s-ink)}
.wz-pill.is-done i{border-color:var(--s-green);color:transparent;
  background:var(--s-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/12px no-repeat}
.wz-pill.is-done span{color:var(--s-body)}
/* completed steps are clickable shortcuts */
.wz-pill.is-done{cursor:pointer}
.wz-pill.is-done:hover{background:#fff;border-color:var(--s-green)}

/* saved-draft note */
.wz-saved{font-size:.72rem;font-weight:700;color:var(--s-muted);display:flex;align-items:center;gap:5px;
  opacity:0;transition:opacity .3s}
.wz-saved.show{opacity:1}
.wz-saved svg{width:12px;height:12px;fill:var(--s-green)}

/* ==========================================================================
   COLUMNS
   ========================================================================== */
.wz-cols{display:grid;grid-template-columns:1fr 440px;gap:22px;align-items:start}
/* type-choice step: one column, centred - two cards must not span 1500px */
.wz-cols--single{grid-template-columns:1fr;max-width:940px;margin-inline:auto}

/* ==========================================================================
   PANELS
   ========================================================================== */
.wz-panel{background:#fff;border:1px solid var(--s-line);border-radius:20px;padding:28px 30px;
  box-shadow:0 14px 44px rgba(21,13,21,.07)}
.wz-panel[hidden]{display:none}
.wz-panel__head{margin-bottom:22px}
.wz-panel__eyebrow{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;color:var(--s-brand);margin-bottom:7px}
.wz-panel__title{margin:0 0 6px;font-size:1.35rem;font-weight:800;color:var(--s-ink);line-height:1.25}
.wz-panel__sub{margin:0;color:var(--s-body);font-size:.92rem;line-height:1.6}

/* ---------- type choice (2 cards) ---------- */
.wz-panel--choice{text-align:center}
.wz-panel--choice .wz-panel__head{text-align:center}
.wz-panel--choice .wz-panel__sub{max-width:560px;margin-inline:auto}
.wz-choice{display:grid;grid-template-columns:1fr 1fr;gap:18px;text-align:left}
.wz-card{text-align:left;background:#fff;border:2px solid var(--s-line);border-radius:16px;padding:26px 24px;
  cursor:pointer;transition:.18s;font:inherit;display:flex;flex-direction:column;gap:12px}
.wz-card:hover{border-color:var(--s-brand);transform:translateY(-2px);box-shadow:0 12px 30px rgba(104,101,231,.14)}
.wz-card__ic{width:54px;height:54px;border-radius:14px;background:var(--s-soft);display:flex;
  align-items:center;justify-content:center}
.wz-card__ic svg{width:30px;height:30px;color:#1c1730}
.wz-card__name{font-size:1.2rem;font-weight:800;color:var(--s-ink)}
.wz-card__desc{font-size:.92rem;color:var(--s-body);line-height:1.55}
.wz-card__go{margin-top:auto;font-weight:800;color:var(--s-brand);font-size:.9rem}

/* ---------- form fields ---------- */
.wz-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 16px}
.wz-field{display:flex;flex-direction:column;gap:6px}
.wz-field--full{grid-column:1 / -1}
.wz-field label{font-size:.82rem;font-weight:700;color:var(--s-ink)}
.wz-field label .req{color:var(--s-brand)}
.wz-field input,.wz-field select,.wz-field textarea{border:1.5px solid var(--s-line);border-radius:11px;
  padding:10px 13px;font:inherit;font-size:.92rem;background:#fff;color:var(--s-ink);width:100%;box-sizing:border-box}
/* One shared control height so the icon-selects (category/country) and the
   plain selects/inputs (subcategory/city) line up exactly. textarea excluded. */
.wz-field input,.wz-field select,.wz-sel__btn{min-height:46px}
.wz-field input:focus,.wz-field select:focus,.wz-field textarea:focus{outline:0;border-color:var(--s-brand);
  box-shadow:0 0 0 3px rgba(104,101,231,.14)}
.wz-field textarea{resize:vertical;min-height:92px}
.wz-field__hint{font-size:.76rem;color:var(--s-muted)}
.wz-field.is-invalid input,.wz-field.is-invalid select,.wz-field.is-invalid textarea{border-color:#e05353}
.wz-field__err{font-size:.76rem;color:#c23b3b;display:none}
.wz-field.is-invalid .wz-field__err{display:block}
.wz-count{font-size:.72rem;color:var(--s-muted);text-align:right}
.wz-count.over{color:#c23b3b;font-weight:700}

/* chips */
.wz-chips{display:flex;flex-wrap:wrap;gap:8px}
.wz-chips__hint{font-size:.85rem;color:var(--s-muted);font-style:italic}
.wz-chip{display:inline-flex;align-items:center;gap:6px;background:var(--s-soft);color:var(--s-ink);
  border:1.5px solid transparent;border-radius:999px;padding:7px 14px;font:inherit;font-size:.86rem;
  font-weight:700;cursor:pointer;transition:.15s}
.wz-chip:hover{border-color:var(--s-brand)}
.wz-chip.is-on{background:var(--s-brand);color:#fff}
.wz-chip__ic{display:inline-flex;width:16px;height:16px;flex:none}
.wz-chip__ic svg{width:16px;height:16px;color:inherit}

/* upload */
.wz-upload{border:2px dashed var(--s-line);border-radius:14px;padding:22px;text-align:center;color:var(--s-muted);
  background:var(--s-pastel);cursor:pointer;transition:.15s;display:block}
.wz-upload:hover{border-color:var(--s-brand);color:var(--s-brand)}
.wz-upload svg{width:28px;height:28px;fill:currentColor;margin-bottom:5px}
.wz-upload strong{display:block;color:var(--s-ink);font-size:.92rem}
.wz-upload span{font-size:.8rem}
.wz-thumbs{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.wz-thumb{width:54px;height:54px;border-radius:8px;object-fit:cover;border:1px solid var(--s-line)}
/* Same box the logo/avatar gets on the public profile (.cabout__logo img = 96px), so what you see here is what ships. */
.wz-upload__img{width:96px;height:96px;border-radius:16px;object-fit:cover;border:1px solid var(--s-line);margin:0 auto 8px;display:block;background:#fff}
.wz-upload.is-picked{border-style:solid;border-color:var(--s-brand);color:var(--s-ink)}
.wz-upload.is-picked svg{display:none}

/* ---------- packages ---------- */
.wz-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.wz-plan{position:relative;border:2px solid var(--s-line);border-radius:18px;padding:24px 20px;background:#fff;
  cursor:pointer;transition:.18s;display:flex;flex-direction:column}
.wz-plan:hover{border-color:var(--s-brand)}
.wz-plan.is-selected{border-color:var(--s-brand);box-shadow:0 12px 34px rgba(104,101,231,.16)}
.wz-plan--popular{border-color:var(--s-brand)}
.wz-plan__flag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--s-brand);color:#fff;
  font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:4px 12px;border-radius:999px}
.wz-plan__name{font-size:1.1rem;font-weight:800;color:var(--s-ink)}
.wz-plan__price{margin:11px 0 2px;font-size:1.85rem;font-weight:800;color:var(--s-ink);line-height:1}
.wz-plan__price small{font-size:.82rem;font-weight:700;color:var(--s-muted)}
.wz-plan__note{font-size:.8rem;color:var(--s-muted);margin-bottom:14px}
.wz-plan__feats{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-direction:column;gap:8px}
.wz-plan__feats li{display:flex;gap:8px;font-size:.85rem;color:var(--s-body);line-height:1.4}
.wz-plan__feats li svg{width:16px;height:16px;flex:0 0 16px;fill:var(--s-green);margin-top:1px}
.wz-plan__feats li.off{color:var(--s-muted)}
.wz-plan__feats li.off svg{fill:#c9cdd8}
.wz-plan__pick{margin-top:auto;text-align:center;font-weight:800;font-size:.88rem;color:var(--s-brand);
  border:1.5px solid var(--s-brand);border-radius:10px;padding:9px}
.wz-plan.is-selected .wz-plan__pick{background:var(--s-brand);color:#fff}

/* ---------- login gate (soft: asked before submitting) ---------- */
.wz-gate{background:var(--s-soft);border:1.5px solid rgba(104,101,231,.3);border-radius:14px;
  padding:18px 20px;margin-top:20px;display:flex;gap:14px;align-items:flex-start}
.wz-gate__ic{width:38px;height:38px;border-radius:10px;background:#fff;flex:0 0 38px;display:flex;
  align-items:center;justify-content:center;border:1px solid var(--s-line)}
.wz-gate__ic svg{width:20px;height:20px;fill:var(--s-brand)}
.wz-gate__b{min-width:0}
.wz-gate__t{font-size:.92rem;font-weight:800;color:var(--s-ink);margin:0 0 3px}
.wz-gate__x{font-size:.83rem;color:var(--s-body);line-height:1.55;margin:0 0 11px}
.wz-gate__btns{display:flex;gap:9px;flex-wrap:wrap}

/* review summary */
.wz-summary{background:var(--s-pastel);border:1px solid var(--s-line);border-radius:14px;padding:16px 18px;
  margin-top:20px;font-size:.88rem;color:var(--s-body)}
.wz-summary strong{color:var(--s-ink)}

/* ---------- footer nav ---------- */
.wz-nav{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:22px}
.wz-nav[hidden]{display:none}
.wz-nav__back{background:none;border:0;color:var(--s-muted);font:inherit;font-weight:700;cursor:pointer;padding:8px}
.wz-nav__back:hover{color:var(--s-ink)}
.wz-nav__back[hidden]{visibility:hidden;display:block}
.wz-nav__spacer{flex:1}

/* ==========================================================================
   LIVE PREVIEW — mini mirror of the real profile page
   ========================================================================== */
/* Not sticky: without an inner scroller the card is taller than the viewport,
   and sticky would pin it with its lower half permanently cut off. */
.wz-prev{position:static}
.wz-prev[hidden]{display:none}
.lp{background:#fff;border:1px solid var(--s-line);border-radius:18px;overflow:hidden;
  box-shadow:0 10px 30px rgba(21,13,21,.09)}
.lp__bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#f3f4f9;
  border-bottom:1px solid var(--s-line)}
.lp__dot{width:9px;height:9px;border-radius:50%;background:#d6d9e6}
.lp__url{flex:1;text-align:center;font-size:.66rem;color:var(--s-muted);font-weight:700;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* .lp__scroll is a plain wrapper: the preview grows to its natural height and
   the page does the scrolling. */

/* hero: neutral fill + full-bleed wave (no strip left underneath) */
.lp__hero{position:relative;background:var(--s-wave);padding:18px 16px 0}
.lp__crumbs{font-size:.6rem;color:var(--s-muted);margin-bottom:7px;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp__name{font-size:1.1rem;font-weight:800;line-height:1.2;margin:0 0 5px;color:var(--s-ink);
  font-style:normal;transition:.2s}
.lp__name.ghost{color:var(--s-muted);font-style:italic;font-weight:600}
.lp__desc{font-size:.73rem;line-height:1.5;color:var(--s-body);margin:0;min-height:2.1em}
.lp__desc.ghost{color:var(--s-muted);font-style:italic}
.lp__wave{display:block;width:calc(100% + 32px);height:20px;margin:10px -16px -1px}
.lp__wave path{fill:#fff}

.lp__body{padding:2px 16px 16px}
.lp__sec{margin-top:13px}
.lp__st{font-size:.63rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--s-muted);
  margin:0 0 6px}

/* status cards */
.lp__status{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.lp__sc{border:1px solid var(--s-line);border-radius:9px;padding:8px 9px;background:#fff;
  position:relative;overflow:hidden}
.lp__sc::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--s-brand)}
.lp__sc--rat::before{background:var(--s-green)}
.lp__sc b{display:block;font-size:.66rem;color:var(--s-ink);font-weight:800}
.lp__sc span{font-size:.58rem;color:var(--s-muted);font-weight:600}
.lp__sc.pend{opacity:.55}
.lp__sc.pend::before{background:#d6d9e6}

/* about + logo */
.lp__about{display:flex;gap:9px;align-items:flex-start}
.lp__logo{width:38px;height:38px;border-radius:8px;background:#eef0f7;flex:0 0 38px;position:relative;
  overflow:hidden;background-size:cover;background-position:center}
.lp__logo::after{content:"";position:absolute;inset:0;opacity:.45;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23aeb4c7'%3E%3Cpath d='M3 21V7l8-4v4l8-4v18h-6v-5h-4v5H3z'/%3E%3C/svg%3E") center/18px no-repeat}
.lp__logo--pro{border-radius:50%}
.lp__logo--pro::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23aeb4c7'%3E%3Cpath d='M12 12a5 5 0 100-10 5 5 0 000 10zm0 2c-4.4 0-8 2.4-8 5.3V22h16v-2.7c0-2.9-3.6-5.3-8-5.3z'/%3E%3C/svg%3E")}
.lp__logo.has-img::after{display:none}
.lp__abtx{font-size:.68rem;color:var(--s-body);line-height:1.5;min-width:0}
.lp__abtx.ghost{color:#c2c7d6;font-style:italic}

/* gallery */
.lp__ph{display:grid;grid-template-columns:2fr 1fr 1fr;gap:4px;height:50px}
.lp__ph i{background:#eef0f7;border-radius:5px;display:block;position:relative;
  background-size:cover;background-position:center}
.lp__ph i.empty::after{content:"";position:absolute;inset:0;opacity:.5;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23aeb4c7'%3E%3Cpath d='M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3 3.5-4.5 4.5 6H5l3.5-4.5z'/%3E%3C/svg%3E") center/16px no-repeat}

/* tags */
.lp__tags{display:flex;flex-wrap:wrap;gap:5px}
.lp__tag{font-size:.63rem;font-weight:700;background:var(--s-soft);color:var(--s-brand);
  padding:3px 9px;border-radius:999px}
.lp__tags .ghost{font-size:.63rem;color:#c2c7d6;font-style:italic}

/* highlights */
.lp__hl{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.lp__hlc{border:1px solid var(--s-line);border-radius:8px;padding:7px 8px;display:flex;gap:6px;
  align-items:flex-start}
.lp__hlc svg{width:12px;height:12px;fill:var(--s-brand);flex:0 0 12px;margin-top:1px}
.lp__hlc span{font-size:.6rem;color:var(--s-muted);line-height:1.35;font-weight:600}

/* contacts */
.lp__side{border:1.5px solid var(--s-line);border-radius:11px;padding:10px;background:var(--s-pastel)}
.lp__sidetop{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;gap:6px}
.lp__sidetop b{font-size:.68rem;font-weight:800;color:var(--s-ink)}
.lp__pos{font-size:.52rem;font-weight:700;color:var(--s-muted);text-transform:uppercase;letter-spacing:.04em;
  background:#fff;border:1px solid var(--s-line);border-radius:5px;padding:2px 6px;white-space:nowrap}
.lp__row{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:.68rem;color:var(--s-body);
  border-bottom:1px dashed var(--s-line);transition:.2s;min-width:0}
.lp__row:last-of-type{border-bottom:0}
.lp__row svg{width:13px;height:13px;fill:var(--s-brand);flex:0 0 13px}
.lp__row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lp__row.empty{color:#c2c7d6}
.lp__row.empty svg{fill:#d6d9e6}
.lp__socials{display:flex;gap:5px;margin-top:7px}
.lp__soc{width:20px;height:20px;border-radius:5px;background:#fff;border:1px solid var(--s-line);
  display:flex;align-items:center;justify-content:center}
.lp__soc svg{width:11px;height:11px;fill:var(--s-brand)}
.lp__cta{margin-top:7px;text-align:center;font-size:.63rem;font-weight:800;color:#fff;
  background:var(--s-brand);border-radius:7px;padding:6px}

/* map */
.lp__map{height:52px;border-radius:8px;border:1px solid var(--s-line);position:relative;overflow:hidden;
  background:repeating-linear-gradient(0deg,#eef0f7 0 9px,#e6e9f2 9px 10px),
             repeating-linear-gradient(90deg,#eef0f7 0 9px,#e6e9f2 9px 10px)}
.lp__mapc{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:38px;height:38px;
  border-radius:50%;background:rgba(104,101,231,.14);border:1.5px dashed var(--s-brand)}
.lp__mappin{position:absolute;left:50%;top:50%;transform:translate(-50%,-70%);width:11px;height:11px}
.lp__mappin svg{width:11px;height:11px;fill:var(--s-brand)}
.lp__mapcap{font-size:.56rem;color:var(--s-muted);text-align:center;margin-top:4px;font-weight:600}

/* reviews */
.lp__rev{border:1px solid var(--s-line);border-radius:8px;padding:8px}
.lp__stars{color:#e8b53d;font-size:.68rem;letter-spacing:1px}
.lp__revtx{font-size:.6rem;color:var(--s-muted);margin-top:3px;font-style:italic}

.lp__cap{text-align:center;font-size:.65rem;color:var(--s-muted);padding:9px 8px 2px;font-weight:600;
  border-top:1px solid var(--s-line);margin-top:13px}

/* pulses */
@keyframes lpPop{0%{background:rgba(104,101,231,.16)}100%{background:transparent}}
.lp__row.pop{animation:lpPop .7s ease-out}
@keyframes lpName{0%{transform:scale(1.04)}100%{transform:scale(1)}}
.lp__name.pop{animation:lpName .35s ease-out}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1300px){
  .wz-cols{grid-template-columns:1fr 380px}
}
@media (max-width:1040px){
  .wz-cols{grid-template-columns:1fr 330px;gap:18px}
}

/* ---------- city autocomplete ----------
   A typed city can't be filtered on, so the field only accepts a pick from
   this list; the input is a label and a hidden id carries the real value. */
.wz-field--city{position:relative}
.wz-ac{
  position:absolute;left:0;right:0;top:calc(100% - 18px);z-index:30;
  background:#fff;border:1px solid var(--line,#e6e3f2);border-radius:12px;
  box-shadow:0 18px 40px rgba(21,13,21,.14);
  max-height:264px;overflow-y:auto;padding:6px;
}
.wz-ac[hidden]{display:none}
.wz-ac__i{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  width:100%;padding:9px 11px;border:0;border-radius:8px;background:none;
  font:inherit;font-size:.9rem;color:var(--ink,#150d15);text-align:left;cursor:pointer;
}
.wz-ac__i[hidden]{display:none}
.wz-ac__i:hover,.wz-ac__i:focus{background:var(--brand-soft,#f1edfa);outline:none}
.wz-ac__i span{font-size:.76rem;color:var(--muted,#8a86a0);flex:0 0 auto}
.wz-field--city input:disabled{background:#faf9fd;color:var(--muted,#8a86a0);cursor:not-allowed}

/* ---------- terms ---------- */
.wz-terms{
  display:flex;align-items:flex-start;gap:11px;margin-top:18px;
  padding:14px 16px;border:1px solid var(--line,#e6e3f2);border-radius:12px;
  font-size:.88rem;color:var(--body,#5a5568);cursor:pointer;
}
.wz-terms:hover{background:var(--tint,#f4f2fb)}
.wz-terms input{width:18px;height:18px;margin-top:1px;flex:0 0 18px;accent-color:var(--brand,#6865e7);cursor:pointer}
.wz-terms a{color:var(--brand,#6865e7);font-weight:700}
#wzTermsErr{display:none;margin-top:8px}
#wzTermsErr.show{display:block}
#wzPlanErr{display:none;margin:10px 0 0}
#wzPlanErr.show{display:block}
.wz-plans.is-invalid{outline:2px solid #e05353;outline-offset:6px;border-radius:18px}


/* ---------- country: select with a search box ----------
   257 options is a long scroll, and people look for their own name first. */
.wz-field--country{position:relative}
.wz-sel{position:relative}
.wz-sel__btn{
  display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  /* Match .wz-field input/select exactly so the icon-selects (category, country)
     line up in height with the plain fields beside them (subcategory, city). */
  padding:10px 13px;border:1.5px solid var(--s-line);border-radius:11px;background:#fff;
  font:inherit;font-size:.92rem;color:var(--ink,#150d15);text-align:left;cursor:pointer;
}
.wz-sel__btn:hover{border-color:var(--brand,#6865e7)}
.wz-sel__btn svg{width:20px;height:20px;flex:0 0 20px;fill:var(--muted,#8a86a0)}
.wz-sel__btn .is-placeholder{color:var(--muted,#8a86a0)}
.wz-sel__drop{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;background:#fff;
  border:1px solid var(--line,#e6e3f2);border-radius:12px;
  box-shadow:0 18px 40px rgba(21,13,21,.16);padding:8px;
}
.wz-sel__drop[hidden]{display:none}
.wz-sel__q{
  width:100%;padding:9px 11px;margin-bottom:6px;font:inherit;font-size:.9rem;
  border:1px solid var(--line,#e6e3f2);border-radius:8px;
}
.wz-sel__q:focus{outline:none;border-color:var(--brand,#6865e7)}
.wz-sel__list{max-height:248px;overflow-y:auto}
.wz-sel__i{
  display:block;width:100%;padding:8px 11px;border:0;border-radius:8px;background:none;
  font:inherit;font-size:.9rem;color:var(--ink,#150d15);text-align:left;cursor:pointer;
}
/* display:block beats the hidden attribute, so filtering the list would hide
   nothing without this. */
.wz-sel__i[hidden]{display:none}
.wz-sel__i:hover,.wz-sel__i:focus{background:var(--brand-soft,#f1edfa);outline:none}
/* The top hit while typing: Enter or clicking away takes it. */
.wz-sel__i.is-active{background:var(--brand-soft,#f1edfa);box-shadow:inset 0 0 0 2px var(--brand,#6865e7)}
.wz-sel__none{margin:8px 11px;font-size:.85rem;color:var(--muted,#8a86a0)}

/* ---- icon dropdowns: category (branded SVG) + country (flag) ---- */
/* The chevron stays a filled glyph; icons must not inherit that fill. */
.wz-sel__chev{width:20px;height:20px;flex:0 0 20px;fill:var(--muted,#8a86a0)}
.wz-sel--icon .wz-sel__btn{gap:10px}
/* Category label is the flexible middle; chevron sits at the far right. */
.wz-sel--icon .wz-sel__btn>span#wzCategoryLabel,
.wz-sel--icon .wz-sel__btn>span#wzSubcategoryLabel,
.wz-sel--icon .wz-sel__btn>span#wzCountryLabel{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Leading icon slot in the button and in each option. */
.wz-sel__ico{flex:0 0 22px;width:22px;height:22px;display:inline-grid;place-items:center}
/* Inside the closed button, keep the icon at text height so the control does
   not grow past the shared 46px (the 22px dropdown-list icon is unaffected). */
.wz-sel__btn>.wz-sel__ico{height:20px;width:20px;flex-basis:20px}
.wz-sel__btn>.wz-sel__ico svg{width:20px;height:20px}
.wz-sel__ico svg{width:22px;height:22px;stroke:#1c1730;fill:none}
.wz-sel__i{display:flex;align-items:center;gap:10px}
.wz-sel__i .wz-sel__ico svg{width:20px;height:20px}
.wz-sel__i[hidden]{display:none}
/* Flags: 4x3 SVG as a background so we ship no icon font. */
.wz-flag{flex:0 0 22px;width:22px;height:16px;border-radius:2px;background-size:cover;
  background-position:center;box-shadow:inset 0 0 0 1px rgba(21,13,21,.08);display:inline-block}
.wz-sel__i .wz-flag{margin-right:2px}
@media (prefers-color-scheme:dark){
  .wz-sel__ico svg{stroke:#cfc9ee}
}
.wz-ac__i em{font-style:normal;color:var(--muted,#8a86a0)}

@media (max-width:900px){
  /* minmax(0,1fr) + min-width:0: a bare 1fr floors at min-content, so any
     wide inner row can push the whole wizard column past the phone screen. */
  .wz-cols{grid-template-columns:minmax(0,1fr)}
  .wz-main,.wz-panel{min-width:0;max-width:100%}
  /* Once the columns collapse the preview can't sit beside the fields, and
     stacked full-width it only pushes the form off the first screen. */
  .wz-prev{display:none}
}
@media (max-width:760px){
  .start-wrap{padding:16px 0 60px}
  .start-intro{padding:14px 16px;border-radius:12px;margin-bottom:16px}
  .start-title{font-size:1.25rem}
  .start-lede{font-size:.86rem}
  .wz-panel{padding:22px 18px;border-radius:16px}
  .wz-choice{grid-template-columns:1fr}
  .wz-grid{grid-template-columns:1fr}
  .wz-plans{grid-template-columns:1fr}
  /* The ring duplicates what the pills already show, and it costs a whole row
     on a narrow screen - drop it and give the pills the full width. */
  .wz-ring{display:none}
  .wz-top{padding:10px 12px;gap:10px}
  /* all four steps on one line: no wrapping, each pill shares the row evenly
     and shrinks its label instead of dropping to a second row. */
  .wz-pills{flex-wrap:nowrap;gap:5px;width:100%}
  .wz-pill{flex:1 1 0;min-width:0;justify-content:center;gap:5px;padding:8px 6px}
  .wz-pill i{width:17px;height:17px;flex:0 0 17px;font-size:.56rem}
  .wz-pill span{font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* the draft note would force the pills onto their own line - it re-appears
     as a full-width row under them */
  .wz-saved{width:100%;justify-content:center}
  .wz-gate{flex-direction:column;gap:10px}
}

/* ============ Step 3: Highlights + Features & amenities ============ */
.wz-field__opt{font-weight:600;font-size:.78rem;color:var(--s-muted);margin-left:4px}

/* Highlight slots: icon button + title + one-line description */
.wz-hls{display:flex;flex-direction:column;gap:10px}
.wz-hl{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--s-line);border-radius:12px;padding:10px;background:#fff}
.wz-hl__ic{flex:0 0 46px;width:46px;height:46px;border-radius:10px;border:1px dashed var(--s-line);
  background:var(--s-pastel,#f4f2fb);display:grid;place-items:center;cursor:pointer;color:var(--s-brand,#6865e7);
  transition:border-color .15s,background .15s}
.wz-hl__ic:hover{border-color:var(--s-brand,#6865e7)}
.wz-hl__ic.has{border-style:solid;border-color:var(--s-brand,#6865e7)}
.wz-hl__ic svg{width:24px;height:24px}
.wz-hl__fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.wz-hl__title,.wz-hl__desc{width:100%}
.wz-hl__title{font-weight:700}

/* Features checklist, grouped */
.wz-feats{display:flex;flex-direction:column;gap:14px}
.wz-featg__t{display:block;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--s-muted);margin-bottom:8px}
.wz-featg__list{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
.wz-feat{position:relative;display:flex;align-items:center;gap:9px;font-size:.9rem;color:var(--s-ink);cursor:pointer;line-height:1.3}
.wz-feat input{position:absolute;opacity:0;width:0;height:0}
.wz-feat__box{flex:0 0 19px;width:19px;height:19px;border:1.5px solid var(--s-line);border-radius:6px;position:relative;transition:background .15s,border-color .15s}
.wz-feat.is-on .wz-feat__box{background:var(--s-brand,#6865e7);border-color:var(--s-brand,#6865e7)}
.wz-feat.is-on .wz-feat__box::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.wz-feat input:focus-visible + .wz-feat__box{outline:2px solid var(--s-brand,#6865e7);outline-offset:2px}

/* Icon picker popover */
.wz-iconpop{position:fixed;inset:0;z-index:60;background:rgba(21,13,21,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.wz-iconpop[hidden]{display:none}
.wz-iconpop__panel{background:#fff;border-radius:16px;width:min(460px,100%);max-height:80vh;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(21,13,21,.3)}
.wz-iconpop__head{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--s-line);font-weight:800;color:var(--s-ink)}
.wz-iconpop__x{border:0;background:none;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--s-muted)}
.wz-iconpop__grid{padding:16px;overflow-y:auto;display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.wz-ico{aspect-ratio:1;border:1px solid var(--s-line);border-radius:10px;background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--s-ink);transition:border-color .15s,background .15s,color .15s}
.wz-ico:hover{border-color:var(--s-brand,#6865e7);color:var(--s-brand,#6865e7);background:var(--s-pastel,#f4f2fb)}
.wz-ico.is-sel{border-color:var(--s-brand,#6865e7);color:var(--s-brand,#6865e7);background:var(--s-pastel,#f4f2fb);box-shadow:0 0 0 2px rgba(104,101,231,.25)}
.wz-ico svg{width:22px;height:22px}

/* Live preview: chosen highlight icons are line-style (fill=none); features */
.lp__hlc svg[fill="none"]{fill:none;stroke:var(--s-brand);stroke-width:2}
.lp__feats{display:flex;flex-direction:column;gap:4px}
.lp__feat{display:flex;align-items:center;gap:6px}
.lp__feat svg{width:11px;height:11px;fill:var(--s-brand);flex:0 0 11px}
.lp__feat span{font-size:.6rem;color:var(--s-muted);font-weight:600}

@media (max-width:560px){
  .wz-featg__list{grid-template-columns:1fr}
  .wz-iconpop__grid{grid-template-columns:repeat(5,1fr)}
}

/* Step 4: "see full plan details" link under the compact plan cards */
.wz-plans__more{text-align:center;margin:18px 0 0;font-size:.9rem;color:var(--s-muted)}
.wz-plans__more a{color:var(--s-brand,#6865e7);font-weight:700;text-decoration:none}
.wz-plans__more a:hover{text-decoration:underline}

/* About: minimal rich-text editor */
.wz-rte{border:1.5px solid var(--s-line);border-radius:12px;overflow:hidden;background:#fff}
.wz-rte:focus-within{border-color:var(--s-brand,#6865e7)}
.wz-rte__bar{display:flex;align-items:center;gap:3px;padding:6px 8px;border-bottom:1px solid var(--s-line);background:var(--s-pastel,#f4f2fb)}
.wz-rte__b{width:32px;height:32px;border:0;background:transparent;border-radius:7px;cursor:pointer;color:var(--s-ink);display:grid;place-items:center;transition:background .15s,color .15s}
.wz-rte__b:hover{background:#fff}
.wz-rte__b.is-active{background:var(--s-brand,#6865e7);color:#fff}
.wz-rte__b svg{width:18px;height:18px}
.wz-rte__sep{width:1px;height:20px;background:var(--s-line);margin:0 4px}
.wz-rte__area{min-height:120px;max-height:340px;overflow-y:auto;padding:12px 14px;font:inherit;font-size:.95rem;line-height:1.55;color:var(--s-ink);outline:none}
.wz-rte.is-empty .wz-rte__area::before{content:attr(data-placeholder);color:var(--s-muted)}
.wz-rte__area p{margin:0 0 .6em}
.wz-rte__area p:last-child{margin-bottom:0}
.wz-rte__area ul,.wz-rte__area ol{margin:.2em 0 .6em;padding-left:1.4em}
.wz-rte__area ul{list-style:disc}
.wz-rte__area ol{list-style:decimal}
.wz-rte__area li{margin:.15em 0}
.wz-rte__area h3{font-size:1.05rem;font-weight:800;margin:.7em 0 .3em;color:var(--s-ink)}
.wz-rte__area h3:first-child{margin-top:0}
.wz-rte__area blockquote{margin:.5em 0;padding:.25em 0 .25em .85em;border-left:3px solid var(--s-brand,#6865e7);color:var(--s-muted);font-style:italic}

/* ===== Networks (brand) : choice icons, sub-choice, banner, dedup ===== */
/* The [hidden] attribute must beat any class that sets display (.wz-choice is
   display:grid, .wz-net is flex) - otherwise JS-toggled blocks never hide. */
[hidden]{display:none !important}
/* Illustrated (raster) icons in the choice cards: no tile, per-card sizes.
   The icon zone is a FIXED height (the largest icon) in every card, so a
   smaller icon does not push its card's text up out of line with its neighbour
   - the name/description/link rows stay level across the pair. */
.wz-card--img .wz-card__ic{width:auto;height:106px;background:none;border-radius:0;padding:0;display:flex;align-items:center}
.wz-card--img .wz-card__ic img{object-fit:contain;display:block}
.wz-card__ic--86 img{width:86px;height:86px}
.wz-card__ic--106 img{width:106px;height:106px}
/* Back link under the single/network sub-choice. */
.wz-subback{display:inline-block;margin-top:16px;background:none;border:0;color:var(--s-brand);font-weight:800;font-size:.9rem;cursor:pointer;padding:6px 2px}
.wz-subback:hover{text-decoration:underline}

/* Network-defaults banner (shown on every form step when mode = network). */
.wz-net{display:flex;gap:16px;align-items:center;background:#f1f0fd;border:1px solid #e3e1fb;border-radius:14px;padding:15px 18px;margin-bottom:22px}
.wz-net__ic{flex:none;width:84px;height:84px}
.wz-net__ic img{width:100%;height:100%;object-fit:contain;display:block}
.wz-net__t{margin:0;font-size:.9rem;line-height:1.55;color:var(--s-body)}
.wz-net__t b{color:var(--s-ink);font-weight:800}

/* Dedup box: "already on Reedleys? claim it". Spans the whole grid row. */
.wz-dedup{grid-column:1 / -1;background:#fff;border:1px solid var(--s-line);border-radius:12px;padding:12px 14px}
.wz-dedup--site{margin-top:-4px}
.wz-dedup__h{margin:0 0 6px;font-size:.86rem;color:var(--s-body)}
.wz-dedup__row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-top:1px solid #f0f1f6}
.wz-dedup__row:first-of-type{border-top:0}
.wz-dedup__nm{font-weight:700;color:var(--s-ink);font-size:.92rem}
.wz-dedup__city{font-weight:600;color:var(--s-body);font-size:.84rem}
.wz-dedup__acts{display:flex;gap:8px;flex:none}
.wz-dedup__acts a{font-size:.82rem;font-weight:700;color:var(--s-brand);text-decoration:none;padding:5px 13px;border:1px solid var(--s-line);border-radius:999px;white-space:nowrap}
.wz-dedup__acts a:hover{background:var(--s-soft)}
.wz-dedup__claim{background:var(--s-brand);color:#fff !important;border-color:var(--s-brand) !important}
/* Keep the brand fill on hover: outrank ".wz-dedup__acts a:hover" (0,2,1),
   which would otherwise repaint the claim button with the light --s-soft
   background under its white text and make the label vanish. */
.wz-dedup__acts a.wz-dedup__claim:hover{background:var(--s-brand);filter:brightness(.92)}
/* Already-claimed website hit: an inert label, not a button (nothing to claim). */
.wz-dedup__claimed{font-size:.82rem;font-weight:700;color:var(--s-body);padding:5px 13px;border:1px solid var(--s-line);border-radius:999px;white-space:nowrap;background:var(--s-soft)}
@media (max-width:560px){
  .wz-dedup__row{flex-direction:column;align-items:flex-start;gap:8px}
}

/* ---- Multi-category: secondary category rows + the plan-step gate ---- */
/* Full-width grouped block so it never breaks the two-column field grid; inputs
   mirror the main form fields (min-height 46, 1.5px border) for one rhythm. */
.wz-field--secondary{grid-column:1 / -1;gap:9px;margin:3px 0;padding:15px 16px 16px;border:1px solid var(--s-line,#e3e1ef);border-radius:14px;background:#f7f6fd}
.wz-field--secondary>label{display:flex;align-items:center;gap:7px}
.wz-secrows{display:flex;flex-direction:column;gap:10px;margin-top:3px}
.wz-secrow{display:grid;grid-template-columns:1fr 1fr 46px;gap:16px;align-items:center}
.wz-secrow__cat,.wz-secrow__sub{width:100%;min-height:46px;padding:9px 12px;border:1.5px solid var(--s-line,#e3e1ef);border-radius:11px;background:#fff;font:inherit;font-size:.9rem;color:var(--s-ink,#150d15);transition:border-color .15s}
.wz-secrow__cat:focus,.wz-secrow__sub:focus{outline:0;border-color:var(--s-brand,#6865e7)}
.wz-secrow__sub:disabled{background:#f2f1f8;color:var(--s-muted,#8a86a8)}
.wz-secrow__rm{width:46px;height:46px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--s-line,#e3e1ef);border-radius:11px;background:#fff;color:var(--s-muted,#8a86a8);font-size:1.3rem;line-height:1;cursor:pointer;transition:.15s}
.wz-secrow__rm:hover{border-color:#e4b7c1;color:#c0344b;background:#fff5f7}
.wz-addcat{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1.5px dashed var(--s-brand,#6865e7);border-radius:11px;background:#fff;color:var(--s-brand,#6865e7);font:inherit;font-size:.83rem;font-weight:700;cursor:pointer;transition:.15s}
.wz-addcat:hover{background:#eeecfe}
.wz-premium-note{margin:0 0 16px;padding:13px 16px;border:1px solid #d9d5f6;border-left:3px solid var(--primary,#6865e7);border-radius:12px;background:#f4f3fe;font-size:.86rem;color:var(--s-ink,#150d15);line-height:1.5}
.wz-premium-note strong{color:var(--ink,#1e266d)}
.wz-premium-note ul{margin:5px 0 6px;padding-left:18px}
.wz-premium-note li{margin:1px 0}
.wz-plan.is-locked{opacity:.5;filter:grayscale(.25);cursor:not-allowed;position:relative}
.wz-plan.is-locked .wz-plan__pick{background:#e7e5f2;color:#8a86a8}
.wz-plan.is-locked::after{content:"Paid plan needed";position:absolute;top:10px;right:12px;font-size:.66rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:#8a86a8}
@media (max-width:560px){
  .wz-secrow{grid-template-columns:1fr 44px;grid-template-areas:"cat rm" "sub rm";gap:10px}
  .wz-secrow__cat{grid-area:cat}.wz-secrow__sub{grid-area:sub}
  .wz-secrow__rm{grid-area:rm;height:100%}
}

/* ---- Premium: CTA button picker (Contacts) + cover preview (Media) ---- */
.wz-cta-row{display:grid;grid-template-columns:minmax(150px,240px) 1fr auto;gap:12px;align-items:center;margin-top:4px}
.wz-sel--cta{position:relative}
.wz-cta-row .wz-sel__btn{width:100%}
.wz-cta-row #wzCtaUrl{width:100%;min-height:46px;padding:9px 12px;border:1.5px solid var(--s-line,#e3e1ef);border-radius:11px;font:inherit;font-size:.9rem;background:#fff;color:var(--s-ink,#150d15)}
.wz-cta-row #wzCtaUrl:focus{outline:0;border-color:var(--s-brand,#6865e7)}
.wz-field--cta.is-invalid #wzCtaUrl{border-color:#e05353}
.wz-sel__group{padding:9px 12px 4px;font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--s-muted,#8a86a8);position:sticky;top:0;background:#fff}
.wz-sel__group:first-child{padding-top:6px}
.wz-cover{margin-top:9px;height:130px;border-radius:12px;background:#f2f1f8 center/cover no-repeat;border:1px solid var(--s-line,#e3e1ef)}
@media (max-width:560px){
  .wz-cta-row{grid-template-columns:1fr auto}
  .wz-cta-row .wz-sel--cta{grid-column:1 / -1}
}

/* ---- video: "or" divider + picked-file name (Media step) ---- */
.wz-or{display:flex;align-items:center;gap:10px;margin:10px 0 2px;color:var(--s-muted,#8a86a8);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.wz-or::before,.wz-or::after{content:"";flex:1;height:1px;background:var(--s-line,#e3e1ef)}
.wz-vidname{margin-top:8px;padding:8px 12px;border:1px solid var(--s-line,#e3e1ef);border-radius:10px;background:#f7f6fd;font-size:.85rem;color:var(--s-ink,#150d15);word-break:break-all}

/* ---- professional phone verification (wizard step 2, inline) ---- */
.wz-phone{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap}
.wz-phone input[name="phone"]{flex:1 1 200px;min-width:0}
/* Explicit height + inline-flex centring so the button never collapses to a
   thin strip when its row is not align-stretch (e.g. the code-entry row). */
.wz-phone__btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;border:0;border-radius:11px;padding:0 18px;font-weight:800;font-size:.85rem;
  line-height:1;cursor:pointer;background:var(--primary,#6865e7);color:#fff;white-space:nowrap}
.wz-phone__btn:hover{filter:brightness(1.05)}
.wz-phone__btn:disabled{opacity:.55;cursor:default}
.wz-phone__btn--go{background:#137a45}
.wz-phone__code{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
/* The code field sits OUTSIDE .wz-field, so it needs its own border/height. */
.wz-phone__code input{flex:0 0 140px;min-height:46px;padding:0 12px;border:1.5px solid var(--s-line);
  border-radius:11px;letter-spacing:.22em;text-align:center;font-weight:700;font-family:inherit;font-size:1rem}
.wz-phone__code input:focus{outline:0;border-color:var(--s-brand)}
.wz-phone__link{display:inline-flex;align-items:center;background:none;border:0;
  color:var(--primary,#6865e7);font-weight:700;font-size:.8rem;cursor:pointer;padding:4px 6px}
.wz-phone__link:hover{text-decoration:underline}
.wz-phone__status{display:block;margin-top:6px;font-size:.8rem;font-weight:700}
.wz-phone__status.is-ok{color:#137a45}
.wz-phone__status.is-err{color:#c0392b}

/* One-professional-per-account notice on the type-choice step */
.wz-choice-note{margin:14px auto 0;max-width:560px;text-align:center;font-size:.9rem;font-weight:600;
  color:#9a6a00;background:#fdf3df;border:1px solid #f0dca6;border-radius:12px;padding:12px 16px}
.wz-choice-note a{color:var(--primary,#6865e7);font-weight:700;text-decoration:underline}

/* "All countries" separator in the wizard country select (same look as /request) */
.wz-sel__sep { padding:8px 11px 4px; font-size:.7rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#9aa2b5; border-top:1px solid #eef0f6; margin-top:4px; }
.wz-sel__sep[hidden] { display:none; }

/* Opening hours rows in the wizard (contacts step) */
.wz-hours { display:flex; flex-direction:column; gap:8px; }
.wz-hours__row { display:flex; align-items:center; gap:8px; }
.wz-hours__day { width:36px; font-weight:800; font-size:.82rem; color:#2b3245; flex:none; }
.wz-hours__t { width:110px; padding:8px 10px; border:1px solid #e0e2ee; border-radius:10px; font:inherit; font-size:.9rem; }
.wz-hours__t:disabled { opacity:.45; }
.wz-hours__dash { color:#9aa2b5; }
.wz-hours__closed { display:inline-flex; align-items:center; gap:6px; font-size:.82rem; font-weight:700; color:#656d80; margin:0; }
.wz-hours__closed input { accent-color:#6865e7; }
.wz-hours__copy { align-self:flex-start; margin-top:2px; background:none; border:0; padding:0; font:inherit; font-size:.85rem; font-weight:800; color:#6865e7; cursor:pointer; }
.wz-hours__copy:hover { text-decoration:underline; }
@media (max-width:560px){ .wz-hours__t { width:96px; } }

/* Opening hours accordion (collapsed by default - the 7 rows stretched the step) */
.wz-hours-acc { border:1px solid #e0e2ee; border-radius:12px; background:#fff; }
.wz-hours-acc summary { display:flex; align-items:center; gap:10px; padding:11px 14px; cursor:pointer; list-style:none; min-height:45px; box-sizing:border-box; }
.wz-hours-acc summary::-webkit-details-marker { display:none; }
.wz-hours-acc__ttl { font-weight:800; font-size:.92rem; color:#2b3245; }
.wz-hours-acc__hint { font-size:.9rem; font-weight:700; color:#9aa2b5; }
.wz-hours-acc__chev { margin-left:auto; }
.wz-hours-acc__chev { width:18px; height:18px; color:#9aa2b5; transition:transform .18s ease; flex:none; }
.wz-hours-acc[open] .wz-hours-acc__chev { transform:rotate(180deg); }
.wz-hours-acc[open] summary { border-bottom:1px solid #eef0f6; }
.wz-hours-acc .wz-hours { padding:12px 14px 14px; }

/* Monthly/Yearly billing toggle on the plan step */
.wz-billing { display:flex; justify-content:center; gap:0; margin:0 0 18px; }
.wz-billing__b { font:inherit; font-size:.9rem; font-weight:800; color:#656d80; background:#fff; border:1px solid #e0e2ee; padding:9px 20px; cursor:pointer; }
.wz-billing__b:first-child { border-radius:999px 0 0 999px; }
.wz-billing__b:last-child { border-radius:0 999px 999px 0; border-left:0; }
.wz-billing__b.is-on { background:#6865e7; border-color:#6865e7; color:#fff; }
.wz-billing__save { display:inline-block; margin-left:6px; font-size:.68rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; background:#e3f6ec; color:#0f7a4d; border-radius:999px; padding:2px 8px; }
.wz-billing__b.is-on .wz-billing__save { background:rgba(255,255,255,.2); color:#fff; }
