/* 5D CRO components (round 6, 16 Oct 2026). Loaded after the funnel's own funnel.css.
   vsl/cro.css and vault/cro.css are identical copies: change both together.
   Kit grammar: flat Graphite panels, white pills, gold only for the one main action. */

/* Shared bits */
.btn.sm{min-height:44px;padding:0 18px;font-size:15px}
/* Kit review 3 resets .select with the background shorthand, so the arrow repeats: restore it here. */
.select{background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-right:40px}
.mb-16{margin-bottom:16px}
.hold-wrap{text-align:center}
.h4{font-size:clamp(18px,1.6vw,20px);letter-spacing:-.015em;line-height:1.25;font-weight:700}
.quiet{display:inline-flex;align-items:center;gap:6px;font-size:15px;color:var(--grey-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}
.quiet:hover{color:var(--white)}
.helper{font-size:13.5px;color:var(--grey-2);line-height:1.4;margin-top:-1px}
.reassure{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:4px;font-size:13.5px;color:var(--grey-2);text-align:center}
.reassure b{color:var(--white);font-weight:700}
.vproof{margin:14px auto 0;max-width:720px;font-size:15px;line-height:1.45;color:var(--grey-2)}
.vproof q,.vproof .q{color:var(--white);font-weight:700;quotes:"\201C" "\201D" "\2018" "\2019"}
.vproof .src{display:block;margin-top:4px;font-size:12.5px;color:var(--grey)}
.live-count{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;color:var(--grey-2);margin:0}
.live-count::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(110,231,168,.16)}
.live-count b{color:var(--white)}

