
:root{--navy:#2B2A5C; --dark:#2D2A60; --lav:#8A86F0; --teal:#5FD4C4; --amber:#F6C85A; --blue:#66A9E0; --soft:rgba(255,255,255,.88);
 --grad:linear-gradient(90deg,#8A86F0 0%,#5FD4C4 100%); --px:clamp(22px,6vw,80px); --gap:clamp(110px,15vw,190px);
 --h1:clamp(34px,5vw,56px); --h2:clamp(30px,4.2vw,46px); --h3:clamp(24px,2.9vw,32px); --body:clamp(18px,1.9vw,20px); --small:16px;}
body{margin:0; background:#fff; font-family:'Montserrat',system-ui,sans-serif; font-weight:400; color:var(--navy); overflow-x:hidden;}
a{color:inherit; text-decoration:none;} h1,h2,h3,h4,p{margin:0;}
.wrap{max-width:1040px; margin:0 auto; width:100%; box-sizing:border-box;}
.g{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;}
.gbtn{display:inline-block; background:var(--grad); color:#fff; font-size:15px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:16px 32px; border-radius:12px; text-align:center; box-sizing:border-box; box-shadow:0 4px 12px rgba(43,42,92,.18);}
.gbtn:hover{filter:brightness(1.06);} .gbtn.amb{background:var(--amber); color:var(--navy); box-shadow:none;}
.gbtn:focus-visible,a:focus-visible{outline:3px solid var(--amber); outline-offset:3px;}
h2{font-size:var(--h2); line-height:1.25; font-weight:700; text-align:center; max-width:760px; margin:0 auto;}
header{background:var(--dark); padding:0 var(--px); height:84px; display:flex; align-items:center; justify-content:space-between;}
header img{height:54px; display:block;} header .gbtn{padding:11px 20px; font-size:13px;}
@media(max-width:560px){header .gbtn{display:none;}}
.hero{padding:clamp(90px,14vw,180px) var(--px) 0; text-align:center;}
.hero h1{font-size:var(--h1); line-height:1.25; font-weight:700; max-width:880px; margin:0 auto;}
.hero .gbtn{margin-top:clamp(40px,6vw,60px);} .hero small{display:block; margin-top:22px; font-size:var(--small); font-weight:500;}
.proof{padding:var(--gap) var(--px) 0;}
.quote{max-width:760px; margin:0 auto 70px; text-align:center;} .quote p{font-size:var(--h3); line-height:1.4; font-weight:600;}
.by{display:flex; align-items:center; justify-content:center; gap:16px; margin-top:26px; text-align:left;} .by img{width:72px; height:72px; border-radius:50%;} .by b{display:block; font-size:18px; font-weight:700;} .by span{font-size:var(--small); font-weight:500; color:var(--teal);}
.ph{border:2px dashed var(--amber);} .tag{display:inline-block; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; background:var(--amber); color:var(--navy); padding:3px 8px; border-radius:6px; margin-right:8px; vertical-align:middle;}
.photo{border-radius:18px; background:#EEEDFB; display:flex; align-items:center; justify-content:center; text-align:center; padding:16px; font-size:var(--small); font-weight:500; aspect-ratio:16/6; color:var(--navy);}
.vids{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin:-70px 28px 0; position:relative;}
.vid{border-radius:18px; background:var(--dark); color:#fff; aspect-ratio:16/9; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center; padding:22px;}
.play{width:68px; height:68px; border-radius:50%; background:var(--grad); display:flex; align-items:center; justify-content:center;}
.vid b{font-size:20px; font-weight:700;} .vid small{font-size:var(--small); font-weight:400; line-height:1.5; max-width:400px;}
.pvs{padding:var(--gap) var(--px) 0;} .pvs h2{margin-bottom:70px;}
.conv{max-width:820px; margin:0 auto 70px; display:flex; flex-direction:column; gap:14px;}
.bub{max-width:82%; padding:20px 24px; border-radius:18px; font-size:var(--body); line-height:1.6; font-weight:400;}
.bub b{display:block; font-size:13px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; margin-bottom:8px;}
.bub.q{background:#F1F0FB; border-bottom-left-radius:6px; align-self:flex-start;} .bub.q b{color:#B4503F;}
.bub.a{background:var(--dark); color:#fff; border-bottom-right-radius:6px; align-self:flex-end;} .bub.a b{color:var(--teal);}
.bub.a.ph{background:#fff; color:var(--navy);} .bub.a.ph b{color:#8A6A10;}
.end{text-align:center; font-size:var(--body); font-weight:600; line-height:1.5;}
.pvs .photo{max-width:820px; margin:0 auto 60px;}
.how{background:var(--dark); color:#fff; padding:var(--gap) var(--px); margin-top:var(--gap);} .how h2{margin-bottom:60px;}
.who{display:flex; align-items:center; gap:22px; margin:6px 0 30px;}
.who .pic{width:96px; height:96px; border-radius:50%; flex:none; background:#EEEDFB; color:var(--navy); display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:600;}
.who b{display:block; font-size:18px; font-weight:700;} .who span{display:block; font-size:var(--small); font-weight:500; color:var(--teal); margin-top:3px;} .who .tag{display:inline-block; color:var(--navy); margin:8px 0 0;}
h3.qt{font-size:var(--h3); line-height:1.4; font-weight:600; margin-bottom:14px;}
p.d{font-size:var(--body); line-height:1.65; font-weight:400; color:var(--soft); max-width:480px;}
.stick{display:none;} .fb{display:block; width:min(52%,230px); margin:0 auto 40px;} .step{padding:44px 0;}
.get{padding:var(--gap) var(--px) 0;} .get h2{margin-bottom:70px;}
.nbs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-bottom:80px;}
.nb h4{font-size:18px; letter-spacing:.04em; line-height:1.35; font-weight:700; text-transform:uppercase; margin-bottom:14px;} .nb p{font-size:var(--body); line-height:1.6;}
.nb .xc{width:56px; height:56px; border-radius:50%; background:var(--blue); display:flex; align-items:center; justify-content:center; margin-bottom:20px;}
.code{max-width:640px; margin:0 auto; border:2px dashed var(--amber); border-radius:24px; padding:34px 36px 40px;}
.code .lab{font-size:var(--small); font-weight:600; letter-spacing:.06em; text-transform:uppercase; text-align:center; margin-bottom:22px; color:#8A6A10;}
.code .typed{font-size:clamp(40px,7vw,64px); font-weight:500; letter-spacing:.04em; overflow:hidden; white-space:nowrap; width:8ch; border-right:3px solid var(--navy);}
.close{background:var(--dark); color:#fff; text-align:center; padding:var(--gap) var(--px) 40px; margin-top:var(--gap);} .close h2{margin-bottom:44px;}
.close .c{margin-top:var(--gap); padding-top:22px; border-top:1px solid rgba(255,255,255,.2); font-size:var(--small); font-weight:400; color:var(--soft);}
@media(max-width:820px){.vids,.nbs{grid-template-columns:1fr;} .vids{margin:-40px 0 0;} .photo{aspect-ratio:4/3;} .who .pic{width:80px; height:80px;} .nbs{gap:46px;}}
@media (prefers-reduced-motion:no-preference){
  .hero h1,.hero .gbtn,.hero small{animation:up .9s cubic-bezier(.2,.7,.2,1) both;} .hero .gbtn{animation-delay:.15s;} .hero small{animation-delay:.3s;}
  @keyframes up{from{opacity:0; transform:translateY(28px);}to{opacity:1; transform:none;}}
  .code .typed{width:0; animation:typ 5s steps(8) infinite;} @keyframes typ{0%{width:0}60%,90%{width:8ch}100%{width:0}}
  @supports (animation-timeline:view()){
    .quote,.vid,.bub,.nb,.promo .card,.pvs h2,.how h2,.get h2,.close h2,.end,.code,.photo{animation:rv linear both; animation-timeline:view(); animation-range:entry 0% entry 70%;}
    .bub.q{animation-name:rvL;} .bub.a{animation-name:rvR;} .vid:nth-child(2),.nb:nth-child(2){animation-range:entry 8% entry 78%;} .nb:nth-child(3){animation-range:entry 14% entry 84%;}
    @keyframes rv{from{opacity:0; transform:translateY(46px);}to{opacity:1; transform:none;}}
    @keyframes rvL{from{opacity:0; transform:translateX(-60px) scale(.96);}to{opacity:1; transform:none;}}
    @keyframes rvR{from{opacity:0; transform:translateX(60px) scale(.96);}to{opacity:1; transform:none;}}
    @media(min-width:821px){
      .how .grid{display:grid; grid-template-columns:300px 1fr; gap:clamp(50px,8vw,110px); align-items:start; max-width:1040px; margin:0 auto; timeline-scope:--s1,--s2,--s3,--s4;}
      .stick{display:block; position:sticky; top:9vh; height:82vh; order:0;} .stick::before{content:""; position:absolute; left:50%; top:50%; width:150%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle,rgba(138,134,240,.42),rgba(95,212,196,.16) 45%,transparent 70%); filter:blur(14px);}
      .pst{position:relative; height:min(74vh,560px); margin-top:4vh;}
      .pi{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; animation:sw linear both; animation-range:cover 0% cover 100%; -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent); -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent); mask-composite:intersect;}
      @keyframes sw{0%{opacity:0; transform:translateY(50px) rotate(-5deg) scale(.92);}32%,68%{opacity:1; transform:none;}100%{opacity:0; transform:translateY(-50px) rotate(4deg) scale(.92);}}
      .fb{display:none;} .step{min-height:92vh; display:flex; flex-direction:column; justify-content:center; padding:0;}
      .step .in{animation:sx linear both; animation-timeline:view(); animation-range:cover 0% cover 100%;} @keyframes sx{0%{opacity:0; transform:translateY(40px);}30%,70%{opacity:1; transform:none;}100%{opacity:0; transform:translateY(-40px);}}
.s1{view-timeline-name:--s1; view-timeline-axis:block;} .p1{animation-timeline:--s1;}
.s2{view-timeline-name:--s2; view-timeline-axis:block;} .p2{animation-timeline:--s2;}
.s3{view-timeline-name:--s3; view-timeline-axis:block;} .p3{animation-timeline:--s3;}
.s4{view-timeline-name:--s4; view-timeline-axis:block;} .p4{animation-timeline:--s4;}
    }
  }
}

.nbs{margin-bottom:0!important;} .nb{display:flex; gap:22px; align-items:flex-start;} .nb .xc{flex:none; margin-bottom:0!important;}
.promo{padding:var(--gap) var(--px) 0;} .promo .card{background:var(--dark); color:#fff; border-radius:28px; padding:clamp(40px,6vw,80px) clamp(24px,5vw,70px); text-align:center;}
.promo .two{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; text-align:left; max-width:760px; margin:50px auto;}
.promo h4{font-size:18px; letter-spacing:.04em; text-transform:uppercase; font-weight:700; color:var(--teal); margin-bottom:12px;} .promo .two p{font-size:var(--body); line-height:1.6; color:var(--soft);}
.promo .code .lab{color:var(--amber);} .promo .code .typed{border-right-color:#fff; color:#fff;}
@media(max-width:820px){.promo .two{grid-template-columns:1fr; gap:30px;}}

/* ---- WeCo classic branding ---- */
:root{--rb:linear-gradient(90deg,#E8412F 0%,#F3A73D 22%,#F2CB2E 40%,#3DBE6B 58%,#2F8CF0 78%,#7D3BE3 100%);}
.g{background:var(--rb); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.08em;}
.rbar{height:8px; background:var(--rb); width:100%;}
h1,h2{font-weight:800!important;} h2::after{content:""; display:block; width:84px; height:7px; border-radius:7px; background:var(--rb); margin:22px auto 0;}
.close h2::after{margin-top:22px;}
.gbtn:not(.amb){background:var(--navy); color:#fff; border-bottom:5px solid transparent; border-image:var(--rb) 1; border-radius:0; box-shadow:0 6px 16px rgba(43,42,92,.2);}
.gbtn:not(.amb):hover{transform:translateY(-2px); filter:none;} .gbtn{transition:transform .12s ease;}
.amb{border-radius:12px; font-weight:800;}
header .gbtn{background:var(--amber); color:var(--navy); border:0; border-image:none; border-radius:12px; box-shadow:none;}
.hero{position:relative; overflow:hidden;} .hero h1,.hero .gbtn,.hero small,.hero .strip{position:relative; z-index:1;}
.dots{position:absolute; inset:0; z-index:0; pointer-events:none;} .dots i{position:absolute; border-radius:50%; display:block; animation:bob 5s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(-10px);}50%{transform:translateY(10px);}}
.strip{display:block; width:min(100%,900px); height:auto; margin:clamp(60px,9vw,110px) auto 0;}
.who .pic,.by img,.mini{box-shadow:0 0 0 7px var(--ring,#E6E1FB);} .by img{--ring:#E3EDFB;}
.who .pic{object-fit:cover;} .mini{float:left; width:64px; height:64px; border-radius:50%; object-fit:cover; margin:4px 22px 8px 6px;}
.bub.a.ph{overflow:hidden;} .bub.a.ph::after{content:""; display:block; clear:both;}
.stick::before{background:radial-gradient(circle,rgba(125,59,227,.4) 0%,rgba(47,140,240,.22) 35%,rgba(243,167,61,.14) 55%,transparent 72%)!important;}
.bub.q{border-left:6px solid #F3A73D;} .conv:nth-child(3) .bub.q{border-left-color:#3DBE6B;} .conv:nth-child(4) .bub.q{border-left-color:#2F8CF0;}
.nb .xc{box-shadow:0 0 0 6px rgba(43,42,92,.06);}
.vid .play{background:var(--rb);}
.vid.pv.vv{cursor:pointer;}
.vid.pv.vv::after{inset:auto 0 0 0; height:45%; background:linear-gradient(transparent,rgba(20,18,50,.62)); pointer-events:none;}
.vid.pv.vv .vplay{position:absolute; left:16px; bottom:16px; top:auto; width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,#E8412F,#F3A73D,#3DBE6B,#2F8CF0,#7D3BE3); display:grid; place-items:center; z-index:2; box-shadow:0 4px 12px rgba(0,0,0,.3);}
.vid.pv.vv .vplay svg{margin-left:2px;}
.vid.pv.vv b.vlabel{left:74px; bottom:27px; font-size:18px; text-shadow:0 1px 6px rgba(0,0,0,.5);}
.vid.pv.vv.loading b.vlabel::after{content:" · loading..."; font-weight:600; font-size:14px;}
.vid.pv.vv.loading .vplay{opacity:.7;}
.vid.pv.vv.playing{aspect-ratio:auto; background:#000;}
.vid.pv.vv.playing img,.vid.pv.vv.playing .vplay,.vid.pv.vv.playing b.vlabel,.vid.pv.vv.playing::after{display:none;}
.vid.pv.vv video{position:static; width:100%; height:auto; max-height:78vh; display:block; margin:0 auto; background:#000;}
.promo .card{background:var(--dark);} .promo .card h2::after{background:var(--rb);}
.code{border-image:none;}

/* ---- round 13 ---- */
.gbtn:not(.amb){border:0!important; border-image:none!important; border-radius:12px; border-bottom:5px solid transparent!important; background:linear-gradient(var(--navy),var(--navy)) padding-box,var(--rb) border-box!important;}
header .gbtn{border:0!important; background:var(--amber)!important;}
.proof{padding:var(--gap) var(--px) 0;} .proof h2{margin-bottom:60px;} .vids{margin:0!important;}
.pvs{padding:var(--gap) var(--px) 0;} .pf{display:grid; grid-template-columns:1fr 64px 1fr; gap:24px; align-items:center; max-width:960px; margin:0 auto 56px;}
.pq{font-size:var(--h3); line-height:1.3; font-weight:800; text-align:right;} .ar{display:flex; justify-content:center;}
.pa{display:flex; align-items:center; gap:18px; font-size:var(--body); line-height:1.5; font-weight:500; flex-wrap:wrap;} .pa .mini{float:none; width:64px; height:64px; margin:0; flex:none; border-radius:50%; object-fit:cover; box-shadow:0 0 0 6px #E6E1FB;} .pa .tag{margin:0;}
.pvs .photo{margin:80px auto 0; max-width:960px;}
@media(max-width:820px){.pf{grid-template-columns:1fr; gap:14px; text-align:left;} .pq{text-align:left;} .ar{justify-content:flex-start; transform:rotate(90deg); width:48px; height:36px; align-items:center;} .pf{margin-bottom:60px;}}
.car{position:relative; max-width:1040px; margin:0 auto;} .car input{position:absolute; opacity:0; pointer-events:none;}
.win{overflow:hidden;} .track{display:flex; width:400%; animation:auto 28s infinite cubic-bezier(.6,0,.2,1); will-change:transform;}
.car:hover .track,.car:focus-within .track{animation-play-state:paused;}
.slide{width:25%; box-sizing:border-box; padding:0 6px; display:grid; grid-template-columns:minmax(260px,400px) 1fr; grid-template-areas:"ph tx" "ph d"; column-gap:clamp(40px,7vw,100px); align-items:center; align-content:center;}
.sph{grid-area:ph; position:relative; display:flex; justify-content:center;} .sph::before{content:""; position:absolute; left:50%; top:50%; width:140%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle,rgba(125,59,227,.4),rgba(47,140,240,.2) 38%,rgba(243,167,61,.12) 56%,transparent 72%); filter:blur(14px);}
.sph img{position:relative; width:100%; max-width:400px; height:auto; display:block; -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent); -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent); mask-composite:intersect;}
.stx{grid-area:tx; align-self:end;} .slide p.d{grid-area:d; align-self:start; margin-top:6px;}
@keyframes auto{0%,21%{transform:translateX(0)}25%,46%{transform:translateX(-25%)}50%,71%{transform:translateX(-50%)}75%,96%{transform:translateX(-75%)}100%{transform:translateX(0)}}
.dots2{display:flex; justify-content:center; gap:14px; margin-top:50px;} .dots2 label{width:16px; height:16px; border-radius:50%; background:rgba(255,255,255,.3); cursor:pointer; animation:dot 28s infinite;} .dots2 label:nth-child(2){animation-delay:7s;} .dots2 label:nth-child(3){animation-delay:14s;} .dots2 label:nth-child(4){animation-delay:21s;}
@keyframes dot{0%,24%{background:#F3A73D; transform:scale(1.3);}25%,100%{background:rgba(255,255,255,.3); transform:none;}}
.car:hover .dots2 label{animation-play-state:paused;}
#c1:checked~.win .track{animation:none; transform:translateX(0);} #c2:checked~.win .track{animation:none; transform:translateX(-25%);} #c3:checked~.win .track{animation:none; transform:translateX(-50%);} #c4:checked~.win .track{animation:none; transform:translateX(-75%);}
.car input:checked~.dots2 label{animation:none;}
#c1:checked~.dots2 label:nth-child(1),#c2:checked~.dots2 label:nth-child(2),#c3:checked~.dots2 label:nth-child(3),#c4:checked~.dots2 label:nth-child(4){background:#F3A73D; transform:scale(1.3);}
.car input:focus-visible~.dots2{outline:3px solid var(--amber); outline-offset:6px;}
@media(prefers-reduced-motion:reduce){.track,.dots2 label{animation:none;}}
@media(max-width:820px){.slide{grid-template-columns:1fr; grid-template-areas:"ph" "tx" "d"; row-gap:20px;} .sph img{max-width:min(70%,300px);} .stx{align-self:start;}}
.promo .two{margin:50px auto 0!important; max-width:760px;} .promo .big{font-size:clamp(64px,11vw,110px); font-weight:800; line-height:1; margin-bottom:14px;} .promo .two>div{text-align:center;} .promo .two p{font-size:var(--body); line-height:1.5; color:var(--soft); max-width:260px; margin:0 auto;}

/* ---- carousel arrows, manual ---- */
.track{animation:none!important; transition:transform .6s cubic-bezier(.6,0,.2,1);} .dots2 label{animation:none!important;}
.nv{position:absolute; top:50%; z-index:3;} .nv.prev{left:-58px;} .nv.next{right:-58px;}
.nv label{display:none; width:52px; height:52px; border-radius:50%; align-items:center; justify-content:center; cursor:pointer; background:linear-gradient(var(--dark),var(--dark)) padding-box,var(--rb) border-box; border:3px solid transparent; box-shadow:0 6px 18px rgba(0,0,0,.35); transform:translateY(-50%); transition:transform .15s ease;}
.nv label:hover{transform:translateY(-50%) scale(1.08);}
#c1:checked~.prev label[for=c4],#c2:checked~.prev label[for=c1],#c3:checked~.prev label[for=c2],#c4:checked~.prev label[for=c3],
#c1:checked~.next label[for=c2],#c2:checked~.next label[for=c3],#c3:checked~.next label[for=c4],#c4:checked~.next label[for=c1]{display:flex;}
@media (prefers-reduced-motion:no-preference){.nv label{animation:nudge 2.4s ease-in-out infinite;} .nv.prev label{animation-name:nudgeL;}
 @keyframes nudge{0%,100%{margin-right:0}50%{margin-right:-6px}} @keyframes nudgeL{0%,100%{margin-left:0}50%{margin-left:-6px}}}
@media(max-width:1180px){.nv.prev{left:2px;} .nv.next{right:2px;}}
@media(max-width:820px){.nv{top:170px;}}

.vid.pv{position:relative; display:block; padding:0; overflow:hidden; border-radius:18px; aspect-ratio:16/9; background:#000; border:0; box-shadow:0 10px 30px rgba(43,42,92,.22);}
.vid.pv img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease;}
.vid.pv:hover img{transform:scale(1.04);}
.vid.pv::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(20,18,60,.7)); }
.vid.pv .play{position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); z-index:2; width:76px; height:76px; border:4px solid #fff; box-shadow:0 6px 20px rgba(0,0,0,.35);}
.vid.pv b{position:absolute; left:20px; bottom:16px; z-index:2; color:#fff; font-size:20px; font-weight:800;}

/* ---- round 15 ---- */
.inlogo{display:inline; height:.8em; width:auto; vertical-align:-.12em; margin-left:.12em;}
.dots i{animation-name:bob;} @media(max-width:1100px){.dots i{display:none;} .dots i:nth-child(1){display:block; left:6%!important; top:3%!important;} .dots i:nth-child(3){display:block; left:auto!important; right:7%!important; top:4%!important;} .dots i:nth-child(5){display:block; left:5%!important; top:97%!important;} .dots i:nth-child(8){display:block; left:auto!important; right:6%!important; top:96%!important;}}
.vid.pv .play{background:var(--amber)!important; border:0; box-shadow:0 6px 20px rgba(0,0,0,.4); width:78px; height:78px;} .vid.pv .play svg{fill:var(--navy); width:32px; height:32px; margin-left:4px;}
.pf .pa{display:block;} .pq{text-align:right;}
.slide{display:flex!important; flex-direction:column; align-items:center; text-align:center; padding:0 6px;}
.qrow{display:flex; align-items:center; justify-content:center; gap:clamp(12px,2.4vw,28px); width:100%; max-width:900px;}
.qbox{flex:1; min-width:0; background:linear-gradient(#37346F,#37346F) padding-box,var(--rb) border-box; border:2px solid transparent; border-radius:22px; padding:clamp(22px,3vw,34px) clamp(20px,3.4vw,40px);}
.qbox .qt{margin:0; font-size:var(--h3); line-height:1.4; font-weight:600;}
.ab{flex:none; width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; background:linear-gradient(var(--dark),var(--dark)) padding-box,var(--rb) border-box; border:3px solid transparent; box-shadow:0 6px 18px rgba(0,0,0,.35); transition:transform .15s ease;}
.ab:hover{transform:scale(1.1);}
.slide .who{justify-content:center; margin:28px 0 10px; text-align:left;} .who span{color:var(--amber)!important;}
.slide .sph{margin:10px 0 30px;} .sph img{max-width:300px!important;}
.more{max-width:560px; width:100%;} .more summary{list-style:none; display:inline-flex; align-items:center; gap:10px; cursor:pointer; border:2px solid rgba(255,255,255,.55); border-radius:999px; padding:11px 24px; font-size:15px; font-weight:700; letter-spacing:.04em; color:#fff;} .more summary::-webkit-details-marker{display:none;}
.more summary::after{content:""; width:9px; height:9px; border-right:3px solid #fff; border-bottom:3px solid #fff; transform:rotate(45deg) translateY(-2px); transition:transform .2s;} .more[open] summary::after{transform:rotate(-135deg) translateY(-2px);}
.more summary:hover{border-color:#fff;} .more summary:focus-visible{outline:3px solid var(--amber); outline-offset:3px;}
.more p.d{margin:20px auto 0; max-width:520px; text-align:center;}
@media(max-width:560px){.ab{width:42px; height:42px;} .ab svg{width:18px; height:18px;}}
.nb h4{text-transform:none!important; letter-spacing:0!important; font-size:20px!important;}

/* ---- round 16 ---- */
.dots i.dm{display:none;} @media(max-width:1100px){.dots i.dd{display:none!important;} .dots i.dm{display:block;}}
.pvs h2{margin-bottom:70px;}
.ps{display:grid; grid-template-columns:1fr 56px 1.25fr; gap:20px; align-items:stretch; max-width:1000px; margin:0 auto 34px;}
.pbox,.sbox{border-radius:20px; padding:26px 28px; position:relative;}
.pbox{background:#FFF1EE; border:2px solid #F4B8AE; display:flex; flex-direction:column; justify-content:center;} .pbox p{font-size:var(--h3); line-height:1.3; font-weight:800; color:#8E2A1B; margin-top:14px;}
.sbox{background:#fff; border:2px solid #3DBE6B; box-shadow:0 8px 24px rgba(61,190,107,.14);}
.chip{display:inline-block; font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:5px 12px; border-radius:999px; color:#fff;} .chip.c1{background:#E8412F; align-self:flex-start;} .chip.c2{background:#3DBE6B;}
.who2{display:flex; align-items:center; gap:16px; margin:18px 0 14px;} .who2 img{width:64px; height:64px; border-radius:50%; object-fit:cover; flex:none; box-shadow:0 0 0 5px #E3F6EA;} .who2 b{display:block; font-size:18px; font-weight:700;} .who2 span{display:block; font-size:var(--small); font-weight:500; color:#2E8F55;}
.sbox p{font-size:var(--body); line-height:1.6; font-weight:400;}
.mid{display:flex; align-items:center; justify-content:center;}
@media(max-width:820px){.ps{grid-template-columns:1fr; gap:10px; margin-bottom:56px;} .mid{transform:rotate(90deg); height:40px;}}
.qbox{text-align:left; background:#37346F!important; border:1px solid rgba(255,255,255,.2)!important; border-radius:18px;}
.qbox .qt{text-align:left;} .qbox .who{justify-content:flex-start; margin:24px 0 0; padding-top:20px; border-top:1px solid rgba(255,255,255,.18); text-align:left;}
.qbox .who .pic{width:64px; height:64px; font-size:16px;}

.what{padding:var(--gap) var(--px) 0; text-align:center;} .what .lead{font-size:var(--h3); line-height:1.35; font-weight:800; max-width:760px; margin:0 auto 22px;}
.what .sub2{font-size:var(--body); line-height:1.65; font-weight:400; max-width:640px; margin:0 auto;}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.what p{animation:rv linear both; animation-timeline:view(); animation-range:entry 0% entry 70%;}}}

/* ---- round 19 ---- */
.pbox{background:#F4F3F9!important; border:2px solid #DAD8E8!important;} .pbox p{color:var(--navy)!important; font-size:var(--body)!important; font-weight:500!important; line-height:1.5!important; margin-top:8px!important;}
.pbox .tp{display:block; margin-top:16px; font-size:var(--h3); line-height:1.25; font-weight:800;}
.chip.c1{background:#8C8AA8!important;}
.stp{width:100%; max-width:420px; margin:34px auto 0; position:relative;}
.sph2{background:#EEECF7; border-radius:26px 26px 0 0; padding:26px 40px 0; display:flex; justify-content:center; overflow:hidden;} .sph2 img{width:100%; max-width:240px; height:auto; display:block;}
.scard{position:relative; margin:-62px 14px 0; background:#fff; color:var(--navy); border-radius:22px; padding:0 22px 22px; text-align:center; box-shadow:0 14px 34px rgba(0,0,0,.25); display:flex; flex-direction:column; gap:6px;}
.scard .n{width:52px; height:52px; border-radius:50%; background:#F3A73D; color:#fff; font-size:26px; font-weight:800; display:flex; align-items:center; justify-content:center; margin:-26px auto 6px; box-shadow:0 0 0 6px #fff;}
.scard b{font-size:22px; font-weight:800;} .scard .dd2{font-size:17px; line-height:1.45; font-weight:500; color:#5F5B80;}
.dots2 label{width:40px!important; height:40px!important; display:flex!important; align-items:center; justify-content:center; font-size:16px; font-weight:800; color:#fff;}
.dots2 label:nth-child(1)::before{content:"1";} .dots2 label:nth-child(2)::before{content:"2";} .dots2 label:nth-child(3)::before{content:"3";} .dots2 label:nth-child(4)::before{content:"4";}
#c1:checked~.dots2 label:nth-child(1),#c2:checked~.dots2 label:nth-child(2),#c3:checked~.dots2 label:nth-child(3),#c4:checked~.dots2 label:nth-child(4){color:var(--navy);}
.dots2{gap:16px!important;}

.nbs{align-items:center;} .nb{align-items:center!important;} .nb h4{margin:0!important; font-size:22px!important; line-height:1.3;}

/* ---- round 21: one-screen steps ---- */
.track .slide.s2{display:grid!important; grid-template-columns:300px 1fr; grid-template-areas:"ph tx" "ph sq"; column-gap:clamp(36px,6vw,80px); row-gap:26px; align-items:center; align-content:center; padding:0 76px!important; text-align:left; position:relative; position:relative;}
.s2 .sph2{grid-area:ph; margin:0; padding:24px 34px 0; border-radius:26px; align-self:center; height:auto;} .s2 .sph2 img{max-width:232px;}
.s2 .sph2{border-radius:26px; padding-bottom:0;}
.s2 .nbadge{display:none;}
.s2 .stxt{grid-area:tx; align-self:end;} .s2 .eyebrow{display:inline-block; font-size:13px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--amber); margin-bottom:10px;}
.s2 .stxt h3{font-size:clamp(30px,3.6vw,42px); line-height:1.15; font-weight:800; margin:0 0 12px; text-align:left;} .s2 .stxt p{font-size:var(--body); line-height:1.5; font-weight:500; color:var(--soft); max-width:420px;}
.s2 .sq{grid-area:sq; align-self:start; background:#37346F; border:1px solid rgba(255,255,255,.18); border-radius:16px; padding:18px 22px;}
.s2 .qt2{font-size:18px; line-height:1.45; font-weight:600; margin:0 0 14px;}
.who3{display:flex; align-items:center; gap:12px;} .who3 .pic{width:46px!important; height:46px!important; border-radius:50%; object-fit:cover; flex:none; background:#EEEDFB; color:var(--navy); display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:600; box-shadow:0 0 0 3px var(--ring,#E6E1FB);}
.who3 b{display:block; font-size:15px; font-weight:700;} .who3 span{display:block; font-size:14px; font-weight:500; color:var(--amber);}
.s2 .ab{position:absolute; top:50%; margin-top:-26px;} .s2 .ab-l{left:6px;} .s2 .ab-r{right:6px;}
@media(max-width:820px){
  .track .slide.s2{grid-template-columns:1fr; grid-template-areas:"ph" "tx" "sq"; row-gap:14px; padding:0 4px!important; text-align:center;}
  .s2 .sph2{width:min(100%,260px); margin:0 auto; padding:16px 36px 0; justify-self:center;} .s2 .sph2 img{max-width:150px;}
  .s2 .stxt{align-self:start; text-align:center;} .s2 .stxt h3{text-align:center; font-size:26px; margin-bottom:6px;} .s2 .stxt p{margin:0 auto; font-size:17px;} .s2 .eyebrow{margin-bottom:6px;}
  .s2 .sq{padding:14px 16px;} .s2 .qt2{font-size:16px; margin-bottom:10px;}
  .s2 .ab{top:92px; margin-top:0; width:40px; height:40px;} .s2 .ab svg{width:18px; height:18px;} .s2 .ab-l{left:0;} .s2 .ab-r{right:0;}
}
.dots2{margin-top:36px!important;}

/* ---- round 23: transparent phone screens ---- */
.s2 .sph2{background:transparent!important; padding:0!important; border-radius:0!important; overflow:visible!important; position:relative; display:flex; justify-content:center; height:400px; overflow:hidden!important;}
.s2 .sph2::before{content:""; position:absolute; left:50%; top:46%; width:130%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle,rgba(125,59,227,.42),rgba(47,140,240,.22) 38%,rgba(243,167,61,.12) 56%,transparent 72%); filter:blur(14px);}
.s2 .sph2 img{position:relative; width:100%; max-width:250px; height:auto; align-self:flex-start; -webkit-mask-image:linear-gradient(180deg,#000 68%,transparent 100%); mask-image:linear-gradient(180deg,#000 68%,transparent 100%); filter:drop-shadow(0 18px 30px rgba(0,0,0,.45));}
@media(max-width:820px){.s2 .sph2{width:min(100%,300px)!important; height:270px;} .s2 .sph2 img{max-width:170px;}}

/* ---- round 24: clean full phones, no glow ---- */
.s2 .sph2{height:auto!important; overflow:visible!important; background:none!important;} .s2 .sph2::before{display:none!important; content:none!important;}
.s2 .sph2 img{-webkit-mask-image:none!important; mask-image:none!important; filter:none!important; max-width:270px!important; width:100%; align-self:center;}
@media(max-width:820px){.s2 .sph2{width:100%!important; height:auto!important;} .s2 .sph2 img{max-width:230px!important;}
 .s2 .ab{top:150px!important;}}

/* ---- round 25: clearer hierarchy ---- */
.nbadge2{display:flex; width:48px; height:48px; border-radius:50%; background:#F3A73D; color:#fff; font-size:24px; font-weight:800; align-items:center; justify-content:center; margin:0 0 16px; box-shadow:0 0 0 5px rgba(243,167,61,.25);}
.s2 .sq{background:#fff!important; border:2px solid #3DBE6B!important; color:var(--navy); box-shadow:0 10px 28px rgba(0,0,0,.2);}
.s2 .qt2{color:var(--navy)!important;} .who3 b{color:var(--navy)!important;} .who3 span{color:#2E8F55!important;}
.who3 .pic{--ring:#E3F6EA;}
.track .slide.s2{row-gap:36px!important;}
@media(max-width:820px){.nbadge2{margin:0 auto 12px;} .track .slide.s2{row-gap:22px!important;} .s2 .stxt h3{margin-bottom:8px;}}

/* ---- round 26: step testimonial = before/after card ---- */
.s2 .sq{background:#fff!important; border:2px solid #3DBE6B!important; border-radius:20px!important; padding:26px 28px!important; box-shadow:0 8px 24px rgba(61,190,107,.14)!important; text-align:left!important; color:var(--navy);}
.s2 .sq .who2{display:flex; align-items:center; gap:16px; margin:0 0 14px; justify-content:flex-start;}
.s2 .sq .who2 img,.s2 .sq .who2 .initial{width:64px; height:64px; border-radius:50%; object-fit:cover; flex:none; box-shadow:0 0 0 5px #E3F6EA;}
.s2 .sq .initial{display:flex; align-items:center; justify-content:center; background:#E3F6EA; color:var(--navy); font-size:22px; font-weight:700;}
.s2 .sq .who2 b{display:block; font-size:18px; font-weight:700; color:var(--navy); text-align:left;} .s2 .sq .who2 span{display:block; font-size:var(--small); font-weight:500; color:#2E8F55; text-align:left;}
.s2 .sq p{font-size:var(--body); line-height:1.6; font-weight:400; color:var(--navy); margin:0; text-align:left;}
@media(max-width:820px){.s2 .sq{padding:22px 22px!important;}}
.midcta{text-align:center; margin-top:60px;}

.evt{max-width:760px; margin:clamp(90px,12vw,150px) auto 0; background:#37346F; border:1px solid rgba(255,255,255,.2); border-radius:24px; padding:clamp(30px,5vw,56px) clamp(22px,5vw,56px); text-align:center;}
.evt .elabel{display:inline-block; background:var(--amber); color:var(--navy); font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:6px 14px; border-radius:999px; margin-bottom:22px;}
.evt h3{font-size:var(--h3); line-height:1.3; font-weight:800; margin:0 0 16px;} .evt p{font-size:var(--body); line-height:1.6; font-weight:400; color:var(--soft); max-width:600px; margin:0 auto 30px;}
.close .c{margin-top:clamp(70px,9vw,110px)!important;}

/* ---- event listing ---- */
.close{padding-bottom:var(--gap)!important;}
.evs{background:#F4F3FA; padding:clamp(70px,10vw,120px) var(--px); color:#1E1B3A;}
.evlead{text-align:center; font-size:var(--body); font-weight:600; margin-bottom:28px; color:#5F5B80;}
.evcard{max-width:980px; margin:0 auto; background:#fff; border:1px solid #DAD9E6; border-radius:14px; overflow:hidden; display:grid; grid-template-columns:42% 1fr; box-shadow:0 10px 30px rgba(30,27,58,.1); font-family:'Montserrat',system-ui,sans-serif;}
.evimg{background:#0E0E12; padding:24px; display:flex; align-items:center;}
.zoom{width:100%; background:#1C1C22; border-radius:10px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.4);}
.zbar{display:flex; align-items:center; gap:6px; padding:9px 12px; background:#2A2A32; color:#E8E8EE; font-size:12px; font-weight:600;} .zbar i{width:9px; height:9px; border-radius:50%; background:#6A6A78; display:block;} .zbar i:nth-child(1){background:#FF5F57;} .zbar i:nth-child(2){background:#FEBC2E;} .zbar i:nth-child(3){background:#28C840;}
.zbar span{margin-left:10px; flex:1;} .zbar em{font-style:normal; color:#fff; background:#E02F44; border-radius:4px; padding:2px 6px; font-size:10px; font-weight:800;}
.zgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding:4px; background:#1C1C22;}
.zt{position:relative; aspect-ratio:1/1; background:#000; overflow:hidden; border-radius:4px;} .zt img{width:100%; height:100%; object-fit:cover; display:block;} .zt.host{background:#fff; display:flex; align-items:center; justify-content:center;} .zt .hl{width:70%; height:auto; object-fit:contain;}
.zt .mic{position:absolute; left:6px; bottom:6px; width:14px; height:14px; border-radius:50%; background:rgba(0,0,0,.6);}
.ztool{display:flex; gap:10px; justify-content:center; padding:10px; background:#2A2A32;} .ztool b{width:26px; height:26px; border-radius:50%; background:#44444F; display:block;} .ztool b.end{background:#E02F44; width:44px; border-radius:13px;}
.evbody{padding:clamp(24px,3.4vw,40px); display:flex; flex-direction:column; gap:18px;}
.evtop{display:flex; gap:18px; align-items:flex-start;}
.evdate{flex:none; width:68px; text-align:center; border:1px solid #DAD9E6; border-radius:8px; overflow:hidden;} .evdate span{display:block; background:#F05537; color:#fff; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:5px 0;} .evdate b{display:block; font-size:22px; font-weight:800; padding:10px 0; color:#1E1B3A;}
.evtag{display:inline-block; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#6B3FA0; margin-bottom:6px;}
.evtitles h3{font-size:clamp(24px,3vw,32px); line-height:1.15; font-weight:800; margin:0 0 6px; color:#1E1B3A;} .evsub{font-size:16px; line-height:1.45; color:#5F5B80; font-weight:500;}
.evmeta{list-style:none; margin:0; padding:0; display:grid; gap:10px;} .evmeta li{display:flex; align-items:center; gap:12px; font-size:16px; font-weight:500; color:#39364F;} .evmeta svg{flex:none;}
.evmeta .free{font-weight:800; color:#1E1B3A;}
.evdesc{font-size:16px; line-height:1.6; color:#39364F; font-weight:400;}
.evfoot{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:18px; border-top:1px solid #E6E5EF; margin-top:auto;}
.evhost{display:flex; align-items:center; gap:10px; font-size:14px; font-weight:600; color:#5F5B80;} .evhost img{height:22px; width:auto; display:block;}
.evbtn{background:#F05537; color:#fff; font-size:16px; font-weight:700; padding:14px 30px; border-radius:6px; display:inline-block;} .evbtn:hover{background:#D84A2E;} .evbtn:focus-visible{outline:3px solid #1E1B3A; outline-offset:3px;}
@media(max-width:820px){.evcard{grid-template-columns:1fr;} .evimg{padding:18px;} .evfoot .evbtn{width:100%; text-align:center; box-sizing:border-box;}}
.ft{background:var(--dark); color:var(--soft); padding:36px var(--px); text-align:center; font-size:var(--small); font-weight:400;}


/* ---- phone coming out of a box ---- */
.track .slide.s2{grid-template-columns:minmax(0,560px)!important; justify-content:center!important; grid-template-areas:"ph" "bx"!important; row-gap:0!important; align-content:start!important; padding:0 76px!important;}
@media(max-width:700px){.track .slide.s2{padding:0 4px!important;}}
.s2 .sph2{width:min(100%,340px)!important; margin:0 auto -104px!important; position:relative; z-index:1; overflow:visible!important;}
.s2 .sph2 img{position:relative; z-index:1; max-width:250px!important; filter:drop-shadow(0 14px 22px rgba(0,0,0,.35))!important;}
.s2 .sph2::after{content:""; position:absolute; inset:0; pointer-events:none; background:
 radial-gradient(circle at 10% 16%,#F3A73D 0 8px,transparent 9px),
 radial-gradient(circle at 90% 26%,#3DBE6B 0 7px,transparent 8px),
 radial-gradient(circle at 16% 62%,#2F8CF0 0 6px,transparent 7px),
 radial-gradient(circle at 86% 68%,#E8412F 0 9px,transparent 10px),
 radial-gradient(circle at 4% 40%,#8A86F0 0 5px,transparent 6px),
 radial-gradient(circle at 96% 48%,#F2CB2E 0 5px,transparent 6px);}
.s2 .sbox{grid-area:bx; position:relative; z-index:2; border:4px solid transparent; border-radius:30px; padding:28px clamp(18px,3vw,34px) 26px;
 border-color:#F3A73D; background:#F3A73D; box-shadow:0 18px 40px rgba(0,0,0,.28);}
.s2 .sbox .nbadge2{position:static; margin:0; width:52px; height:52px; font-size:26px; background:#2B2A5C; color:#fff; border:0; box-shadow:none; flex:none;}
.s2 .sbox .stxt{display:grid; grid-template-columns:auto 1fr; justify-content:start; align-items:center; column-gap:14px; row-gap:10px; text-align:left!important;}
.s2 .sbox .stxt h3{margin:0!important; text-align:left!important;}
.s2 .sbox .stxt p{grid-column:1/-1; text-align:left!important; margin:0!important; max-width:none!important;}
.s2 .sbox .stxt{align-self:auto; text-align:center; margin-bottom:20px;}
.s2 .sbox .stxt h3{color:#2B2A5C; text-align:center;}
.s2 .sbox .stxt p{color:#2B2A5C; margin:0 auto;}
.s2 .sbox .sq{box-shadow:none!important;}
.s2 .ab{z-index:3; top:130px!important;}

/* ---- testimonial inside the box: dark, no green border ---- */
.s2 .sbox .sq{background:#fff!important; border:0!important; border-radius:20px!important; box-shadow:none!important; color:#2B2A5C!important; padding:24px 26px!important;}
.s2 .sbox .sq .who2 b{color:#2B2A5C!important;}
.s2 .sbox .sq .who2 span{color:#2B2A5C!important; font-weight:400!important;}
.s2 .sbox .sq p{color:#2B2A5C!important; font-weight:500!important;}
.s2 .sbox .sq .who2 img,.s2 .sbox .sq .who2 .initial{box-shadow:0 0 0 4px rgba(43,42,92,.25)!important;}
.s2 .sbox .sq .initial{background:#3E3B86!important; color:#fff!important;}
.s2 .sbox .stxt,.s2 .sbox .stxt h3,.s2 .sbox .stxt p{text-align:left!important;}

/* ---- v54 light & fresh step card ---- */
.s2 .sbox{border:0!important; background:#fff!important; box-shadow:0 22px 48px rgba(0,0,0,.30)!important; padding:30px clamp(20px,3vw,34px) 26px!important; overflow:hidden;}
.s2 .sbox::before{content:""; position:absolute; left:0; right:0; top:0; height:8px; background:linear-gradient(90deg,#F3A73D,#F6C85A);}
.s2 .sbox .stxt{margin-bottom:18px!important; padding-top:6px;}
.s2 .sbox .nbadge2{background:#F3A73D!important; color:#2B2A5C!important; width:46px!important; height:46px!important; font-size:24px!important; box-shadow:0 6px 14px rgba(243,167,61,.45)!important;}
.s2 .sbox .stxt h3{color:#2B2A5C!important; font-size:clamp(24px,2.6vw,30px)!important; line-height:1.2!important; letter-spacing:-.01em; text-wrap:balance;}
.s2 .sbox .sq{background:#FFF6E6!important; border-radius:20px!important; padding:20px 24px 22px!important;}
.s2 .sbox .sq::before{content:"\2605\2605\2605\2605\2605"; display:block; color:#F3A73D; font-size:20px; letter-spacing:3px; margin:0 0 12px;}
.s2 .sbox .sq .who2{margin:0 0 10px!important;}
.s2 .sbox .sq .who2 img,.s2 .sbox .sq .who2 .initial{width:52px!important; height:52px!important; box-shadow:0 0 0 3px #F3A73D!important;}
.s2 .sbox .sq .who2 b{font-size:17px!important; color:#2B2A5C!important;}
.s2 .sbox .sq .who2 span{font-size:15px!important; color:#6B6893!important; font-weight:400!important;}
.s2 .sbox .sq p{font-size:clamp(16px,1.6vw,18px)!important; line-height:1.55!important; color:#2B2A5C!important; font-weight:500!important;}
.s2 .sph2::after,.s2 .sph2::before{display:none!important; content:none!important;}

/* ---- community snapshot ---- */
.snap{max-width:860px; margin:48px auto 0; background:#F1F0FB; border-radius:28px; padding:clamp(24px,4vw,44px) clamp(18px,4vw,44px) 22px;}
.sn-nums{display:grid; grid-template-columns:repeat(3,minmax(0,1fr));}
.sn-nums div{display:flex; flex-direction:column; align-items:center; gap:4px; padding:0 8px;}
.sn-nums div+div{border-left:2px solid #DAD8F3;}
.sn-nums b{font-size:clamp(40px,7vw,64px); line-height:1; font-weight:800; color:#2B2A5C;}
.sn-nums span{font-size:15px; font-weight:600; color:#5F5B80; letter-spacing:.06em; text-transform:uppercase;}
.sn-dots{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; max-width:290px; margin:30px auto 32px;}
.sn-d{width:18px; height:18px; border-radius:50%; background:#8A86F0; opacity:.55;}
.sn-d.sn-hit{background:#5FD4C4; opacity:1; box-shadow:0 0 0 5px rgba(95,212,196,.35);}
.sn-match{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:16px;}
.sn-card{text-align:left; background:#fff; border-radius:20px; padding:18px 20px; display:flex; flex-direction:column; gap:6px; box-shadow:0 8px 20px rgba(43,42,92,.08); min-width:0;}
.sn-k{font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#5F5B80;}
.sn-t{font-size:20px; font-weight:800; color:#2B2A5C;}
.sn-need{align-self:flex-start; background:#F6C85A; color:#2B2A5C; font-size:15px; font-weight:700; border-radius:999px; padding:7px 14px;}
.sn-mem{flex-direction:row; align-items:center; gap:14px;}
.sn-av{flex:none; width:52px; height:52px; border-radius:50%; background:#2B2A5C; color:#fff; font-weight:800; font-size:22px; display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 4px #5FD4C4;}
.sn-who{display:flex; flex-direction:column; gap:4px; min-width:0;}
.sn-link{display:flex; flex-direction:column; align-items:center; gap:8px;}
.sn-pill{background:#2B2A5C; color:#fff; font-size:13px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; border-radius:999px; padding:7px 14px; white-space:nowrap;}
.sn-cap{text-align:center; margin-top:22px; font-size:13px; font-weight:600; color:#8A87AD; letter-spacing:.06em; text-transform:uppercase;}
@media(max-width:680px){
 .sn-match{grid-template-columns:1fr; gap:10px;}
 .sn-link{flex-direction:row; justify-content:center;}
 .sn-link svg{transform:rotate(90deg); width:48px; height:24px;}
 .sn-nums span{font-size:12px;}
}

/* ---- v2: smaller and quieter ---- */
.snap{max-width:640px!important; margin:36px auto 0!important; padding:26px clamp(16px,3vw,30px) 28px!important; border-radius:24px!important;}
.sn-nums b{font-size:clamp(30px,5vw,42px)!important;}
.sn-nums span{font-size:12px!important;}
.sn-nums div+div{border-left-width:1px!important;}
.sn-match{margin-top:26px; grid-template-columns:auto auto auto!important; justify-content:center; gap:14px!important;}
.sn-need{background:#F6C85A; color:#2B2A5C; font-size:15px; font-weight:700; border-radius:999px; padding:10px 16px; line-height:1.25; text-align:center;}
.sn-mem{display:flex; align-items:center; gap:10px; background:#fff; border-radius:999px; padding:6px 18px 6px 6px; box-shadow:0 6px 16px rgba(43,42,92,.08);}
.sn-av{width:40px!important; height:40px!important; font-size:18px!important;}
.sn-link svg{width:64px!important; height:16px!important;}
@media(max-width:680px){
 .sn-match{grid-template-columns:1fr!important; justify-items:center;}
 .sn-link{flex-direction:column!important;}
 .sn-link svg{transform:rotate(90deg); width:40px!important; height:16px!important; margin:6px 0;}
}

/* ---- v3: simplified team report ---- */
.snap.tr{max-width:560px!important; padding:28px clamp(18px,4vw,34px) 30px!important; text-align:left;}
.tr-head{display:flex; align-items:baseline; gap:12px; margin-bottom:22px;}
.tr-head b{font-size:clamp(40px,7vw,56px); line-height:1; font-weight:800; color:#2B2A5C;}
.tr-head span{font-size:15px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#5F5B80;}
.tr-rows{display:flex; flex-direction:column; gap:14px;}
.tr-row{display:grid; grid-template-columns:96px minmax(0,1fr) 26px 52px; align-items:center; gap:12px;}
.tr-l{font-size:15px; font-weight:700; color:#2B2A5C;}
.tr-bar{height:16px; background:#E2E0F6; border-radius:999px; overflow:hidden; display:block;}
.tr-bar i{display:block; height:100%; border-radius:999px; background:#8A86F0;}
.tr-row.hi .tr-bar i{background:#5FD4C4;}
.tr-row.lo .tr-bar i{background:#F6C85A;}
.tr-n{font-size:15px; font-weight:800; color:#2B2A5C; text-align:right;}
.tr-tag{font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; border-radius:999px; padding:4px 0; text-align:center; color:#2B2A5C;}
.tr-row.hi .tr-tag{background:#5FD4C4;} .tr-row.lo .tr-tag{background:#F6C85A;}
.tr-row:not(.hi):not(.lo) .tr-tag{display:none;}
@media(max-width:420px){.tr-row{grid-template-columns:78px minmax(0,1fr) 22px 44px; gap:8px;} .tr-l{font-size:13px;}}

/* ---- first visual (stats + match) ---- */
.fv{max-width:860px; margin:48px auto 0; background:#F1F0FB; border-radius:28px; padding:clamp(24px,4vw,44px) clamp(18px,4vw,44px) 22px;}
.fv+.snap{margin-top:32px!important;}
.fv-nums{display:grid; grid-template-columns:repeat(3,minmax(0,1fr));}
.fv-nums div{display:flex; flex-direction:column; align-items:center; gap:4px; padding:0 8px;}
.fv-nums div+div{border-left:2px solid #DAD8F3;}
.fv-nums b{font-size:clamp(40px,7vw,64px); line-height:1; font-weight:800; color:#2B2A5C;}
.fv-nums span{font-size:15px; font-weight:600; color:#5F5B80; letter-spacing:.06em; text-transform:uppercase;}
.fv-dots{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; max-width:290px; margin:30px auto 32px;}
.fv-d{width:18px; height:18px; border-radius:50%; background:#8A86F0; opacity:.55;}
.fv-d.fv-hit{background:#5FD4C4; opacity:1; box-shadow:0 0 0 5px rgba(95,212,196,.35);}
.fv-match{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:16px;}
.fv-card{text-align:left; background:#fff; border-radius:20px; padding:18px 20px; display:flex; flex-direction:column; gap:6px; box-shadow:0 8px 20px rgba(43,42,92,.08); min-width:0;}
.fv-k{font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#5F5B80;}
.fv-t{font-size:20px; font-weight:800; color:#2B2A5C;}
.fv-need{align-self:flex-start; background:#F6C85A; color:#2B2A5C; font-size:15px; font-weight:700; border-radius:999px; padding:7px 14px;}
.fv-mem{flex-direction:row; align-items:center; gap:14px;}
.fv-av{flex:none; width:52px; height:52px; border-radius:50%; background:#2B2A5C; color:#fff; font-weight:800; font-size:22px; display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 4px #5FD4C4;}
.fv-who{display:flex; flex-direction:column; gap:4px; min-width:0;}
.fv-link{display:flex; flex-direction:column; align-items:center; gap:8px;}
.fv-pill{background:#2B2A5C; color:#fff; font-size:13px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; border-radius:999px; padding:7px 14px; white-space:nowrap;}
.fv-cap{text-align:center; margin-top:22px; font-size:13px; font-weight:600; color:#8A87AD; letter-spacing:.06em; text-transform:uppercase;}
@media(max-width:680px){
 .fv-match{grid-template-columns:1fr; gap:10px;}
 .fv-link{flex-direction:row; justify-content:center;}
 .fv-link svg{transform:rotate(90deg); width:48px; height:24px;}
 .fv-nums span{font-size:12px;}
}

/* ---- community characters ---- */
.cm{font-family:'Montserrat',system-ui,sans-serif; text-align:left; max-width:780px; margin:44px auto 0; background:#F1F0FB; border-radius:32px; padding:clamp(16px,3vw,32px); display:flex; flex-direction:column; gap:12px;}
.cm-cap{font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#8A86F0; text-align:center;}
.cm-card{background:#fff; border-radius:26px; box-shadow:0 10px 28px rgba(43,42,92,.09); overflow:hidden; position:relative;}
.cm-comm{padding:24px clamp(14px,3vw,30px) 22px;}
.cm-row1{display:flex; justify-content:center; align-items:center; padding:4px 0;}
.cm-f{--fs:clamp(40px,calc((100vw - 80px) / 6.2),100px); width:var(--fs); height:var(--fs); flex:none; border-radius:50%; padding:calc(var(--fs) * .07); box-sizing:border-box; background:linear-gradient(135deg,var(--g1),var(--g2)); position:relative;}
.cm-f + .cm-f{margin-left:calc(var(--fs) * -.19);}
.cm-f:nth-child(2){z-index:2;} .cm-f:nth-child(3){z-index:3;} .cm-f:nth-child(4){z-index:4;} .cm-f:nth-child(5){z-index:5;} .cm-f:nth-child(6){z-index:6;} .cm-f:nth-child(7){z-index:7;}
.cm-f img{width:100%; height:100%; border-radius:50%; object-fit:cover; object-position:center; display:block; border:calc(var(--fs) * .055) solid #fff; box-sizing:border-box;}
.cm-more{display:flex; align-items:center; justify-content:center; background:#EEEBFA; padding:0;}
.cm-more span{font-size:clamp(11px,calc(var(--fs) * .3),28px); font-weight:800; color:#2B2A5C;}
.cm-rep{margin-top:22px; padding-top:20px; border-top:2px solid #F1F0FB; display:flex; flex-direction:column; gap:8px;}
.cm-rt{font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#2B2A5C; margin-bottom:2px;}
.cm-d{display:grid; grid-template-columns:104px 1fr 26px; align-items:center; gap:12px; font-size:13px; font-weight:700; color:#2B2A5C;}
.cm-d b{font-weight:800; text-align:right;}
.cm-t{height:10px; border-radius:99px; background:#F1F0FB; overflow:hidden;}
.cm-t i{display:block; height:100%; border-radius:99px;}
.cm-link{width:4px; height:26px; margin:4px auto 2px; border-radius:4px; background:linear-gradient(#8A86F0,#F3A73D);}
.cm-prof{display:flex; align-items:center; gap:clamp(36px,6vw,56px); padding:clamp(26px,4vw,40px) clamp(18px,3.5vw,34px) clamp(22px,3.5vw,34px);}
.cm-prof::before{content:""; position:absolute; left:0; right:0; top:0; height:8px; background:linear-gradient(90deg,#E8412F,#F3A73D,#F2CB2E,#3DBE6B,#2F8CF0,#7D3BE3);}
.cm-who{flex:none; display:flex; flex-direction:column; align-items:center; gap:12px;}
.cm-who b{font-size:24px; font-weight:800; color:#2B2A5C;}
.cm-big{--s:clamp(120px,22vw,172px); width:var(--s); height:var(--s); flex:none; border-radius:50%; padding:5px; box-sizing:border-box; background:conic-gradient(#E8412F,#F3A73D,#F2CB2E,#3DBE6B,#2F8CF0,#7D3BE3,#E8412F);}
.cm-big img{width:100%; height:100%; border-radius:50%; object-fit:cover; object-position:center; display:block; border:5px solid #fff; box-sizing:border-box;}
.cm-rows{flex:1; display:flex; flex-direction:column; gap:10px; min-width:0;}
.cm-r{position:relative; background:#2B2A5C; border-radius:18px; padding:13px 18px; display:flex; align-items:center; gap:16px;}
.cm-r::before{content:""; position:absolute; right:100%; top:50%; width:clamp(36px,6vw,56px); height:3px; background:#8A86F0; border-radius:3px;}
.cm-r small{flex:none; width:92px; font-size:14px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#F6C85A;}
.cm-v{display:flex; flex-wrap:nowrap; gap:8px; min-width:0;}
.cm-v span{white-space:nowrap; font-size:14px; font-weight:700; color:#fff; background:rgba(255,255,255,.14); border-radius:999px; padding:6px 13px;}
@media(max-width:700px){
 .cm-comm{padding:18px 14px 18px;} .cm-row1{gap:0;}
 .cm-d{grid-template-columns:84px 1fr 24px; gap:10px; font-size:12px;}
 .cm-prof{flex-direction:column; gap:20px; padding:28px 16px 18px;} .cm-rows{width:100%;}
 .cm-r::before{display:none;} .cm-r{flex-direction:column; align-items:flex-start; gap:8px; padding:11px 12px;} .cm-r small{width:auto; font-size:13px;} .cm-v{gap:6px;} .cm-v span{font-size:clamp(10.5px,3.1vw,13px); padding:5px clamp(7px,2.4vw,11px);}
}
