/* Business page (/business/). Visual page: hero, the sample-site loop (.lp-), the Get found frame (.fz-), the before and after show (.bba-), lean price cards and care strip. Logical properties only; kit tokens (light and dark). */

.biz-found{margin:0}


/* closed details: long explanations, FAQs and small print (same look as the FAQ rows) */
.fold{background:var(--card);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-1);overflow:hidden;margin-block-start:var(--s-4)}
.fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:14px 18px;font-weight:var(--fw-semibold);font-size:var(--fs-16);color:var(--ink);min-block-size:52px}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::after{content:"";inline-size:10px;block-size:10px;border-inline-end:2px solid var(--muted);border-block-end:2px solid var(--muted);transform:rotate(45deg);flex:none;margin-inline-end:4px;transition:transform var(--dur-fast) var(--ease)}
.fold[open]>summary::after{transform:rotate(225deg)}
.fold>summary:hover{background:var(--card-2)}
.fold>summary:focus-visible{box-shadow:inset var(--shadow-focus)}
.fold>.fold-in{padding:0 18px 16px;color:var(--ink-2)}
.fold>.fold-in>p{max-inline-size:var(--read-max)}
.fold>.fold-in.faq{max-inline-size:none}


.biz-cta{display:flex;gap:var(--s-6);align-items:center;justify-content:space-between;flex-wrap:wrap}
.biz-cta>div:first-child{flex:1 1 320px}
.biz-cta .actions{flex:0 1 auto;min-inline-size:0}
@media (max-width:520px){.biz-cta .actions .btn{inline-size:100%}}
/* flagged blocks stay hidden until site-flags.js un-hides them, even where a class sets display */
[data-flag][hidden],[data-flag-off][hidden]{display:none!important}

/* business ladder, care cards */
/* Business websites: price ladder, care plans (business-ladder.js). Logical properties only; colours from the kit tokens (light and dark). */
.bl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-2)}
.bl-step{display:flex;flex-direction:column;gap:2px;align-items:flex-start;justify-content:center;text-align:start;padding:var(--s-3) var(--s-4);background:var(--card);border:1px solid var(--border);border-radius:var(--r-md);color:var(--ink);cursor:pointer;min-block-size:64px;font:inherit}
.bl-step:hover{background:var(--card-2)}
.bl-step:focus-visible{outline:none;box-shadow:var(--shadow-focus)}
.bl-step[aria-selected="true"]{border-color:var(--gold);box-shadow:inset 0 -3px 0 var(--gold);background:var(--card-2)}
.bl-n{font-weight:var(--fw-semibold);font-size:var(--fs-16)}
.bl-p{font-size:var(--fs-14);color:var(--ink-2);font-variant-numeric:tabular-nums}
.bl-body{display:grid;gap:var(--s-5);margin-block-start:var(--s-4);grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start}
.bl-mock{background:var(--card);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-1);overflow:hidden}
.bl-bar{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--card-2);border-block-end:1px solid var(--border)}
.bl-bar i{inline-size:9px;block-size:9px;border-radius:50%;background:var(--border)}
.bl-url{flex:1;font-size:var(--fs-13,13px);color:var(--muted);padding-inline-start:8px;direction:ltr;text-align:start}
.bl-site{padding:var(--s-4);min-block-size:340px}
.bl-name{margin:0;font:var(--fw-semibold) var(--fs-20,20px)/1.2 var(--font-serif);color:var(--ink)}
.bl-tag{margin:2px 0 var(--s-3);font-size:var(--fs-14);color:var(--ink-2)}
.bl-blocks{display:grid;gap:6px}
.bl-b{max-block-size:0;opacity:0;overflow:hidden;margin:0;padding:0 12px;border-radius:var(--r-sm,8px);background:var(--card-2);border:1px dashed var(--border);font-size:var(--fs-13,13px);color:var(--ink-2);display:flex;align-items:center;transition:max-block-size .35s ease var(--d,0s),opacity .35s ease var(--d,0s),padding .35s ease var(--d,0s),margin .35s ease var(--d,0s)}
.bl-b.is-on{max-block-size:44px;opacity:1;padding:10px 12px;border-style:solid;border-inline-start:3px solid var(--gold)}
.bl-cap{margin:0;padding:8px 12px;font-size:var(--fs-13,13px);color:var(--muted);border-block-start:1px solid var(--border)}
.bl-h{margin:0 0 var(--s-2);font-size:var(--fs-24)}
.bl-h span{color:var(--ink-2);font-size:var(--fs-18);font-weight:var(--fw-regular,400);white-space:nowrap}
.bl-list{margin:0 0 var(--s-3);padding-inline-start:20px;display:grid;gap:6px;color:var(--ink-2)}
.bl-found{margin:0 0 var(--s-4);padding:var(--s-3) var(--s-4);background:var(--card-2);border-inline-start:4px solid var(--gold);border-radius:var(--r-sm,8px);font-size:var(--fs-14);color:var(--ink-2)}
@media (max-width:760px){.bl-steps{grid-template-columns:repeat(2,1fr)}.bl-body{grid-template-columns:1fr}.bl-site{min-block-size:0}}
@media (prefers-reduced-motion:reduce){.bl-b{transition:none}}

.bc-grid{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr))}
.bc{display:flex;flex-direction:column;gap:4px;padding:var(--s-4);background:var(--card);border:1px solid var(--border);border-block-start:3px solid var(--gold);border-radius:var(--r-md)}
.bc-p{font-weight:var(--fw-semibold);font-variant-numeric:tabular-nums}
.bc-t{font-size:var(--fs-14);color:var(--ink-2)}
.bc-note{margin:var(--s-3) 0 0;font-size:var(--fs-14);color:var(--ink-2);max-inline-size:var(--read-max)}
.bl-tip{margin:0 0 var(--s-3);font-size:var(--fs-14);color:var(--ink-2)}

/* comparison strip, Get found previews, reviews band, FAQ */
/* Business websites: "How this compares" strip, Get found previews, hidden reviews band (business-elsewhere.js). Logical properties only. */
.be-note{margin:var(--s-3) 0 0;font-size:var(--fs-14);color:var(--ink-2);max-inline-size:var(--read-max)}

.bf-grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.bf{margin:0}
.bf figcaption{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);margin-block-end:var(--s-2);font-weight:var(--fw-semibold);color:var(--ink)}
.bf-card{padding:var(--s-4);background:var(--card);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-1);min-block-size:150px}
.bf-card p{margin:0 0 6px}
.bf-t{font-weight:var(--fw-semibold);color:var(--ink);font-size:var(--fs-18)}
.bf-s{font-size:var(--fs-14);color:var(--ink-2)}
.bf-url{font-size:var(--fs-13,13px);color:var(--muted);direction:ltr;text-align:start}
.bf-link{font-weight:var(--fw-semibold);color:var(--link,var(--ink));font-size:var(--fs-16)}
.bf-q{font-weight:var(--fw-semibold);color:var(--ink)}
.bf-act{display:flex;gap:var(--s-2);flex-wrap:wrap;margin-block-start:var(--s-3)!important}
.bf-act span{padding:4px 12px;border:1px solid var(--border);border-radius:999px;font-size:var(--fs-13,13px);color:var(--ink-2)}
.bf-prices{list-style:none;margin:var(--s-4) 0 0;padding:0;display:grid;gap:6px;color:var(--ink)}
.bf-prices li{padding-inline-start:var(--s-3);border-inline-start:3px solid var(--gold)}
[id="reviews-band"][hidden]{display:none!important}



