/* Callback product page: shared marketing tokens, scoped product layouts. */
.cp-callback { --cp-accent:var(--brand); --cp-soft:color-mix(in srgb,var(--brand) 6%,var(--card)); }
.cp-callback *, .cp-callback *::before, .cp-callback *::after { box-sizing:border-box; }
.cp-callback [hidden] { display:none !important; }
.cp-callback h1, .cp-callback h2, .cp-callback h3 { text-align:left; }
.cp-callback h2 { font-size:clamp(1.8rem,3vw,2.3rem); line-height:1.18; letter-spacing:-.04em; margin:0 0 20px; }
.cp-callback h2 span { color:var(--muted); }
.cp-callback h3 { font-size:1.07rem; line-height:1.4; margin:0 0 10px; letter-spacing:-.015em; }
.cp-callback p { line-height:1.65; }
.cp-callback a:focus-visible, .cp-callback button:focus-visible, .cp-callback input:focus-visible, .cp-demo-stage:focus-visible { outline:3px solid var(--cp-accent); outline-offset:4px; }
.cp-callback button { font:inherit; cursor:pointer; }
.cp-breadcrumb { display:flex; align-items:center; gap:10px; margin:10px 3px 20px; color:var(--muted); font-size:.76rem; }
.cp-breadcrumb a { color:var(--muted); text-decoration:underline; text-underline-offset:3px; }
.cp-hero { display:grid; grid-template-columns:1.15fr 1fr; align-items:center; gap:32px; padding:46px 38px 38px; border:1px solid var(--stroke); border-radius:24px; background:var(--card); }
.cp-hero-copy { min-width:0; container-type:inline-size; }
.cp-category { font-size:.84rem; font-weight:650; color:var(--muted); margin:0 0 22px; }
.cp-hero h1 { font-size:clamp(1.9rem,8.8cqi,2.9rem); line-height:1.12; letter-spacing:-.045em; margin:0 0 22px; }
.cp-hero h1 span { display:block; color:var(--cp-accent); }
.cp-lead { font-size:1rem; max-width:530px; margin:0 0 26px; }
.cp-actions { display:flex; align-items:center; flex-wrap:wrap; gap:17px 22px; }
.cp-callback .btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; text-align:center; }
.cp-text-link { color:var(--cp-accent); font-size:.91rem; font-weight:700; line-height:1.5; text-decoration:none; text-underline-offset:4px; }
.cp-text-link:hover { text-decoration:underline; }
button.cp-text-link { padding:8px 0; background:none; border:0; min-height:44px; }
.cp-callback .cp-trial-note { margin:15px 0 0; font-size:.74rem; color:var(--muted); max-width:475px; }
.cp-benefits { display:flex; flex-wrap:wrap; gap:10px 18px; list-style:none; padding:0; margin:25px 0 0; font-size:.76rem; }
.cp-benefits li::before { content:'✓'; color:var(--cp-accent); font-weight:700; margin-right:7px; }
.cp-hero-art { position:relative; min-width:0; min-height:485px; margin:0; padding:20px 36px 70px 0; isolation:isolate; }
.cp-hero-art::before { content:''; position:absolute; inset:10% -5% 0; background:radial-gradient(ellipse,color-mix(in srgb,var(--brand) 12%,transparent),transparent 70%); z-index:-1; }
.cp-browser { background:#fff; color:#201a26; border:1px solid #e5e1e9; border-radius:19px; overflow:hidden; box-shadow:0 12px 35px #2610370b; }
.cp-browser-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 16px; border-bottom:1px solid #ebe7ee; font-size:9px; color:#726779; }
.cp-browser-bar span:first-child { color:#aaa3b0; letter-spacing:2px; font-size:7px; }
.cp-example-site { padding:22px 20px 25px; }
.cp-site-brand { display:flex; gap:9px; align-items:center; font-size:11px; font-weight:700; }
.cp-business-avatar { display:inline-grid; place-items:center; flex:none; width:25px; height:25px; background:#650a98; border-radius:7px; color:#fff; font:750 12px/1 system-ui,sans-serif; }
.cp-example-site .cp-site-heading { font-size:21px; font-weight:800; letter-spacing:-.045em; line-height:1.15; color:#201a26; margin:19px 0 10px; }
.cp-site-intro { display:block; font-size:10px; color:#746a7b; margin-bottom:18px; }
.cp-widget-example { width:100%; max-width:350px; }
.cp-widget-example img { display:block; width:100%; height:auto; border-radius:8px; }
.cp-hero-art .cp-widget-example { width:calc(100% - 56px); min-width:215px; }
.cp-mascot { position:absolute; width:100px; height:auto; bottom:16px; left:20px; pointer-events:none; }
.cp-hero-art > figcaption { position:absolute; bottom:0; right:0; font-size:.68rem; color:var(--muted); }
/* Reuse the same photographic iPhone hardware as the homepage and Reviews. */
.cp-phone { position:relative; width:210px; aspect-ratio:391/800; container-type:inline-size; flex:none; isolation:isolate; filter:drop-shadow(0 12px 18px #17102522); }
.cp-phone-frame { position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none; }
.cp-phone-display { position:absolute; inset:1.6% 4.4% 1.4%; border-radius:14% / 6.5%; overflow:hidden; background:linear-gradient(160deg,#51415e,#1e1429); color:#fff; font:400 5cqw/1.5 system-ui,-apple-system,sans-serif; }
.cp-phone-display::after { content:''; position:absolute; width:32%; height:3px; background:#fff; bottom:1.5%; left:34%; border-radius:5px; }
.cp-phone-status { height:8%; display:flex; align-items:center; justify-content:space-between; padding:0 8%; font-size:3.8cqw; font-weight:700; }
.cp-phone-status::after { content:''; position:absolute; top:1.7%; left:34%; width:32%; height:4.7%; border-radius:999px; background:#050505; }
.cp-call-screen { display:flex; flex-direction:column; align-items:center; text-align:center; padding:8% 8% 0; }
.cp-call-label { font-size:4.6cqw; color:#e1d4ec; }
.cp-caller-avatar { display:grid; place-items:center; width:23cqw; height:23cqw; border-radius:50%; margin:10% 0 7%; background:#766382; font-size:12cqw; font-weight:500; }
.cp-call-screen > strong { font-size:7.8cqw; font-weight:600; line-height:1.3; }
.cp-call-screen > span:not(.cp-call-label):not(.cp-caller-avatar) { color:#d5c9df; font-size:4.5cqw; margin-top:3%; }
.cp-call-source { margin-top:15%; padding:10% 4%; width:100%; border:1px solid #ffffff26; border-radius:10px; background:#ffffff0b; }
.cp-call-source span,.cp-call-source strong { display:block; font-size:4.5cqw; }
.cp-call-source span { color:#cec2d8; font-size:4cqw; margin-bottom:4%; }
.cp-answer-icon { display:grid; place-items:center; background:#2aa95f; border-radius:50%; width:22cqw; height:22cqw; margin:16% 0 7%; }
.cp-answer-icon svg { width:11cqw; height:11cqw; }
.cp-call-screen small { font-size:3.9cqw; color:#d9cfe2; }
.cp-phone--hero { position:absolute; bottom:33px; right:-6px; width:135px; z-index:3; }
.cp-phone--hero .cp-call-source { margin-top:12%; }
.cp-page-nav { display:flex; justify-content:center; flex-wrap:wrap; gap:10px 30px; padding:24px 0; border-bottom:1px solid var(--stroke); }
.cp-page-nav a { display:inline-flex; align-items:center; min-height:30px; color:var(--muted); font-size:.82rem; font-weight:600; text-underline-offset:5px; }
.cp-page-nav a:hover { color:var(--cp-accent); text-decoration:underline; }
.cp-section { margin:76px 0; scroll-margin-top:26px; }
.cp-section-head { max-width:690px; margin:0 0 34px; }
.cp-section-head > p { margin:0; }
.cp-journey { padding:38px; border:1px solid var(--stroke); border-radius:24px; background:var(--card); }
.cp-journey-layout { display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:start; }
.cp-modes { border:0; padding:0; margin:0; min-width:0; }
.cp-modes legend { font-size:.88rem; font-weight:650; margin-bottom:15px; }
.cp-modes label { display:flex; align-items:center; gap:12px; padding:15px; margin:0 0 9px; border:1px solid var(--stroke); border-radius:13px; cursor:pointer; }
.cp-modes label:has(input:checked) { background:var(--cp-soft); border-color:var(--cp-accent); }
.cp-modes input { flex:none; width:17px; height:17px; accent-color:var(--cp-accent); margin:0; }
.cp-modes strong,.cp-modes small { display:block; }
.cp-modes strong { font-size:.9rem; }
.cp-modes small { color:var(--muted); font-size:.77rem; line-height:1.5; margin-top:4px; }
.cp-step-controls { display:grid; gap:4px; margin:22px 0; }
.cp-step-controls button { display:flex; align-items:center; gap:10px; min-height:44px; padding:10px 12px; text-align:left; color:var(--muted); background:transparent; border:0; border-radius:10px; font-size:.85rem; }
.cp-step-controls button > span:first-child { display:grid; place-items:center; width:23px; height:23px; border:1px solid var(--stroke); border-radius:50%; font-size:.7rem; flex:none; }
.cp-step-controls button[aria-pressed="true"] { color:var(--cp-accent); background:var(--cp-soft); font-weight:700; }
.cp-step-controls button[aria-pressed="true"] > span:first-child { color:var(--card); background:var(--cp-accent); border-color:var(--cp-accent); }
.cp-explanation { font-size:.92rem; min-height:100px; margin:20px 0 12px; }
.cp-callback .cp-fine { color:var(--muted); font-size:.76rem; line-height:1.6; }
.cp-demo-preview { min-width:0; }
.cp-demo-stage { display:grid; align-items:center; justify-items:center; min-height:495px; padding:24px; border:1px solid var(--stroke); border-radius:22px; background:var(--cp-soft); }
.cp-demo-stage > [data-cp-panel] { width:100%; }
.cp-demo-stage .cp-phone { margin:0 auto; width:195px; }
.cp-demo-note { text-align:center; font-size:.72rem; color:var(--muted); margin:15px 0 0; }
.cp-mini-site { max-width:300px; margin:auto; }
.cp-mini-site > h3 { font-size:1.45rem; margin:22px 0; line-height:1.2; letter-spacing:-.035em; }
.cp-preview-controls { text-align:center; margin-top:16px; }
.cp-preview-controls p { margin:0; font-size:.75rem; color:var(--muted); }
.cp-preview-controls button { font-size:.82rem; }
.cp-connection, .cp-confirmation { text-align:center; }
.cp-connection h3, .cp-confirmation h3 { text-align:center; font-size:1.65rem; letter-spacing:-.04em; line-height:1.2; margin:22px 0; }
.cp-connection > p { font-size:.84rem; }
.cp-connection-icon, .cp-demo-icon { display:grid; place-items:center; width:55px; height:55px; margin:0 auto 20px; border-radius:50%; background:var(--card); color:var(--cp-accent); font-size:1.7rem; }
.cp-connection-icon svg { width:23px; height:23px; }
.cp-people { display:flex; justify-content:center; align-items:center; gap:15px; margin:35px 0; }
.cp-people > div { display:grid; justify-items:center; gap:8px; flex:1; }
.cp-people > div > span { display:grid; place-items:center; background:var(--card); color:var(--cp-accent); border:1px solid var(--stroke); border-radius:50%; width:50px; height:50px; font-size:.85rem; font-weight:700; }
.cp-people strong { font-size:.85rem; }
.cp-people small { color:var(--muted); font-size:.7rem; }
.cp-connect-line { color:var(--cp-accent); font-size:1.7rem; }
.cp-outcome h3 { font-size:1.6rem; letter-spacing:-.035em; line-height:1.25; text-align:center; margin-bottom:25px; }
.cp-outcome dl { background:var(--card); border:1px solid var(--stroke); border-radius:13px; padding:4px 20px; }
.cp-outcome dl > div { padding:16px 0; border-bottom:1px solid var(--stroke); }
.cp-outcome dl > div:last-child { border:0; }
.cp-outcome dt { font-size:.74rem; color:var(--muted); margin-bottom:6px; }
.cp-outcome dd { margin:0; font-size:.85rem; }
.cp-status { color:var(--cp-accent); font-weight:700; }
.cp-schedule-example h3 { font-size:1.5rem; line-height:1.2; margin:28px 0 18px; letter-spacing:-.04em; }
.cp-schedule-example > p { font-size:.82rem; }
.cp-slot-date { display:flex; justify-content:space-between; gap:10px; background:var(--card); border:1px solid var(--stroke); border-radius:9px; padding:14px; font-size:.83rem; }
.cp-time-slots { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:15px; }
.cp-time-slots > span { display:flex; justify-content:center; gap:10px; background:var(--card); border:1px solid var(--stroke); border-radius:9px; padding:12px; font-size:.83rem; }
.cp-time-slots .cp-selected { border-color:var(--cp-accent); color:var(--cp-accent); font-weight:700; }
.cp-static-button { background:#650a98; color:#fff; text-align:center; border-radius:8px; padding:13px; font-size:.84rem; margin-top:24px; }
.cp-booking { display:grid; gap:12px; border:1px solid var(--stroke); border-radius:14px; padding:25px 15px; background:var(--card); font-size:.85rem; }
.cp-booking small { color:var(--muted); font-size:.75rem; }
.cp-split { display:grid; grid-template-columns:1fr 1fr; gap:74px; align-items:center; }
.cp-split > div > p { font-size:.94rem; }
.cp-split > div > h3 { margin-top:24px; }
.cp-routing-visual, .cp-hours-panel { background:var(--card); border:1px solid var(--stroke); padding:30px; border-radius:22px; }
.cp-route-source { display:flex; align-items:center; gap:13px; font-size:.92rem; }
.cp-route-source svg { width:24px; height:24px; color:var(--cp-accent); }
.cp-route-line { height:30px; width:1px; background:var(--stroke); margin-left:14px; }
.cp-route-team { display:flex; align-items:flex-start; gap:15px; background:var(--cp-soft); border:1px solid var(--stroke); border-radius:13px; padding:18px; }
.cp-route-number { color:var(--cp-accent); font-size:.8rem; font-weight:750; }
.cp-route-team strong { font-size:.9rem; }
.cp-route-team p { font-size:.77rem; margin:6px 0 0; }
.cp-team-avatars { display:flex; gap:6px; margin-top:15px; }
.cp-team-avatars > span { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--card); border:1px solid var(--stroke); color:var(--cp-accent); font-size:.65rem; }
.cp-route-fallback { display:flex; align-items:center; gap:12px; margin:15px; color:var(--muted); font-size:.75rem; }
.cp-routing-visual > .cp-fine { margin:20px 0 0; }
.cp-hours-icon { display:block; color:var(--cp-accent); font-size:2.4rem; margin-bottom:12px; }
.cp-hours-row { display:grid; gap:7px; padding:20px 0; border-bottom:1px solid var(--stroke); }
.cp-hours-row span { color:var(--muted); font-size:.75rem; }
.cp-hours-row strong { font-size:.87rem; }
.cp-hours-panel > .cp-fine { margin:20px 0 0; }
.cp-dashboard { background:var(--card); border:1px solid var(--stroke); border-radius:24px; padding:38px; }
.cp-dashboard-figure { margin:0; }
.cp-dashboard-figure > a { display:block; }
.cp-dashboard-figure figcaption a { color:var(--cp-accent); text-decoration:underline; text-underline-offset:3px; }
.cp-dashboard-figure img { display:block; width:100%; height:auto; border:1px solid var(--stroke); border-radius:14px; box-shadow:0 10px 30px #17102508; }
.cp-dashboard-figure figcaption { font-size:.7rem; color:var(--muted); margin-top:12px; }
.cp-dashboard-details { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; border-top:1px solid var(--stroke); padding-top:28px; margin-top:28px; }
.cp-dashboard-details p { font-size:.85rem; margin:0; }
.cp-scenarios { display:grid; grid-template-columns:repeat(3,1fr); gap:34px; margin:32px 0 25px; }
.cp-scenarios article { border-top:1px solid var(--stroke); padding-top:22px; }
.cp-scenarios article > span { display:block; color:var(--cp-accent); font-size:.75rem; font-weight:750; margin-bottom:15px; }
.cp-scenarios p { font-size:.88rem; margin:0; }
.cp-setup { border-top:1px solid var(--stroke); padding-top:55px; }
.cp-setup-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; padding:0; margin:0; list-style:none; }
.cp-setup-steps li { display:flex; align-items:flex-start; gap:14px; }
.cp-setup-steps li > span { flex:none; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--cp-soft); color:var(--cp-accent); border:1px solid var(--stroke); font-size:.8rem; }
.cp-setup-steps p { font-size:.85rem; margin:0; }
.cp-start { display:grid; grid-template-columns:1.4fr 1fr; gap:45px; align-items:center; padding:38px; border:1px solid var(--stroke); border-radius:24px; background:var(--card); }
.cp-start .cp-actions { margin-top:25px; }
.cp-credit-note { border-left:1px solid var(--stroke); padding-left:32px; }
.cp-credit-note > strong { font-size:1.25rem; color:var(--cp-accent); }
.cp-credit-note > p { font-size:.87rem; }
.cp-faq { max-width:820px; margin-left:auto; margin-right:auto; }
.cp-faq .faq-grid { margin:0; max-width:none; }
.cp-faq h2 { margin-bottom:28px; }
.cp-closing { text-align:center; padding:0 20px 45px; }
.cp-closing > p { color:var(--text); font-size:1.2rem; font-weight:700; margin:0 0 20px; }
.cp-closing small { display:block; font-size:.72rem; color:var(--muted); margin-top:15px; }
.cp-related { padding:25px 0; border-top:1px solid var(--stroke); font-size:.8rem; text-align:center; line-height:1.7; }
.cp-related a { color:var(--cp-accent); font-weight:650; text-decoration:underline; text-underline-offset:3px; }
:root[data-theme="dark"] .cp-callback { --cp-accent:#d6a8fa; }
@media (prefers-color-scheme:dark) { :root:not([data-theme]) .cp-callback { --cp-accent:#d6a8fa; } }
@media (min-width:801px) and (max-width:1024px) { body:has(.cp-callback) header.main-head .nav-links, body:has(.cp-callback) header.main-head .btn-login, body:has(.cp-callback) header.main-head .nav-trial { display:none; } body:has(.cp-callback) header.main-head .hamburger { display:block; } }
@media (max-width:1100px) and (min-width:801px) { .cp-hero { padding:34px 27px; gap:22px; grid-template-columns:1.05fr 1fr; } .cp-hero-art { padding-right:28px; } .cp-phone--hero { width:115px; right:-10px; } .cp-hero-art .cp-widget-example { min-width:190px; } .cp-example-site { padding:20px 15px; } .cp-site-intro { max-width:190px; } .cp-split { gap:40px; } }
@media (max-width:800px) {
 .cp-hero { grid-template-columns:1fr; padding:30px; gap:15px; }
 .cp-hero-copy { max-width:610px; }
 .cp-hero h1 { font-size:clamp(2rem,6vw,2.7rem); }
 .cp-hero-art { width:min(450px,100%); margin:auto; }
 .cp-section { margin:58px 0; }
 .cp-page-nav { gap:8px 22px; }
 .cp-journey-layout { grid-template-columns:1fr; gap:25px; }
 .cp-journey-controls { display:contents; }
 .cp-modes { grid-row:1; }
 .cp-step-controls { grid-row:2; grid-template-columns:repeat(4,1fr); gap:4px; margin:0; }
 .cp-step-controls button { flex-direction:column; text-align:center; gap:8px; padding:10px 5px; font-size:.73rem; }
 .cp-demo-preview { grid-row:3; }
 .cp-explanation { grid-row:4; min-height:0; margin:0; }
 .cp-journey-controls > .cp-fine { grid-row:5; margin:0; }
 .cp-demo-stage { min-height:485px; }
 .cp-split { grid-template-columns:1fr; gap:28px; }
 .cp-scheduling > div:last-child { grid-row:1; }
 .cp-dashboard-details, .cp-scenarios, .cp-setup-steps { grid-template-columns:1fr; gap:25px; }
 .cp-start { grid-template-columns:1fr; gap:25px; }
 .cp-credit-note { border-left:0; border-top:1px solid var(--stroke); padding:25px 0 0; }
}
@media (max-width:520px) {
 .cp-breadcrumb { font-size:.72rem; margin:5px 2px 15px; }
 .cp-hero { padding:26px 20px 22px; }
 .cp-category { margin-bottom:18px; }
 .cp-hero h1 { font-size:clamp(1.85rem,8.3vw,2.35rem); }
 .cp-lead { font-size:.94rem; }
 .cp-hero .cp-actions { align-items:stretch; flex-direction:column; }
 .cp-hero .btn { width:100%; font-size:.88rem; }
 .cp-callback .cp-trial-note { font-size:.71rem; }
 .cp-benefits { font-size:.73rem; gap:10px; margin-top:22px; }
 .cp-hero-art { min-height:0; padding:16px 0 55px; }
 .cp-hero-art .cp-phone { display:none; }
 .cp-hero-art .cp-widget-example { width:100%; min-width:0; }
 .cp-example-site { padding:20px 16px; }
 .cp-example-site .cp-site-heading { font-size:21px; }
 .cp-site-intro { font-size:11px; }
 .cp-mascot { width:78px; bottom:4px; left:-3px; }
 .cp-hero-art > figcaption { bottom:15px; right:0; font-size:.6rem; max-width:150px; text-align:right; }
 .cp-page-nav { justify-content:flex-start; gap:5px 18px; padding:18px 3px; }
 .cp-page-nav a { font-size:.75rem; }
 .cp-section { margin:46px 0; }
 .cp-callback h2 { font-size:1.8rem; }
 .cp-section-head { margin-bottom:25px; }
 .cp-section-head > p { font-size:.93rem; }
 .cp-journey, .cp-dashboard, .cp-start { padding:25px 19px; border-radius:20px; }
 .cp-modes label { padding:12px; }
 .cp-modes legend { font-size:.8rem; }
 .cp-modes strong { font-size:.86rem; }
 .cp-modes small { font-size:.73rem; }
 .cp-step-controls { grid-template-columns:repeat(2,1fr); gap:5px; }
 .cp-step-controls button { flex-direction:row; justify-content:flex-start; text-align:left; gap:7px; font-size:.72rem; padding:9px 6px; }
 .cp-step-controls button > span:first-child { width:20px; height:20px; }
 .cp-demo-stage { min-height:465px; padding:18px 14px; }
 .cp-demo-stage .cp-phone { width:min(190px,100%); }
 .cp-explanation { font-size:.85rem; }
 .cp-connection h3, .cp-confirmation h3, .cp-outcome h3, .cp-schedule-example h3 { font-size:1.45rem; }
 .cp-route-team { padding:16px; }
 .cp-routing-visual, .cp-hours-panel { padding:23px 20px; }
 .cp-split, .cp-use-cases, .cp-setup { padding-left:4px; padding-right:4px; }
 .cp-setup { padding-top:35px; }
 .cp-start .cp-actions { flex-direction:column; align-items:flex-start; }
 .cp-start .btn { font-size:.88rem; }
 .cp-related { text-align:left; padding:22px 4px; }
}
@media (prefers-reduced-motion:reduce) { .cp-callback * { scroll-behavior:auto !important; transition:none !important; } }

.cp-proof-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.cp-proof-grid article { overflow:hidden; border:1px solid var(--stroke); border-radius:20px; background:var(--card); }
.cp-proof-grid img { display:block; width:100%; height:auto; }
.cp-proof-grid article > div { padding:24px; }
.cp-proof-grid p { font-size:.9rem; margin:0 0 18px; }
@media(max-width:650px) { .cp-proof-grid { grid-template-columns:1fr; gap:22px; } .cp-proof-grid article > div { padding:22px; } }
