/* ===== Así funciona (caso Adara) ===== */
.como{position:relative;overflow:hidden}
.como .wrap{max-width:1320px}
.cm-steps{list-style:none;margin:0 0 70px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
.cm-step{position:relative;display:flex;gap:16px;align-items:flex-start;background:#fff;border-radius:26px;padding:24px 22px;box-shadow:0 20px 40px -30px rgba(46,74,92,.5)}
.cm-step + .cm-step::before{content:"";position:absolute;left:-24px;top:50%;width:28px;height:3px;background:repeating-linear-gradient(90deg,#E8796E 0 6px,transparent 6px 11px)}
.cm-n{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;font-family:var(--f-display);font-size:1.6rem;color:#fff;background:var(--coral);box-shadow:0 8px 16px -6px rgba(232,121,110,.8)}
.cm-step:nth-child(2) .cm-n{background:#9B6FE0;box-shadow:0 8px 16px -6px rgba(155,111,224,.8)}
.cm-step:nth-child(3) .cm-n{background:#4F98DA;box-shadow:0 8px 16px -6px rgba(79,152,218,.8)}
.cm-step h3{font-weight:900;font-size:1.15rem;margin-bottom:6px;color:var(--navy)}
.cm-step p{font-weight:500;font-size:.93rem;line-height:1.5}

.cm-case{display:grid;grid-template-columns:1fr auto 1fr;gap:44px;align-items:center}
.cm-story{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}
.cm-tag{background:var(--navy);color:#fff;font-weight:800;letter-spacing:.18em;font-size:.72rem;text-transform:uppercase;padding:8px 16px;border-radius:999px}
.cm-polaroid{position:relative;margin:0;background:#fff;padding:12px 12px 14px;border-radius:6px;transform:rotate(-4deg);box-shadow:0 26px 40px -24px rgba(46,20,60,.55);width:min(250px,64vw)}
.cm-polaroid img{display:block;width:100%;height:auto;aspect-ratio:480/700;object-fit:cover;object-position:50% 12%;border-radius:3px;background:#eee}
.cm-polaroid figcaption{font-family:var(--f-display);text-align:center;margin-top:10px;font-size:1.05rem;color:var(--navy)}
.cm-polaroid .tape{position:absolute;left:50%;top:-14px;width:90px;height:28px;transform:translateX(-50%) rotate(3deg);background:rgba(251,231,161,.85);box-shadow:0 2px 4px rgba(0,0,0,.08)}
.cm-likes{text-align:center}
.cm-likes p{font-weight:700;margin-bottom:10px;color:var(--navy)}
.cm-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:330px}
.cm-chips span{background:#fff;border:2px solid #E7DBFA;border-radius:999px;padding:7px 13px;font-weight:700;font-size:.88rem;box-shadow:0 6px 12px -10px rgba(46,74,92,.6)}
.cm-arrow{display:flex;align-items:center;gap:6px;font-family:var(--f-display);color:#9B6FE0;font-size:1.3rem}
.cm-arrow svg{width:110px;height:56px}
.cm-ok{font-size:.75rem;font-weight:600;opacity:.6}

/* celular con la invitación */
.cm-phonecol{position:relative;display:flex;justify-content:center}
.cm-phone{position:relative;width:340px;height:700px;border-radius:52px;background:#141418;padding:12px;box-shadow:0 50px 90px -40px rgba(46,20,60,.7),inset 0 0 0 2px #333}
.cm-phone .notch{position:absolute;left:50%;top:20px;width:96px;height:26px;border-radius:20px;background:#141418;transform:translateX(-50%);z-index:3}
.cm-screen{position:relative;height:100%;overflow-y:auto;overflow-x:hidden;border-radius:42px;background:#FBF6FF;scrollbar-width:none;overscroll-behavior:contain;scroll-behavior:auto}
.cm-screen::-webkit-scrollbar{display:none}
.iv-blk{position:relative;margin:0 12px 12px;transition:box-shadow .4s,transform .4s}
.iv-blk.hl{box-shadow:0 0 0 3px #9B6FE0,0 12px 30px -10px rgba(155,111,224,.7);border-radius:20px}
.iv-video{margin:0 0 12px;aspect-ratio:9/16;background:#C9B7EE}
.iv-video video{width:100%;height:100%;object-fit:cover;display:block}
.iv-video .sound{position:absolute;right:12px;bottom:12px}
.iv-sample{position:absolute;left:12px;top:56px;background:rgba(46,74,92,.75);color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.2em;padding:5px 9px;border-radius:999px}
.iv-live{display:flex;justify-content:space-between;background:#fff;border-radius:16px;padding:10px 14px;font-size:.78rem;font-weight:700;color:var(--navy)}
.iv-live .dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#25D366;box-shadow:0 0 0 0 rgba(37,211,102,.6);animation:ivp 1.6s infinite;vertical-align:middle}
@keyframes ivp{70%{box-shadow:0 0 0 8px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
.iv-live b{font-variant-numeric:tabular-nums}
.iv-hello{text-align:center;padding:6px 0 2px}
.iv-hello small{font-weight:800;letter-spacing:.18em;font-size:.6rem;color:#9B6FE0}
.iv-hello h3{font-family:var(--f-display);font-weight:400;font-size:2.6rem;line-height:1.2;color:var(--navy)}
.iv-hello p{font-weight:700;font-size:.85rem}
.iv-card{background:#fff;border-radius:20px;padding:14px;box-shadow:0 10px 24px -20px rgba(46,74,92,.7)}
.iv-map{padding:0;overflow:hidden}
.iv-map svg{display:block;width:100%;height:auto}
.iv-map .pin{transform-origin:160px 52px}
.iv-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px}
.iv-row b{display:block;font-size:.85rem}
.iv-row small,.iv-card small{display:block;font-size:.72rem;font-weight:600;opacity:.7}
.iv-pill{flex:none;background:#9B6FE0;color:#fff;font-weight:800;font-size:.72rem;padding:8px 12px;border-radius:999px}
.iv-rsvp{text-align:center;display:flex;flex-direction:column;gap:10px}
.iv-btns{display:flex;gap:8px}
.iv-btns button{flex:1;border:0;border-radius:14px;padding:11px 6px;font:inherit;font-weight:800;font-size:.85rem;cursor:pointer}
.iv-btns .yes{background:#9B6FE0;color:#fff}
.iv-btns .no{background:#F1E8FF;color:#6B45B0}
.iv-btns .yes.done{background:#25D366}
.iv-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:none;padding:0;box-shadow:none}
.iv-two > div{background:#fff;border-radius:20px;padding:14px 12px;box-shadow:0 10px 24px -20px rgba(46,74,92,.7);display:flex;flex-direction:column;gap:4px;font-size:.82rem;transition:box-shadow .4s}
.iv-two > div.hl{box-shadow:0 0 0 3px #9B6FE0,0 12px 30px -10px rgba(155,111,224,.7)}
.iv-two .ico{font-size:1.5rem}
.iv-dots{display:flex;gap:5px;margin-top:4px}
.iv-dots i{width:16px;height:16px;border-radius:50%;border:2px solid #E7DBFA}
.iv-gal b{font-size:.85rem}
.iv-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
.iv-grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;background:#E7DBFA}
.iv-grid span{display:grid;place-items:center;text-align:center;border:2px dashed #C9B7EE;border-radius:12px;font-weight:800;font-size:.72rem;color:#6B45B0;padding:6px}
.iv-end{text-align:center;padding:10px 0 30px;font-size:.8rem;font-weight:600}
.iv-end b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.6rem;color:var(--navy)}
.iv-blk .fc-wrap{margin:0}
.cm-toast{position:absolute;left:50%;bottom:34px;transform:translate(-50%,20px);background:var(--navy);color:#fff;font-weight:700;font-size:.82rem;padding:10px 16px;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;white-space:nowrap;z-index:5}
.cm-toast.on{opacity:1;transform:translate(-50%,0)}

/* lista de lo que incluye */
.cm-feats h3{font-weight:900;font-size:1.5rem;color:var(--navy)}
.cm-sub{font-weight:600;margin:4px 0 16px;opacity:.75}
.cm-feats ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.cm-feats li{display:flex;align-items:center;gap:12px;background:#fff;border-radius:18px;padding:10px 14px;cursor:pointer;border:2px solid transparent;transition:border-color .3s,transform .3s,background .3s}
.cm-feats li > span{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#F6EEFF;font-size:1.25rem}
.cm-feats li b{display:block;font-size:.95rem;color:var(--navy)}
.cm-feats li small{display:block;font-size:.8rem;font-weight:600;opacity:.65}
.cm-feats li:hover{transform:translateX(4px)}
.cm-feats li.on{border-color:#9B6FE0;background:#FBF8FF;transform:translateX(8px)}
.cm-feats li.on > span{background:#9B6FE0}

/* WhatsApp */
.cm-wa{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;margin-top:90px}
.cm-wa-copy h3{font-weight:900;font-size:clamp(1.7rem,3.2vw,2.5rem);letter-spacing:-.02em;color:var(--navy);margin:10px 0 12px;line-height:1.15}
.cm-wa-copy h3 .script{font-size:.92em}
.cm-wa-copy p{font-weight:500;font-size:1.05rem;max-width:46ch}
.cm-wa-copy ul{list-style:none;padding:0;margin:18px 0 22px;display:flex;flex-direction:column;gap:8px;font-weight:700}
.cm-chat{position:relative;width:min(370px,100%);justify-self:center;border-radius:44px;overflow:hidden;background:#141418;padding:10px;box-shadow:0 50px 90px -40px rgba(46,20,60,.7),inset 0 0 0 2px #333;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
.cm-chat > *{position:relative}
.wa-top{display:flex;align-items:center;gap:10px;background:#075E54;color:#fff;padding:30px 12px 10px;border-radius:34px 34px 0 0}
.wa-ttl{flex:1;min-width:0}
.wa-ttl b{display:block;font-size:.95rem}
.wa-top small{display:block;font-size:.72rem;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-back{font-size:1.6rem;line-height:1}
.wa-av{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;background:#D3C2EE}
.wa-ic{display:flex;gap:14px}.wa-ic svg{width:20px;height:20px}
.wa-body{display:flex;flex-direction:column;gap:6px;padding:12px 10px;height:470px;overflow-y:auto;scrollbar-width:none;background-color:#EFE7DD;background-image:radial-gradient(rgba(0,0,0,.05) 1.2px,transparent 1.2px);background-size:16px 16px}
.wa-body::-webkit-scrollbar{display:none}
.wa-day{align-self:center;background:#E1F2FB;color:#556;font-size:.7rem;font-weight:600;padding:4px 10px;border-radius:8px;box-shadow:0 1px 1px rgba(0,0,0,.1)}
.wa-sys{align-self:center;background:#FFF5C4;color:#665;font-size:.7rem;padding:4px 10px;border-radius:8px;text-align:center}
.wa-msg{position:relative;flex:none;max-width:82%;padding:6px 8px 18px;border-radius:10px;font-size:.88rem;line-height:1.35;box-shadow:0 1px 1px rgba(0,0,0,.12);color:#111;opacity:0;transform:translateY(16px) scale(.94);transition:opacity .3s,transform .35s cubic-bezier(.3,1.4,.5,1)}
.wa-msg.vis{opacity:1;transform:none}
.wa-msg p{margin:0}
.wa-msg.out{align-self:flex-end;background:#DCF8C6;border-top-right-radius:2px;transform-origin:100% 100%}
.wa-msg.in{align-self:flex-start;background:#fff;border-top-left-radius:2px;transform-origin:0 100%}
.wa-msg .who{display:block;font-size:.76rem;margin-bottom:2px}
.who.w1{color:#D1477A}.who.w2{color:#1F7AC2}.who.w3{color:#B5651D}.who.w4{color:#7B3FB8}.who.w5{color:#13866F}
.wa-t{position:absolute;right:8px;bottom:3px;font-size:.66rem;color:#667}
.wa-t .tick{font-style:normal;color:#8A9399;letter-spacing:-3px;margin-left:3px;transition:color .3s}
.wa-t .tick.read{color:#34B7F1}
.wa-link{width:82%}
.wa-prev{background:#CFEAB8;border-radius:8px;overflow:hidden;margin-bottom:6px}
.wa-prev img{display:block;width:100%;aspect-ratio:1.91/1;object-fit:cover;background:#C9B7EE}
.wa-prev div{padding:7px 9px}
.wa-prev b{display:block;font-size:.84rem}
.wa-prev small{display:block;font-size:.75rem;color:#445}
.wa-prev em{display:block;font-style:normal;font-size:.7rem;color:#667;margin-top:2px}
.wa-msg u{color:#027EB5;text-decoration:none}
.wa-msg.ph{width:70%}
.wa-photo{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:7px;margin-bottom:5px;background:#ddd}
.wa-msg.stk{background:none;box-shadow:none;padding:0 0 16px}
.wa-msg.stk .who{background:#fff;display:inline-block;padding:2px 6px;border-radius:6px}
.wa-stk{display:block;width:120px;height:120px}
.wa-msg.stk .wa-t{background:rgba(255,255,255,.8);border-radius:6px;padding:0 4px;right:0}
.wa-typing{flex:none;align-self:flex-start;display:flex;gap:4px;background:#fff;border-radius:10px;padding:10px 12px;box-shadow:0 1px 1px rgba(0,0,0,.12)}
.wa-typing i{width:7px;height:7px;border-radius:50%;background:#9AA;animation:wat 1s infinite}
.wa-typing i:nth-child(2){animation-delay:.15s}.wa-typing i:nth-child(3){animation-delay:.3s}
@keyframes wat{50%{transform:translateY(-4px);opacity:.5}}
.wa-compose{background:#F0F0F0;border-radius:0 0 34px 34px;padding:8px 10px 16px}
.wa-pv{display:flex;gap:8px;align-items:center;background:#fff;border-radius:10px;overflow:hidden;max-height:0;opacity:0;margin-bottom:0;transition:max-height .35s,opacity .35s,margin .35s}
.wa-pv.on{max-height:80px;opacity:1;margin-bottom:8px}
.wa-pv img{width:64px;height:64px;object-fit:cover;flex:none}
.wa-pv b{display:block;font-size:.78rem}.wa-pv small{font-size:.7rem;color:#667}
.wa-input{display:flex;align-items:center;gap:8px}
.wa-input span{flex:1;min-width:0;background:#fff;border-radius:999px;padding:9px 14px;font-size:.85rem;color:#111;white-space:nowrap;overflow:hidden;text-overflow:clip;direction:ltr}
.wa-input span.ph{color:#999}
.wa-input i{font-style:normal;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#00897B;color:#fff;flex:none;transition:transform .15s}
.wa-input i.press{transform:scale(.8)}

@media (max-width:1100px){
  .cm-case{grid-template-columns:1fr 1fr;gap:34px}
  .cm-story{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:center}
}
@media (max-width:820px){
  .cm-steps{grid-template-columns:1fr;gap:14px;margin-bottom:50px}
    .cm-case{grid-template-columns:1fr;gap:30px}
  .cm-story{flex-direction:column}
  .cm-phone{width:min(320px,86vw);height:min(660px,160vw)}
  .cm-feats ul{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .cm-feats li{flex-direction:column;align-items:flex-start;gap:6px;padding:12px}
  .cm-feats li.on,.cm-feats li:hover{transform:none}
  .cm-wa{grid-template-columns:1fr;gap:30px;margin-top:60px}
  .cm-arrow svg{transform:rotate(70deg);width:80px}
}
@media (max-width:380px){.cm-feats ul{grid-template-columns:1fr}}
.cm-case > *,.cm-feats li,.cm-feats li > div{min-width:0}
.cm-feats li b,.cm-feats li small{overflow-wrap:anywhere}
.steps-x{height:560px;margin-bottom:80px}
.steps-x .col .num{letter-spacing:.24em}
.steps-x .col .name{font-size:2rem}
@media (max-width:820px){.steps-x{height:auto;margin-bottom:50px}.steps-x .col .name{font-size:1.5rem;max-width:12ch}.steps-x .col.on{height:250px}}
/* conoce más de nuestro trabajo */
.trabajo{padding-block:70px 60px;text-align:center;overflow:hidden}
.trabajo .eyebrow{color:var(--navy);opacity:.7}
.trabajo h2{font-weight:300;font-size:clamp(1.6rem,3.4vw,2.4rem);letter-spacing:.02em;color:var(--navy);margin:10px 0 34px}
.trabajo h2 b{font-weight:800}
.tr-band{border-top:1px solid rgba(46,74,92,.25);border-bottom:1px solid rgba(46,74,92,.25);padding:22px 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.tr-row{display:flex;width:max-content;animation:trmove 46s linear infinite}
.tr-band:hover .tr-row{animation-play-state:paused}
.tr-row span{display:flex;align-items:center;white-space:nowrap}
.tr-row a{font-weight:300;font-size:clamp(1.4rem,3vw,2.2rem);letter-spacing:.18em;text-transform:uppercase;color:var(--navy);text-decoration:none;padding:0 28px;transition:color .3s}
.tr-row a:hover{color:var(--coral)}
.tr-row i{font-style:normal;color:var(--coral);font-size:.9rem}
@keyframes trmove{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.trabajo p{margin-top:22px;font-weight:500;opacity:.75}
@media (prefers-reduced-motion:reduce){.tr-row{animation:none}}
.packs{grid-template-columns:repeat(2,minmax(0,380px));justify-content:center}
@media (max-width:820px){.packs{grid-template-columns:1fr}}