/* before and after, SIDE BY SIDE (Business page, #bba): two mock sites of a made-up care agency drawn in HTML and CSS; the panes carry .ba-frame so they keep the light tokens in dark mode.
   Wide screens: Before (small, plain, a little desaturated) beside After (large, accent border, lifted shadow; a laptop and a phone). Phones: stacked. Mirrors in Arabic through the grid and logical properties. */
.bba-badge{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center;margin:var(--s-2) 0 0;color:var(--muted);font-size:var(--fs-14)}
.bba{margin:0 auto;max-inline-size:1180px}
.bba-stage{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-5);align-items:start}
@media (min-width:860px){.bba-stage{grid-template-columns:minmax(0,.78fr) minmax(0,1.4fr)}}
.bba-pane{position:relative;box-sizing:border-box;container-type:inline-size;background:var(--card);color:var(--ink);border:1px solid var(--border-strong);border-radius:var(--r-md);overflow:hidden;font:400 14px/1.45 var(--font-sans);text-align:start}
.bba-tag{position:absolute;z-index:4;inset-block-start:.7em;inset-inline-start:.8em;padding:.2em .9em;border-radius:var(--r-pill);background:var(--ink);color:var(--on-ink);font:var(--fw-semibold) 13px/1.5 var(--font-sans);pointer-events:none}
.bba-tag-after{background:var(--gold);color:var(--ink)}
/* before: small, plain, a little desaturated */
.bba-before{display:block;min-block-size:23em;font-size:13px;background:hsl(58 85% 80%);font-family:"Times New Roman",Times,serif;filter:saturate(.7);opacity:.96}
.bba-o-ban{position:relative;block-size:7em;overflow:hidden;background-color:var(--ink)}
.bba-o-ban img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
.bba-o-t{position:absolute;inset:0;margin:0;display:grid;place-items:center;padding:0 .5em;text-align:center;font:700 1.45em/1 Impact,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);text-shadow:2px 2px 0 hsl(300 90% 35%)}
.bba-before>p{margin:.4em .6em}
.bba-o-nav{padding:.25em;background:hsl(120 65% 68%);text-align:center;font-size:max(13px,calc(1em * .72));color:hsl(240 90% 40%);text-decoration:underline;letter-spacing:.03em;white-space:nowrap}
.bba-o-p{inline-size:175%;font-size:max(13px,calc(1em * .62));line-height:1.1;text-align:justify;color:hsl(0 85% 36%)}
.bba-o-rate{font-size:max(13px,calc(1em * .8));font-weight:700;color:hsl(280 80% 35%)}
.bba-o-link{font-size:max(13px,calc(1em * .7));color:hsl(240 90% 42%);text-decoration:underline}
.bba-o-cnt{display:inline-block;padding:.1em .5em;background:hsl(0 0% 15%);color:hsl(120 90% 60%);font:max(13px,calc(1em * .62))/1.4 "Courier New",monospace}
.bba-o-fine{font-size:max(13px,calc(1em * .55));color:hsl(200 70% 28%)}
.bba-o-sb{position:absolute;inset-inline:0;inset-block-end:0;block-size:.9em;background:var(--border)}
.bba-o-sb i{display:block;inline-size:38%;block-size:100%;background:var(--border-strong)}
/* after: large, accent border, lifted; a laptop and a phone */
.bba-after{padding:2.9em .9em .9em;background:var(--card-2);border:2px solid var(--primary);box-shadow:0 18px 44px rgba(20,30,50,.18)}
.bba-devs{display:grid;grid-template-columns:minmax(0,1fr) 13.5em;gap:1em;align-items:end}
@container (max-width:600px){.bba-devs{grid-template-columns:minmax(0,1fr)}.bba-ph{justify-self:center;inline-size:15em}}
.bba-lap{position:relative;font-size:13px;background:var(--card);border:1px solid var(--border-strong);border-radius:.7em .7em .3em .3em;overflow:hidden;box-shadow:0 .8em 2em rgba(20,30,50,.2)}
.bba-bar{display:flex;align-items:center;gap:.4em;padding:.5em .8em;background:var(--card-2);border-block-end:1px solid var(--border)}
.bba-bar i{inline-size:.7em;block-size:.7em;border-radius:50%;background:var(--border-strong)}
.bba-url{flex:1;margin-inline-start:.6em;padding:.15em .8em;border-radius:99px;background:var(--card);border:1px solid var(--border);color:var(--muted);direction:ltr;text-align:start}
.bba-site{position:relative}
.bba-site .icon{inline-size:1.15em;block-size:1.15em;flex:none}
.bba-n-bar{display:flex;align-items:center;gap:.6em;padding:.7em .9em}
.bba-n-bar>b{flex:1;font:var(--fw-semibold) 1.1em/1.2 var(--font-sans)}
.bba-n-logo{inline-size:1.5em;block-size:1.5em;border-radius:.4em;background:var(--primary)}
.bba-lang{position:relative;display:inline-flex;align-items:center;gap:.35em;padding:.2em .7em;border:1px solid var(--border-strong);border-radius:99px;font-weight:600;white-space:nowrap}
.bba-lang s{color:var(--muted);text-decoration:none}
.bba-pin{display:inline-grid;place-items:center;inline-size:1.7em;block-size:1.7em;margin-inline-start:.5em;border-radius:50%;background:var(--gold);color:var(--ink);font:700 1em/1 var(--font-sans);box-shadow:0 0 0 2px var(--card);vertical-align:middle;flex:none}
.bba-hero{position:relative;isolation:isolate;display:grid;min-block-size:15em;overflow:hidden;background-color:rgb(8,14,26)}
.bba-n-photo{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;z-index:-2}
.bba-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,14,26,.88) 0%,rgba(8,14,26,.62) 60%,rgba(8,14,26,.34) 100%)}
:root[dir="rtl"] .bba-hero::before{background:linear-gradient(270deg,rgba(8,14,26,.88) 0%,rgba(8,14,26,.62) 60%,rgba(8,14,26,.34) 100%)}
.bba-hero-in{align-self:center;display:grid;gap:.8em;justify-items:start;padding:1.4em 1.1em;color:var(--on-solid)}
.bba-n-tag{margin:0;font:600 1em/1.3 var(--font-sans);letter-spacing:.04em;opacity:.92}
.bba-hl{margin:0;max-inline-size:14em;font:700 2em/1.1 var(--font-serif);color:inherit}
.bba-cta{display:inline-flex;align-items:center;gap:.2em;padding:.7em 1.4em;border-radius:99px;background:var(--gold);color:var(--ink);font:700 1em/1.2 var(--font-sans);box-shadow:0 .4em 1em rgba(0,0,0,.3)}
.bba-trust{display:flex;flex-wrap:wrap;gap:.4em 1em;margin:0;padding:.8em .9em;list-style:none;background:var(--primary-tint)}
.bba-trust li{display:inline-flex;align-items:center;gap:.4em;font-weight:600;color:var(--primary-ink)}
.bba-n-svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6em;margin:0;padding:.9em;list-style:none}
.bba-n-svc li{display:grid;gap:.25em;justify-items:start;align-content:start;padding:.7em;border:1px solid var(--border);border-radius:.6em;background:var(--card);box-shadow:var(--shadow-1)}
.bba-n-svc span{font-weight:600}
.bba-n-svc em{font-style:normal;color:var(--primary-ink)}
.bba-ic{display:inline-grid;place-items:center;inline-size:2em;block-size:2em;border-radius:50%;background:var(--primary-soft);color:var(--primary-ink)}
.bba-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:.7em;padding:0 .9em .9em}
.bba-card{padding:.8em;border:1px solid var(--border);border-radius:.7em;background:var(--card);box-shadow:var(--shadow-1)}
.bba-k{display:flex;align-items:center;gap:.4em;margin:0 0 .5em;font-weight:700}
.bba-chips{display:flex;flex-wrap:wrap;gap:.3em;margin:0 0 .4em;padding:0;list-style:none}
.bba-chips li{padding:.25em .6em;border:1px solid var(--border-strong);border-radius:.5em;font-variant-numeric:tabular-nums}
.bba-chips li.on{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.bba-confirm{display:block;margin-block-start:.5em;padding:.5em;border-radius:99px;background:var(--primary);color:var(--on-primary);text-align:center;font-weight:600}
.bba-bars{display:flex;align-items:flex-end;gap:.35em;block-size:5.5em}
.bba-bars i{flex:1;block-size:var(--h);border-radius:.25em .25em 0 0;background:var(--primary)}
.bba-bars i:nth-child(1){--h:30%}.bba-bars i:nth-child(2){--h:38%}.bba-bars i:nth-child(3){--h:46%}.bba-bars i:nth-child(4){--h:58%}.bba-bars i:nth-child(5){--h:72%}.bba-bars i:nth-child(6){--h:88%;background:var(--gold)}
.bba-tiny{margin:.5em 0 0}
.bba-foot{display:flex;align-items:center;gap:.5em;margin:0;padding:.8em 4.5em .8em .9em;background:var(--ink);color:var(--on-ink)}
:root[dir="rtl"] .bba-foot{padding:.8em .9em .8em 4.5em}
.bba-wa{position:absolute;inset-block-end:.7em;inset-inline-end:.8em;display:grid;place-items:center;inline-size:3em;block-size:3em;border-radius:50%;background:hsl(142 70% 40%);color:hsl(0 0% 100%);box-shadow:0 .4em 1em rgba(0,0,0,.3)}
.bba-wa .icon{inline-size:1.6em;block-size:1.6em}
.bba-wa .bba-pin{position:absolute;inset-block-start:-.7em;inset-inline-end:-.7em;margin:0}
.bba-ph{position:relative;font-size:13px;border:.45em solid var(--ink);border-radius:1.6em;background:var(--card);overflow:hidden;box-shadow:0 .8em 2em rgba(20,30,50,.25)}
.bba-ph-notch{display:block;inline-size:30%;block-size:.5em;margin:.4em auto;border-radius:99px;background:var(--ink)}
.bba-ph .icon{inline-size:1.2em;block-size:1.2em}
.bba-ph-top{display:flex;align-items:center;gap:.4em;padding:.3em .6em}
.bba-ph-top>b{flex:1;font-size:1em}
.bba-ph-hero{min-block-size:13em}
.bba-ph .bba-hero-in{padding:1em .8em;gap:.6em}
.bba-ph .bba-hl{font-size:1.45em}
.bba-ph .bba-cta{padding:.5em 1em}
.bba-ph-svc{display:grid;gap:.4em;margin:0;padding:.6em .6em 3.6em;list-style:none}
.bba-ph-svc li{display:flex;justify-content:space-between;gap:.5em;padding:.5em .6em;border-radius:.5em;background:var(--primary-tint)}
.bba-ph-svc em{font-style:normal;font-weight:600;color:var(--primary-ink)}
.bba-ph-wa{inline-size:2.6em;block-size:2.6em}
/* cinematic image pass (2026-10-07): decorative photos beside the text; no text sits on a photo except under .cine-scrim */
.cine-band{position:relative;margin:0 0 var(--s-5);aspect-ratio:21/8;overflow:hidden;border-radius:var(--r-md);background:var(--sky-2)}
.cine-band img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
.cine-hero{position:relative;overflow:hidden;isolation:isolate}
.cine-hero-img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;z-index:-2}
.cine-scrim::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,14,26,.9) 0%,rgba(8,14,26,.78) 60%,rgba(8,14,26,.68) 100%)}
.cine-scrim :is(h1,.lead,.eyebrow,.cf-note){color:var(--on-solid)}
.cine-scrim .btn-secondary{background:transparent;color:var(--on-solid);border-color:var(--on-solid)}
:root[data-theme="dark"] .cine-band img{filter:brightness(.85)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cine-band img{filter:brightness(.85)}}
@media (max-width:760px){.cine-band{aspect-ratio:16/9}}
/* price ladder as sales cards (2026-10-07): a promise, what you get, who it is for, the two payment halves, a monthly framing and one primary action per step; amounts come from the price list in business-ladder.js */
.bsc-grid{display:grid;gap:var(--s-5);grid-template-columns:minmax(0,1fr);margin:0 0 var(--s-4);padding:0;list-style:none}
@media (min-width:700px){.bsc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.bsc-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.bsc{position:relative;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);background:var(--card);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-1)}
.bsc-rec{border:2px solid var(--primary);box-shadow:var(--shadow-3)}
.bsc-badge{position:absolute;inset-block-start:-13px;inset-inline-start:var(--s-4);padding:2px 12px;border-radius:var(--r-pill);background:var(--gold);color:var(--ink);font:700 var(--fs-13)/1.6 var(--font-sans)}
.bsc-n{margin:0;font:var(--fw-semibold) var(--fs-20)/1.2 var(--font-serif)}
.bsc-p{margin:0;font:var(--fw-semibold) var(--fs-24)/1.1 var(--font-serif);color:var(--primary-ink);font-variant-numeric:tabular-nums}
.bsc-promise{margin:0;font-weight:600;color:var(--ink)}
.bsc-for{margin:0;color:var(--ink-2);font-size:var(--fs-14)}
.bsc-list{flex:1;display:grid;gap:6px;align-content:start;margin:0;padding:0;list-style:none;font-size:var(--fs-14);color:var(--ink-2)}
.bsc-list li{display:flex;gap:var(--s-2);align-items:flex-start}
.bsc-list .icon{inline-size:18px;block-size:18px;flex:none;color:var(--ok-ink)}
.bsc-note{margin:0;padding:var(--s-2) var(--s-3);background:var(--card-2);border-inline-start:3px solid var(--gold);border-radius:var(--r-xs);font-size:var(--fs-13);color:var(--ink-2)}
.bsc .btn{justify-content:center}
.bsc-risk{margin:0 0 var(--s-6);text-align:center;color:var(--ink-2);font-size:var(--fs-15)}
.bsc-sub{margin:var(--s-6) 0 var(--s-3);font:var(--fw-semibold) var(--fs-20)/1.3 var(--font-serif)}

