/* Cartoon skin over the v2/v3 pages: same content and purple palette,
   soft lilac outlines and offset shadows for relief (no heavy black ink), rounded display type.
   Preview only. */
:root{
  --line:#d9c6f7;          /* card outline: light lilac */
  --pop:4px 4px 0 #e6d9fb; /* offset shadow, a touch lighter than the outline */
  --pop-lg:6px 6px 0 #d6c1f7;
}

/* type */
.title,.hero h1,.mid h2,.deliver h3,.plan h3,.rv-head b{font-family:"Montserrat",Montserrat,sans-serif;font-weight:700;letter-spacing:.01em}
.title{font-size:2rem;line-height:1.1}
.hero h1{font-size:2.15rem;line-height:1.05}
.hero h1 .sub{font-family:Montserrat,sans-serif}

/* squiggle under section titles */
.title::after{content:"";display:block;width:86px;height:12px;margin:10px auto 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 86 12'%3E%3Cpath d='M2 7c8-6 13 4 21 0s13-6 21 0 13 4 21 0 13-6 19-1' fill='none' stroke='%23c4a3f5' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}

/* buttons: chunky and pressable, relief in the button's own darker shade */
.btn{border:0;box-shadow:0 5px 0 #179a4c;font-family:"Montserrat",Montserrat,sans-serif;font-weight:700;font-size:1.08rem;letter-spacing:.03em;transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translateY(-2px);box-shadow:0 7px 0 #179a4c;filter:none}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #179a4c}
.btn.alt-btn{border:2px solid #cfcbd6;box-shadow:0 5px 0 #e3e0e8}
.btn.alt-btn:active{box-shadow:0 2px 0 #e3e0e8}

/* pills and badges: soft outline only */
.badge{border:1.5px solid #d7c3f8}
.more-tag{border:1.5px solid #b9e9cc}
.mid .kicker{display:inline-block;background:var(--accent);color:#3a1d00;padding:5px 14px;border-radius:999px;letter-spacing:.14em;box-shadow:0 3px 0 #e08e45}

/* every card gets the same soft sticker relief */
.sheet,.review,.ideal li,.bonus,.faq details,.stats,.plan,.creator-img,.feat{border:2px solid var(--line)!important;box-shadow:var(--pop)!important}
.sheet{border-radius:16px}
.plan.best{border-color:#b98cf5!important;box-shadow:var(--pop-lg)!important;background:#fff}
.plan.basic{background:#fff}
.stats{border-radius:22px}
.stat+.stat{border-left:2px dashed #e3d4fb}
.deliver{box-shadow:6px 6px 0 #d6c1f7}

/* What's included: same soft relief as every other card, with the alternating tilt (Ian liked it) */
.sticker .feat{border:2px solid var(--line)!important;box-shadow:var(--pop)!important}
.sico{border:0!important}

/* faces keep a white ring */
.pstack img,.rv-who img{border:3px solid #fff}

/* dark band gets a wavy edge */
.mid{position:relative}
.mid::before,.mid::after{content:"";position:absolute;left:0;right:0;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 18' preserveAspectRatio='none'%3E%3Cpath d='M0 18V9c10-8 20-8 30 0s20 8 30 0 20-8 30 0 20 8 30 0v9z' fill='%231e0b3a'/%3E%3C/svg%3E") repeat-x;background-size:120px 18px}
.mid::before{top:-17px}
.mid::after{bottom:-17px;transform:rotate(180deg)}

/* soft floating shapes behind some section titles */
section{position:relative;overflow-x:clip}
section > .wrap{position:relative;z-index:1}
#included::before,#reviews::before,#plans::before,#faq::before{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:#f3ebff;border:2px dashed #dcc8fb;top:28px;right:-26px;z-index:0}
#proof::before,#bonuses::before,#ideal::before{content:"";position:absolute;width:70px;height:70px;border-radius:22px;background:#fff1e4;border:2px dashed #f9cfa8;top:40px;left:-24px;rotate:14deg;z-index:0}
@media (min-width:900px){.title{font-size:2.6rem}.hero h1{font-size:3rem}}

/* Perfect for you: stacked rows, single lilac palette (Ian, 10/10) */
.ideal-tiles{display:grid;grid-template-columns:1fr;gap:12px;margin-top:28px}
.ideal-tiles li{list-style:none;background:#fff;border:2px solid var(--line);border-radius:18px;box-shadow:var(--pop);padding:14px 16px;display:flex;flex-direction:row;align-items:center;gap:14px}
.ideal-tiles .ic{flex:none;width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:#f1e8fe}
.ideal-tiles .ic svg{width:22px;height:22px;fill:none;stroke:#7e22ce;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ideal-tiles span:last-child{font-weight:700;font-size:.95rem;color:var(--fg);line-height:1.35}
@media (min-width:768px){.ideal-tiles{grid-template-columns:1fr 1fr;max-width:900px;margin-left:auto;margin-right:auto;gap:14px 16px}}

/* desktop alignment (Ian, 10/10) */
@media (min-width:640px){
  .stats{grid-template-columns:repeat(3,1fr)}
  .stat b{white-space:nowrap}
}
@media (min-width:900px){
  .features.sticker{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;max-width:1040px;margin-left:auto;margin-right:auto}
  .features.sticker .feat{flex:0 1 calc((100% - 44px)/3)}
  .gallery{max-width:none}
  .plans{align-items:flex-start}
  .plan .checkout{margin-top:6px}
}

/* How access works: numbered timeline, line fills as you scroll (Ian, 10/10) */
#access{text-align:center}
.access-sub{font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin:2px 0 34px}
.tl{position:relative;max-width:560px;margin:0 auto;text-align:left;padding-left:4px}
.tl-line{position:absolute;left:25px;top:26px;bottom:26px;width:4px;border-radius:4px;background:#ece2fb;overflow:hidden}
.tl-line i{position:absolute;left:0;top:0;width:100%;height:0;border-radius:4px;background:#7e22ce}
.tl-step{position:relative;display:flex;gap:18px;align-items:flex-start;padding:0 0 34px}
.tl-step:last-child{padding-bottom:0}
.tl-num{flex:none;position:relative;z-index:1;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:"Montserrat",Montserrat,sans-serif;font-weight:700;font-size:1.4rem;background:#fff;color:#b79af0;border:3px solid #e3d4fb;transition:background .35s,color .35s,border-color .35s,transform .35s}
.tl-step.on .tl-num{background:#7e22ce;color:#fff;border-color:#7e22ce;transform:scale(1.06);box-shadow:0 0 0 6px #f1e8fe}
.tl-body{padding-top:6px}
.tl-body h3{font-family:"Montserrat",Montserrat,sans-serif;font-weight:700;font-size:1.3rem;line-height:1.2;margin-bottom:4px;color:#b3a6c6;transition:color .35s}
.tl-step.on .tl-body h3{color:var(--fg)}
.tl-body p{color:var(--muted);font-size:.95rem;line-height:1.55}
.access-cta{margin-top:34px}
@media (min-width:768px){.tl-body h3{font-size:1.45rem}.tl-body p{font-size:1rem}}
@media (prefers-reduced-motion:reduce){.tl-num,.tl-body h3{transition:none}}

/* Complete plan: bonuses in their own highlighted box (Ian, 10/10) */
.bonus-box{background:#fff8ec;border:2px dashed #f6b783;border-radius:18px;padding:14px 14px 12px;margin:4px 0 18px;text-align:left}
.bonus-box-h{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.bb-ic{width:30px;height:30px;border-radius:10px;background:#fda85e;display:inline-flex;align-items:center;justify-content:center;flex:none}
.bb-ic .gift{width:17px;height:17px;stroke:#fff}
.bonus-box-h b{font-family:"Montserrat",Montserrat,sans-serif;font-weight:700;font-size:1.05rem;color:#9c4210;text-transform:uppercase;letter-spacing:.02em}
.bonus-box-h em{font-style:normal;margin-left:auto;background:#fff;border:1.5px solid #f6b783;color:#9c4210;font-weight:800;font-size:.72rem;padding:3px 10px;border-radius:999px}
.bonus-list{margin:0;gap:9px}
.bonus-list li{color:#5a2a0c}
.bdot{flex:none;width:19px;height:19px;display:inline-flex;align-items:center;justify-content:center}
.gift{fill:none;stroke:#e08e45;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;width:17px;height:17px}

/* second sheets row under What's included (Ian, 10/10) */
.gallery-included{margin-top:34px}

/* hero title in the mockup cover colors, solid (Ian, 10/10) */
.hero h1 .c-p{color:#5b1fa0}.hero h1 .c-o{color:#f08a2a}.hero h1 .c-g{color:#3caa4f}