/* /black-friday/ in sq en de it fr (global-src/deals.py → build.py render_bf).
   Loaded only on those pages; everything is scoped under .bf, .bf-nav and
   body.bf-page, so the pages that share style.css cannot be touched.
   The site's own light system (Genti, 2026-11-06: "the clean white one"):
   warm paper and white bands, Geist 400/500/600 on one type scale, black
   buttons, Titro yellow only on the price tag, the countdown dot, the phone
   buy bar and inside the captions. Body text ≥ 7:1 everywhere. */
body.bf-page{background:#F7F5F0}
body.bf-page .foot{background:#fff;margin-top:0;border-top:1px solid #E6E2D9;--t3:#6B6F75}
body.bf-page .foot .foot-legal{opacity:1}

/* ---------------------------------------------------------------- header */
.bf-nav [hidden]{display:none!important}
.bf-nav .logo{min-height:44px}
.bf-nav .logo .logo-mark{border:0;outline:0;box-shadow:none;background:none;border-radius:0}
.bf-nav .lang-menu summary{height:44px}
.bf-nav .lang-menu ul a{min-height:44px}
.bf-nav .nav-links a.bf-navcta-a{background:#111214;color:#fff;font-weight:600;white-space:nowrap;border:0}
.bf-nav .nav-links a.bf-navcta-a:hover{background:#000;color:#fff}
@media (max-width:820px){.bf-nav .nav-in{gap:14px;padding-left:16px}.bf-nav .nav-links{gap:10px}.bf-nav .lang-item{margin:0}}
@media (max-width:760px){.bf-nav.bf-cta-off .bf-navcta{display:none}.bf-nav .lang-menu ul{left:auto;right:0}}

/* ---------------------------------------------------------------- base */
.bf{
  --pa:#F7F5F0; --pa2:#EFECE4; --wh:#FFFFFF; --ink:#111214; --ink2:#3D4046; --ink3:#4A4E54;
  --ln:#E6E2D9; --ln2:#D6D1C6; --y:#FFD400;
  --sans:Geist,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --cap:Montserrat,"Arial Black",sans-serif;
  --fs-d:clamp(2.5rem,1.55rem + 3.4vw,4rem);
  --fs-h2:clamp(2rem,1.5rem + 1.8vw,2.875rem);
  --fs-lede:clamp(1.0625rem,1rem + .3vw,1.25rem);
  color:var(--ink);font:400 17px/1.6 var(--sans);
}
:where(.bf) :is(h1,h2,h3,p,ul,ol,li,figure){margin:0;padding:0}
:where(.bf) :is(ul,ol){list-style:none}
:where(.bf) :is(img,video){display:block;max-width:100%;height:auto}
:where(.bf) a{color:inherit}
:where(.bf) section{padding:0}
.bf [hidden]{display:none!important}
.bf section[id]{scroll-margin-top:96px}
.bf h1,.bf h2,.bf h3,.bf .bf-h1{max-width:none;margin:0;text-align:inherit;color:inherit;text-wrap:balance}
.bf h2{font-size:var(--fs-h2);line-height:1.08;letter-spacing:-.032em;font-weight:600}
.bf svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.bf :focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}
.bf-wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.bf-hero-grid>*,.bf-demo>*,.bf-lang>*,.bf-voice>*,.bf-faq>*{min-width:0}
@media (max-width:640px){.bf-wrap{padding:0 16px}}
.bf-sec{padding:clamp(80px,9vw,128px) 0}
.bf-white{background:var(--wh)}
.bf-paper{background:var(--pa)}
.bf-eye{display:flex;align-items:center;gap:10px;font:500 15px/1.2 var(--sans);color:var(--ink3);margin:0 0 18px}
.bf-eye::before{content:"";width:18px;height:3px;border-radius:3px;background:var(--y)}
.bf-head.center{text-align:center}
.bf-head.center .bf-eye{justify-content:center}
.bf-sub{font-size:var(--fs-lede);line-height:1.55;color:var(--ink2);margin-top:18px;max-width:36em;text-wrap:pretty}
.bf-head.center .bf-sub{margin-left:auto;margin-right:auto}

/* ---------------------------------------------------------------- buttons */
.bf-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 28px;border-radius:14px;font:600 17px/1 var(--sans);text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:background-color .15s ease,box-shadow .15s ease}
.bf-btn:active{transform:translateY(1px)}
.bf-btn svg.i{width:18px;height:18px;stroke-width:2}
.bf-ink{background:var(--ink);color:#fff}
.bf-ink:hover{background:#000;box-shadow:0 8px 20px -8px rgba(17,18,20,.5)}
.bf-line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ln2)}
.bf-line:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.bf-yellow{background:var(--y);color:var(--ink)}
.bf-yellow:hover{background:#FFDD33}

/* ---------------------------------------------------------------- hero */
.bf-hero{padding:48px 0 104px;overflow:clip}
.bf-hero-grid{display:grid;grid-template-columns:minmax(0,580px) minmax(0,1fr);gap:56px;align-items:center}
.bf-pill{display:inline-flex;align-items:center;gap:10px;min-height:34px;padding:6px 15px 6px 13px;border-radius:999px;background:var(--wh);box-shadow:inset 0 0 0 1px var(--ln);font:500 14px/1.2 var(--sans);color:var(--ink2)}
.bf-pill b{font-weight:600;color:var(--ink)}
.bf-dot{width:8px;height:8px;border-radius:50%;background:var(--y);box-shadow:0 0 0 3px rgba(255,212,0,.28);flex:none}
.bf-hero .bf-h1{font-size:var(--fs-d);line-height:1.04;letter-spacing:-.04em;font-weight:600;margin-top:22px}
.bf-hero .bf-h1.long{font-size:clamp(2.25rem,1.45rem + 2.7vw,3.5rem);line-height:1.06}
.bf-lede{font-size:var(--fs-lede);line-height:1.55;color:var(--ink2);margin-top:20px;max-width:31em;text-wrap:pretty}
.bf-offer{max-width:520px;margin-top:32px;background:var(--wh);border-radius:24px;padding:26px 26px 22px;box-shadow:0 0 0 1px var(--ln),0 1px 2px rgba(17,18,20,.04),0 24px 48px -28px rgba(17,18,20,.22)}
.bf-offer-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font:500 15px/1.3 var(--sans);color:var(--ink2)}
.bf-offer-top h3{font:600 17px/1.3 var(--sans);letter-spacing:-.01em;color:var(--ink)}
.bf-tag{background:var(--y);color:var(--ink);font:600 14px/1 var(--sans);padding:7px 10px;border-radius:8px;letter-spacing:-.01em;white-space:nowrap}
.bf-price-row{display:flex;align-items:flex-end;gap:16px;margin-top:12px}
.bf-price{font-size:clamp(46px,4.6vw,58px);font-weight:600;letter-spacing:-.04em;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.bf-was{display:flex;flex-direction:column;gap:2px;padding-bottom:8px;line-height:1.2}
.bf-was s{font-size:20px;font-weight:500;color:var(--ink3);text-decoration-thickness:1.5px}
.bf-was small{font-size:13.5px;color:var(--ink3)}
.bf-per{margin-top:6px;color:var(--ink2);font-size:16px}
.bf-offer .bf-btn{width:100%;margin-top:22px}
.bf-code{margin-top:14px;font-size:14px;line-height:1.45;color:var(--ink3);text-align:center}
.bf code{font:500 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--pa);box-shadow:inset 0 0 0 1px var(--ln);padding:3px 6px;border-radius:6px;color:var(--ink);white-space:nowrap}
.bf-offer-alt{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin-top:18px;padding-top:16px;border-top:1px solid var(--ln);font-size:15px;color:var(--ink2);text-decoration:none}
.bf-offer-alt b{font-weight:600;color:var(--ink)}
.bf-offer-alt .go{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--ink);white-space:nowrap}
.bf-offer-alt .go svg.i{width:16px;height:16px}
.bf-offer-alt:hover .go-t{text-decoration:underline;text-underline-offset:3px}
.bf-ends{margin-top:14px;font-size:14px;line-height:1.45;color:var(--ink3);text-align:center;text-wrap:balance}
.bf-ends svg.i{display:inline-block;width:15px;height:15px;margin-right:6px;vertical-align:-3px}
.bf-ends b{font-weight:500;color:var(--ink2)}
.bf-ends+.bf-code{margin-top:6px;text-wrap:balance}
.bf-state p{margin-top:20px;color:var(--ink2);font-size:var(--fs-lede);line-height:1.55;max-width:31em}
.bf-state .bf-btn{margin-top:26px}
.bf-hero-vis{position:relative;aspect-ratio:1/.86;width:100%;justify-self:end}
@media (min-width:1300px){.bf-hero-vis{width:calc(100% + 72px);margin-right:-72px}}
.bf-hero-vis::before{content:"";position:absolute;left:22%;top:4%;width:72%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(255,212,0,.42),rgba(255,212,0,.16) 55%,rgba(255,212,0,0));pointer-events:none}
.bf-hero-vis .bf-laptop{position:absolute;right:0;top:9%;width:96%;height:auto;filter:drop-shadow(0 34px 40px rgba(17,18,20,.16))}
.bf-hero-vis .bf-phone{position:absolute;left:1%;bottom:0;height:92%;width:auto;max-width:none;filter:drop-shadow(0 30px 34px rgba(17,18,20,.24))}
@media (max-width:1100px){
  .bf-hero{padding:36px 0 72px}
  .bf-hero-grid{grid-template-columns:minmax(0,1fr);gap:44px}
  .bf-hero-copy{max-width:600px}
  .bf-hero-vis{justify-self:center;max-width:600px;margin-right:0}
}
@media (max-width:640px){
  .bf-hero{padding-top:24px}
  .bf-hero .bf-h1{margin-top:18px;letter-spacing:-.035em}
  .bf-hero .bf-h1.long{font-size:2.125rem}
  .bf-lede{margin-top:14px}
  .bf-offer{margin-top:22px;padding:20px 18px 18px;border-radius:20px}
  .bf-price-row{margin-top:8px}
  .bf-offer .bf-btn{margin-top:18px}
  .bf-offer-alt{font-size:14.5px}
  .bf-offer-alt .go-t{display:none}
  .bf-offer-alt .go{width:44px;height:44px;border-radius:50%;justify-content:center;box-shadow:inset 0 0 0 1px var(--ln2);flex:none}
  .bf-state .bf-btn{width:100%}
}