/* ===== visual rebuild (2026-10-07): hero, the loop, Get found frame, before and after show, lean ladder and care strip ===== */
.bv-hero{min-block-size:min(64vh,560px)}
.bv-hero .ph-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy"}
.bv-hero .ph-copy{max-inline-size:720px}
.bv-hero h1{font-size:clamp(32px,5vw,52px);line-height:1.1}
.bv-risk{margin:0;color:var(--ink-2);font-size:var(--fs-15)}
.biz-cta{display:grid;justify-items:center;gap:var(--s-3);text-align:center}
.biz-cta .actions{justify-content:center}

/* the loop: one sample site at a time in a laptop frame with a phone frame beside it (same approach as the Home stage) */
.lp{display:grid;gap:var(--s-3);justify-items:center}
.lp-top{display:flex;gap:var(--s-2);align-items:center;justify-content:space-between;inline-size:100%;max-inline-size:720px}
.lp-cap{font:var(--fw-semibold) var(--fs-18)/1.3 var(--font-serif);color:var(--primary-ink)}
.lp-frames{position:relative;inline-size:100%;max-inline-size:720px;padding-block-end:var(--s-6)}
.lp-laptop{border:1px solid var(--border-strong);border-radius:var(--r-md) var(--r-md) var(--r-xs) var(--r-xs);background:var(--card);box-shadow:var(--shadow-3);overflow:hidden}
.lp-bar{display:flex;gap:5px;align-items:center;padding:8px 10px;background:var(--card-2);border-block-end:1px solid var(--border)}
.lp-bar i{inline-size:8px;block-size:8px;border-radius:50%;background:var(--border-strong)}
.lp-laptop .lp-screen{block-size:clamp(300px,46vw,380px);overflow:hidden}
.lp-phone{position:absolute;inset-block-end:0;inset-inline-end:-4px;inline-size:30%;min-inline-size:118px;border:3px solid var(--ink);border-radius:var(--r-lg);background:var(--card);box-shadow:var(--shadow-3);overflow:hidden}
.lp-phone .lp-screen{aspect-ratio:9/17;overflow:hidden}
.lp-site{position:relative;display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-3);block-size:100%;box-sizing:border-box;color:var(--ink);font-size:var(--fs-14);text-align:start}
.lp-nav{display:flex;align-items:center;gap:var(--s-2)}
.lp-logo{inline-size:20px;block-size:20px;border-radius:6px;background:var(--primary)}
.lp-lnk{inline-size:30px;block-size:5px;border-radius:3px;background:var(--border-strong)}
.lp-menu{margin-inline-start:auto;inline-size:18px;block-size:12px;border-block:2px solid var(--border-strong)}
.lp-hi{position:relative;flex:0 0 auto;block-size:clamp(110px,16vw,150px);border-radius:var(--r-xs);overflow:hidden;background:hsl(210 55% 17%);color:hsl(0 0% 100%)}
.lp-hi img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
.lp-hi img.ld{opacity:1}
.lp-hi::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.8) 0%,rgba(0,0,0,.6) 55%,rgba(0,0,0,.04) 100%)}
.lp-hi-txt{text-shadow:0 1px 2px rgba(0,0,0,.55);position:absolute;z-index:1;inset-inline-start:var(--s-3);inset-block-end:var(--s-2);display:grid;gap:2px;max-inline-size:62%}
.lp-hi-txt b{font-size:var(--fs-13);font-weight:var(--fw-semibold)}
.lp-hi-txt span{font:var(--fw-semibold) clamp(16px,2.2vw,19px)/1.2 var(--font-serif)}
.lp-book{position:absolute;z-index:1;inset-inline-end:var(--s-3);inset-block-start:var(--s-2);padding:6px 12px;border-radius:var(--r-pill);background:var(--gold);color:var(--ink);font-weight:var(--fw-semibold);font-size:var(--fs-13)}
.lp-hi .lp-book.lp-b{transform:none}
@media (prefers-reduced-motion:no-preference){.lp-hi.is-on img{animation:lp-kb 6s ease-out both}}
@keyframes lp-kb{from{transform:scale(1)}to{transform:scale(1.1)}}
.lp-lo{position:relative;flex:1 1 auto;min-block-size:0;overflow:hidden}
.lp-svc{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.lp-laptop .lp-svc{margin-inline-end:35%}
.lp-laptop .lp-demo{inset-inline-end:35%}
.lp-laptop .lp-book{inset-inline-end:36%}
.lp-svc li{display:flex;justify-content:space-between;gap:var(--s-2);padding:4px 10px;border-radius:var(--r-xs);background:var(--primary-tint);font-size:var(--fs-13)}
.lp-svc em{font-style:normal;color:var(--primary-ink);font-weight:var(--fw-semibold)}
.lp-wa{position:absolute;z-index:2;inset-block-end:var(--s-2);inset-inline-start:var(--s-3);display:grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;background:hsl(142 70% 40%);color:hsl(0 0% 100%);box-shadow:var(--shadow-2)}
.lp-wa .icon{inline-size:18px;block-size:18px}
.lp-phone .lp-site{padding:var(--s-2);gap:6px}
.lp-phone .lp-hi{flex:1 1 0;block-size:auto;min-block-size:84px}
.lp-phone .lp-hi-txt{max-inline-size:none;inset-inline:6px;inset-block-end:6px}
.lp-phone .lp-hi-txt span{font-size:var(--fs-14);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lp-phone .lp-hi-txt b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-phone .lp-book,.lp-phone .lp-lnk,.lp-phone .lp-chip{display:none}
.lp-phone .lp-lo{flex:0 0 86px}
.lp-phone .lp-nav{block-size:18px}
.lp-phone .lp-logo{inline-size:16px;block-size:16px}
.lp-phone .lp-svc li:nth-child(n+3){display:none}
.lp-phone .lp-svc li{padding:3px 6px}
.lp-phone .lp-svc li em{display:none}
.lp-phone .lp-wa{inline-size:24px;block-size:24px;inset-block-end:4px;inset-inline-start:auto;inset-inline-end:4px}
.lp-b{opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .45s ease}
.lp-b.is-on{opacity:1;transform:none}
.lp-demo{container-type:inline-size;position:absolute;inset:0;display:flex;flex-direction:column;gap:4px;padding:4px 2px 0;background:var(--card);opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease;pointer-events:none}
.lp-site.is-demo .lp-demo{opacity:1;transform:none}
.lp-chip{align-self:flex-start;padding:2px 10px;border-radius:var(--r-pill);background:var(--primary-soft);color:var(--primary-ink);font-size:var(--fs-13);font-weight:var(--fw-semibold)}
.lp-db{flex:1;min-block-size:0;display:flex;gap:var(--s-3);align-items:center}
.lp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;flex:1;max-inline-size:220px}
.lp-d{display:grid;place-items:center;block-size:20px;border-radius:4px;background:var(--card-2);color:var(--ink-2);font-size:var(--fs-13);transition:background .3s ease,transform .3s ease}
.lp-demo.d2 .lp-d.pick{background:var(--primary);color:var(--on-primary);transform:scale(1.12)}
.lp-ok{margin:0;padding:3px 10px;border-radius:var(--r-pill);background:var(--ok-bg);color:var(--ok-ink);font-size:var(--fs-13);font-weight:var(--fw-semibold);opacity:0;transform:scale(.9);transition:opacity .35s ease,transform .35s ease}
.lp-ok::before{content:"\2713\00a0"}
.lp-demo.d3 .lp-ok{opacity:1;transform:none}
.lp-kpi{display:grid;gap:2px;flex:0 0 36%}
.lp-kpi b{font:var(--fw-semibold) 22px/1 var(--font-serif);color:var(--primary-ink);font-variant-numeric:tabular-nums}
.lp-kpi span{font-size:var(--fs-13);color:var(--ink-2)}
.lp-bars{flex:1;align-self:stretch;display:flex;align-items:flex-end;gap:6px;border-block-end:2px solid var(--border-strong)}
.lp-bars i{flex:1;block-size:var(--h);background:var(--primary);border-radius:3px 3px 0 0;transform:scaleY(0);transform-origin:bottom;transition:transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i) * 90ms)}
.lp-demo.d1 .lp-bars i{transform:none}
.lp-chat{display:grid;gap:4px;inline-size:100%}
.lp-chat p{margin:0;padding:3px 10px;border-radius:12px;font-size:var(--fs-13);line-height:1.3;max-inline-size:88%;opacity:0;transform:translateY(8px) scale(.96);transition:opacity .4s ease,transform .4s ease}
.lp-in{justify-self:end;background:var(--ok-bg);color:var(--ok-ink)}
.lp-out{justify-self:start;background:var(--card-2);color:var(--ink);border:1px solid var(--border)}
.lp-demo.d1 .lp-in,.lp-demo.d2 .lp-out{opacity:1;transform:none}
.lp-cost{display:grid;gap:3px;inline-size:100%}
.lp-row{display:flex;justify-content:space-between;gap:var(--s-2);margin:0;font-size:var(--fs-13);opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s ease}
.lp-row b{font-variant-numeric:tabular-nums}
.lp-tot{padding-block-start:3px;border-block-start:1px solid var(--border-strong);font-weight:var(--fw-semibold);color:var(--primary-ink)}
.lp-demo.d1 .lp-row:nth-child(1),.lp-demo.d2 .lp-row:nth-child(2),.lp-demo.d3 .lp-row:nth-child(3){opacity:1;transform:none}
.lp-lang{flex-direction:column;align-items:flex-start;gap:6px}
.lp-pills{display:flex;gap:3px;direction:ltr}
.lp-pills i{font-style:normal;font-size:var(--fs-13);padding:0 7px;border-radius:var(--r-pill);border:1px solid var(--border-strong);color:var(--ink-2);transition:background .3s ease,color .3s ease}
.lp-pills i.on{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.lp-card{display:grid;gap:4px;inline-size:100%;padding-inline-start:var(--s-2);border-inline-start:3px solid var(--primary);transition:opacity .25s ease}
.lp-card b{font:var(--fw-semibold) var(--fs-14)/1.25 var(--font-serif)}
.lp-btn{justify-self:start;padding:1px 10px;border-radius:var(--r-pill);background:var(--primary);color:var(--on-primary);font-size:var(--fs-13);font-weight:var(--fw-semibold)}
.lp-phone .lp-d:nth-child(n+6){display:none}
.lp-phone .lp-grid{grid-template-columns:repeat(5,1fr)}
.lp-phone .lp-db{flex-direction:column;gap:4px;align-items:stretch}
.lp-phone .lp-ok{justify-self:start}
.lp-phone .lp-kpi{flex:0 0 auto}
.lp-phone .lp-kpi span{display:none}
.lp-phone .lp-bars{min-block-size:0;block-size:44px;flex:0 0 auto}
.lp-phone .lp-pills i:nth-child(2),.lp-phone .lp-pills i:nth-child(4),.lp-phone .lp-pills i:nth-child(5){display:none}
.lp-phone .lp-btn{display:none}
.lp-phone .lp-cost{gap:2px}
.lp-phone .lp-row span{display:none}
.lp-phone .lp-row{justify-content:flex-end}
@media (prefers-reduced-motion:reduce){.lp-b,.lp-demo,.lp-d,.lp-ok,.lp-bars i,.lp-chat p,.lp-row,.lp-card,.lp-pills i,.lp-hi img{transition:none}.lp-b{opacity:1;transform:none}}
.lp-ctl{display:flex;gap:var(--s-2);flex-wrap:wrap;align-items:center;justify-content:center}
.lp-ctl .btn{min-block-size:44px}
.lp-dots{display:flex;gap:2px;margin:0;padding:0}
.lp-dot{display:grid;place-items:center;inline-size:28px;block-size:44px;padding:0;border:0;background:transparent;cursor:pointer}
.lp-dot::before{content:"";inline-size:12px;block-size:12px;border-radius:50%;border:2px solid var(--primary);transition:transform .2s ease}
.lp-dot[aria-current]::before{background:var(--primary);transform:scale(1.2)}
.lp-dot:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:var(--r-sm)}

