/* blezd.ai — landing page styles. Fonts are self-hosted (no Google Fonts). */
@font-face { font-family:'Inter'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('assets/inter-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Inter'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('assets/inter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
html { background:#FFFFFF; scroll-behavior:smooth; }
html[data-blz-theme="dark"], html[data-blz-theme="dark"] body { background:#000000; }
body { margin:0; background:inherit; }
/* Light/dark switch cross-fades instead of flipping. */
.blz :where(header, section, footer, div, p, span, h1, h2, h3, a, button, ul, li, details, summary, figure, figcaption, strong, input) {
  transition: background-color .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease;
}
body{margin:0}
a{color:inherit}a:hover{color:inherit}
.blz{font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",system-ui,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;font-synthesis:none}
.blz button,.blz input,.blz textarea{font:inherit}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hdr{position:relative;z-index:30;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:24px}
.hdr-nav{justify-self:center}
.hdr-ctrl{justify-self:end}
.hdr-nav a{text-decoration:none}
.hdr-nav a:hover{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.blz-ico{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.blz-fill{fill:currentColor;stroke:none}
.blz-ico-bold{fill:none;stroke:currentColor;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}
.blz-arrow{transition:transform .2s ease}
.blz-cta:hover .blz-arrow{transform:translateX(4px)}
[dir=rtl] .blz-arrow{transform:scaleX(-1)}
[dir=rtl] .blz-cta:hover .blz-arrow{transform:scaleX(-1) translateX(4px)}
.blz-link{text-decoration:none}
.blz-link:hover{text-decoration:underline;text-underline-offset:5px}
section[id]{scroll-margin-top:88px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.span2{grid-column:span 2}
.mk{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,280px) minmax(0,1fr);align-items:center}
.mk-mid{display:flex;align-items:center}
.mk-line{flex:1 1 auto;height:2px;min-width:24px}
.talk{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:40px}
.talk-mid{display:flex;flex-direction:column;align-items:center;gap:12px;width:240px}
.talk-arrow-d{display:none}
.phone{position:relative;width:320px;max-width:100%;aspect-ratio:320/694}
.phone-screen{position:absolute;inset:0;box-sizing:border-box;border-radius:50px;overflow:hidden}
.wv{animation:blzwave 1.1s ease-in-out infinite;transform-origin:center}
@keyframes blzwave{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.faq summary{list-style:none;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq details[open] .faq-chev{transform:rotate(180deg)}
.faq-chev{transition:transform .2s ease}
.mbar{display:none}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #B19062;outline-offset:3px}
@media (max-width:900px){
.g3,.bento{grid-template-columns:1fr}
.span2{grid-column:auto}
.mk{grid-template-columns:1fr}
.mk-mid{flex-direction:column}
.mk-line{width:2px;height:36px;flex:0 0 36px;min-width:0}
.talk{grid-template-columns:1fr;gap:28px}
.talk-mid{flex-direction:column;justify-self:center}
.talk-arrow-r{display:none}
.talk-arrow-d{display:block;text-align:center}
}
@media (max-width:720px){
.hdr{position:relative;grid-template-columns:auto 1fr;row-gap:4px}
.hdr-nav{grid-row:2;grid-column:1 / -1;justify-self:center}
.hdr-cta{display:none !important}
.mbar{display:flex}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;scroll-behavior:auto !important}}

/* ── Hero: fills the screen, headline scales up to 27" and beyond ───────────── */
.blz-hero { position:relative; min-height:100vh; min-height:100svh; }
/* v26: day picture in white mode, night picture in black mode.
   The text stands on a clean sky: a deep blue gradient fills the top of the hero, and the day picture
   (::before) fades in below the text (mask), so clouds, hills and the two characters start under it.
   The night picture (::after) lies on top and fades in and out with the light/dark switch; it brings
   its own dark base colour, so the blue never jumps away during the fade. Both pictures have the same
   geometry and keep the characters at the same height on any screen shape (background-position 54%).
   !important: the hero's inline background shorthand would otherwise paint over all of this. */
.blz-hero { isolation:isolate; background-color:#2B74CF !important;
  background-image:linear-gradient(180deg, #2B74CF 0%, #3A85DD 32%, #5DA6EF 48%, #8EC6FA 62%) !important;
  padding-top:calc(var(--hdr-h, 80px) + clamp(48px, 7vh, 130px)) !important; }
.blz-hero::before, .blz-hero::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-repeat:no-repeat; background-position:50% 54%; background-size:cover; }
.blz-hero::before { background-image:url('/assets/hero-day-2560.webp');
  -webkit-mask-image:linear-gradient(180deg, transparent 36%, #000 58%); mask-image:linear-gradient(180deg, transparent 36%, #000 58%); }
.blz-hero::after { opacity:0; background-color:#071430; transition:opacity .9s cubic-bezier(.4,0,.2,1); }
html[data-blz-theme="dark"] .blz-hero::after { opacity:1; }
/* Each mode loads only its own picture first. The other one follows once the page has loaded
   (landing.js sets .blz-hero-both), so the first switch already fades to a loaded picture. */
html[data-blz-theme="dark"] .blz-hero::after, html.blz-hero-both .blz-hero::after { background-image:url('/assets/hero-night-2560.webp'); }
html[data-blz-theme="dark"]:not(.blz-hero-both) .blz-hero::before { background-image:none; }
/* standard-resolution screens up to 1600 px: the lighter files are sharp enough */
@media (max-width:1600px) and (max-resolution:1.49dppx) {
  .blz-hero::before { background-image:url('/assets/hero-day-1600.webp'); }
  html[data-blz-theme="dark"] .blz-hero::after, html.blz-hero-both .blz-hero::after { background-image:url('/assets/hero-night-1600.webp'); }
  html[data-blz-theme="dark"]:not(.blz-hero-both) .blz-hero::before { background-image:none; }
}
/* phones and tablets in portrait: a tall cut of each picture (sky extended upwards), the two characters at the bottom */
@media (max-width:900px) {
  .blz-hero::before { background-image:url('/assets/hero-day-portrait.webp'); }
  html[data-blz-theme="dark"] .blz-hero::after, html.blz-hero-both .blz-hero::after { background-image:url('/assets/hero-night-portrait.webp'); }
  html[data-blz-theme="dark"]:not(.blz-hero-both) .blz-hero::before { background-image:none; }
}
/* the reduced-motion rule above uses *, which does not reach pseudo-elements */
@media (prefers-reduced-motion:reduce) { .blz-hero::after { transition:none; } }
/* the top bar lies on the hero, transparent */
.blz-hdr-over { position:absolute !important; top:0; left:0; right:0; background:transparent !important; }
/* from tablet width the text starts high, on the clean sky (phones already do) */
@media (min-width:901px) {
  .blz-hero { justify-content:flex-start !important; padding-top:calc(var(--hdr-h, 80px) + clamp(28px, 7vh, 110px)) !important; }
}
.blz-hdr-over .blz-mode, .blz-hdr-over [data-lang-wrap] > button { -webkit-backdrop-filter:blur(12px) saturate(150%); backdrop-filter:blur(12px) saturate(150%); }
/* the e-mail field after "share yours": neutral grey glass (the backdrop is desaturated, otherwise the meadow tints it) */
.blz-hero input[type="email"] { -webkit-backdrop-filter:blur(16px) saturate(20%); backdrop-filter:blur(16px) saturate(20%); }
.blz-hero input[type="email"]::placeholder { color:rgba(255,255,255,.72); }
.blz-h1 { max-width:100%; font-size:clamp(56px, 11vw, 300px); }
@media (max-width:900px) {
  .blz-h1 { font-size:clamp(44px, 14.6vw, 150px); }
  .talk { grid-template-columns:minmax(0, 1fr); }
}
@media (min-width:1800px) {
  .blz-hero .blz-cta { min-height:68px !important; padding:0 32px 0 36px !important; font-size:21px !important; gap:12px !important; }
  .blz-hero .blz-link { font-size:21px !important; }
  .blz-hero form { max-width:640px !important; }
  .blz-hero form input[type="email"] { height:68px !important; font-size:19px !important; }
  .blz-hero-cta { gap:28px !important; }
  .blz-micro { font-size:16px !important; }
}
.blz-cue { position:absolute; left:50%; bottom:clamp(14px, 3.5vh, 40px); width:44px; height:44px; margin-left:-22px; display:grid; place-items:center; border-radius:999px; text-decoration:none; opacity:.55; }
.blz-cue:hover { opacity:1; }
@media (max-height:620px) { .blz-cue { display:none; } }
#know { scroll-margin-top:0; }
.blz-sub { text-wrap:balance; }
html.blz-motion [data-reveal="3"][data-in] { animation-delay:.38s; }

/* ── Buyer side + "the world reads it" ───────────────────────────────────── */
.blz-find { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:clamp(40px, 6vw, 96px); align-items:center; }
@media (max-width:900px) { .blz-find { grid-template-columns:minmax(0, 1fr); } }
@media (max-width:560px) { .blz-find-pts { grid-template-columns:minmax(0, 1fr) !important; } }
@media (max-width:720px) { .blz-world-list { grid-template-columns:minmax(0, 1fr) !important; } }
@keyframes blz-blink { 0%, 49% { opacity:1; } 50%, 100% { opacity:0; } }
.blz-caret { animation:blz-blink 1.1s linear infinite; }

/* ── v14: hero link for creators ─────────────────────────────────────────── */
.blz-hero-cr { box-sizing:border-box; display:inline-flex; align-items:center; gap:10px; max-width:100%; min-height:44px; margin-top:4px; padding-block:6px; padding-inline:16px 6px; border-radius:999px; font-size:15px; font-weight:600; line-height:1.3; text-align:start; text-decoration:none; transition:transform .2s ease, border-color .35s ease, color .35s ease; }
.blz-hero-cr:hover .blz-arrow, .blz-kcta:hover .blz-arrow, .blz-more:hover .blz-arrow { transform:translateX(3px); }
[dir=rtl] .blz-hero-cr:hover .blz-arrow, [dir=rtl] .blz-kcta:hover .blz-arrow, [dir=rtl] .blz-more:hover .blz-arrow { transform:scaleX(-1) translateX(3px); }
.blz-hero-cr:active { transform:scale(.97); }
@media (min-width:1800px) { .blz-hero-cr { font-size:17px; min-height:52px; } }

/* ── v14: know cards (4 + 4) ─────────────────────────────────────────────── */
.cards { grid-template-columns:repeat(4, minmax(0, 1fr)); }
@media (max-width:1099px) { .cards { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:599px) { .cards { grid-template-columns:minmax(0, 1fr); } .cards > * { min-height:0 !important; } }

/* ── v14: you're not alone ───────────────────────────────────────────────── */
.blz-na-head { display:flex; align-items:flex-end; justify-content:space-between; gap:32px 48px; }
.blz-crowd { flex:0 1 300px; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:8px; padding-bottom:6px; }
@media (max-width:900px) { .blz-na-head { flex-direction:column; align-items:flex-start; } .blz-crowd { flex:none; max-width:340px; justify-content:flex-start; } }
.blz-na-row { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, .95fr) minmax(0, 1.2fr); gap:10px 32px; align-items:baseline; padding:22px 0; }
.blz-na-th { padding:0 0 14px; font-size:14px; font-weight:600; letter-spacing:.01em; }
.blz-na-q { font-size:19px; line-height:1.4; font-weight:500; }
.blz-na-a { display:flex; align-items:baseline; gap:10px; font-size:19px; line-height:1.35; font-weight:700; }
.blz-na-a > span:first-child { position:relative; top:3px; }
.blz-na-h { font-size:16px; line-height:1.5; }
@media (max-width:720px) {
  .blz-na-th { display:none; }
  .blz-na-row { grid-template-columns:minmax(0, 1fr); gap:6px; padding:20px 0; }
  .blz-na-h { padding-inline-start:28px; }
}
.blz-strike { background-image:linear-gradient(currentColor, currentColor); background-repeat:no-repeat; background-size:100% 1.5px; background-position:0 58%; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
[dir=rtl] .blz-strike { background-position:100% 58%; }
@keyframes blz-strike { from { background-size:0 1.5px; } }
html.blz-motion [data-stagger][data-in] .blz-strike { animation:blz-strike .7s cubic-bezier(.65,0,.35,1) backwards; }
.blz-life { display:flex; align-items:center; gap:20px 28px; }
@media (max-width:720px) { .blz-life { flex-direction:column; align-items:flex-start; } }
html.blz-motion .blz-na-head .blz-crowd[data-in] > * { animation-name:blz-dot; animation-duration:.6s; animation-timing-function:cubic-bezier(.34,1.56,.64,1); }
html.blz-motion .blz-na-head .blz-crowd[data-in] > :nth-child(3n) { animation-delay:.12s; }
html.blz-motion .blz-na-head .blz-crowd[data-in] > :nth-child(3n+1) { animation-delay:.24s; }
html.blz-motion .blz-na-head .blz-crowd[data-in] > :nth-child(12) { animation-delay:.6s; }

/* ── v14: your path, drawn as a growth curve ────────────────────────────── */
.blz-grow { display:flex; flex-direction:column; gap:28px; }
.blz-grow-chart { position:relative; height:clamp(170px, 16vw, 220px); }
.blz-grow-svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
[dir=rtl] .blz-grow-svg { transform:scaleX(-1); }
.blz-step-dot { position:absolute; z-index:1; box-sizing:border-box; display:grid; place-items:center; width:44px; height:44px; border-radius:999px; font-size:16px; font-weight:700; font-variant-numeric:tabular-nums; transform:translate(-50%, -50%); }
[dir=rtl] .blz-step-dot { transform:translate(50%, -50%); }
.blz-path { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); }
.blz-step { box-sizing:border-box; padding:0 10px; text-align:center; }
.blz-step-num { display:none; }
.blz-opt { align-self:center; display:inline-flex; align-items:center; min-height:24px; padding:0 10px; border-radius:999px; font-size:12px; font-weight:600; }
.blz-path-net { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; }
@keyframes blz-wipe { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0 0 0 0); } }
@keyframes blz-wipe-rtl { from { clip-path:inset(0 0 0 100%); } to { clip-path:inset(0 0 0 0); } }
html.blz-motion .blz-grow-chart[data-in] { animation:none; }
html.blz-motion .blz-grow-chart[data-in] .blz-grow-svg { animation:blz-wipe 1.6s cubic-bezier(.65,0,.35,1) .1s backwards; }
html.blz-motion[dir=rtl] .blz-grow-chart[data-in] .blz-grow-svg { animation-name:blz-wipe-rtl; }
html.blz-motion .blz-grow-chart[data-in] .blz-step-dot { animation:blz-dot .6s cubic-bezier(.34,1.56,.64,1) backwards; }
html.blz-motion .blz-grow-chart[data-in] .blz-step-dot:nth-of-type(1) { animation-delay:.2s; }
html.blz-motion .blz-grow-chart[data-in] .blz-step-dot:nth-of-type(2) { animation-delay:.5s; }
html.blz-motion .blz-grow-chart[data-in] .blz-step-dot:nth-of-type(3) { animation-delay:.8s; }
html.blz-motion .blz-grow-chart[data-in] .blz-step-dot:nth-of-type(4) { animation-delay:1.1s; }
html.blz-motion .blz-grow-chart[data-in] .blz-step-dot:nth-of-type(5) { animation-delay:1.4s; }
@media (max-width:900px) {
  .blz-grow-chart { height:150px; margin:0 6px; }
  .blz-step-dot { width:34px; height:34px; font-size:14px; }
  .blz-path { grid-template-columns:minmax(0, 1fr); gap:22px; }
  .blz-step { display:grid; grid-template-columns:30px minmax(0, 1fr); gap:14px; padding:0; text-align:start; }
  .blz-step-num { box-sizing:border-box; display:grid; place-items:center; width:30px; height:30px; border-radius:999px; font-size:13px; font-weight:700; }
  .blz-opt { align-self:flex-start; }
  .blz-path-net { grid-template-columns:minmax(0, 1fr); }
}

/* ── v14: creators, networks, pricing ────────────────────────────────────── */
.blz-cr { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px; }
@media (max-width:1099px) { .blz-cr { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:560px) { .blz-cr { grid-template-columns:minmax(0, 1fr); } }
.blz-cr-proof { display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr); gap:16px; }
@media (max-width:900px) { .blz-cr-proof { grid-template-columns:minmax(0, 1fr); } }
html.blz-motion [data-in] .blz-bar { transform-origin:left center; animation:blz-line-x 1.2s cubic-bezier(.65,0,.35,1) .35s backwards; }
[dir=rtl] .blz-bar { transform-origin:right center !important; }
.blz-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 28px; }
.blz-nw { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:clamp(40px, 6vw, 96px); align-items:center; }
@media (max-width:900px) { .blz-nw { grid-template-columns:minmax(0, 1fr); } }
.blz-plans { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; }
@media (max-width:900px) { .blz-plans { grid-template-columns:minmax(0, 1fr); } }
.blz-price { white-space:nowrap; }

/* ── v16: more air in grids and the new sections ────────────────────────── */
.g3, .bento, .cards, .blz-cr, .blz-plans, .blz-path-net, .blz-cr-proof { gap:20px !important; }
.blz-hero-cta { gap:30px !important; }
.blz-hero-cr { margin-top:10px; }
.blz-na-row { padding:28px 0; column-gap:40px; }
.blz-na-th { padding:0 0 16px; }
.blz-grow { gap:44px; }
.blz-step > div { gap:10px !important; }
.blz-world-list li { padding:15px 0 !important; }
.faq details > p { padding-bottom:26px !important; line-height:1.6 !important; }
@media (max-width:720px) { .blz-hero-cta { gap:24px !important; } .blz-na-row { padding:24px 0; } }

/* ── Header on large screens: logo and controls move in, in line with the headline ── */
@media (min-width:1280px) {
  .hdr { padding-left:max(40px, 6.8vw, calc((100vw - 2360px) / 2)) !important; padding-right:max(40px, 6.8vw, calc((100vw - 2360px) / 2)) !important; }
}
/* four nav links: tighter between the burger breakpoint and laptop width */
.hdr-cta { white-space:nowrap; }
@media (min-width:961px) and (max-width:1279px) { .hdr-nav { gap:22px !important; } .hdr { column-gap:16px !important; } }

/* ── Header: burger menu on phones ───────────────────────────────────────── */
.hdr-burger { display:none; }
.hdr-burger:active { transform:scale(.92); }
@keyframes blz-icon { from { opacity:0; transform:rotate(-90deg) scale(.6); } to { opacity:1; transform:none; } }
.hdr-burger-ico { animation:blz-icon .28s cubic-bezier(.16,1,.3,1) both; }
@keyframes blz-mnav { from { opacity:0; transform:translate3d(0, -10px, 0); } to { opacity:1; transform:none; } }
.blz-mnav { animation:blz-mnav .32s cubic-bezier(.16,1,.3,1) both; }
.blz-mnav nav a:active { opacity:.6; }
@media (min-width:961px) { .blz-mnav { display:none; } }
/* phones and tablets in portrait: burger menu (the full nav needs ~960px in some languages) */
@media (max-width:960px) {
  .hdr { grid-template-columns:auto 1fr !important; }
  .hdr-nav { display:none !important; }
  .hdr-cta { display:none !important; }
  .hdr-burger { display:grid; }
}
@media (max-width:380px) {
  .hdr { column-gap:8px !important; }
  .hdr-ctrl { gap:6px !important; }
  .hdr-start img { height:22px !important; }
}

/* ── Hero on phones: headline in the upper third, buttons stacked, air below ── */
@media (max-width:720px) {
  /* top bar lies on the picture; room at the bottom so the two characters stand below the buttons */
  .blz-hero { justify-content:flex-start !important; padding-top:calc(var(--hdr-h, 72px) + clamp(28px, 7svh, 96px)) !important; padding-bottom:clamp(280px, 42svh, 400px) !important; }
  .blz-hero-cta { margin-top:clamp(40px, 6.5svh, 64px) !important; gap:22px !important; }
  .blz-hero-actions { width:100%; flex-direction:column; flex-wrap:nowrap !important; gap:10px !important; }
  .blz-hero-actions .blz-cta { width:100%; max-width:340px; justify-content:center; }
  .blz-hero form { flex-direction:column; align-items:stretch; max-width:340px !important; }
  .blz-hero form input[type="email"] { flex:none !important; width:100%; }
  .blz-hero form button { justify-content:center; }
  .blz-micro { margin-top:0 !important; }
  /* bigger headline where the longest word allows it */
  .blz-h1 { font-size:clamp(44px, 16vw, 150px); }
  .blz:lang(fr) .blz-h1, .blz:lang(it) .blz-h1, .blz:lang(es) .blz-h1, .blz:lang(pt) .blz-h1 { font-size:clamp(44px, 14.6vw, 150px); }
}
.blz-micro { text-wrap:balance; }
html.blz-menu-open { overflow:hidden; }

/* ── Micro-interactions ──────────────────────────────────────────────────── */
.blz-cta { transition:transform .2s ease, opacity .2s ease, background-color .35s ease, color .35s ease; }
.blz-cta:active { transform:scale(.97); }
.bento > div, .g3 > div, .blz-cr > li, .blz-plans > div { transition:transform .45s cubic-bezier(.16,1,.3,1), background-color .35s ease, color .35s ease; }
.cards > button, .cards > a { transition:transform .45s cubic-bezier(.16,1,.3,1), background-color .25s ease, border-color .3s ease, color .35s ease !important; }
.cards > button:active, .cards > a:active { transform:scale(.98); }
@media (hover:hover) {
  .bento > div:hover, .g3 > div:hover, .cards > button:hover, .cards > a:hover, .blz-cr > li:hover, .blz-plans > div:hover { transform:translateY(-4px); }
}
@keyframes blz-pop { from { opacity:0; transform:translate3d(0, 10px, 0) scale(.985); } to { opacity:1; transform:none; } }
@keyframes blz-menu { from { opacity:0; transform:translate3d(0, -4px, 0) scale(.96); } to { opacity:1; transform:none; } }
@keyframes blz-fade { from { opacity:0; transform:translate3d(0, -6px, 0); } to { opacity:1; transform:none; } }
.blz-pop { animation:blz-pop .5s cubic-bezier(.16,1,.3,1) both; }
.blz-menu { transform-origin:top right; animation:blz-menu .22s cubic-bezier(.16,1,.3,1) both; }
[dir=rtl] .blz-menu { transform-origin:top left; }
.faq details[open] > p { animation:blz-fade .45s cubic-bezier(.16,1,.3,1) both; }

/* ── Scroll reveals (only with JS + motion allowed: html.blz-motion) ─────── */
@keyframes blz-rise { from { opacity:0; transform:translate3d(0, 28px, 0); } to { opacity:1; transform:none; } }
@keyframes blz-rise-h { from { opacity:0; transform:translate3d(0, 36px, 0); filter:blur(8px); } to { opacity:1; transform:none; filter:none; } }
@keyframes blz-zoom { from { opacity:0; transform:translate3d(0, 48px, 0) scale(.96); } to { opacity:1; transform:none; } }
@keyframes blz-slide { from { opacity:0; transform:translate3d(var(--blz-dx, -40px), 0, 0); } to { opacity:1; transform:none; } }
@keyframes blz-line-x { from { transform:scaleX(0); } to { transform:none; } }
@keyframes blz-line-y { from { transform:scaleY(0); } to { transform:none; } }
@keyframes blz-dot { from { opacity:0; transform:scale(.6); } to { opacity:1; transform:none; } }
@keyframes blz-cue { 0%, 100% { transform:translate3d(0, 0, 0); } 50% { transform:translate3d(0, 6px, 0); } }
@keyframes blz-show { to { opacity:1; } }
html.blz-motion [data-reveal]:not([data-in]),
html.blz-motion [data-stagger]:not([data-in]) > * { opacity:0; }
/* fail-safe: if landing.js never runs, show everything after 2 s */
html.blz-motion:not(.blz-live) [data-reveal],
html.blz-motion:not(.blz-live) [data-stagger] > * { animation:blz-show 0s 2s forwards; }
html.blz-motion [data-reveal][data-in],
html.blz-motion [data-stagger][data-in] > * { animation:blz-rise .9s cubic-bezier(.16,1,.3,1) backwards; }
html.blz-motion [data-reveal="h"][data-in],
html.blz-motion [data-stagger][data-in] > h2 { animation-name:blz-rise-h; animation-duration:1.1s; }
html.blz-motion [data-reveal="zoom"][data-in] { animation-name:blz-zoom; animation-duration:1.1s; }
html.blz-motion [data-reveal="2"][data-in] { animation-delay:.22s; }
html.blz-motion [data-stagger][data-in] > :nth-child(2) { animation-delay:.08s; }
html.blz-motion [data-stagger][data-in] > :nth-child(3) { animation-delay:.16s; }
html.blz-motion [data-stagger][data-in] > :nth-child(4) { animation-delay:.24s; }
html.blz-motion [data-stagger][data-in] > :nth-child(5) { animation-delay:.32s; }
html.blz-motion [data-stagger][data-in] > :nth-child(6) { animation-delay:.40s; }
html.blz-motion [data-stagger][data-in] > :nth-child(n+7) { animation-delay:.48s; }
/* "You speak → You get": phones come in from their sides, then the four steps tick in */
html.blz-motion .talk[data-in] > :first-child { animation-name:blz-slide; --blz-dx:-48px; }
html.blz-motion .talk[data-in] > :last-child { animation-name:blz-slide; --blz-dx:48px; animation-delay:.2s; }
[dir=rtl] .talk[data-in] > :first-child { --blz-dx:48px !important; }
[dir=rtl] .talk[data-in] > :last-child { --blz-dx:-48px !important; }
html.blz-motion .talk[data-in] .talk-mid > * { animation:blz-rise .6s cubic-bezier(.16,1,.3,1) .35s backwards; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(3) { animation-delay:.5s; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(4) { animation-delay:.62s; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(5) { animation-delay:.74s; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(6) { animation-delay:.86s; }
html.blz-motion .talk[data-in] .talk-mid > span > span { animation:blz-dot .5s cubic-bezier(.34,1.56,.64,1) .7s backwards; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(4) > span { animation-delay:.82s; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(5) > span { animation-delay:.94s; }
html.blz-motion .talk[data-in] .talk-mid > :nth-child(6) > span { animation-delay:1.06s; }
/* People ↔ AI: the connecting lines draw themselves */
html.blz-motion .mk[data-in] .mk-line { transform-origin:left center; animation:blz-line-x .9s cubic-bezier(.65,0,.35,1) .35s backwards; }
html.blz-motion .mk[data-in] .mk-mid > :last-child { animation-delay:.6s; }
[dir=rtl] .mk-line { transform-origin:right center !important; }
html.blz-motion .mk[data-in] .mk-mid > div { animation:blz-dot .7s cubic-bezier(.34,1.56,.64,1) .3s backwards; }
@media (max-width:900px) {
  html.blz-motion .talk[data-in] > :first-child, html.blz-motion .talk[data-in] > :last-child { animation-name:blz-rise; }
  html.blz-motion .mk[data-in] .mk-line { transform-origin:center top !important; animation-name:blz-line-y; }
}
/* Hero drifts up and fades as the page scrolls on (--hero-p: 0 → 1, set by landing.js) */
@media (prefers-reduced-motion:no-preference) {
  html.blz-motion .blz-h1 { transform:translate3d(0, calc(var(--hero-p, 0) * -9vh), 0) scale(calc(1 - var(--hero-p, 0) * .05)); opacity:calc(1 - var(--hero-p, 0) * .75); }
  html.blz-motion .blz-sub { transform:translate3d(0, calc(var(--hero-p, 0) * -7vh), 0); opacity:calc(1 - var(--hero-p, 0) * 1.2); }
  html.blz-motion .blz-hero-cta { transform:translate3d(0, calc(var(--hero-p, 0) * -5vh), 0); opacity:calc(1 - var(--hero-p, 0) * 1.4); }
  html.blz-motion .blz-cue { opacity:calc(.55 - var(--hero-p, 0) * 3); animation:blz-cue 2.6s ease-in-out 1.6s infinite; }
}
@media (prefers-reduced-motion:reduce) {
  html.blz-motion [data-reveal], html.blz-motion [data-stagger] > * { opacity:1 !important; }
}

.hp { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); opacity:0; pointer-events:none; }
.blz-cta:disabled { opacity:.6; cursor:default; }
/* Until landing.js has applied the visitor's language/theme (only when it differs
   from the pre-rendered English/white page). Fails open after 1.5 s. */
html.blz-wait #blz-root { opacity:0; animation:blz-failsafe 0s 1.5s forwards; }
@keyframes blz-failsafe { to { opacity:1; } }

/* ── v27: the story right after the hero ───────────────────────────── */
.blz-st-top { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); grid-template-areas:"h h" "lead cards"; column-gap:clamp(40px, 6vw, 96px); row-gap:clamp(28px, 3vw, 44px); align-items:start; }
.blz-st-h { grid-area:h; }
.blz-st-lead { grid-area:lead; }
.blz-st-cards { grid-area:cards; }
.blz-st-cards { display:flex; flex-direction:column; gap:12px; }
.blz-st-card { box-sizing:border-box; display:flex; align-items:center; gap:16px; padding:18px 22px; border-radius:22px; }
.blz-st-steps { margin:0; padding:0; list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(24px, 3vw, 44px); }
#talk { scroll-margin-top:88px; }
@media (max-width:900px) {
  .blz-st-top { grid-template-columns:minmax(0, 1fr); grid-template-areas:"h" "lead" "cards"; }
  .blz-st-steps { grid-template-columns:minmax(0, 1fr); }
}

/* ── v27: any post can be a product (app cards stay dark in both modes, like the app) ── */
.blz-pr { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas:"copy side" "comp side"; column-gap:clamp(48px, 6vw, 88px); row-gap:clamp(40px, 4.4vw, 64px); align-items:start; }
.blz-pr-copy { grid-area:copy; }
.blz-pr-comp { grid-area:comp; }
.blz-pr-side { grid-area:side; display:flex; flex-direction:column; gap:26px; }
@media (max-width:1023px) { .blz-pr { grid-template-columns:minmax(0, 1fr); grid-template-areas:"copy" "side" "comp"; } }
.blz-app { position:relative; box-sizing:border-box; border-radius:22px; background:#1C1C1E; color:#F5F5F7; border:1px solid rgba(255,255,255,.1);
  box-shadow:0 28px 60px rgba(0,0,0,.18), 0 2px 6px rgba(0,0,0,.08); font-size:14px; text-align:start; }
.blz-app p { margin:0; }
.blz-app-ex { position:absolute; top:16px; right:16px; padding:3px 9px; border-radius:999px; background:#2C2C2E; color:#A1A1A6; font-size:11px; font-weight:600; }
/* composer */
.blz-pr-comp { width:380px; max-width:100%; padding:16px 16px 18px; }
.blz-pr-comp-t { margin:2px 0 14px !important; font-size:17px; font-weight:700; letter-spacing:-.015em; }
.blz-pr-tools { display:flex; align-items:center; gap:2px; height:36px; padding:0 5px; border-radius:10px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.08); }
.blz-pr-tb { display:grid; place-items:center; min-width:28px; height:26px; font-size:14px; font-weight:600; color:rgba(245,245,247,.75); }
.blz-pr-sep { width:1px; height:16px; margin:0 5px; background:rgba(255,255,255,.12); }
.blz-pr-attach { display:flex; gap:6px; margin-top:10px; }
.blz-pr-attach span { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; border:1px solid rgba(255,255,255,.12); color:rgba(245,245,247,.75); }
.blz-pr-seg { display:inline-flex; gap:2px; margin-top:16px; padding:3px; border-radius:10px; background:rgba(255,255,255,.06); box-shadow:0 0 0 1.5px #B19062, 0 0 12px rgba(177,144,98,.35); }
.blz-pr-seg span { padding:6px 12px; border-radius:8px; font-size:13px; font-weight:600; color:rgba(245,245,247,.7); }
.blz-pr-seg .is-on { background:#3A3A3C; color:#F5F5F7; }
.blz-pr-label { margin:16px 0 7px !important; font-size:13px; font-weight:600; color:#A1A1A6; }
.blz-pr-input { display:flex; align-items:center; gap:9px; height:42px; padding:0 13px; box-sizing:border-box; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); font-size:15px; font-weight:600; }
.blz-pr-area { height:62px; align-items:flex-start; padding-top:12px; font-size:14.5px; font-weight:400; color:rgba(245,245,247,.5); }
.blz-coin { flex:0 0 auto; width:16px; height:16px; border-radius:999px; background:radial-gradient(circle at 35% 30%, #E3C79A, #B19062 60%, #7A5F36); }
/* post card */
.blz-pr-post { width:min(100%, 580px); padding:18px 18px 12px; }
.blz-pr-head { display:flex; align-items:center; gap:12px; padding-right:72px; }
.blz-pr-av { position:relative; flex:0 0 auto; width:46px; height:46px; }
.blz-pr-av img { display:block; width:100%; height:100%; border-radius:999px; object-fit:cover; }
.blz-pr-av span { position:absolute; right:-4px; bottom:-3px; display:grid; place-items:center; min-width:20px; height:20px; padding:0 3px; box-sizing:border-box; border-radius:999px; background:#F5F5F7; color:#1C1C1E; font-size:10px; font-weight:700; border:2px solid #1C1C1E; }
.blz-pr-who { display:flex; flex-direction:column; gap:1px; min-width:0; }
.blz-pr-name { display:flex; align-items:center; gap:7px; font-size:15px; font-weight:700; }
.blz-pr-tier { padding:2px 7px; border-radius:999px; background:#B19062; color:#1C1C1E; font-size:9.5px; font-weight:800; letter-spacing:.06em; }
.blz-pr-meta { font-size:12px; color:#A1A1A6; }
.blz-pr-title { margin:16px 0 4px !important; font-size:17px; font-weight:700; letter-spacing:-.01em; }
.blz-pr-body { margin:0 0 14px !important; font-size:14.5px; line-height:1.45; color:#C7C7CC; }
/* paid stage: locked below, unlocked on top, cut by a slanted gold divider */
.blz-pr-paid { --xp:50%; --k:28px; position:relative; aspect-ratio:16 / 11; border-radius:18px; overflow:hidden; background:#141416; }
.blz-pr-paid::after { content:""; position:absolute; inset:0; z-index:4; border-radius:inherit; box-shadow:inset 0 0 0 2px #B19062; pointer-events:none; }
.blz-pr-locked { position:absolute; inset:0; display:flex; flex-direction:column; }
.blz-pr-mosaic { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:2fr 1fr; grid-template-rows:1fr 1fr; gap:3px; }
.blz-pr-mosaic img { display:block; width:100%; height:100%; object-fit:cover; filter:grayscale(1) brightness(.55); }
.blz-pr-mosaic img:first-child { grid-row:span 2; }
.blz-pr-bars { display:flex; flex-direction:column; gap:7px; padding:14px 16px 16px; }
.blz-pr-bars i { display:block; height:9px; border-radius:5px; background:rgba(255,255,255,.08); }
.blz-pr-bars i:nth-child(2) { width:85%; }
.blz-pr-bars i:nth-child(3) { width:60%; }
.blz-pr-center { position:absolute; top:0; bottom:0; left:0; width:calc(var(--xp) - 16px); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; }
.blz-pr-lock { display:grid; place-items:center; width:56px; height:56px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22); }
.blz-pr-buy { display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:0 18px; border-radius:12px; background:#B19062; color:#1C1C1E; font-size:14px; font-weight:700; white-space:nowrap; }
.blz-pr-open { position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; gap:10px; padding:14px 16px; background:linear-gradient(160deg, #2A2A2E, #1C1C1E);
  clip-path:polygon(calc(var(--xp) + var(--k)) 0, 100% 0, 100% 100%, calc(var(--xp) - var(--k)) 100%); }
.blz-pr-unl { align-self:flex-end; display:inline-flex; align-items:center; gap:5px; padding:4px 9px; border-radius:999px; background:rgba(255,255,255,.1); font-size:11.5px; font-weight:600; }
.blz-pr-ptext { font-size:14px; line-height:1.45; color:#E5E5EA; }
.blz-pr-photo { display:block; width:100%; flex:1 1 auto; min-height:0; object-fit:cover; border-radius:12px; }
.blz-pr-dots { display:flex; justify-content:center; gap:5px; }
.blz-pr-dots i { display:block; width:5px; height:5px; border-radius:999px; background:rgba(255,255,255,.3); }
.blz-pr-dots i.is-on { background:#F5F5F7; }
.blz-pr-line { position:absolute; top:-5%; left:var(--xp); z-index:3; width:2px; height:110%; margin-left:-1px; background:#B19062; box-shadow:0 0 14px rgba(177,144,98,.55); transform:rotate(8deg); }
.blz-pr-handle { position:absolute; left:calc(var(--xp) - var(--k) * .56); top:78%; z-index:5; display:grid; place-items:center; width:44px; height:44px; margin:-22px 0 0 -22px; border-radius:50%;
  background:rgba(16,16,19,.78); color:#FFFFFF; box-shadow:inset 0 0 0 2px #B19062, 0 8px 20px rgba(0,0,0,.45); }
.blz-pr-handle > span { position:absolute; top:calc(100% + 9px); left:50%; transform:translateX(-50%); padding:5px 10px; border-radius:999px; background:rgba(10,10,12,.72);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); font-size:11.5px; font-weight:600; white-space:nowrap; }
.blz-pr-reacts { display:flex; gap:8px; margin-top:12px; }
.blz-pr-reacts span { padding:4px 10px; border-radius:999px; background:#2C2C2E; font-size:13px; font-weight:600; }
.blz-pr-acts { display:flex; align-items:center; gap:18px; margin-top:12px; padding-top:10px; border-top:1px solid rgba(255,255,255,.08); color:#A1A1A6; font-size:13px; font-weight:600; }
.blz-pr-acts span { display:inline-flex; align-items:center; gap:6px; }
.blz-pr-micro { width:min(100%, 580px); }
.blz-pr-micro p { margin:0; font-size:14px; line-height:1.6; }
/* phones: a taller stage and the divider further right, so the locked side still holds the button */
@media (max-width:720px) {
  .blz-pr-paid { --xp:64%; --k:20px; aspect-ratio:1 / 0.9; }
  .blz-pr-buy { padding:0 14px; font-size:13px; }
  .blz-pr-head { padding-right:64px; }
}
/* the divider can be dragged; vertical swipes still scroll the page */
.blz-pr-paid { cursor:ew-resize; touch-action:pan-y; -webkit-user-select:none; user-select:none; }
.blz-pr-paid.is-drag { cursor:grabbing; }
.blz-pr-paid img { -webkit-user-drag:none; pointer-events:none; }
.blz-pr-handle > span { transition:opacity .25s ease; }
.blz-pr-paid.is-moved .blz-pr-handle > span { opacity:0; }
.blz-pr-h { text-wrap:balance; }
/* Japanese breaks at phrase boundaries where the browser can, Korean only between words */
.blz:lang(ja) :is(#know, #product) { word-break:auto-phrase; }
.blz:lang(ko) :is(#know, #product) :is(h2, .blz-st-steps) { word-break:keep-all; }
/* right-to-left pages: the example chip and the room for it change sides */
[dir=rtl] .blz-app-ex { right:auto; left:16px; }
[dir=rtl] .blz-pr-head { padding-right:0; padding-left:72px; }
@media (max-width:720px) { [dir=rtl] .blz-pr-head { padding-left:64px; } }

/* ── v29: the merged earn tiles below the product example ── */
.blz-pr-more { max-width:1180px; margin:clamp(80px, 9vw, 128px) auto 0; display:flex; flex-direction:column; gap:28px; }
/* ── v29: the hero headline stays on one line and the line below it on the clean sky ──
   On wider screens the size also follows the window height, so on low laptop screens the text
   still ends above the picture. Long headlines get a smaller size so they keep to one line
   (measured width on one line: de 10.2 em, es 11 em, pt 9.8 em, tr 8.2 em, it 7.8 em, ja 8 em). */
@media (min-width:901px) {
  .blz-h1 { font-size:clamp(56px, min(11vw, 17.5vh), 300px); }
  .blz:lang(de) .blz-h1 { font-size:clamp(48px, min(8.4vw, 17.5vh), 300px); }
  .blz:lang(es) .blz-h1 { font-size:clamp(48px, min(7.8vw, 17.5vh), 300px); }
  .blz:lang(pt) .blz-h1 { font-size:clamp(48px, min(8.7vw, 17.5vh), 300px); }
  .blz:lang(tr) .blz-h1 { font-size:clamp(48px, min(10.4vw, 17.5vh), 300px); }
  .blz:lang(it) .blz-h1 { font-size:clamp(48px, min(10.9vw, 17.5vh), 300px); }
  .blz:lang(ja) .blz-h1 { font-size:clamp(48px, min(10.7vw, 17.5vh), 300px); }
}

/* ── Colour-mode switch in the top bar (v30) ──
   One switch: off = sun (white thumb), on = moon (black thumb). The thumb springs like the app's
   switches (landing.js, gummySwitch): while data-gummy is set, place, size and colours come from
   the --g-* variables frame by frame. Without it (reduced motion, before the first measurement)
   the thumb moves on data-on. Off/on via transform, not left: the spring reads the off position
   from offsetLeft. direction: ltr, like every switch: the thumb is placed with left. */
.blz-mode { position:relative; box-sizing:border-box; display:inline-flex; align-items:center; gap:2px; height:44px; margin:0; padding:3px; border-radius:999px; color:#FFFFFF; cursor:pointer; direction:ltr; touch-action:pan-y; -webkit-tap-highlight-color:transparent; --toggle-travel:38px; }
.blz-mode-thumb { position:absolute; top:3px; left:3px; width:36px; height:36px; border-radius:999px; background:#FFFFFF; box-shadow:0 1px 3px rgba(0,0,0,0.14); pointer-events:none; transition:transform .25s ease, background-color .2s ease, box-shadow .2s ease; }
.blz-mode[data-on="true"] .blz-mode-thumb { transform:translateX(var(--toggle-travel)); background:#1D1D1F; box-shadow:none; }
.blz-mode-ico { position:relative; z-index:1; display:grid; place-items:center; width:36px; height:36px; color:#FFFFFF; transition:color .2s ease; }
.blz-mode[data-on="false"] .blz-mode-ico--light { color:#1D1D1F; }
.blz-mode[data-gummy] .blz-mode-thumb { left:var(--g-l); top:var(--g-t); width:var(--g-w); height:var(--g-h); transform:none; transition:none; background:color-mix(in srgb, #1D1D1F var(--g-knob), #FFFFFF); box-shadow:0 1px 3px color-mix(in srgb, transparent var(--g-knob), rgba(0,0,0,0.14)); }
.blz-mode[data-gummy] .blz-mode-ico { transition:none; }
.blz-mode[data-gummy] .blz-mode-ico--light { color:color-mix(in srgb, #FFFFFF var(--g-knob), #1D1D1F); }