/* Shared styles for Zippidobi marketing sub-pages (pricing, how-it-works,
   coverage, founding-member, mom-network). Tokens mirror the homepage. */
:root{
  --purple:#4E2A8E;--purple-deep:#46278A;--purple-700:#3A1F70;--purple-300:#7B4FC7;
  --orange:#F47114;--orange-light:#FA8C37;--green:#1FA463;--teal:#00A199;
  --cream:#F8F7F5;--cream-2:#F3F1EC;--ink:#1E1B2E;--navy:#16102C;
  --muted:#6B6776;--muted-2:#8A8694;
  --lav-soft:#EFE8F8;--orange-soft:#FDEBDD;--green-soft:#E2F3EA;--teal-soft:#E5F7F5;
  --line:#EAE7F1;--line-2:#E4E0EC;--white:#fff;
  --shadow-sm:0 2px 8px rgba(30,27,46,.06);
  --shadow-md:0 14px 36px -14px rgba(46,39,90,.28);
  --sans:"Mulish",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Lora",Georgia,serif;--round:"Baloo 2",var(--sans);--script:"Dancing Script",cursive;
  --wrap:1080px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:40;background:rgba(248,247,245,.92);
  backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;align-items:center;gap:18px;height:64px}
.tb-brand{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.tb-brand img{display:block;width:36px;height:36px}
.tb-nm{display:block;font-family:var(--round);font-weight:800;font-size:20px;
  color:var(--purple);letter-spacing:-.4px;line-height:1}
.tb-tg{display:block;font-family:var(--round);font-weight:700;font-size:10px;
  color:var(--orange);letter-spacing:.02em;margin-top:1px}
.tb-links{display:flex;gap:22px}
.tb-links a{color:var(--ink);text-decoration:none;font-weight:700;font-size:14.5px}
.tb-links a:hover,.tb-links a[aria-current="page"]{color:var(--purple)}
.tb-links a[aria-current="page"]{text-decoration:underline;text-underline-offset:5px}
@media(max-width:820px){
  /* keep the nav reachable on mobile: wrap to a second, scrollable row */
  .topbar-in{height:auto;flex-wrap:wrap;gap:10px 14px;padding-top:10px;padding-bottom:9px}
  .tb-links{order:3;flex:1 0 100%;gap:18px;overflow-x:auto;padding-bottom:2px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
    /* fade the right edge so it reads as scrollable rather than cut off */
    -webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);
    mask-image:linear-gradient(90deg,#000 86%,transparent)}
  .tb-links::-webkit-scrollbar{display:none}
  .tb-links a{white-space:nowrap;font-size:14px}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;border:0;cursor:pointer;
  font-family:var(--sans);font-weight:800;font-size:15px;text-decoration:none;
  padding:13px 22px;border-radius:999px;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px)}
.btn-orange{background:linear-gradient(135deg,var(--orange),var(--orange-light));
  color:#fff;box-shadow:0 10px 24px -10px rgba(244,113,20,.7)}
.btn-purple{background:var(--purple);color:#fff}
.btn-ghost{background:#fff;color:var(--purple);border:1.5px solid var(--line-2)}
.btn-sm{padding:10px 17px;font-size:14px}

/* ---------- hero ---------- */
.phero{background:linear-gradient(160deg,var(--purple) 0%,var(--purple-700) 100%);
  color:#fff;padding:52px 0 58px;border-radius:0 0 30px 30px}
.crumbs{font-size:13px;color:rgba(255,255,255,.72);margin-bottom:14px}
.crumbs a{color:rgba(255,255,255,.9);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.eyebrow{display:inline-block;font-weight:800;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--orange-light);margin-bottom:10px}
.phero h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,5vw,44px);
  line-height:1.14;margin:0 0 12px;letter-spacing:-.5px}
.phero .lede{font-size:17.5px;color:rgba(255,255,255,.88);max-width:640px;margin:0 0 22px}
.phero .script{font-family:var(--script);color:var(--orange-light);font-size:1.12em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.hero-note{font-size:13.5px;color:rgba(255,255,255,.75)}

/* ---------- sections ---------- */
main{padding-bottom:70px}
.sec{padding:52px 0 0}
.sec h2{font-family:var(--serif);font-weight:700;font-size:clamp(23px,3.4vw,30px);
  color:var(--ink);margin:0 0 8px;letter-spacing:-.3px}
.sec h3{font-family:var(--round);font-weight:800;font-size:19px;color:var(--purple);margin:0 0 6px}
.sec .sub{color:var(--muted);margin:0 0 24px;max-width:660px;font-size:16.5px}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:24px 26px;box-shadow:var(--shadow-sm)}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
@media(max-width:800px){.g2,.g3{grid-template-columns:1fr}}

/* ---------- lists ---------- */
.ticks{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding-left:30px;margin:11px 0}
.ticks li::before{content:"";position:absolute;left:0;top:7px;width:19px;height:19px;
  border-radius:50%;background:var(--green-soft)}
.ticks li::after{content:"";position:absolute;left:6px;top:12px;width:7px;height:4px;
  border-left:2.2px solid var(--green);border-bottom:2.2px solid var(--green);
  transform:rotate(-45deg)}
.crosses li::before{background:var(--orange-soft)}
.crosses li::after{left:6.5px;top:11.5px;width:7px;height:7px;border:0;
  background:linear-gradient(currentColor,currentColor) center/100% 2.2px no-repeat,
             linear-gradient(currentColor,currentColor) center/2.2px 100% no-repeat;
  color:var(--orange);transform:rotate(45deg)}

/* ---------- steps ---------- */
.step{display:flex;gap:18px;align-items:flex-start}
.step-n{flex:0 0 auto;width:42px;height:42px;border-radius:14px;display:grid;
  place-items:center;background:var(--lav-soft);color:var(--purple);
  font-family:var(--round);font-weight:800;font-size:19px}

/* ---------- price ---------- */
.price-row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:4px 0 14px}
.price-now{font-family:var(--round);font-weight:800;font-size:44px;color:var(--purple);line-height:1}
.price-now small{font-size:17px;font-weight:700;color:var(--muted)}
.price-was{font-size:19px;color:var(--muted-2);text-decoration:line-through}
.pill{display:inline-block;font-weight:800;font-size:12px;letter-spacing:.02em;
  padding:5px 12px;border-radius:999px;background:var(--green-soft);color:var(--green)}
.pill-orange{background:var(--orange-soft);color:var(--orange)}
.pill-lav{background:var(--lav-soft);color:var(--purple)}

/* ---------- areas ---------- */
.area{display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:14px 0;border-bottom:1px solid var(--line)}
.area:last-child{border-bottom:0}
.area b{font-size:16.5px}
.area .code{font-family:var(--round);font-weight:800;color:var(--purple);
  background:var(--lav-soft);padding:5px 13px;border-radius:999px;font-size:14px}

/* ---------- callout ---------- */
.callout{margin-top:34px;background:linear-gradient(135deg,var(--purple),var(--purple-300));
  color:#fff;border-radius:24px;padding:32px 30px;text-align:center}
.callout h2{color:#fff;font-family:var(--serif);margin:0 0 8px}
.callout p{color:rgba(255,255,255,.86);margin:0 0 18px}

/* ---------- footer ---------- */
.pfoot{background:var(--navy);color:#a99fc4;padding:44px 0 30px;font-size:14.5px}
.pfoot-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
@media(max-width:800px){.pfoot-cols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.pfoot-cols{grid-template-columns:1fr}}
.pfoot h4{color:#fff;font-weight:800;font-size:12.5px;letter-spacing:.08em;
  text-transform:uppercase;margin:0 0 13px}
.pfoot a{display:block;color:#a99fc4;text-decoration:none;margin-bottom:9px}
.pfoot a:hover{color:#fff}
.pfoot .pf-brand{font-family:var(--round);font-weight:800;font-size:21px;color:#fff;margin-bottom:6px}
.pfoot-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:30px;padding-top:18px;
  font-size:12.8px;color:#8a7f9f}
.pfoot-bottom a{display:inline;color:#a99fc4}