:root{color-scheme:light;--bg:#FFF9FB;--sf:#fff;--ink:#3A2347;--ink2:#76638A;--line:#F4E6EC;--berry:#D43F6C;--pink:#F7B3CB;--lav:#C9B6F2;--mint:#A9E3CC;--butter:#FFE08A;--sky:#A9D8F5;--peach:#FFC4A3;--sh:0 18px 50px rgba(58,35,71,.10);--d:'Bricolage Grotesque','Trebuchet MS',sans-serif;--b:'Plus Jakarta Sans',system-ui,sans-serif;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px)}
body{background:var(--bg);color:var(--ink);font:500 16px/1.6 var(--b);overflow-x:hidden}
h1,h2,h3{font-family:var(--d);line-height:1.08;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}.wrap{max-width:1120px;margin:auto;padding:0 22px}
section{padding:90px 0;position:relative}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;z-index:0;animation:drift 14s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate(40px,-30px) scale(1.15)}}
nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(16px);background:color-mix(in srgb,var(--bg) 78%,transparent);border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;gap:22px;height:66px}
.logo{display:flex;align-items:center;gap:10px;font:800 22px var(--d)}
.logo i{width:32px;height:32px;border-radius:50%;background:conic-gradient(var(--berry),var(--pink),var(--lav),var(--berry));display:block;animation:spin 8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
nav ul{display:flex;gap:24px;list-style:none;margin-left:auto;font-weight:600;font-size:15px;color:var(--ink2)}nav ul a:hover{color:var(--berry)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border-radius:999px;font-weight:700;background:var(--berry);color:#fff;box-shadow:0 10px 26px rgba(212,63,108,.35);transition:.25s;border:0;cursor:pointer;font-family:var(--b);font-size:15px}
.btn:hover{transform:translateY(-3px) scale(1.03)}.btn.ghost{background:var(--sf);color:var(--ink);box-shadow:none;border:1.5px solid var(--line)}
.hero{padding-top:70px;overflow:hidden}.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;position:relative;z-index:1}
.tag{display:inline-flex;gap:8px;align-items:center;padding:7px 16px;border-radius:999px;background:var(--sf);border:1px solid var(--line);font-weight:700;font-size:13px;color:var(--ink2);box-shadow:var(--sh)}
.tag b{width:8px;height:8px;border-radius:50%;background:var(--mint);animation:pulse 1.6s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 8px transparent;transform:scale(1.3)}}
.hero h1{font-size:clamp(42px,6.4vw,78px);margin:20px 0}
.grad{background:linear-gradient(100deg,var(--berry),#9b6bf0 60%,var(--berry));background-size:200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 6s linear infinite}
@keyframes sheen{to{background-position:200%}}
.hero p.lead{font-size:19px;color:var(--ink2);max-width:520px}.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.phone{width:290px;height:580px;margin:auto;border-radius:48px;background:var(--sf);border:9px solid var(--ink);box-shadow:var(--sh),0 40px 80px rgba(212,63,108,.25);position:relative;padding:22px 18px;animation:bob 6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-16px) rotate(1.2deg)}}
.phone:before{content:"";position:absolute;top:8px;left:50%;width:80px;height:20px;margin-left:-40px;border-radius:99px;background:var(--ink)}
.phone h4{font:800 20px var(--d);margin:18px 0 2px}.phone small{color:var(--ink2);font-weight:600}
.ring{display:block;margin:14px auto}.ring circle{fill:none;stroke-width:14;stroke-linecap:round}
.ring .t{stroke:var(--line)}.ring .p{stroke:url(#g);stroke-dasharray:439;stroke-dashoffset:439;animation:fill 2.4s .4s forwards ease-out}
@keyframes fill{to{stroke-dashoffset:150}}
.ring text{font:800 34px var(--d);fill:var(--ink);text-anchor:middle}.ring .s{font:600 12px var(--b);fill:var(--ink2)}
.row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:18px;margin-top:8px;font-weight:700;font-size:13px}
.row i{width:26px;height:26px;border-radius:50%;display:block}
.fl{position:absolute;padding:10px 16px;border-radius:18px;background:var(--sf);box-shadow:var(--sh);border:1px solid var(--line);font-weight:700;font-size:13px;animation:bob 5s ease-in-out infinite;z-index:3}
.fl small{display:block;color:var(--ink2);font-weight:600}
.stage{position:relative}
.head{text-align:center;max-width:640px;margin:0 auto 50px;position:relative;z-index:1}.head h2{font-size:clamp(32px,4.6vw,54px)}.head p{color:var(--ink2);margin-top:14px}
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative;z-index:1}
.card{border-radius:30px;padding:26px;border:1px solid var(--line);background:var(--sf);box-shadow:var(--sh);transition:transform .3s,box-shadow .3s;position:relative;overflow:hidden;transform-style:preserve-3d}
.card:hover{box-shadow:0 26px 60px rgba(212,63,108,.18)}.card h3{font-size:22px;margin:14px 0 6px}.card p{color:var(--ink2);font-size:14.5px}
.ic{width:52px;height:52px;border-radius:18px;display:grid;place-items:center}.ic svg{width:26px;height:26px;stroke:var(--ink);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.w2{grid-column:span 2}.tall{grid-row:span 2}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:16px}.cal i{aspect-ratio:1;border-radius:50%;background:var(--line);display:block;animation:pop .6s both}
@keyframes pop{from{transform:scale(0)}}
.phases{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;position:relative;z-index:1}
.pb{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.pb button{padding:11px 20px;border-radius:999px;border:1.5px solid var(--line);background:var(--sf);font:700 14px var(--b);color:var(--ink);cursor:pointer;transition:.25s}
.pb button.on{background:var(--c);border-color:var(--c);transform:scale(1.07)}
.big{width:min(340px,100%);margin:auto;display:block;filter:drop-shadow(0 20px 30px rgba(58,35,71,.15))}
.badges{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative;z-index:1}
.bd{text-align:center;padding:24px 14px}.med{width:76px;height:76px;margin:auto;border-radius:50%;display:grid;place-items:center;border:4px solid var(--sf);box-shadow:0 10px 24px rgba(58,35,71,.18);transition:.4s}
.bd:hover .med{transform:rotate(360deg) scale(1.12)}.med svg{width:34px;height:34px;stroke:var(--ink);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.bd h3{font-size:17px;margin:14px 0 2px}.bd p{font-size:13px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:center}.stats b{font:800 clamp(40px,6vw,70px) var(--d);display:block;color:var(--berry)}.stats span{color:var(--ink2);font-weight:600}
.dark{background:var(--ink);color:var(--bg);border-radius:44px;margin:0 14px;overflow:hidden}.dark .head p,.dark .card p{color:#cdbfdc}.dark .card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);box-shadow:none;color:#fff}.dark .ic svg{stroke:#fff}
.sec3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;position:relative;z-index:1}
details{background:var(--sf);border:1px solid var(--line);border-radius:22px;padding:18px 22px;margin-top:12px;box-shadow:var(--sh)}summary{cursor:pointer;font-weight:700;list-style:none}summary:after{content:"+";float:right;color:var(--berry);font-size:22px;line-height:1}details[open] summary:after{content:"–"}details p{color:var(--ink2);margin-top:10px}
.final{text-align:center;border-radius:44px;padding:80px 24px;margin:0 14px;background:linear-gradient(135deg,var(--pink),var(--lav));position:relative;overflow:hidden}
.final h2{font-size:clamp(34px,5.4vw,64px);color:#3A2347}.final p{max-width:480px;margin:16px auto 28px;color:#3A2347}
footer{padding:36px 22px calc(36px + env(safe-area-inset-bottom,0px));text-align:center;color:var(--ink2);font-size:14px}
.rv{opacity:0;transform:translateY(40px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
@media(max-width:900px){nav ul{display:none}nav .btn{margin-left:auto}.hero .wrap,.phases{grid-template-columns:1fr}.bento,.badges,.stats{grid-template-columns:repeat(2,1fr)}.sec3{grid-template-columns:1fr}.w2{grid-column:span 2}.tall{grid-row:auto}.stage{margin-top:30px}}
@media(max-width:520px){.bento,.badges{grid-template-columns:1fr}.w2{grid-column:auto}section{padding:64px 0}.fl{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.ring .p{stroke-dashoffset:150}}