/* Multi-step opt-in: opener, "I want to..." cards, email, then name and phone */
.ms{display:grid;gap:14px}
.ms-bar{margin:2px 0 4px}
.ms-step{display:grid;gap:12px}
.ms-step[hidden]{display:none}
.ms-q{font-size:clamp(17px,1.5vw,19px);font-weight:700;color:var(--white);line-height:1.3;letter-spacing:-.01em}
.ms-q span{display:block;margin-top:4px;font-size:14px;font-weight:500;color:var(--grey-2);letter-spacing:0}
.ms-cards{display:grid;gap:10px}
.ms-card{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:12px 16px;border:0;border-radius:var(--radius-sm);background:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-2);color:var(--white);font:inherit;font-size:16px;font-weight:700;text-align:left;cursor:pointer;transition:background .15s,box-shadow .15s,transform .1s}
.ms-card:hover{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.ms-card:active{transform:scale(.99)}
.ms-card:focus-visible{outline:2px solid var(--white);outline-offset:2px}
.ms-card .ic{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.ms-card .ic svg{width:16px;height:16px}
.ms-card.on{background:var(--white);color:#000;box-shadow:none}
.ms-card.on .ic{background:var(--green);color:#000}
.ms-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13.5px;color:var(--grey-2)}
.ms-meta b{color:var(--white)}
.ms-back{border:0;background:none;padding:4px 0;color:var(--grey-2);font:inherit;font-size:13.5px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.ms-back:hover{color:var(--white)}
.ms-goal{font-size:13.5px;color:var(--green);font-weight:700}
.ms .field label{font-size:14px}

/* Deferred deal diagram: deposit, the seller paid from profits over time, 100% yours */
.deal{background:var(--graphite);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(20px,3vw,36px)}
.deal-price{display:flex;min-height:54px;border-radius:14px;overflow:hidden;margin-top:22px;font-size:14px;font-weight:700}
.deal-price span{display:flex;align-items:center;padding:8px 14px;line-height:1.25}
.deal-price .dep{flex:0 0 22%;background:var(--white);color:#000}
.deal-price .rest{flex:1;background:rgba(110,231,168,.14);color:var(--green);box-shadow:inset 0 0 0 1px rgba(110,231,168,.35);border-radius:0 14px 14px 0}
.deal-scale{margin-top:6px;font-size:12.5px;color:var(--grey);text-align:right}
.deal-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.deal-steps li{position:relative;padding:18px;border-radius:var(--radius-sm);background:var(--ink);border:1px solid var(--line)}
.deal-steps .n{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--grey-2);font-weight:700}
.deal-steps .n i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--white);color:#000;font-style:normal;font-size:12.5px;font-weight:900}
.deal-steps h3{margin-top:10px;font-size:18px;line-height:1.25;letter-spacing:-.01em}
.deal-steps p{margin-top:6px;font-size:14.5px;color:var(--grey-2);line-height:1.45}
.deal-own{display:flex;align-items:center;gap:10px;margin-top:14px}
.deal-own .ring{flex:none;width:44px;height:44px;border-radius:50%;background:conic-gradient(var(--green) 0 100%,rgba(255,255,255,.1) 0);display:grid;place-items:center}
.deal-own .ring::after{content:"100%";width:34px;height:34px;border-radius:50%;background:var(--ink);display:grid;place-items:center;font-size:10.5px;font-weight:900;color:var(--white)}
.deal-own span{font-size:13.5px;color:var(--grey-2)}
.deal-owed{margin-top:14px}
.deal-owed .row{display:flex;justify-content:space-between;font-size:13px;color:var(--grey-2);margin-bottom:6px}
.deal-owed .track{height:10px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}
.deal-owed .track i{display:block;height:100%;width:100%;border-radius:inherit;background:var(--white);transform-origin:left center}
.deal-owed .coins{display:flex;gap:6px;margin-top:10px}
.deal-owed .coins b{width:14px;height:14px;border-radius:50%;background:var(--green);opacity:.25}
.deal-paid{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:14px;color:var(--green);font-weight:700}
.deal-paid svg{width:22px;height:22px;flex:none}
.deal-note{margin-top:16px;font-size:13px;color:var(--grey)}
/* Motion with a job: the balance owed drains as profits pay the seller, step by step. */
.deal.rv .deal-steps li{opacity:.35;transition:opacity .5s ease}
.deal.rv.in .deal-steps li{opacity:1}
.deal.rv.in .deal-steps li:nth-child(2){transition-delay:.9s}
.deal.rv.in .deal-steps li:nth-child(3){transition-delay:3.6s}
.deal.rv.in .deal-owed .track i{animation:owed 2.8s cubic-bezier(.5,0,.3,1) 1.1s forwards}
.deal.rv.in .deal-owed .coins b{animation:coin .5s ease forwards}
.deal.rv.in .deal-owed .coins b:nth-child(1){animation-delay:1.2s}
.deal.rv.in .deal-owed .coins b:nth-child(2){animation-delay:1.6s}
.deal.rv.in .deal-owed .coins b:nth-child(3){animation-delay:2s}
.deal.rv.in .deal-owed .coins b:nth-child(4){animation-delay:2.4s}
.deal.rv.in .deal-owed .coins b:nth-child(5){animation-delay:2.8s}
.deal.rv.in .deal-owed .coins b:nth-child(6){animation-delay:3.2s}
@keyframes owed{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@keyframes coin{to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .deal.rv .deal-steps li{opacity:1;transition:none}
  .deal.rv.in .deal-owed .track i{animation:none;transform:scaleX(.45)}
  .deal.rv.in .deal-owed .coins b{animation:none;opacity:1}
}
@media (max-width:760px){.deal-steps{grid-template-columns:1fr}.deal-price .dep{flex-basis:34%}}

/* Facts strip and the four doubts beside every calendar */
.facts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.facts li{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;background:var(--graphite);box-shadow:inset 0 0 0 1px var(--line-2);font-size:14px;font-weight:700;color:var(--white)}
.facts li::before{content:"";flex:none;width:15px;height:15px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/9px no-repeat}
.facts-sub{margin-top:10px;font-size:14.5px;color:var(--grey-2);text-align:center}
.facts-sub b{color:var(--white)}
.free-no{margin-top:12px;font-size:14px;color:var(--grey-2);text-align:center}
.free-no b{color:var(--white)}
.doubts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.doubts > div{padding:16px;border-radius:var(--radius-sm);background:var(--graphite);border:1px solid var(--line)}
.doubts .k{display:block;font-size:13px;color:var(--grey);font-weight:700}
.doubts b{display:block;margin-top:4px;font-size:16px;color:var(--white);letter-spacing:-.01em;line-height:1.25}
.doubts p{margin-top:6px;font-size:14px;color:var(--grey-2);line-height:1.45}
@media (max-width:900px){.doubts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.doubts{gap:8px}.doubts > div{padding:14px 12px}.doubts b{font-size:15px}.doubts p{font-size:13.5px}}

/* Qualifier: one question per screen, a filling bar and no step count */
.qz .qz-bar{margin-top:18px}
.qz .qz-step{padding-top:6px}
.qz .qz-step[hidden],.qz [data-qz-check][hidden],.qz [data-qz-out][hidden]{display:none}
.qz .q{border-top:0;padding:16px 0 4px}
.qz .choices.stacked .choice span{justify-content:flex-start;padding:0 18px;text-align:left;line-height:1.3}
.qz .choices.stacked .choice input:checked + span{background:var(--white);color:#000}
.qz-react{margin-top:12px;padding:14px 16px;border-radius:var(--radius-sm);background:rgba(110,231,168,.09);box-shadow:inset 0 0 0 1px rgba(110,231,168,.28);font-size:15px;line-height:1.5;color:var(--chalk)}
.qz-react b{color:var(--green)}
.qz-nav{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:16px}
.qz-nav .btn{min-height:48px}
.qz-link{border:0;background:none;padding:6px 0;color:var(--grey-2);font:inherit;font-size:14px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.qz-link:hover{color:var(--white)}
.qz .select{height:56px;padding:0 16px;max-width:360px}
.qz-hint{margin-top:-4px;font-size:14px;color:var(--grey-2)}
.qz-check{padding-top:8px}
.qz-check h3{display:flex;align-items:center;gap:10px}
.qz-spin{flex:none;width:20px;height:20px;border-radius:50%;border:2.5px solid rgba(255,255,255,.18);border-top-color:var(--white);animation:qzspin .8s linear infinite}
@keyframes qzspin{to{transform:rotate(360deg)}}
.qz-list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.qz-list li{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px;padding:12px 14px;border-radius:12px;background:var(--ink);border:1px solid var(--line);opacity:0;transform:translateY(6px);animation:qzin .35s ease forwards;animation-delay:var(--d,0s)}
.qz-list li .k{font-size:13.5px;color:var(--grey)}
.qz-list li b{font-size:15px;color:var(--white);text-align:right}
.qz-list li b::before{content:"";display:inline-block;vertical-align:-2px;width:15px;height:15px;margin-right:8px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/9px no-repeat}
@keyframes qzin{to{opacity:1;transform:none}}
.qz-quote{display:flex;gap:12px;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.qz-quote img{width:64px;height:54px;flex:none;object-fit:cover;object-position:left top;border-radius:8px;background:#fff}
.qz-quote p{font-size:14px;color:var(--grey-2);line-height:1.4}
.qz-quote b{color:var(--white)}
.qz-out{padding-top:16px}
.qz-out h3{font-size:clamp(20px,2vw,24px)}
.qz-out p{margin-top:10px;color:var(--grey-2);font-size:15.5px;line-height:1.5}
.qz-out p b{color:var(--white)}
.qz-out .btn{margin-top:18px}
.playback{margin-top:8px;font-size:15px;color:var(--green);font-weight:700}
@media (prefers-reduced-motion:reduce){.qz-list li{animation:none;opacity:1;transform:none}.qz-spin{animation:none}}

/* Thank-you: booked line, answer echo, press and hold, where, reminders, brief, partner */
.echo{margin:16px auto 0;max-width:640px}
.echo ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.echo li{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;justify-content:center;font-size:15px;color:var(--grey-2)}
.echo li span{color:var(--grey)}
.echo li b{color:var(--white)}
.hold{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:60px;padding:0 30px;border:0;border-radius:999px;background:var(--white);color:#000;font:inherit;font-size:17px;font-weight:800;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:none;-webkit-touch-callout:none}
.hold .hold-fill{position:absolute;inset:0;background:var(--green);transform:scaleX(0);transform-origin:left center;transition:transform .2s ease}
.hold.holding .hold-fill{transform:scaleX(1);transition:transform 1.2s linear}
.hold.done .hold-fill{transform:scaleX(1);transition:none}
.hold .hold-txt,.hold svg{position:relative}
.hold svg{width:20px;height:20px;flex:none}
.hold:focus-visible{outline:2px solid var(--white);outline-offset:3px}
.hold-note{margin-top:10px;font-size:13.5px;color:var(--grey)}
.hold-after{margin-top:14px;font-size:15px;color:var(--grey-2)}
.hold-after a{color:var(--white);font-weight:700}
.hold-after .links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px}
.prep-grid{display:grid;grid-template-columns:1fr;gap:16px}
.prep-grid > .panel,.prep > .panel{padding:clamp(18px,2.4vw,28px)}
.place .choices{margin-top:14px}
.place .choices .choice span{min-height:46px;padding:0 18px}
.place-echo{margin-top:12px;font-size:15px;color:var(--green);font-weight:700}
.remind-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px;align-items:start;margin-top:14px}
@media (max-width:760px){.remind-grid{grid-template-columns:1fr}}
.remind .choices .choice span{min-height:44px;padding:0 18px}
.checks{display:flex;flex-wrap:wrap;gap:10px;border:0;margin:0;padding:0}
.checks legend{font-size:14px;color:var(--chalk);font-weight:700;margin-bottom:8px;padding:0}
.check{position:relative;cursor:pointer}
.check input{position:absolute;opacity:0;inset:0;cursor:pointer}
.check span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--white);font-size:15px}
.check span::before{content:"";width:16px;height:16px;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--line-2)}
.check input:checked + span{background:var(--white);color:#000;font-weight:700;box-shadow:none}
.check input:checked + span::before{background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/11px no-repeat;box-shadow:none}
.check input:focus-visible + span{outline:2px solid var(--white);outline-offset:2px}
.mock{border-radius:22px;background:#0B141A;border:1px solid var(--line-2);padding:14px;font-size:14px}
.mock[data-channel="sms"]{background:#111}
.mock .app{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#9AA4A9;font-weight:700;padding:0 2px 10px;border-bottom:1px solid rgba(255,255,255,.08)}
.mock .app i{width:22px;height:22px;border-radius:50%;background:#fff url('/assets/kit/logos/tile.svg') center/14px no-repeat}
.mock .bubble{position:relative;margin:12px 0 0;max-width:92%;padding:10px 12px 18px;border-radius:12px 12px 12px 4px;background:#1F2C33;color:#E9EDEF;line-height:1.45}
.mock[data-channel="sms"] .bubble{background:#2A2A2C}
.mock .bubble small{position:absolute;right:10px;bottom:4px;font-size:11px;color:#8696A0}
.mock .cap{margin-top:10px;font-size:12.5px;color:#9AA4A9}
.fine{font-size:12.5px;color:var(--grey);line-height:1.5}
.brief .form{margin-top:16px}
.brief .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.brief .two{grid-template-columns:1fr}}
.done-box{padding:18px;border-radius:var(--radius-sm);background:rgba(110,231,168,.09);box-shadow:inset 0 0 0 1px rgba(110,231,168,.28);margin-top:14px}
.done-box b{color:var(--green)}
.done-box p{margin-top:4px;font-size:15px;color:var(--chalk)}
.partner{display:flex;gap:16px;align-items:flex-start}
.partner .ic{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.partner .ic svg{width:22px;height:22px}
.partner p{margin-top:6px;font-size:15px;color:var(--grey-2);line-height:1.5}
.partner p b{color:var(--white)}
.cl li.pre{border-color:rgba(110,231,168,.3)}
.cl li.pre .box{background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:none}
.cl li.pre .txt b{text-decoration:none}
.cl li.pre label{cursor:default}