/* ---------------------------------------------------------------- how it works */
.bf-demo{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(48px,8vw,120px);align-items:center}
.bf-steps{margin:40px 0 0;display:grid;gap:6px;max-width:520px}
.bf-step{display:grid;grid-template-columns:36px 1fr;column-gap:16px;width:100%;padding:18px 20px;border:0;border-radius:18px;background:transparent;text-align:left;font:inherit;color:inherit;cursor:pointer;transition:background-color .2s}
.bf-step:hover{background:rgba(17,18,20,.03)}
.bf-step .n{width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--ln2);display:grid;place-items:center;font:600 14px/1 var(--sans);color:var(--ink3);transition:all .2s;margin-top:-2px}
.bf-step .h{font-size:19px;line-height:1.35;font-weight:600;letter-spacing:-.015em;color:var(--ink3);transition:color .2s}
.bf-step .p{grid-column:2;margin-top:4px;font-size:16px;line-height:1.5;color:var(--ink3)}
.bf-step .bar{grid-column:2;height:2px;border-radius:2px;background:var(--ln);margin-top:14px;overflow:hidden;opacity:0}
.bf-step .bar i{display:block;height:100%;background:var(--ink);transform-origin:left;transform:scaleX(0)}
.bf-step.on{background:var(--pa)}
.bf-step.on .n{background:var(--ink);color:#fff;box-shadow:none}
.bf-step.on .h{color:var(--ink)}
.bf-step.on .p{color:var(--ink2)}
.bf-step.on .bar{opacity:1}
.bf-step.on .bar i{animation:bf-fill var(--d,4s) linear forwards}
.paused .bf-step.on .bar i{animation-play-state:paused}
@keyframes bf-fill{to{transform:scaleX(1)}}
.bf-demo-vis{display:flex;justify-content:center;padding-right:clamp(0px,3vw,40px)}
@media (max-width:900px){
  .bf-demo{grid-template-columns:minmax(0,1fr);gap:36px}
  .bf-demo-copy{display:contents}
  .bf-demo-copy .bf-head{order:1}
  .bf-demo-vis{order:2;padding:0}
  .bf-steps{order:3;margin-top:0;max-width:none}
  .bf-step{padding:14px}
  .bf-step:not(.on) .p{display:none}
}

/* the phone: a CSS frame round real screens and one rebuilt editor screen.
   Editor sizes are in cqw so it scales with the frame. */
.bf-dev{width:320px;padding:10px;border-radius:54px;background:#0F1012;box-shadow:inset 0 0 0 1.5px #3B3D42,0 0 0 1px #CFCAC0,0 50px 80px -40px rgba(17,18,20,.45),0 18px 40px -22px rgba(17,18,20,.3)}
@media (max-width:900px){.bf-dev{width:min(290px,78vw)}}
.bf-dev-scr{position:relative;aspect-ratio:720/1561;border-radius:44px;overflow:hidden;background:#fff;container-type:inline-size;isolation:isolate}
.bf-island{position:absolute;top:2.6cqw;left:50%;transform:translateX(-50%);width:27cqw;height:7.8cqw;border-radius:5cqw;background:#000;z-index:9}
.bf-scr{position:absolute;inset:0;opacity:0;transition:opacity .45s ease}
.bf-scr.on{opacity:1}
.bf-scr>img{width:100%;height:auto}
.bf-ed{background:#fff;color:#16171A;font-family:var(--sans)}
.bf-ed svg.i{stroke-width:2}
.ed-status{position:absolute;top:0;left:0;right:0;height:12cqw;display:flex;align-items:center;justify-content:space-between;padding:1cqw 7cqw 0 10cqw;font:600 4.2cqw/1 var(--sans)}
.ed-sys{display:flex;gap:1.4cqw;align-items:center}
.ed-sys i{display:block;background:#16171A}
.ed-sys i:nth-child(1){width:4.2cqw;height:2.6cqw;border-radius:.6cqw}
.ed-sys i:nth-child(2){width:3.4cqw;height:2.6cqw;border-radius:50% 50% .4cqw .4cqw}
.ed-sys i:nth-child(3){width:6.4cqw;height:3cqw;border-radius:1cqw}
.ed-top{position:absolute;top:14cqw;left:3.5cqw;right:3.5cqw;height:10.5cqw;display:flex;align-items:center;gap:2cqw}
.ed-ib{width:10.5cqw;height:10.5cqw;border-radius:50%;box-shadow:inset 0 0 0 .3cqw #E6E6EA;display:grid;place-items:center;flex:none}
.ed-ib svg.i{width:4.8cqw;height:4.8cqw}
.ed-title{display:flex;align-items:center;gap:1cqw;font:600 3.9cqw/1 var(--sans);margin-left:1cqw;white-space:nowrap}
.ed-title svg.i{width:3.6cqw;height:3.6cqw;color:#8A8D93}
.ed-push{margin-left:auto}
.ed-exp{height:10.5cqw;padding:0 4cqw;border-radius:6cqw;background:#111214;color:#fff;font:600 3.6cqw/10.5cqw var(--sans);white-space:nowrap;flex:none}
.ed-video{position:absolute;top:27.5cqw;left:3.5cqw;right:3.5cqw;height:117cqw;border-radius:5cqw;background:#1C1D20;overflow:hidden;display:flex;justify-content:center}
.ed-video img{height:100%;width:auto;max-width:none}
.ed-cap{position:absolute;left:4cqw;right:4cqw;bottom:16cqw;text-align:center;font:800 6.4cqw/1.2 var(--cap);color:#fff;text-shadow:0 .4cqw 1.8cqw rgba(0,0,0,.6),0 0 .6cqw rgba(0,0,0,.45);letter-spacing:-.01em}
.ed-cap .w{opacity:0;transition:opacity .12s}
.ed-cap .w.v{opacity:1}
.ed-cap .w.a{color:#FFD400}
.ed-ctrl{position:absolute;top:148.5cqw;left:5cqw;right:5cqw;height:10.5cqw;display:flex;align-items:center;justify-content:space-between;font:500 3.3cqw/1 var(--sans);color:#3A3C40;font-variant-numeric:tabular-nums}
.ed-play{position:absolute;left:50%;top:0;transform:translateX(-50%);width:10.5cqw;height:10.5cqw;border-radius:50%;background:#111214;display:grid;place-items:center;color:#fff}
.ed-play svg.i{width:4cqw;height:4cqw;fill:#fff;stroke:none;margin-left:.6cqw}
.ed-ctrl>svg.i{width:4.6cqw;height:4.6cqw;color:#55585E}
.ed-tl{position:absolute;top:161cqw;left:0;right:0;height:30cqw;overflow:hidden}
.ed-rail{position:absolute;left:0;top:0;height:100%;will-change:transform}
.ed-rail .tick{position:absolute;top:0;font:500 2.9cqw/1 var(--sans);color:#6B6F75;transform:translateX(-50%)}
.ed-rail .wave{position:absolute;top:6cqw;left:0;height:10cqw;border-radius:2.4cqw;background:#16171A;overflow:hidden}
.ed-rail .wave svg{width:100%;height:100%;display:block;fill:#8E9197}
.ed-rail .chip{position:absolute;top:18.5cqw;height:9cqw;border-radius:2.4cqw;background:#FFC72C;color:#1A1A1A;font:600 3.1cqw/9cqw var(--sans);padding:0 1.8cqw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:box-shadow .15s}
.ed-rail .chip.on{box-shadow:inset 0 0 0 .55cqw #111214}
.ed-head{position:absolute;left:50%;top:3.5cqw;bottom:1cqw;width:.6cqw;margin-left:-.3cqw;background:#FFD400;border-radius:.3cqw}
.ed-head::before{content:"";position:absolute;left:50%;top:-1.2cqw;width:3.2cqw;height:3.2cqw;margin-left:-1.6cqw;border-radius:50%;background:#FFD400}
.ed-tools{position:absolute;top:194cqw;left:3.5cqw;right:3.5cqw;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1.6cqw}
.ed-tools .ed-tool{height:15.5cqw;border-radius:4cqw;box-shadow:inset 0 0 0 .3cqw #E6E6EA;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.3cqw;font:500 2.5cqw/1 var(--sans);color:#26282C;min-width:0}
.ed-tools .ed-tool span{max-width:100%;overflow:hidden;text-overflow:clip;white-space:nowrap;padding:0 .4cqw;line-height:1.4}
.ed-tools svg.i{width:5.2cqw;height:5.2cqw;stroke-width:1.8}
.ed-home{position:absolute;bottom:1.6cqw;left:50%;width:34cqw;height:1.2cqw;margin-left:-17cqw;border-radius:1cqw;background:#111214}

/* ---------------------------------------------------------------- what you get */
.bf-facts{display:grid;grid-template-columns:repeat(4,1fr);margin-top:52px;background:var(--wh);border-radius:24px;box-shadow:0 0 0 1px var(--ln)}
.bf-fact{padding:26px 28px}
.bf-fact+.bf-fact{border-left:1px solid var(--ln)}
.bf-fact b{display:block;font-size:clamp(32px,3.2vw,44px);font-weight:500;letter-spacing:-.035em;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.bf-fact span{display:block;margin-top:8px;font-size:15px;color:var(--ink2)}
.bf-rows{margin-top:clamp(72px,9vw,112px);display:grid;gap:clamp(80px,9vw,120px)}
.bf-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,104px);align-items:center}
.bf-row.flip .bf-row-vis{order:2}
.bf-row-vis{display:flex;justify-content:center;position:relative;min-width:0}
.bf-row>*{min-width:0}
.bf-row-phone::before{content:"";position:absolute;left:50%;top:50%;width:min(440px,90%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(255,212,0,.30),rgba(255,212,0,.10) 55%,rgba(255,212,0,0));pointer-events:none}
.bf-row-phone img{position:relative;width:min(272px,70vw);filter:drop-shadow(0 30px 34px rgba(17,18,20,.18))}
.bf-row h3{font-size:clamp(26px,2.4vw,32px);font-weight:600;letter-spacing:-.03em;line-height:1.15}
.bf-intro{margin-top:10px;font-size:18px;color:var(--ink2)}
.bf-feats{margin-top:26px}
.bf-feats li{padding:16px 0;border-top:1px solid var(--ln2)}
.bf-feats li:last-child{border-bottom:1px solid var(--ln2)}
.bf-feats b{display:block;font-size:17px;font-weight:600;letter-spacing:-.01em}
.bf-feats span{display:block;margin-top:3px;font-size:15.5px;line-height:1.5;color:var(--ink2)}
/* the styles sheet: drawn like the app's own style panel (a white sheet,
   a dark preview, chips), playing the real renders from the Titro engine */
.bf-sheet{width:min(520px,100%);min-width:0;background:var(--wh);border-radius:28px;padding:12px 14px 18px;box-shadow:0 0 0 1px var(--ln),0 40px 70px -44px rgba(17,18,20,.4)}
.bf-grab{display:block;width:38px;height:4px;border-radius:4px;background:var(--ln2);margin:2px auto 0}
.bf-sheet-h{margin:12px 0 12px;text-align:center;font:600 15px/1.2 var(--sans)}
.bf-player{border-radius:16px;overflow:hidden;background:#151719;aspect-ratio:720/280}
.bf-player video{width:100%;height:100%;object-fit:contain}
.bf-tabs{display:flex;gap:8px;margin:14px -14px 0;padding:0 14px 2px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:14px}
@media (min-width:901px){.bf-tabs{flex-wrap:wrap;justify-content:center;overflow:visible;margin:14px 0 0;padding:0}.bf-tabs .bf-tab{margin:0}}
.bf-tabs::-webkit-scrollbar{display:none}
.bf-tab{flex:none;height:44px;padding:0 17px;border-radius:999px;border:0;background:var(--pa);color:var(--ink2);font:500 15px/1 var(--sans);cursor:pointer;scroll-snap-align:start;transition:background-color .15s,color .15s}
.bf-tab:hover{background:var(--pa2);color:var(--ink)}
.bf-tab[aria-selected="true"]{background:var(--ink);color:#fff}
.bf-sheet-note{margin-top:12px;text-align:center;font-size:13.5px;color:var(--ink3)}
.bf-tab:first-child{margin-left:auto}.bf-tab:last-child{margin-right:auto}
@media (max-width:900px){
  .bf-facts{grid-template-columns:repeat(2,1fr);margin-top:36px}
  .bf-fact{padding:20px}
  .bf-fact:nth-child(3){border-left:0}
  .bf-fact:nth-child(n+3){border-top:1px solid var(--ln)}
  .bf-rows{gap:64px;margin-top:64px}
  .bf-row,.bf-row.flip{grid-template-columns:minmax(0,1fr);gap:28px}
  .bf-row.flip .bf-row-vis{order:0}
  .bf-row:has(.bf-row-phone){grid-template-columns:112px 1fr;grid-template-rows:auto auto 1fr;column-gap:20px;row-gap:0;align-items:start}
  .bf-row:has(.bf-row-phone) .bf-row-copy{display:contents}
  .bf-row:has(.bf-row-phone) .bf-row-vis{grid-column:1;grid-row:1/4}
  .bf-row-phone::before{display:none}
  .bf-row-phone img{width:112px}
  .bf-row:has(.bf-row-phone) h3{grid-column:2;align-self:end;padding-top:20px}
  .bf-row:has(.bf-row-phone) .bf-intro{grid-column:2;font-size:16px}
  .bf-row:has(.bf-row-phone) .bf-feats{grid-column:1/-1;margin-top:24px}
  .bf-intro{font-size:16.5px}
}

/* ---------------------------------------------------------------- languages */
.bf-lang{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);gap:clamp(48px,8vw,120px);align-items:center}
.bf-ticks{margin-top:30px;display:grid;gap:14px;max-width:34em}
.bf-ticks li{display:grid;grid-template-columns:24px 1fr;gap:12px;font-size:17px;line-height:1.5;color:var(--ink2)}
.bf-ticks svg.i{margin-top:3px;color:var(--ink);stroke-width:2.2}
.bf-lang-card{position:relative;border-radius:28px;overflow:hidden;background:#D9D6CF;box-shadow:0 40px 70px -40px rgba(17,18,20,.45),0 0 0 1px rgba(17,18,20,.06)}
.bf-lang-card img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 10%}
.bf-route{position:absolute;top:16px;left:16px;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:rgba(17,18,20,.74);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:500 14px/1 var(--sans)}
.bf-route svg.i{width:15px;height:15px}
.bf-route.same svg.i,.bf-route.same #bf-lto{display:none}
.bf-lang-cap{position:absolute;left:7%;right:7%;bottom:13%;text-align:center;font:800 clamp(19px,2vw,25px)/1.22 var(--cap);color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.6),0 0 3px rgba(0,0,0,.4);transition:opacity .2s ease}
.bf-lang-cap em{font-style:normal;color:#FFD400}
.bf-lang-cap.fade{opacity:0}
.bf-seg{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px;justify-content:center}
.bf-seg button{height:44px;padding:0 13px;border-radius:999px;border:0;background:var(--pa);box-shadow:inset 0 0 0 1px var(--ln);font:500 14.5px/1 var(--sans);color:var(--ink2);cursor:pointer;white-space:nowrap}
.bf-seg button:hover{box-shadow:inset 0 0 0 1px var(--ink3)}
.bf-seg button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}
@media (max-width:900px){.bf-lang{grid-template-columns:minmax(0,1fr)}.bf-lang-vis{max-width:420px;width:100%;margin:0 auto}}
@media (max-width:640px){.bf-seg{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin:16px -16px 0;padding:0 16px 2px;scrollbar-width:none}.bf-seg::-webkit-scrollbar{display:none}.bf-seg button{flex:none}}

/* ---------------------------------------------------------------- use cases */
.bf-uc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.bf-uc{background:var(--wh);border-radius:22px;padding:10px 10px 24px;box-shadow:0 0 0 1px var(--ln)}
.bf-uc h3{font-size:19px;font-weight:600;letter-spacing:-.015em;margin:20px 14px 0;line-height:1.3}
.bf-uc p{margin:6px 14px 0;font-size:15.5px;line-height:1.5;color:var(--ink2)}
.bf-uc-mini{position:relative;aspect-ratio:16/10;border-radius:15px;background:var(--pa2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:18px;overflow:hidden;text-align:center}
.bf-uc-mini .cap{margin:0;font:800 23px/1.25 var(--cap);color:var(--ink);letter-spacing:-.01em}
.bf-uc-mini .cap.up{text-transform:uppercase;font-size:25px;line-height:1.2}
.bf-uc-mini em{font-style:normal;background:var(--y);color:var(--ink);padding:0 .2em;border-radius:.22em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.bf-uc-mini .cap b{background:var(--ink);color:#fff;padding:0 .22em;border-radius:.18em;font-weight:800}
.bf-uc-mini .wavebars{display:flex;align-items:center;gap:4px;height:34px}
.bf-uc-mini .wavebars i{display:block;width:4px;border-radius:2px;background:var(--ink)}
.bf-uc-mini .wavebars i:nth-child(4n+2){background:#E8B800}
.bf-uc-mini .spk{display:flex;flex-direction:column;gap:9px;align-items:flex-start;width:100%;max-width:300px;text-align:left}
.bf-uc-mini .spk div{font:800 17px/1.3 var(--cap);color:var(--ink)}
.bf-uc-mini .spk em{font:600 12.5px/1 var(--sans);display:inline-block;padding:5px 8px;border-radius:6px;margin-right:8px;vertical-align:2px}
.bf-uc-mini .spk em.c0{background:#5ED3E6}
.bf-uc-mini .tline{width:100%;max-width:300px}
.bf-uc-mini .trk{height:10px;border-radius:5px;background:#D6D1C6;position:relative;overflow:hidden}
.bf-uc-mini .trk::after{content:"";position:absolute;left:0;top:0;bottom:0;width:38%;background:var(--ink);border-radius:5px}
.bf-uc-mini .lbl{display:flex;justify-content:space-between;margin-top:8px;font:500 12.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink3);font-variant-numeric:tabular-nums}
.bf-uc-mini .trans{width:100%;max-width:310px;display:grid;gap:8px;text-align:left}
.bf-uc-mini .trans div{display:grid;grid-template-columns:44px 1fr;gap:10px;font:400 14px/1.4 var(--sans);color:var(--ink2)}
.bf-uc-mini .trans span{font:500 12px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink3)}
.bf-uc-mini .trans .cur{color:var(--ink);font-weight:500}
.bf-uc-mini .trans .cur span{color:var(--ink)}
.bf-uc-mini .trans .cur{background:linear-gradient(var(--y),var(--y)) no-repeat 54px 50%/calc(100% - 54px) 100%;border-radius:4px}
.bf-uc-more{margin-top:28px;text-align:center;font-size:16px;color:var(--ink2)}
@media (max-width:980px){.bf-uc-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){
  .bf-uc-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:36px -16px 0;padding:2px 16px 8px;scrollbar-width:none}
  .bf-uc-grid::-webkit-scrollbar{display:none}
  .bf-uc{flex:0 0 82%;scroll-snap-align:center}
  .bf-uc-more{text-align:left}
}

/* ---------------------------------------------------------------- AI voice (coming) */
.bf-voice{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:clamp(40px,7vw,96px);align-items:center}
.bf-soon{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 13px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--ln2);font:500 14px/1 var(--sans);color:var(--ink2);margin-bottom:20px}
.bf-soon i{width:7px;height:7px;border-radius:50%;background:var(--ink3)}
.bf-more{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:16px;font:500 16px/1 var(--sans);color:var(--ink);text-decoration:none}
.bf-more span,.bf-more{border-bottom:0}
.bf-more:hover{text-decoration:underline;text-underline-offset:4px}
.bf-more svg.i{width:16px;height:16px}
.bf-vcard{background:var(--wh);border-radius:24px;padding:22px;box-shadow:0 0 0 1px var(--ln),0 30px 60px -40px rgba(17,18,20,.3)}
.bf-vcard-h{display:flex;align-items:center;justify-content:space-between;gap:12px;font:600 15px/1.2 var(--sans)}
.bf-vcard-h span{font:500 13.5px/1 var(--sans);color:var(--ink3);display:flex;gap:8px;align-items:center;white-space:nowrap}
.bf-vcard-h span i{width:7px;height:7px;border-radius:50%;background:var(--ln2)}
.bf-vtext{margin-top:16px;padding:16px 18px;border-radius:14px;background:var(--pa);font-size:16.5px;line-height:1.55;color:var(--ink2)}
.bf-vrow{display:flex;align-items:center;gap:14px;margin-top:16px}
.bf-vplay{width:44px;height:44px;border-radius:50%;background:var(--ink);display:grid;place-items:center;color:#fff;flex:none;opacity:.9}
.bf-vplay svg.i{width:16px;height:16px;fill:#fff;stroke:none;margin-left:2px}
.bf-vwave{flex:1;display:flex;align-items:center;gap:3px;height:40px;overflow:hidden}
.bf-vwave i{flex:1;min-width:2px;border-radius:2px;background:var(--ink);opacity:.18;height:var(--h);animation:bf-vw 2.4s ease-in-out infinite;animation-delay:var(--dl)}
@keyframes bf-vw{0%,100%{opacity:.16}50%{opacity:.5}}
.bf-vtime{font:500 13px/1 var(--sans);color:var(--ink3);font-variant-numeric:tabular-nums}
.bf-vbtn{display:flex;align-items:center;justify-content:center;margin-top:16px;height:46px;border-radius:12px;background:var(--pa);box-shadow:inset 0 0 0 1px var(--ln);font:500 15px/1 var(--sans);color:var(--ink3);cursor:not-allowed}
@media (max-width:900px){.bf-voice{grid-template-columns:minmax(0,1fr)}}

/* ---------------------------------------------------------------- trust */
.bf-trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.bf-tcard{background:var(--wh);border-radius:22px;padding:28px;box-shadow:0 0 0 1px var(--ln)}
.bf-tcard .ic{width:48px;height:48px;border-radius:14px;background:var(--pa);box-shadow:inset 0 0 0 1px var(--ln);display:grid;place-items:center;color:var(--ink)}
.bf-tcard .ic svg.i{width:22px;height:22px}
.bf-tcard h3{margin-top:22px;font-size:20px;font-weight:600;letter-spacing:-.02em;line-height:1.3}
.bf-tcard p{margin-top:8px;font-size:16px;line-height:1.55;color:var(--ink2)}
.bf-paybar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin-top:20px;padding:20px 28px;border-radius:22px;background:var(--wh);box-shadow:0 0 0 1px var(--ln)}
.bf-paybar p{font-size:15px;color:var(--ink2)}
.bf-paybar a,.bf-faq-side a{color:var(--ink);font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ln2)}
.bf-paylogos{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.bf-paylogos li{height:36px;padding:0 12px;border-radius:9px;background:var(--wh);box-shadow:inset 0 0 0 1px var(--ln);display:flex;align-items:center}
.bf-paylogos img{height:20px;width:auto}
.bf-paylogos .gp img{height:16px}
.bf-trust-cta{display:flex;justify-content:center;margin-top:40px}
@media (max-width:900px){
  .bf-trust-grid{grid-template-columns:1fr;gap:10px;margin-top:36px}
  .bf-tcard{display:grid;grid-template-columns:44px 1fr;column-gap:16px;padding:20px}
  .bf-tcard .ic{width:44px;height:44px;grid-row:1/3}
  .bf-tcard h3{margin-top:0;font-size:18px;align-self:center}
  .bf-tcard p{margin-top:4px;font-size:15.5px}
  .bf-paybar{padding:20px}
  .bf-trust-cta .bf-btn{width:100%}
}

/* ---------------------------------------------------------------- FAQ */
.bf-faq{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:clamp(40px,7vw,96px);align-items:start}
.bf-faq-side p{margin-top:16px;color:var(--ink2);font-size:17px}
.bf-qa{border-top:1px solid var(--ln2)}
.bf-qa:last-child{border-bottom:1px solid var(--ln2)}
.bf-qa summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;padding:20px 0;cursor:pointer;font:600 18px/1.4 var(--sans);letter-spacing:-.012em}
.bf-qa summary::-webkit-details-marker{display:none}
.bf-qa .pm{width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--ln2);display:grid;place-items:center;flex:none;transition:transform .2s,background-color .2s}
.bf-qa .pm svg.i{width:14px;height:14px;stroke-width:2.2}
.bf-qa[open] .pm{transform:rotate(45deg);background:var(--ink);color:#fff;box-shadow:none}
.bf-qa .ans{padding:0 48px 24px 0;font-size:16.5px;line-height:1.6;color:var(--ink2)}
@media (max-width:900px){.bf-faq{grid-template-columns:minmax(0,1fr)}.bf-qa summary{font-size:17px;padding:16px 0}.bf-qa .ans{padding-right:0}}

/* ---------------------------------------------------------------- final: plan cards */
.bf-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:880px;margin:48px auto 0}
.bf-plan{display:flex;flex-direction:column;background:var(--wh);border-radius:24px;padding:26px 26px 22px;box-shadow:0 0 0 1px var(--ln),0 24px 48px -32px rgba(17,18,20,.2)}
.bf-plan.main{box-shadow:0 0 0 2px var(--ink),0 24px 48px -28px rgba(17,18,20,.28)}
.bf-plan-facts{margin-top:14px;padding-top:14px;border-top:1px solid var(--ln);font-size:15px;color:var(--ink2)}
.bf-plan .bf-btn{width:100%;margin-top:auto}
.bf-plan .bf-plan-facts{margin-bottom:22px}
.bf-renew{margin-top:12px;font-size:14px;color:var(--ink3);text-align:center}
.bf-final-alt{margin-top:28px;text-align:center;font-size:16px;color:var(--ink2)}
.bf-final-alt a{color:var(--ink);font-weight:500;text-decoration:underline;text-underline-offset:3px}
.bf-fine{max-width:640px;margin:28px auto 0;padding-top:22px;border-top:1px solid var(--ln2);text-align:center;font-size:13.5px;line-height:1.55;color:var(--ink3)}
.bf-final .bf-head .bf-btn{margin-top:28px}
@media (max-width:760px){.bf-plans{grid-template-columns:1fr;gap:14px;margin-top:36px}.bf-plan{padding:20px 18px 18px;border-radius:20px}}

/* ---------------------------------------------------------------- phone buy bar */
.bf-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;display:none;align-items:center;gap:12px;padding:10px 10px 10px 16px;border-radius:18px;background:#111214;color:#fff;box-shadow:0 18px 40px -12px rgba(0,0,0,.45);transform:translateY(calc(100% + 30px));transition:transform .3s cubic-bezier(.2,.8,.2,1);visibility:hidden;font-family:Geist,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.bf-bar.on{transform:none;visibility:visible}
.bf-bar-p{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.bf-bar-p b{font-size:18px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.bf-bar-p span{font-size:13px;line-height:1.3;color:#C9CCD2;text-wrap:balance}
.bf-bar .bf-btn{margin-left:auto;height:48px;padding:0 18px;font-size:16px;border-radius:12px;flex:none}
@media (max-width:760px){.bf-bar{display:flex}}

@media (prefers-reduced-motion:reduce){
  .bf *{scroll-behavior:auto!important}
  .bf-vwave i{animation:none}
  .bf-step.on .bar i{animation:none;transform:scaleX(1)}
  .bf-scr,.bf-lang-cap,.bf-bar{transition:none}
}

/* ---------------------------------------------------------------- 2026-11-08 landing rebuild
   Free signup first, features, normal pricing, the offer at the bottom.
   Wider frame (1320) but still contained. */
.bf-wrap{max-width:1320px}
.lp-hero{padding:40px 0 88px}
.lp-hero-grid{display:grid;grid-template-columns:minmax(0,620px) minmax(0,1fr);gap:64px;align-items:center}
.lp-hero-copy{min-width:0}
a.bf-pill{text-decoration:none;color:var(--ink2)}
a.bf-pill:hover{box-shadow:inset 0 0 0 1px var(--ink2)}
.lp-h1{font-size:clamp(36px,4.6vw,60px);line-height:1.04;letter-spacing:-.035em;font-weight:600;margin:20px 0 0;max-width:none;text-align:left;color:var(--ink);text-wrap:balance}
.lp-lede{max-width:34em}
.lp-form{margin-top:28px;background:var(--wh);border-radius:20px;box-shadow:0 1px 0 rgba(17,18,20,.04),0 12px 32px -12px rgba(17,18,20,.16),inset 0 0 0 1px var(--ln);padding:22px 22px 18px}
.lp-form-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:14px}
.lp-form-h b{font:600 18px/1.3 var(--sans);color:var(--ink)}
.lp-form-h span{font:400 15px/1.4 var(--sans);color:var(--ink2)}
.lp-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lp-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.lp-f span{font:500 13px/1 var(--sans);color:var(--ink2)}
.lp-f input{height:50px;border-radius:12px;border:1px solid var(--ln);background:#fff;padding:0 14px;font:400 16px/1 var(--sans);color:var(--ink);min-width:0}
.lp-f input:focus{outline:2px solid #111214;outline-offset:1px;border-color:transparent}
.lp-go{grid-column:1/-1;width:100%;margin-top:4px}
.lp-opt{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font:400 14px/1.45 var(--sans);color:var(--ink2)}
.lp-opt input{margin-top:3px;width:16px;height:16px;flex:none}
.lp-fine{grid-column:1/-1;margin:0;font:400 13px/1.5 var(--sans);color:#5C5F66}
.lp-fine a{color:var(--ink);text-underline-offset:2px}
.lp-msg{font:500 14px/1.4 var(--sans);color:#B42318;margin:0 0 8px}
.lp-msg:empty{display:none}
.lp-done{display:flex;flex-direction:column;gap:8px}
.lp-done b{font:600 18px/1.3 var(--sans);color:var(--ink)}
.lp-done p{margin:0;font:400 15px/1.5 var(--sans);color:var(--ink2)}
.lp-resend{align-self:flex-start;height:40px;padding:0 16px;border-radius:10px;border:1px solid var(--ln);background:#fff;font:500 14px/1 var(--sans);cursor:pointer;color:var(--ink)}
.lp-new{background:#E8F5EC;color:#1B6B3A}
.lp-new i{background:#1B8F4A}
.lp-ready{color:#1B6B3A}
.lp-ready i{background:#1B8F4A}
.lp-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:48px auto 0;max-width:1120px}
.lp-plan{background:var(--wh);border-radius:20px;box-shadow:inset 0 0 0 1px var(--ln);padding:28px 26px;display:flex;flex-direction:column;gap:10px;min-width:0}
.lp-plan.main{box-shadow:inset 0 0 0 2px #111214}
.lp-plan h3{margin:0;font:600 20px/1.2 var(--sans);color:var(--ink)}
.lp-amt{margin:6px 0 0;display:flex;align-items:baseline;gap:4px}
.lp-amt b{font:600 40px/1 var(--sans);letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.lp-amt span{font:400 16px/1 var(--sans);color:var(--ink2)}
.lp-yr{margin:0;font:400 15px/1.4 var(--sans);color:var(--ink2);min-height:1.4em}
.lp-plan ul{list-style:none;margin:8px 0 6px;padding:0;display:flex;flex-direction:column;gap:9px;flex:1}
.lp-plan li{position:relative;padding-left:26px;font:400 15px/1.45 var(--sans);color:var(--ink)}
.lp-plan li::before{content:"";position:absolute;left:2px;top:6px;width:12px;height:7px;border-left:2px solid #111214;border-bottom:2px solid #111214;transform:rotate(-45deg)}
.lp-plan .bf-btn{width:100%;margin-top:10px}
.lp-eyebrow{margin:0 0 10px;font:600 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.bf-fine.center{text-align:center;margin-top:24px}
@media (max-width:980px){.lp-hero-grid{grid-template-columns:minmax(0,1fr);gap:44px}.lp-plans{grid-template-columns:minmax(0,1fr);max-width:520px}}
@media (max-width:640px){.lp-hero{padding:20px 0 56px}.lp-fields{grid-template-columns:minmax(0,1fr)}.lp-form{padding:18px 16px 16px}.lp-h1{font-size:clamp(32px,9vw,40px)}}