/* Get found frame: a search, the result list, a map card and an AI answer; plays once when it scrolls into view */
.fz{display:grid;gap:var(--s-3);justify-items:center}
.fz-frame{position:relative;display:grid;gap:var(--s-3);inline-size:100%;max-inline-size:820px;padding:var(--s-6) var(--s-4) var(--s-4);box-sizing:border-box;border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--card);box-shadow:var(--shadow-3);overflow:hidden}
.fz-smp{position:absolute;inset-block-start:var(--s-2);inset-inline-end:var(--s-3)}
.fz-search{display:flex;align-items:center;gap:var(--s-2);min-block-size:44px;padding:6px 16px;border:1px solid var(--border-strong);border-radius:var(--r-pill);background:var(--card-2);color:var(--ink)}
.fz-search .icon{inline-size:18px;block-size:18px;flex:none;color:var(--muted)}
.fz-q{flex:1;min-inline-size:0}
.fz-caret{inline-size:2px;block-size:1.2em;background:var(--ink);opacity:0}
.fz.is-armed.s0 .fz-caret{opacity:1;animation:fz-blink 1s steps(1) infinite}
.fz.s1 .fz-caret{display:none}
@keyframes fz-blink{50%{opacity:0}}
.fz-cols{display:grid;gap:var(--s-3);align-items:start}
@media (min-width:760px){.fz-cols{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}}
.fz-res{display:grid;gap:var(--s-2);margin:0;padding:0}
.fz-r{position:relative;display:grid;gap:4px;padding:var(--s-3);border-radius:var(--r-sm);border:1px solid transparent}
.fz-r1{border:2px solid var(--primary);background:var(--primary-tint)}
.fz-u{margin:0;color:var(--muted);font-size:var(--fs-13);direction:ltr;text-align:start}
.fz-t{margin:0;color:var(--primary-ink);font:var(--fw-semibold) var(--fs-18)/1.3 var(--font-sans)}
.fz-s{margin:0;color:var(--ink-2);font-size:var(--fs-14)}
.fz-tag{justify-self:start;padding:1px 10px;border-radius:var(--r-pill);background:var(--gold);color:var(--ink);font-size:var(--fs-13);font-weight:var(--fw-semibold)}
.fz-ph{display:block;block-size:8px;inline-size:90%;border-radius:4px;background:var(--border)}
.fz-ph-u{inline-size:40%}
.fz-ph-t{inline-size:70%;block-size:12px}
.fz-map{display:grid;gap:4px;padding:var(--s-3);border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--card);box-shadow:var(--shadow-2)}
.fz-map p{margin:0}
.fz-pin{display:grid;place-items:center;inline-size:36px;block-size:36px;border-radius:50%;background:var(--danger);color:hsl(0 0% 100%)}
.fz-pin .icon{inline-size:20px;block-size:20px}
.fz-mn{font:var(--fw-semibold) var(--fs-18)/1.2 var(--font-serif);color:var(--ink)}
.fz-mc{color:var(--ink-2);font-size:var(--fs-14)}
.fz-mo{color:var(--ok-ink);font-size:var(--fs-14);font-weight:var(--fw-semibold)}
.fz-act{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-block-start:var(--s-2)!important}
.fz-act span{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:var(--r-pill);background:var(--primary);color:var(--on-primary);font-size:var(--fs-13);font-weight:var(--fw-semibold)}
.fz-act .icon{inline-size:14px;block-size:14px}
.fz-ai{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-2) var(--s-3);align-items:start;padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--primary-soft);color:var(--primary-ink)}
.fz-ai-ic{display:grid;place-items:center;inline-size:32px;block-size:32px;border-radius:50%;background:var(--primary);color:var(--on-primary)}
.fz-ai-ic .icon{inline-size:18px;block-size:18px}
.fz-ai-t{margin:0;font-size:var(--fs-16);color:var(--ink)}
.fz-src{grid-column:2;justify-self:start;padding:2px 10px;border-radius:var(--r-pill);border:1px solid var(--primary);font-size:var(--fs-13);font-weight:var(--fw-semibold);direction:auto}
.fz-prices{display:flex;flex-wrap:wrap;gap:var(--s-2);margin:0;padding:0;justify-content:center}
.fz-prices li{padding:4px 14px;border:1px solid var(--border-strong);border-radius:var(--r-pill);background:var(--card);border-inline-start:3px solid var(--gold)}
.fz-line{margin:0;text-align:center;color:var(--ink);font-weight:var(--fw-semibold)}
.fz.is-armed .fz-r,.fz.is-armed .fz-map,.fz.is-armed .fz-ai{opacity:0}
.fz.is-armed .fz-r{transform:translateY(12px)}
.fz.is-armed .fz-map{transform:translateX(28px)}
html[dir="rtl"] .fz.is-armed .fz-map{transform:translateX(-28px)}
.fz.is-armed .fz-ai{transform:translateY(14px) scale(.97)}
.fz.is-armed .fz-r,.fz.is-armed .fz-map,.fz.is-armed .fz-ai{transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
.fz.s1 .fz-r,.fz.s2 .fz-map,.fz.s3 .fz-ai{opacity:1;transform:none}
.fz.s1 .fz-r2{transition-delay:.15s}
.fz.s1 .fz-r3{transition-delay:.3s}

/* before and after: the show (business-ba.js adds .is-armed once it is in view, then the phase classes p1 to p5; without them the finished state is shown) */
.bba-stage{position:relative}
.bba-pair{position:relative;display:grid}
.bba-pair>.bba-en,.bba-pair>.bba-ar{grid-area:1/1}
.bba-pair>.bba-ar{opacity:0;text-align:start}
.bba-pair>.bba-pin{position:absolute;inset-block-start:-.9em;inset-inline-end:-.9em;margin:0}
.bba-cta.bba-pair{display:inline-grid;position:relative}
.bba-cur{position:absolute;opacity:0;pointer-events:none;z-index:6}
.bba-cta .bba-cur{inset-block-end:-.5em;inset-inline-end:1em}
.bba-lang .bba-l-ar{padding-inline:.3em;border-radius:99px}
.bba-lang .bba-pin{position:absolute;inset-block-start:-.9em;inset-inline-end:-.9em;margin:0}
.bba-o-broken{position:absolute;inset-block-start:.5em;inset-inline-end:.6em;inline-size:1.5em;block-size:1.5em;border:1px solid hsl(0 0% 45%);background:linear-gradient(135deg,hsl(0 0% 100%) 44%,hsl(0 75% 45%) 46%,hsl(0 75% 45%) 54%,hsl(0 0% 100%) 56%)}
.bba-o-tiny{position:relative;display:inline-block;inline-size:.7em;block-size:.7em;margin-inline-start:.7em;background:hsl(0 0% 72%);border:1px solid hsl(0 0% 50%);vertical-align:middle}
.bba-o-tiny .bba-cur{inset-block-start:.15em;inset-inline-start:.15em}
.bba-o-pop{position:absolute;z-index:3;inset-block-start:34%;inset-inline-start:10%;inline-size:64%;box-sizing:border-box;display:grid;gap:.35em;padding:.55em .7em;border:2px solid hsl(0 80% 42%);background:hsl(0 0% 100%);box-shadow:.3em .3em 0 hsl(0 0% 0% / .35);opacity:0;pointer-events:none}
.bba-o-pop b{justify-self:end;display:grid;place-items:center;inline-size:1.2em;block-size:1.2em;background:hsl(0 80% 42%);color:hsl(0 0% 100%);font:700 max(13px,.8em)/1 var(--font-sans)}
.bba-o-pop i{display:block;block-size:.45em;background:hsl(0 0% 70%)}
.bba-toast{position:absolute;z-index:6;margin:0;padding:.4em .95em;border-radius:99px;font:600 max(13px,.95em)/1.3 var(--font-sans);opacity:0;pointer-events:none;box-shadow:0 .4em 1em rgba(20,30,50,.25)}
.bba-toast-no{inset-block-end:1.2em;inset-inline:0;margin-inline:auto;inline-size:max-content;background:var(--ink);color:var(--on-ink)}
.bba-toast-ok{display:flex;align-items:center;gap:.4em;inset-block-start:.6em;inset-inline-end:.6em;background:var(--ok-bg);color:var(--ok-ink);border:1px solid var(--ok-ink)}
.bba-notif{position:absolute;z-index:5;inset-inline:.5em;inset-block-start:1.2em;margin:0;display:flex;align-items:center;gap:.4em;padding:.4em .6em;border-radius:.9em;background:var(--ink);color:var(--on-ink);font:600 max(13px,.85em)/1.2 var(--font-sans);opacity:0;pointer-events:none}
.bba-sweep{position:absolute;inset:0;z-index:7;overflow:hidden;pointer-events:none;border-radius:var(--r-md)}
html[dir="rtl"] .bba-sweep{transform:scaleX(-1)}
.bba-sweep i{position:absolute;inset:0;opacity:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent calc(100% - 110px),hsl(45 100% 70% / .3) calc(100% - 16px),hsl(48 100% 97%) calc(100% - 3px),hsl(48 100% 97%) 100%)}
.bba-sparks{display:none;position:absolute;z-index:8;inset-block-start:46%;inset-inline-start:35.6%;pointer-events:none}
@media (min-width:860px){.bba-sparks{display:block}}
.bba-sparks i{position:absolute;inline-size:7px;block-size:7px;margin:-3px;border-radius:50%;background:hsl(45 100% 66%);box-shadow:0 0 8px hsl(45 100% 66%);opacity:0}
.bba-sparks i:nth-child(1){--dx:-34px;--dy:-30px}.bba-sparks i:nth-child(2){--dx:0px;--dy:-44px}.bba-sparks i:nth-child(3){--dx:34px;--dy:-30px}
.bba-sparks i:nth-child(4){--dx:-44px;--dy:4px}.bba-sparks i:nth-child(5){--dx:44px;--dy:4px}.bba-sparks i:nth-child(6){--dx:-24px;--dy:34px}.bba-sparks i:nth-child(7){--dx:24px;--dy:34px}
.bba-pin[data-n="1"],.bba-nl li[data-n="1"]{--pd:0s}.bba-pin[data-n="2"],.bba-nl li[data-n="2"]{--pd:.3s}.bba-pin[data-n="3"],.bba-nl li[data-n="3"]{--pd:.6s}
.bba-pin[data-n="4"],.bba-nl li[data-n="4"]{--pd:.9s}.bba-pin[data-n="5"],.bba-nl li[data-n="5"]{--pd:1.2s}
.bba-n-svc li:nth-child(1){--i:0}.bba-n-svc li:nth-child(2){--i:1}.bba-n-svc li:nth-child(3){--i:2}
.bba-bars i:nth-child(1){--i:0}.bba-bars i:nth-child(2){--i:1}.bba-bars i:nth-child(3){--i:2}.bba-bars i:nth-child(4){--i:3}.bba-bars i:nth-child(5){--i:4}.bba-bars i:nth-child(6){--i:5}
/* the five short labels under the pair, numbered, and the controls */
.bba-nl{counter-reset:bn;display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);justify-content:center;margin:var(--s-5) 0 0;padding:0}
.bba-nl li{counter-increment:bn;display:flex;gap:var(--s-2);align-items:center;font-weight:var(--fw-semibold);color:var(--ink)}
.bba-nl li::before{content:counter(bn);flex:none;display:grid;place-items:center;inline-size:26px;block-size:26px;border-radius:50%;background:var(--gold);color:var(--ink);font:700 var(--fs-14)/1 var(--font-sans)}
.bba-ctl{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;justify-content:center;margin-block-start:var(--s-4)}
.bba-ctl .btn{min-block-size:44px}
@media (prefers-reduced-motion:no-preference){
  .bba-show.is-paused *,.bba-show.is-paused *::before,.bba-show.is-paused *::after{animation-play-state:paused!important}
  /* armed: the After starts empty */
  .bba-show.is-armed .bba-after{opacity:.35}
  .bba-show.is-armed .bba-after .bba-n-photo{opacity:0;transform:scale(1.3)}
  .bba-show.is-armed .bba-after :is(.bba-n-tag,.bba-trust,.bba-card,.bba-foot,.bba-ph-top,.bba-ph-svc,.bba-n-bar>b,.bba-lang){opacity:0}
  .bba-show.is-armed .bba-after .bba-pair>.bba-en{opacity:0}
  .bba-show.is-armed .bba-after .bba-hl .bba-en{transform:translateY(16px)}
  .bba-show.is-armed .bba-after .bba-cta,.bba-show.is-armed .bba-after .bba-ph .bba-cta{opacity:0;transform:scale(.6)}
  .bba-show.is-armed .bba-n-svc li{opacity:0;transform:translateY(18px) rotate(-5deg)}
  .bba-show.is-armed .bba-wa{opacity:0;transform:scale(0)}
  .bba-show.is-armed .bba-bars i{transform:scaleY(0);transform-origin:bottom}
  .bba-show.is-armed .bba-book .bba-chips li.on{background:transparent;border-color:var(--border-strong);color:inherit}
  .bba-show.is-armed .bba-pin{opacity:0;transform:scale(0)}
  .bba-show.is-armed .bba-nl li{opacity:.45}
  .bba-show.is-armed .bba-nl li::before{transform:scale(.8);background:var(--border-strong)}
  /* 1 the old site glitches and nobody answers */
  .bba-show.p1 .bba-before{animation:bba-gl 2.8s steps(1,end) both}
  .bba-show.p1 .bba-o-pop{animation:bba-pp 2.8s ease both}
  .bba-show.p1 .bba-o-tiny .bba-cur{animation:bba-c1 2.8s ease both}
  .bba-show.p1 .bba-toast-no{animation:bba-tn 2.8s ease both}
  /* 2 a glowing line sweeps across, sparks at the join, the old site fades */
  .bba-show.p2 .bba-before{animation:bba-dim .7s ease .3s both}
  .bba-show.p2 .bba-sweep i{animation:bba-sw 1s cubic-bezier(.55,0,.25,1) both}
  .bba-show.p2 .bba-sparks i{animation:bba-sp .8s ease-out .38s both}
  /* 3 the new site assembles */
  .bba-show.p3 .bba-after{animation:bba-lift .5s ease both}
  .bba-show.p3 .bba-after .bba-n-photo{animation:bba-zoom 1.4s cubic-bezier(.2,.7,.2,1) both}
  .bba-show.p3 .bba-after .bba-n-tag{animation:bba-up .5s ease .3s both}
  .bba-show.p3 .bba-after .bba-n-bar>b,.bba-show.p3 .bba-after .bba-lang,.bba-show.p3 .bba-after .bba-ph-top{animation:bba-fade .5s ease .2s both}
  .bba-show.p3 .bba-after .bba-hl .bba-en{animation:bba-up .6s ease .45s both,bba-xo 1.3s ease 1.6s forwards}
  .bba-show.p3 .bba-after .bba-cta.bba-pair .bba-en{animation:bba-fade .3s ease .9s both,bba-xo 1.3s ease 1.6s forwards}
  .bba-show.p3 .bba-after .bba-pair>.bba-ar{animation:bba-xi 1.3s ease 1.6s both}
  .bba-show.p3 .bba-after .bba-cta{animation:bba-pop .7s cubic-bezier(.3,1.6,.5,1) .9s both}
  .bba-show.p3 .bba-after .bba-ph .bba-cta{animation:bba-pop .7s cubic-bezier(.3,1.6,.5,1) 1.1s both}
  .bba-show.p3 .bba-after .bba-lang .bba-l-ar{animation:bba-hi 1.3s ease 1.6s both}
  .bba-show.p3 .bba-after .bba-trust{animation:bba-fade .5s ease .8s both}
  .bba-show.p3 .bba-n-svc li{animation:bba-fan .6s cubic-bezier(.2,.8,.3,1.2) both;animation-delay:calc(1.1s + var(--i) * .15s)}
  .bba-show.p3 .bba-ph-svc{animation:bba-fade .5s ease 1.3s both}
  .bba-show.p3 .bba-after .bba-card{animation:bba-up .5s ease 1.6s both}
  .bba-show.p3 .bba-after .bba-dash{animation-delay:1.75s}
  .bba-show.p3 .bba-bars i{animation:bba-grow .6s cubic-bezier(.2,.8,.3,1) both;animation-delay:calc(1.9s + var(--i) * .08s)}
  .bba-show.p3 .bba-foot{animation:bba-fade .5s ease 2s both}
  .bba-show.p3 .bba-wa{animation:bba-bounce .9s ease 2.1s both}
  /* 4 a visitor books, the booking is confirmed, a notification arrives on the phone */
  .bba-show.p4 .bba-cta .bba-cur{animation:bba-c2 1.9s ease both}
  .bba-show.p4 .bba-book .bba-chips:not(.bba-times) li.on{animation:bba-sel .45s ease 1.2s both}
  .bba-show.p4 .bba-times li.on{animation:bba-sel .45s ease 1.7s both}
  .bba-show.p4 .bba-confirm{animation:bba-pulse .6s ease 1.9s both}
  .bba-show.p4 .bba-toast-ok{animation:bba-toast .5s ease 1.95s both}
  .bba-show.p4 .bba-notif{animation:bba-notif .6s ease 2.3s both}
  /* 5 the five numbered dots light up one by one */
  .bba-show.p5 .bba-pin{animation:bba-pinpop .45s cubic-bezier(.3,1.7,.5,1) both;animation-delay:var(--pd,0s)}
  .bba-show.p5 .bba-nl li{animation:bba-lit .4s ease both;animation-delay:var(--pd,0s)}
  .bba-show.p5 .bba-nl li::before{animation:bba-litn .5s ease both;animation-delay:var(--pd,0s)}
}
@keyframes bba-gl{0%{transform:none;opacity:.96}7%{transform:translateX(-2px);opacity:.78}9%{transform:translateX(2px);opacity:.96}24%{transform:none}31%{transform:translateX(1px);opacity:.82}33%{transform:none;opacity:.96}58%{transform:translateX(-2px)}60%{transform:none}84%{opacity:.78}86%{opacity:.96}}
@keyframes bba-pp{0%,6%{opacity:0;transform:translateY(-8px)}9%,26%{opacity:1;transform:none}30%,44%{opacity:0;transform:translateY(-8px)}47%,70%{opacity:1;transform:none}74%,100%{opacity:0;transform:translateY(-8px)}}
@keyframes bba-c1{0%{opacity:0;transform:translate(90px,70px)}8%{opacity:1}38%{transform:translate(0,0)}44%{transform:scale(.8)}50%{transform:scale(1)}58%{transform:scale(.8)}64%{transform:scale(1)}90%{opacity:1}100%{opacity:0}}
@keyframes bba-tn{0%,62%{opacity:0;transform:translateY(8px)}72%,100%{opacity:1;transform:none}}
@keyframes bba-dim{from{opacity:.96}to{opacity:.45}}
@keyframes bba-sw{0%{opacity:1;transform:translateX(-100%)}92%{opacity:1}100%{opacity:0;transform:translateX(0)}}
@keyframes bba-sp{0%{opacity:0;transform:none}8%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
@keyframes bba-lift{to{opacity:1}}
@keyframes bba-zoom{from{opacity:0;transform:scale(1.3)}to{opacity:1;transform:scale(1)}}
@keyframes bba-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes bba-fade{from{opacity:0}to{opacity:1}}
@keyframes bba-pop{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.12)}80%{transform:scale(.97)}100%{opacity:1;transform:none}}
@keyframes bba-fan{from{opacity:0;transform:translateY(18px) rotate(-5deg)}to{opacity:1;transform:none}}
@keyframes bba-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes bba-bounce{0%{opacity:0;transform:scale(0)}45%{opacity:1;transform:scale(1.25)}65%{transform:scale(.9)}82%{transform:scale(1.07)}100%{opacity:1;transform:none}}
@keyframes bba-xo{0%{opacity:1}10%,80%{opacity:0}100%{opacity:1}}
@keyframes bba-xi{0%{opacity:0}10%,80%{opacity:1}100%{opacity:0}}
@keyframes bba-hi{0%{background:transparent}10%,80%{background:var(--primary);color:var(--on-primary)}100%{background:transparent}}
@keyframes bba-c2{0%{opacity:0;transform:translate(110px,90px)}12%{opacity:1}50%{transform:translate(0,0)}58%{transform:scale(.78)}66%{transform:scale(1)}88%{opacity:1}100%{opacity:0;transform:translate(16px,16px)}}
@keyframes bba-sel{to{background:var(--primary);border-color:var(--primary);color:var(--on-primary);transform:scale(1.12)}}
@keyframes bba-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes bba-toast{0%{opacity:0;transform:scale(.6) translateY(-8px)}60%{opacity:1;transform:scale(1.08)}100%{opacity:1;transform:none}}
@keyframes bba-notif{from{opacity:0;transform:translateY(-130%)}to{opacity:1;transform:none}}
@keyframes bba-pinpop{from{opacity:0;transform:scale(0)}to{opacity:1;transform:none}}
@keyframes bba-lit{from{opacity:.45}to{opacity:1}}
@keyframes bba-litn{0%{transform:scale(.8);background:var(--border-strong)}60%{transform:scale(1.3);background:var(--gold)}100%{transform:none;background:var(--gold)}}

/* lean price cards and the care strip */
.bsc-lean .bsc-list{flex:0 0 auto}
.bl-lean .bl-steps{margin-block-start:var(--s-4)}
.bc-lean .bc{align-items:center;text-align:center}
.bc-ic{display:grid;place-items:center;inline-size:40px;block-size:40px;border-radius:50%;background:var(--primary-soft);color:var(--primary-ink)}
.bc-ic .icon{inline-size:20px;block-size:20px}
.bc-chips{display:flex;flex-wrap:wrap;gap:var(--s-2);justify-content:center;margin:var(--s-4) 0 0;padding:0}
.bc-chips li{padding:4px 14px;border:1px solid var(--border-strong);border-radius:var(--r-pill);background:var(--card);border-inline-start:3px solid var(--gold);font-weight:var(--fw-semibold)}

/* what a website costs elsewhere (business-compare.js): three bars that grow once in view */
.cmp-list{display:grid;gap:var(--s-5);margin:0;padding:0}
.cmp-row{display:grid;gap:6px}
.cmp-top{display:flex;justify-content:space-between;gap:var(--s-3);align-items:baseline;flex-wrap:wrap}
.cmp-v{font-weight:var(--fw-semibold);color:var(--ink)}
.cmp-track{block-size:14px;border-radius:999px;background:var(--card-2);overflow:hidden;position:relative}
.cmp-track i{position:absolute;inset-block:0;border-radius:999px;background:var(--muted);transform:scaleX(0);transform-origin:left center;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
:root[dir="rtl"] .cmp-track i{transform-origin:right center}
.cmp-diy .cmp-track i{background:var(--muted)}
.cmp-us .cmp-track i{background:var(--primary);min-inline-size:12px}
.cmp-go .cmp-track i{transform:scaleX(1)}
.cmp-go .cmp-ag .cmp-track i{transition-delay:.1s}.cmp-go .cmp-diy .cmp-track i{transition-delay:.5s}.cmp-go .cmp-us .cmp-track i{transition-delay:.9s}
.cmp-row p{margin:0;color:var(--ink-2);font-size:var(--fs-13)}
.cmp-us .cmp-top b{color:var(--primary)}
.cmp-src{margin-block-start:var(--s-4);color:var(--ink-2);font-size:var(--fs-13)}
@media (prefers-reduced-motion:reduce){.cmp-track i{transition:none;transform:scaleX(1)}}
.cmp-list{grid-template-columns:repeat(3,1fr);align-items:stretch}
.cmp-row{padding:var(--s-4);border-radius:var(--r-xl);background:var(--card);border:1px solid var(--line);opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.cmp-go .cmp-row{opacity:1;transform:none}
.cmp-go .cmp-diy{transition-delay:.35s}.cmp-go .cmp-us{transition-delay:.7s}
.cmp-us{border-color:var(--primary);box-shadow:0 10px 30px rgba(0,0,0,.08)}
.cmp-pts{display:grid;gap:var(--s-2);margin:var(--s-2) 0 0;padding:0}
.cmp-pts li{position:relative;padding-inline-start:26px;font-size:var(--fs-14);line-height:1.4}
.cmp-pts li::before{position:absolute;inset-inline-start:0;inset-block-start:0;inline-size:20px;block-size:20px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:var(--fw-semibold);color:var(--card)}
.cmp-bad li::before{content:"\2715";background:var(--danger)}
.cmp-good li::before{content:"\2713";background:var(--primary)}
@media (max-width:820px){.cmp-list{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.cmp-row{opacity:1;transform:none;transition:none}}