/* Public marketing site. One typeface (Plus Jakarta Sans, local), the logo's
   blue, a night blue for the moments that matter and a green that only
   means "a client arrived". Motion lives under .has-motion: without
   JavaScript or with reduced motion, every block shows its final state.

   The home and the masterclass load only this stylesheet (the contact and
   legal pages add Tailwind's), so it carries what they would otherwise take
   from Tailwind: the font and Tailwind's reset with the 14px root. The
   reset sits in @layer base, like Tailwind's own, so where both load the
   utilities still win. */
@font-face {
  font-family:"Plus Jakarta Sans"; font-style:normal; font-weight:400 800; font-display:swap;
  src:url("/assets/plus-jakarta-sans-latin-ext-ff4456f1.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family:"Plus Jakarta Sans"; font-style:normal; font-weight:400 800; font-display:swap;
  src:url("/assets/plus-jakarta-sans-latin-d2ff26bc.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;
}
@layer base {
  *, ::before, ::after, ::backdrop { box-sizing:border-box; border:0 solid; margin:0; padding:0; }
  html { font-size:14px; line-height:1.5; -webkit-text-size-adjust:100%; text-size-adjust:100%; tab-size:4; -webkit-tap-highlight-color:transparent; }
  h1, h2, h3, h4, h5, h6 { font-size:inherit; font-weight:inherit; }
  a { color:inherit; text-decoration:inherit; }
  b, strong { font-weight:bolder; }
  small { font-size:80%; }
  summary { display:list-item; }
  ol, ul, menu { list-style:none; }
  img, svg, video, canvas, audio, iframe, embed, object { display:block; vertical-align:middle; }
  img, video { max-width:100%; height:auto; }
  button, input, select, optgroup, textarea { font:inherit; font-feature-settings:inherit; font-variation-settings:inherit; letter-spacing:inherit; color:inherit; opacity:1; background-color:transparent; border-radius:0; }
  button, input:where([type=button],[type=reset],[type=submit]) { appearance:button; }
  ::placeholder { opacity:1; color:color-mix(in oklab, currentcolor 50%, transparent); }
  textarea { resize:vertical; }
  [hidden]:where(:not([hidden=until-found])) { display:none!important; }
}
.marketing-site {
  --site-blue:#2c4eba; --site-blue-dark:#2443a6; --site-ink:#0e1733;
  --site-copy:#4d5874; --site-muted:#6a7490; --site-line:#e3e7f0;
  --site-soft:#f3f5fa; --site-night:#0b1742; --site-night-copy:#b3bedf;
  --site-go:#16924d; --site-signal:#ffd978;
  font-family:"Plus Jakarta Sans",system-ui,sans-serif; color:var(--site-ink); background:white; -webkit-font-smoothing:antialiased;
}
.marketing-site .site-skip-link { position:absolute; top:16px; left:16px; z-index:100; padding:8px 16px; border-radius:8px; background:var(--site-blue); color:white; font-weight:600; }
.marketing-site .site-skip-link:not(:focus) { width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.marketing-site *, .marketing-site *::before, .marketing-site *::after { box-sizing:border-box; }
.marketing-site [hidden] { display:none!important; }
.marketing-site :where(.marketing-home) :where(h1,h2,h3,p,ul,ol,figure) { margin:0; }
.marketing-site :where(.marketing-home) :where(ul,ol) { padding:0; list-style:none; }
.marketing-site :is(.marketing-home,.site-header,.site-footer) a { text-decoration:none; }
.marketing-site button, .marketing-site input { font:inherit; }
.marketing-site button { cursor:pointer; }
.marketing-site :is(a,button,summary,input):focus-visible { outline:3px solid var(--site-blue); outline-offset:4px; border-radius:7px; }
.marketing-site :is(.site-pains,.site-sectors,.site-closing) :is(a,button):focus-visible { outline-color:var(--site-signal); }
.marketing-site :is(section[id],main[id],h2[id]) { scroll-margin-top:84px; }
.marketing-site .site-container { width:min(1200px,calc(100% - 64px)); margin-inline:auto; }
.marketing-site .marketing-home svg { width:18px; height:18px; flex-shrink:0; }
.marketing-site .marketing-home :is(h1,h2) { font-weight:800; letter-spacing:-.042em; text-wrap:balance; }
.marketing-site .marketing-home h2 { font-size:clamp(34px,4.1vw,56px); line-height:1.04; }
.marketing-site .marketing-home h3 { font-size:19px; font-weight:700; letter-spacing:-.018em; line-height:1.3; }
.marketing-site .site-section { padding-block:120px; }
.marketing-site .site-heading { max-width:760px; margin-bottom:56px; }
.marketing-site .site-heading > p { max-width:54ch; margin-top:20px; color:var(--site-copy); font-size:18px; line-height:1.65; text-wrap:pretty; }
.marketing-site .site-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:14px 22px; border:1px solid transparent; border-radius:12px; background:var(--site-blue); color:white; font-weight:700; font-size:15px; line-height:1.3; transition:background .15s,transform .15s; }
.marketing-site .site-button:hover { background:var(--site-blue-dark); transform:translateY(-1px); }
.marketing-site .site-button svg { width:17px; height:17px; }
.marketing-site .site-button-light { color:var(--site-ink); background:white; }
.marketing-site .site-button-light:hover { background:#e9eefc; }
.marketing-site .site-button-small { min-height:40px; padding:9px 17px; font-size:13px; }
.marketing-site .site-whatsapp-icon { flex-shrink:0; width:18px; height:18px; color:#1a9e4b; }
.marketing-site .site-text-link { display:inline-flex; align-items:center; gap:8px; color:var(--site-blue); font-size:15px; font-weight:700; }
.marketing-site .site-text-link:hover { text-decoration:underline; text-underline-offset:4px; }
.marketing-site .site-text-link.is-on-dark { color:white; }
.marketing-site .site-text-link.is-on-dark .site-whatsapp-icon { color:#4ade80; }
.marketing-site .site-play { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:white; color:var(--site-blue); }
.marketing-site .site-play svg { width:15px; height:15px; margin-left:2px; fill:currentColor; }
.marketing-site .site-button-light .site-play { background:var(--site-blue); color:white; }

/* Shared navigation, including contact and legal pages: the logo and the
   menu on the left; the clients' login, drawn as a login, and the
   masterclass on the right. The menu's anchors glide to their section. */
html:has(> .marketing-site.has-motion) { scroll-behavior:smooth; }
.marketing-site .site-header { position:sticky; top:0; z-index:30; background:#fffffff2; backdrop-filter:blur(16px); border-bottom:1px solid #e3e7f080; }
.marketing-site .site-header-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:72px; position:relative; }
.marketing-site .site-header-start { display:flex; align-items:center; gap:44px; min-width:0; }
.marketing-site .site-logo { display:inline-flex; flex-shrink:0; }
.marketing-site .site-logo img { width:108px; height:32px; object-fit:contain; }
.marketing-site .site-header-nav { display:flex; align-items:center; gap:30px; }
.marketing-site .site-header-actions { display:flex; align-items:center; gap:12px; }
.marketing-site .site-header-link { color:#394459; font-size:14px; font-weight:600; }
.marketing-site .site-header-link:hover { color:var(--site-blue); }
.marketing-site .site-login { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:9px 15px; border:1px solid var(--site-line); border-radius:12px; background:white; color:var(--site-ink); font-size:13px; font-weight:700; line-height:1.3; transition:border-color .15s,background .15s; }
.marketing-site .site-login:hover { border-color:#c9d1e4; background:var(--site-soft); }
.marketing-site .site-login svg { flex-shrink:0; width:16px; height:16px; color:var(--site-blue); }

/* Hero: a short promise, then the video. The player is one link to /video;
   its poster plays one client's path through the system. */
.marketing-site .site-hero { padding:44px 0 88px; overflow:hidden; text-align:center; }
.marketing-site .site-hero-copy { max-width:900px; margin-inline:auto; }
.marketing-site .site-hero h1 { font-size:clamp(42px,5.8vw,82px); line-height:.96; letter-spacing:-.052em; }
.marketing-site .site-hero-lead { max-width:58ch; margin:20px auto 0; color:var(--site-copy); font-size:19px; line-height:1.6; text-wrap:pretty; }
.marketing-site .site-button-video { min-height:58px; padding:10px 24px 10px 11px; border-radius:16px; font-size:16px; box-shadow:0 14px 30px -12px #2c4eba99; }
.marketing-site .site-hero-meta { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:24px!important; color:var(--site-copy); font-size:14px; font-weight:600; }
.marketing-site .site-meta-glyphs { display:flex; gap:6px; color:var(--site-ink); }
.marketing-site .site-meta-glyphs svg { width:16px; height:16px; }

.marketing-site .site-player { position:relative; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); max-width:1080px; aspect-ratio:16/9; margin:36px auto 0; padding:22px; border-radius:30px; background:radial-gradient(700px 420px at 0 0,#2c4eba70,transparent 70%),var(--site-night); box-shadow:0 60px 100px -50px #0b1742b3; text-align:left; }
.marketing-site .site-player-link { position:absolute; inset:0; z-index:5; border-radius:inherit; }
.marketing-site .site-player-link:focus-visible { outline-offset:6px; border-radius:30px; }
.marketing-site .site-player-intro { display:flex; flex-direction:column; justify-content:center; padding:20px 34px 20px 26px; color:white; }
.marketing-site .site-player-kicker { align-self:flex-start; padding:5px 12px; border:1px solid #ffffff38; border-radius:999px; color:#c9d4ff; font-size:12.5px; font-weight:700; }
.marketing-site .site-player-title { margin-top:14px!important; font-size:clamp(24px,2.6vw,34px); font-weight:800; line-height:1.1; letter-spacing:-.035em; text-wrap:balance; }
.marketing-site .site-player-host { display:flex; align-items:center; gap:12px; margin-top:22px; }
.marketing-site .site-player-host img { flex-shrink:0; width:52px; height:52px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 3px #ffffff40; }
.marketing-site .site-player-by { display:block; color:var(--site-night-copy); font-size:13px; line-height:1.4; }
.marketing-site .site-player-host small { display:block; margin-top:2px; color:var(--site-night-copy); font-size:13px; line-height:1.4; }
.marketing-site .site-player-cta { display:inline-flex; align-self:flex-start; align-items:center; gap:12px; margin-top:30px!important; padding:9px 22px 9px 9px; border-radius:16px; background:white; color:var(--site-ink); font-size:16px; font-weight:700; box-shadow:0 14px 30px -12px #00000066; transition:transform .15s,box-shadow .15s; }
.marketing-site .site-player-cta .site-play { background:var(--site-blue); color:white; }
.marketing-site .site-player:hover .site-player-cta { transform:translateY(-1px); box-shadow:0 18px 34px -12px #00000080; }
.marketing-site .site-player-stage { position:relative; min-width:0; }
.marketing-site .site-journey { position:relative; height:100%; overflow:hidden; border-radius:20px; background:radial-gradient(#c3cff2 1.1px,transparent 1.3px) 0 0/20px 20px,linear-gradient(165deg,#eef2fd,#dfe7fb); }
.marketing-site .site-journey-board { position:absolute; top:52px; left:150px; width:720px; overflow:hidden; border-radius:14px; background:white; box-shadow:0 34px 60px -24px #0e173366,0 0 0 1px #0e173314; }
.marketing-site .site-journey-board img { display:block; width:100%; height:auto; }
.marketing-site .site-phone { position:absolute; top:38px; left:34px; z-index:2; width:254px; height:504px; padding:8px; border-radius:44px; background:var(--site-ink); box-shadow:0 44px 80px -28px #0e1733a6; }
.marketing-site .site-phone-screen { position:relative; display:flex; flex-direction:column; height:100%; overflow:hidden; border-radius:36px; background:#efeae2; }
.marketing-site .site-phone-status { display:flex; align-items:center; justify-content:space-between; flex-shrink:0; height:32px; padding:0 22px; background:white; font-size:11px; font-weight:700; }
.marketing-site .site-phone-notch { width:68px; height:20px; border-radius:12px; background:var(--site-ink); }
.marketing-site .site-chat { display:flex; flex-direction:column; flex:1; min-height:0; }
.marketing-site .site-chat-head { display:flex; align-items:center; gap:8px; padding:6px 12px 10px; background:white; font-size:12px; line-height:1.25; border-bottom:1px solid #0e17330f; }
.marketing-site .site-chat-head > svg { width:16px; height:16px; color:var(--site-go); }
.marketing-site .site-chat-head small { display:block; color:var(--site-muted); font-size:10px; }
.marketing-site .site-chat-avatar { display:grid; place-items:center; flex-shrink:0; width:28px; height:28px; border-radius:50%; background:var(--site-blue); color:white; font-size:10px; font-weight:800; }
.marketing-site .site-chat-body { display:flex; flex-direction:column; gap:7px; flex:1; padding:10px; }
.marketing-site .site-chat-day { align-self:center; padding:3px 9px; border-radius:6px; background:#ffffffd9; color:var(--site-muted); font-size:10px; }
.marketing-site .site-msg { max-width:86%; padding:7px 9px 5px; border-radius:11px; font-size:11.5px; line-height:1.42; box-shadow:0 1px 0 #0e173312; }
.marketing-site .site-msg small { display:block; margin-top:2px; color:#6f7787; font-size:9px; text-align:right; }
.marketing-site .site-msg.is-out { align-self:flex-end; background:#d9fdd3; border-top-right-radius:3px; }
.marketing-site .site-msg.is-in { align-self:flex-start; background:white; border-top-left-radius:3px; }
.marketing-site .site-msg-slot { position:relative; align-self:flex-start; max-width:86%; }
.marketing-site .site-msg-slot > .site-msg { max-width:100%; }
.marketing-site .site-typing { position:absolute; top:0; left:0; display:flex; gap:3px; padding:10px 11px; border-radius:11px; border-top-left-radius:3px; background:white; opacity:0; }
.marketing-site .site-typing i { width:5px; height:5px; border-radius:50%; background:#9aa3b5; animation:site-dot 1s infinite; }
.marketing-site .site-typing i:nth-child(2) { animation-delay:.15s; }
.marketing-site .site-typing i:nth-child(3) { animation-delay:.3s; }
.marketing-site .site-chat-compose { margin:0 8px 10px!important; padding:8px 12px; border-radius:18px; background:white; color:var(--site-muted); font-size:11px; }
.marketing-site .site-phone-ad { position:absolute; inset:32px 0 0; display:flex; flex-direction:column; background:white; opacity:0; visibility:hidden; transition:opacity .45s,visibility .45s; }
.marketing-site .site-instagram-ad { display:flex; flex-direction:column; height:100%; overflow:hidden; background:white; color:var(--site-ink); }
.marketing-site .site-instagram-bar { display:flex; align-items:center; justify-content:space-between; flex-shrink:0; padding:5px 12px; border-bottom:1px solid var(--site-line); }
.marketing-site .site-instagram-bar > strong { font-family:Georgia,serif; font-size:17px; font-style:italic; letter-spacing:-.6px; }
.marketing-site .site-instagram-bar > span { display:flex; gap:10px; }
.marketing-site .site-instagram-bar svg { width:14px; height:14px; }
.marketing-site .site-ad-head { display:flex; align-items:center; gap:8px; flex-shrink:0; padding:7px 12px; font-size:11px; line-height:1.25; }
.marketing-site .site-ad-head > svg { margin-left:auto; width:14px; height:14px; }
.marketing-site .site-ad-head small { display:block; color:var(--site-muted); font-size:10px; }
.marketing-site .site-ad-art { position:relative; flex:1; min-height:0; overflow:hidden; background:#214564; }
.marketing-site .site-ad-art > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; }
.marketing-site .site-ad-art::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 25%,#081e3b26 45%,#081e3be6 100%); }
.marketing-site .site-ad-art-copy { position:absolute; inset:auto 14px 15px; z-index:1; color:white; }
.marketing-site .site-ad-art-copy > span { color:#e2edff; font-size:9px; font-weight:700; }
.marketing-site .site-ad-art-copy > strong { display:block; margin-top:5px; font-size:29px; font-weight:800; line-height:1.02; letter-spacing:-.04em; }
.marketing-site .site-ad-art-copy > em { display:inline-block; margin-top:10px; padding:5px 8px; border-radius:5px; background:white; color:#18325a; font-size:8.5px; font-style:normal; font-weight:800; }
.marketing-site .site-ad-cta { position:relative; display:flex; align-items:center; justify-content:space-between; flex-shrink:0; padding:8px 12px; background:#eef2f9; font-size:10px; font-weight:700; }
.marketing-site .site-ad-cta svg { width:17px; height:17px; color:#1a9e4b; }
.marketing-site .site-ad-cta::after { content:""; position:absolute; top:50%; left:38%; width:44px; height:44px; margin:-22px; border-radius:50%; background:#2c4eba40; opacity:0; }
.marketing-site .site-ad-actions { display:flex; align-items:center; gap:9px; flex-shrink:0; padding:7px 12px 2px; }
.marketing-site .site-ad-actions svg { width:15px; height:15px; }
.marketing-site .site-ad-actions svg:last-child { margin-left:auto; }
.marketing-site .site-ad-caption { flex-shrink:0; padding:5px 12px 7px; color:var(--site-copy); font-size:9px; line-height:1.4; }
.marketing-site .site-ad-caption strong { color:var(--site-ink); }
.marketing-site .site-instagram-nav { display:flex; align-items:center; justify-content:space-around; flex-shrink:0; padding:7px 5px 9px; border-top:1px solid var(--site-line); }
.marketing-site .site-instagram-nav svg { width:15px; height:15px; }
.marketing-site .site-journey-chip { position:absolute; top:150px; left:298px; z-index:3; display:flex; align-items:center; gap:7px; padding:9px 14px; border-radius:999px; background:white; font-size:12.5px; font-weight:700; box-shadow:0 16px 32px -12px #0e173347; transition:opacity .4s,transform .4s; }
.marketing-site .site-journey-chip svg { width:15px; height:15px; color:var(--site-blue); }
.marketing-site .site-journey-toast { position:absolute; top:22px; right:22px; z-index:3; display:flex; align-items:center; gap:10px; padding:10px 16px 10px 10px; border-radius:14px; background:white; font-size:13px; font-weight:700; box-shadow:0 18px 36px -14px #0e17334d; transition:opacity .45s,transform .45s; }
.marketing-site .site-journey-toast span { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:#e3f6ea; color:var(--site-go); }
.marketing-site .site-journey-toast svg { width:16px; height:16px; }
.marketing-site .site-journey-deal { position:absolute; top:232px; left:318px; z-index:3; width:266px; padding:15px 16px; border-radius:15px; background:white; box-shadow:0 28px 54px -18px #0e17335c,0 0 0 1px #0e17330f; transition:opacity .6s,transform .7s cubic-bezier(.2,.8,.2,1); }
.marketing-site .site-deal-stage { display:flex; align-items:center; gap:6px; color:var(--site-muted); font-size:11.5px; font-weight:600; }
.marketing-site .site-deal-stage i { width:7px; height:7px; border-radius:50%; background:#1aa3e8; }
.marketing-site .site-deal-title { margin-top:7px!important; font-size:14px; font-weight:700; line-height:1.35; }
.marketing-site .site-deal-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px!important; font-size:12px; color:var(--site-muted); }
.marketing-site .site-deal-meta strong { color:var(--site-ink); font-size:14px; }
.marketing-site .site-deal-meta span, .marketing-site .site-deal-ai { display:flex; align-items:center; gap:5px; }
.marketing-site .site-deal-meta svg { width:13px; height:13px; }
.marketing-site .site-deal-ai { margin-top:12px!important; padding-top:11px; border-top:1px solid var(--site-line); color:var(--site-go); font-size:12px; font-weight:700; }
.marketing-site .site-deal-ai svg { width:14px; height:14px; }
.marketing-site .site-journey-pause { position:absolute; right:14px; bottom:14px; z-index:6; display:none; padding:7px 13px; border:0; border-radius:999px; background:#0e1733b3; color:white; font-size:12px; font-weight:600; backdrop-filter:blur(6px); }
.marketing-site .site-journey-pause:hover { background:#0e1733e6; }

/* The story told above the phone, on phones only (see the 640px block). */
.marketing-site .site-journey-story { display:none; }

/* The journey's four steps. */
.marketing-site.has-motion .site-journey-pause { display:block; }
.marketing-site.has-motion .site-journey :is(.site-msg,.site-journey-chip,.site-journey-toast,.site-journey-deal) { opacity:0; }
.marketing-site.has-motion .site-journey .site-msg { transform:translateY(8px); transition:opacity .35s,transform .35s; }
.marketing-site.has-motion .site-journey .site-journey-chip { transform:translateX(-10px); }
.marketing-site.has-motion .site-journey .site-journey-toast { transform:translateY(-12px); }
.marketing-site.has-motion .site-journey .site-journey-deal { transform:translate(-150px,70px) scale(.8); }
.marketing-site.has-motion .site-journey[data-step="1"] .site-phone-ad { opacity:1; visibility:visible; }
.marketing-site.has-motion .site-journey[data-step="1"] .site-ad-art-copy { animation:site-rise .7s .25s both; }
.marketing-site.has-motion .site-journey[data-step="1"] .site-ad-cta::after { animation:site-tap .8s 2.2s both; }
.marketing-site.has-motion .site-journey:is([data-step="2"],[data-step="3"],[data-step="4"]) [data-msg="1"],
.marketing-site.has-motion .site-journey:is([data-step="3"],[data-step="4"]) [data-msg="2"],
.marketing-site.has-motion .site-journey[data-step="4"] :is([data-msg="3"],[data-msg="4"]) { opacity:1; transform:none; }
.marketing-site.has-motion .site-journey[data-step="2"] [data-msg="1"] { transition-delay:.3s; }
.marketing-site.has-motion .site-journey[data-step="2"] [data-typing="2"] { animation:site-typing 2.1s both; }
.marketing-site.has-motion .site-journey[data-step="2"] [data-msg="2"] { opacity:1; transform:none; transition-delay:2.1s; }
.marketing-site.has-motion .site-journey[data-step="3"] [data-msg="3"] { opacity:1; transform:none; transition-delay:.35s; }
.marketing-site.has-motion .site-journey[data-step="3"] [data-typing="4"] { animation:site-typing 2s both; }
.marketing-site.has-motion .site-journey[data-step="3"] [data-msg="4"] { opacity:1; transform:none; transition-delay:2s; }
.marketing-site.has-motion .site-journey:is([data-step="2"],[data-step="3"],[data-step="4"]) .site-journey-chip { opacity:1; transform:none; }
.marketing-site.has-motion .site-journey[data-step="2"] .site-journey-chip { transition-delay:2.4s; }
.marketing-site.has-motion .site-journey[data-step="4"] .site-journey-deal { opacity:1; transform:none; transition-delay:.15s; }
.marketing-site.has-motion .site-journey[data-step="4"] .site-journey-toast { opacity:1; transform:none; transition-delay:.85s; }
.marketing-site.has-motion .site-journey[data-paused="true"] :is(.site-typing,.site-typing i) { animation-play-state:paused; }
@keyframes site-dot { 0%,60%,100% { transform:none; opacity:.55; } 30% { transform:translateY(-3px); opacity:1; } }
@keyframes site-typing { 0%,30% { opacity:0; } 36%,94% { opacity:1; } 100% { opacity:0; } }
@keyframes site-rise { from { opacity:0; transform:translateY(14px); } }
@keyframes site-fill { from { transform:scaleX(0); } to { transform:none; } }
@keyframes site-tap { 0% { opacity:0; transform:scale(.2); } 30% { opacity:1; } 100% { opacity:0; transform:scale(2.4); } }

/* The pain, on night blue: four small scenes and the turn. */
.marketing-site .site-pains { background:var(--site-night); color:white; }
.marketing-site .site-pains h2 { max-width:17ch; color:white; }
.marketing-site .site-pain-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; margin-top:60px; }
.marketing-site .site-pain-grid h3 { color:white; font-size:18px; }
.marketing-site .site-pain-grid li > p { margin-top:8px; color:var(--site-night-copy); font-size:15px; line-height:1.55; }
.marketing-site .site-pain-scene { position:relative; height:176px; margin-bottom:24px; padding:18px; overflow:hidden; border:1px solid #ffffff17; border-radius:18px; background:#ffffff0a; font-size:12px; }
.marketing-site .site-pain-scene.is-months { display:flex; align-items:stretch; gap:9px; padding-top:40px; }
.marketing-site .site-scene-label { position:absolute; top:15px; left:18px; color:#8e9bc4; font-size:11px; font-weight:700; }
.marketing-site .is-months > span { display:flex; flex:1; flex-direction:column; justify-content:flex-end; align-items:center; gap:7px; color:#8e9bc4; font-size:10px; }
.marketing-site .is-months i { width:100%; border-radius:5px 5px 2px 2px; background:linear-gradient(#6f8ff5,#3657c9); transform-origin:bottom; }
.marketing-site .is-months > span:nth-of-type(1) i { height:78%; }
.marketing-site .is-months > span:nth-of-type(2) i { height:24%; }
.marketing-site .is-months > span:nth-of-type(3) i { height:8%; }
.marketing-site .is-months > span:nth-of-type(4) i { height:60%; }
.marketing-site .is-months > span:nth-of-type(5) i { height:16%; }
.marketing-site .is-months > span:nth-of-type(6) i { height:42%; }
.marketing-site .site-pain-scene.is-boost { display:flex; flex-direction:column; gap:10px; }
.marketing-site .site-boost-button { align-self:flex-start; margin-bottom:6px; padding:8px 13px; border-radius:8px; background:var(--site-blue); color:white; font-weight:700; }
.marketing-site .is-boost p { display:flex; align-items:baseline; gap:8px; color:var(--site-night-copy); }
.marketing-site .is-boost strong { color:white; font-size:26px; letter-spacing:-.03em; }
.marketing-site .is-boost p:last-child strong { color:#ff9b9b; }
.marketing-site .site-pain-scene.is-late { display:flex; flex-direction:column; gap:8px; }
.marketing-site :is(.site-late-in,.site-late-out) { max-width:82%; padding:7px 10px; border-radius:10px; line-height:1.35; }
.marketing-site :is(.site-late-in,.site-late-out) small { display:block; margin-top:2px; font-size:9.5px; opacity:.7; text-align:right; }
.marketing-site .site-late-in { align-self:flex-start; background:#ffffff1f; border-top-left-radius:3px; }
.marketing-site .site-late-out { align-self:flex-end; background:#2c4eba; border-top-right-radius:3px; }
.marketing-site .site-late-note { margin-top:auto!important; color:var(--site-signal); font-weight:700; }
.marketing-site .site-pain-scene.is-report p { display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed #ffffff1f; color:var(--site-night-copy); }
.marketing-site .is-report p strong { color:white; }
.marketing-site .is-report .site-report-title { padding-top:0; border:0; color:white; font-weight:700; }
.marketing-site .is-report p:last-child { border:0; }
.marketing-site .is-report p:last-child strong { color:#ff9b9b; }
.marketing-site .site-pains-fact { display:flex; align-items:center; gap:24px; margin-top:56px!important; padding:22px 28px; border:1px solid #ffffff1f; border-radius:18px; background:#ffffff0a; }
.marketing-site .site-pains-fact strong { flex-shrink:0; color:#8fa6f5; font-size:46px; font-weight:800; letter-spacing:-.04em; line-height:1; }
.marketing-site .site-pains-fact span { color:white; font-size:17px; font-weight:600; line-height:1.5; }
.marketing-site .site-pains-fact small { display:block; margin-top:4px; color:#8e9bc4; font-size:12px; font-weight:500; }
.marketing-site .site-pains-turn { margin-top:48px!important; padding-top:40px; border-top:1px solid #ffffff1f; font-size:clamp(26px,3.1vw,42px); font-weight:800; letter-spacing:-.035em; line-height:1.15; }
.marketing-site.has-motion .site-pain-grid > li { opacity:0; transform:translateY(18px); transition:opacity .6s,transform .6s; }
.marketing-site.has-motion .site-pain-grid .is-months i { transform:scaleY(0); transition:transform .9s cubic-bezier(.2,.8,.2,1); }
.marketing-site.has-motion .site-pain-grid.is-revealed > li { opacity:1; transform:none; }
.marketing-site.has-motion .site-pain-grid.is-revealed .is-months i { transform:none; }
.marketing-site.has-motion .site-pain-grid > li:nth-child(2) { transition-delay:.15s; }
.marketing-site.has-motion .site-pain-grid > li:nth-child(3) { transition-delay:.3s; }
.marketing-site.has-motion .site-pain-grid > li:nth-child(4) { transition-delay:.45s; }
.marketing-site.has-motion .is-months > span:nth-of-type(n) i { transition-delay:calc(.3s + var(--bar-delay,0s)); }
.marketing-site.has-motion .is-months > span:nth-of-type(2) { --bar-delay:.08s; }
.marketing-site.has-motion .is-months > span:nth-of-type(3) { --bar-delay:.16s; }
.marketing-site.has-motion .is-months > span:nth-of-type(4) { --bar-delay:.24s; }
.marketing-site.has-motion .is-months > span:nth-of-type(5) { --bar-delay:.32s; }
.marketing-site.has-motion .is-months > span:nth-of-type(6) { --bar-delay:.4s; }

/* The system: four pieces in order, joined by one thread. */
.marketing-site .site-system-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; }
.marketing-site .site-system-steps > li { position:relative; }
.marketing-site .site-system-steps > li:not(:last-child)::before { content:""; position:absolute; top:240px; left:36px; right:-28px; height:2px; background:var(--site-blue); transform-origin:left; }
.marketing-site .site-system-art { position:relative; height:206px; margin-bottom:17px; overflow:hidden; border:1px solid var(--site-line); border-radius:20px; background:var(--site-soft); }
.marketing-site .site-system-number { position:relative; z-index:1; display:grid; place-items:center; width:36px; height:36px; border:2px solid var(--site-blue); border-radius:50%; background:white; color:var(--site-blue); font-size:14px; font-weight:800; }
.marketing-site .site-system-steps h3 { margin-top:18px; }
.marketing-site .site-system-steps li > p { margin-top:10px; color:var(--site-copy); font-size:15px; line-height:1.6; }
.marketing-site .site-mini-ad { position:absolute; top:22px; width:106px; overflow:hidden; border-radius:9px; box-shadow:0 14px 26px -12px #0e173359; }
.marketing-site .site-mini-ad.is-gym { left:calc(50% - 124px); transform:rotate(-9deg); }
.marketing-site .site-mini-ad.is-school { left:calc(50% + 18px); transform:rotate(9deg); }
.marketing-site .site-mini-ad.is-clinic { left:calc(50% - 64px); top:10px; z-index:1; width:128px; box-shadow:0 20px 34px -14px #0e173380; }
.marketing-site .site-instagram-ad.is-compact .site-ad-head { gap:4px; padding:5px 6px; font-size:6.5px; }
.marketing-site .site-instagram-ad.is-compact .site-ad-head small { font-size:5.5px; }
.marketing-site .site-instagram-ad.is-compact .site-chat-avatar { width:16px; height:16px; font-size:6px; }
.marketing-site .site-instagram-ad.is-compact .site-ad-head > svg { width:9px; height:9px; }
.marketing-site .site-instagram-ad.is-compact .site-ad-art { flex:auto; height:auto; aspect-ratio:1; }
.marketing-site .site-instagram-ad.is-compact .site-ad-art-copy { inset:auto 8px 9px; }
.marketing-site .site-instagram-ad.is-compact .site-ad-art-copy > span { display:none; }
.marketing-site .site-instagram-ad.is-compact .site-ad-art-copy > strong { font-size:16px; line-height:1.04; }
.marketing-site .site-instagram-ad.is-compact .site-ad-cta { padding:5px 6px; font-size:6.5px; }
.marketing-site .site-instagram-ad.is-compact .site-ad-cta svg { width:10px; height:10px; }
.marketing-site .site-instagram-ad.is-gym .site-ad-art::after { background:linear-gradient(transparent 15%,#12251bcc 100%); }
.marketing-site .site-instagram-ad.is-academy .site-ad-art::after { background:linear-gradient(transparent 15%,#502813e6 100%); }
.marketing-site .site-example-label { position:absolute; bottom:6px; inset-inline:0; color:var(--site-muted); font-size:8px; font-weight:600; text-align:center; }
.marketing-site .site-mini-window { position:absolute; inset:22px 24px 0; overflow:hidden; border-radius:10px 10px 0 0; background:white; box-shadow:0 12px 30px -14px #0e173340; }
.marketing-site .site-mini-window > span { display:block; }
.marketing-site .site-mini-browser { display:flex!important; gap:4px; padding:9px 10px; border-bottom:1px solid var(--site-line); }
.marketing-site .site-mini-browser i { width:6px; height:6px; border-radius:50%; background:#cfd5e2; }
.marketing-site .site-mini-browser { align-items:center; }
.marketing-site .site-mini-browser small { margin-left:auto; color:var(--site-muted); font-size:7px; }
.marketing-site .site-mini-landing-copy { padding:9px 14px 0; }
.marketing-site .site-mini-landing-copy > strong { display:block; font-size:14px; font-weight:800; line-height:1.1; letter-spacing:-.03em; }
.marketing-site .site-mini-landing-copy > p { margin-top:4px; color:var(--site-copy); font-size:7.5px; }
.marketing-site .site-mini-video { position:relative; display:grid!important; place-items:center; height:54px; margin:8px 14px 0; overflow:hidden; border-radius:6px; background:var(--site-night); color:white; }
.marketing-site .site-mini-video > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 28%; filter:brightness(.7); }
.marketing-site .site-mini-video > span { position:relative; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:white; color:var(--site-blue); }
.marketing-site .site-mini-video svg { width:18px; height:18px; fill:currentColor; }
.marketing-site .site-mini-button { width:max-content; margin:7px 14px 0; padding:5px 8px; border-radius:5px; background:var(--site-blue); color:white; font-size:8px; font-weight:700; }
.marketing-site .site-system-art.is-chat { display:flex; flex-direction:column; gap:8px; padding:26px 18px; background:#efeae2; }
.marketing-site .site-mini-msg { max-width:80%; padding:8px 11px; border-radius:11px; font-size:12px; line-height:1.4; box-shadow:0 1px 0 #0e173312; }
.marketing-site .site-mini-msg.is-out { align-self:flex-end; background:#d9fdd3; border-top-right-radius:3px; }
.marketing-site .site-mini-msg.is-in { align-self:flex-start; background:white; border-top-left-radius:3px; }
.marketing-site .site-mini-tag { display:flex; align-items:center; gap:5px; align-self:flex-start; padding:4px 9px; border-radius:999px; background:#e7ebfb; color:var(--site-blue); font-size:10.5px; font-weight:700; }
.marketing-site .site-mini-tag svg { width:12px; height:12px; }
.marketing-site .site-system-art.is-crm { display:flex; flex-direction:column; gap:8px; padding:20px 26px; }
.marketing-site .site-mini-column { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:700; }
.marketing-site .site-mini-column i { width:7px; height:7px; border-radius:50%; background:#1aa3e8; }
.marketing-site .site-mini-column span { padding:1px 6px; border-radius:6px; background:#e3e7f0; color:var(--site-muted); font-size:10px; }
.marketing-site .site-mini-card { display:grid; gap:3px; padding:11px 12px; border-radius:11px; background:white; box-shadow:0 1px 0 #0e173314,0 8px 18px -12px #0e173333; font-size:11px; color:var(--site-muted); }
.marketing-site .site-mini-card strong { color:var(--site-ink); font-size:12.5px; }
.marketing-site .site-mini-card.is-new { box-shadow:0 0 0 2px var(--site-go),0 12px 24px -12px #16924d66; }
.marketing-site.has-motion .site-system-steps > li:not(:last-child)::before { transform:scaleX(0); transition:transform .7s cubic-bezier(.4,0,.2,1); }
.marketing-site.has-motion .site-system-steps.is-revealed > li::before { transform:none; }
.marketing-site.has-motion .site-system-steps > li:nth-child(2)::before { transition-delay:.6s; }
.marketing-site.has-motion .site-system-steps > li:nth-child(3)::before { transition-delay:1.2s; }
.marketing-site.has-motion .site-system-steps .site-mini-card.is-new { opacity:0; transform:translateY(-10px); transition:opacity .5s 2s,transform .5s 2s; }
.marketing-site.has-motion .site-system-steps.is-revealed .site-mini-card.is-new { opacity:1; transform:none; }

.marketing-site .site-system { padding-bottom:96px; }
.marketing-site .site-video-band { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px 32px; margin-top:72px; padding:24px 26px 24px 34px; border:1px solid var(--site-line); border-radius:22px; background:var(--site-soft); }
.marketing-site .site-video-band p { color:var(--site-copy); font-size:18px; line-height:1.5; }
.marketing-site .site-video-band strong { color:var(--site-ink); }

/* Who we have worked with: logos by size, then rows of sector tags drifting
   in alternate directions. Without motion the tags sit still, wrapped and
   centred, with the repeated copies hidden. */
.marketing-site .site-sectors { background:var(--site-night); color:white; text-align:center; }
.marketing-site .site-sectors .site-heading { max-width:900px; margin-inline:auto; }
.marketing-site .site-sectors h2 { color:white; }
.marketing-site .site-sectors .site-heading > p { max-width:60ch; margin-inline:auto; color:var(--site-night-copy); text-wrap:balance; }
.marketing-site .site-clients { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:36px 28px; max-width:1100px; margin:0 auto 64px; }
.marketing-site .site-clients li { display:grid; place-items:center; height:52px; }
.marketing-site .site-clients img { display:block; width:var(--logo-w); max-width:100%; max-height:40px; height:auto; object-fit:contain; opacity:.6; transition:opacity .2s; }
.marketing-site .site-clients li:hover img { opacity:1; }
.marketing-site .site-sector-rows { display:grid; gap:14px; width:min(1080px,calc(100% - 64px)); margin-inline:auto; }
.marketing-site .site-sector-track { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.marketing-site .site-sector-track li { flex-shrink:0; padding:11px 20px; border:1px solid #ffffff24; border-radius:999px; background:#ffffff0d; color:white; font-size:15px; font-weight:600; line-height:1.3; white-space:nowrap; transition:background .2s,border-color .2s; }
.marketing-site .site-sector-track li::before { content:""; display:inline-block; width:7px; height:7px; margin-right:10px; border-radius:50%; background:#7f97ee; vertical-align:2px; }
.marketing-site .site-sector-track li:hover { border-color:var(--site-blue); background:var(--site-blue); }
.marketing-site .site-sector-track .is-copy { display:none; }
.marketing-site .site-sector-foot { display:flex; flex-direction:column; align-items:center; gap:18px; margin-top:44px; }
.marketing-site .site-sector-ask { display:inline-flex; align-items:center; gap:11px; padding:8px 22px 8px 8px; border-radius:999px; background:white; color:var(--site-ink); font-size:15px; font-weight:700; transition:background .2s; }
.marketing-site .site-sector-ask:hover { background:#e9eefc; }
.marketing-site .site-sector-ask .site-play { flex-shrink:0; width:30px; height:30px; background:var(--site-blue); color:white; }
.marketing-site .site-sector-ask .site-play svg { width:12px; height:12px; }
.marketing-site .site-marquee-pause { display:none; padding:0; border:0; background:none; color:var(--site-night-copy); font-size:12px; font-weight:600; }
.marketing-site .site-marquee-pause:hover { color:white; text-decoration:underline; text-underline-offset:3px; }
.marketing-site.has-motion .site-marquee-pause { display:block; }
.marketing-site.has-motion .site-sector-rows { width:100%; mask-image:linear-gradient(90deg,transparent,black 12%,black 88%,transparent); }
.marketing-site.has-motion .site-sector-row { overflow:hidden; }
.marketing-site.has-motion .site-sector-track { flex-wrap:nowrap; justify-content:flex-start; width:max-content; padding-right:12px; animation:site-marquee var(--duration,60s) linear infinite; }
.marketing-site.has-motion .site-sector-track .is-copy { display:block; }
.marketing-site.has-motion .is-reverse .site-sector-track { animation-direction:reverse; }
.marketing-site.has-motion .site-sector-rows:hover .site-sector-track,
.marketing-site.has-motion .site-sector-rows[data-paused="true"] .site-sector-track { animation-play-state:paused; }
@keyframes site-marquee { to { transform:translateX(-50%); } }

/* Done for you: the client's three lines against the team's eight. */
.marketing-site .site-done { background:var(--site-soft); }
.marketing-site .site-done-grid { display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:24px; }
.marketing-site .site-done-grid h3 { font-size:15px; }
.marketing-site .site-done-yours { padding:40px; border-radius:24px; background:var(--site-ink); color:white; }
.marketing-site .site-done-yours h3 { color:var(--site-night-copy); }
.marketing-site .site-done-yours ol { margin-top:22px; counter-reset:yours; }
.marketing-site .site-done-yours li { display:flex; gap:16px; padding:20px 0; border-bottom:1px solid #ffffff1a; font-size:clamp(20px,2vw,26px); font-weight:700; letter-spacing:-.025em; line-height:1.25; counter-increment:yours; }
.marketing-site .site-done-yours li:last-child { border:0; padding-bottom:0; }
.marketing-site .site-done-yours li::before { content:counter(yours); flex-shrink:0; width:28px; color:#7f97ee; font-size:15px; line-height:1.9; }
.marketing-site .site-done-ours { padding:40px; border:1px solid var(--site-line); border-radius:24px; background:white; }
.marketing-site .site-done-ours h3 { color:var(--site-muted); }
.marketing-site .site-done-ours ul { display:grid; grid-template-columns:1fr 1fr; gap:6px 32px; margin-top:22px; }
.marketing-site .site-done-ours li { display:flex; align-items:center; gap:13px; padding:12px 0; border-bottom:1px solid var(--site-line); font-size:16px; font-weight:600; }
.marketing-site .site-done-check { display:grid; place-items:center; flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--site-go); color:white; }
.marketing-site .site-done-check svg { width:14px; height:14px; }
.marketing-site.has-motion .site-done-ours .site-done-check { background:white; color:transparent; box-shadow:inset 0 0 0 2px var(--site-line); transition:background .3s,color .3s,box-shadow .3s; }
.marketing-site.has-motion .site-done-ours .is-revealed .site-done-check { background:var(--site-go); color:white; box-shadow:none; }
.marketing-site.has-motion .site-done-ours li:nth-child(2) .site-done-check { transition-delay:.18s; }
.marketing-site.has-motion .site-done-ours li:nth-child(3) .site-done-check { transition-delay:.36s; }
.marketing-site.has-motion .site-done-ours li:nth-child(4) .site-done-check { transition-delay:.54s; }
.marketing-site.has-motion .site-done-ours li:nth-child(5) .site-done-check { transition-delay:.72s; }
.marketing-site.has-motion .site-done-ours li:nth-child(6) .site-done-check { transition-delay:.9s; }
.marketing-site.has-motion .site-done-ours li:nth-child(7) .site-done-check { transition-delay:1.08s; }
.marketing-site.has-motion .site-done-ours li:nth-child(8) .site-done-check { transition-delay:1.26s; }

/* The CRM, with real captures the visitor switches. */
.marketing-site .site-crm-tabs { display:inline-flex; flex-wrap:wrap; gap:4px; margin-bottom:24px; padding:5px; border:1px solid var(--site-line); border-radius:14px; background:var(--site-soft); }
.marketing-site .site-crm-tab { display:flex; align-items:center; gap:8px; min-height:44px; padding:10px 18px; border:0; border-radius:10px; background:transparent; color:var(--site-copy); font-size:14px; font-weight:600; }
.marketing-site .site-crm-tab:hover { color:var(--site-ink); }
.marketing-site .site-crm-tab.is-active { background:white; color:var(--site-ink); box-shadow:0 1px 2px #0e17331a,0 4px 10px -4px #0e17331a; }
.marketing-site .site-crm-panel + .site-crm-panel { margin-top:40px; }
.marketing-site .is-cycling .site-crm-panel + .site-crm-panel { margin-top:0; }
.marketing-site .site-crm-screen { overflow:hidden; border-radius:20px; background:white; box-shadow:0 40px 80px -40px #0e173359,0 0 0 1px #0e173314; }
.marketing-site .site-crm-screen img { display:block; width:100%; height:auto; }
.marketing-site .site-crm-caption { max-width:62ch; margin-top:20px!important; color:var(--site-copy); font-size:16px; line-height:1.6; }
.marketing-site .site-crm-note { margin-top:12px!important; color:var(--site-muted); font-size:12px; }


/* Meta: Keddly in the middle, the services it connects to around it. */
.marketing-site .site-meta { background:var(--site-soft); }
.marketing-site .site-meta-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:64px; align-items:center; }
.marketing-site .site-meta h2 { max-width:14ch; }
.marketing-site .site-meta-lead { max-width:50ch; margin-top:22px!important; color:var(--site-copy); font-size:18px; line-height:1.65; }
.marketing-site .site-meta-points { display:grid; gap:22px; margin-top:34px!important; }
.marketing-site .site-meta-points li { display:flex; gap:16px; }
.marketing-site .site-meta-points li > span { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; border:1px solid var(--site-line); border-radius:12px; background:white; color:var(--site-blue); }
.marketing-site .site-meta-points li > span svg { width:20px; height:20px; }
.marketing-site .site-meta-points h3 { font-size:17px; }
.marketing-site .site-meta-points p { margin-top:4px!important; color:var(--site-copy); font-size:15px; line-height:1.55; }
.marketing-site .site-meta-art { position:relative; width:100%; max-width:440px; aspect-ratio:1; margin-inline:auto; border:1px solid var(--site-line); border-radius:28px; background:radial-gradient(#c9d4f3 1.1px,transparent 1.3px) 0 0/20px 20px,white; }
.marketing-site .site-meta-art .site-meta-lines { position:absolute; inset:0; width:100%; height:100%; }
.marketing-site .site-meta-lines path { fill:none; stroke:var(--site-blue); stroke-width:2; stroke-dasharray:6 7; vector-effect:non-scaling-stroke; }
.marketing-site .site-meta-hub { position:absolute; top:50%; left:50%; translate:-50% -50%; display:grid; place-items:center; width:148px; height:148px; border-radius:50%; background:white; box-shadow:0 24px 50px -20px #0e173359,0 0 0 10px #2c4eba14; }
.marketing-site .site-meta-hub img { width:96px; height:auto; }
.marketing-site .site-meta-node { position:absolute; display:grid; justify-items:center; gap:8px; translate:-50% -50%; font-size:12px; font-weight:700; }
.marketing-site .site-meta-node svg { box-sizing:content-box; width:28px; height:28px; padding:16px; border-radius:18px; background:white; box-shadow:0 14px 30px -14px #0e173359,0 0 0 1px #0e173312; }
.marketing-site .site-meta-node.is-meta { top:17.5%; left:17.5%; color:#0866ff; }
.marketing-site .site-meta-node.is-whatsapp { top:17.5%; left:82.5%; color:#1fa855; }
.marketing-site .site-meta-node.is-instagram { top:82.5%; left:17.5%; color:#d62976; }
.marketing-site .site-meta-node.is-facebook { top:82.5%; left:82.5%; color:#1877f2; }
.marketing-site .site-meta-node small { color:var(--site-ink); }
.marketing-site .site-meta-badge { position:absolute; bottom:-18px; left:50%; translate:-50% 0; display:flex; align-items:center; gap:7px; padding:9px 16px; border-radius:999px; background:var(--site-ink); color:white; font-size:13px; font-weight:700; white-space:nowrap; }
.marketing-site .site-meta-badge svg { width:15px; height:15px; color:#4ade80; }
.marketing-site.has-motion .site-meta-lines { opacity:0; transition:opacity .8s; }
.marketing-site.has-motion .site-meta-art.is-revealed .site-meta-lines { opacity:1; }
.marketing-site.has-motion .site-meta-art.is-revealed .site-meta-lines path { animation:site-flow 1.2s linear 4; }
@keyframes site-flow { to { stroke-dashoffset:-26; } }

/* Launch: seven days on one line, how billing works and who it is for. */
.marketing-site .site-launch-steps { position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:24px; }
.marketing-site .site-launch-steps::before, .marketing-site .site-launch-steps::after { content:""; position:absolute; top:19px; left:20px; right:calc(20% - 39px); height:2px; background:var(--site-line); }
.marketing-site .site-launch-steps::after { background:var(--site-blue); transform-origin:left; }
.marketing-site .site-launch-steps > li { position:relative; z-index:1; }
.marketing-site .site-launch-dot { display:grid; place-items:center; width:40px; height:40px; border:2px solid var(--site-blue); border-radius:50%; background:white; color:var(--site-blue); font-size:15px; font-weight:800; }
.marketing-site .site-launch-steps > li:last-child .site-launch-dot { border-color:var(--site-go); background:var(--site-go); color:white; }
.marketing-site .site-launch-day { display:block; margin-top:14px; color:var(--site-blue); font-size:12px; font-weight:800; }
.marketing-site .site-launch-steps h3 { margin-top:14px; font-size:17px; }
.marketing-site .site-launch-day + h3 { margin-top:4px; }
.marketing-site .site-launch-steps li > p { margin-top:8px; color:var(--site-copy); font-size:14.5px; line-height:1.55; }
.marketing-site.has-motion .site-launch-steps::after { transform:scaleX(0); transition:transform 1.6s cubic-bezier(.4,0,.2,1) .2s; }
.marketing-site.has-motion .site-launch-steps.is-revealed::after { transform:none; }
.marketing-site .site-launch-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:60px!important; }
.marketing-site .site-launch-facts li { display:flex; gap:14px; padding:22px; border:1px solid var(--site-line); border-radius:18px; background:white; }
.marketing-site .site-launch-facts svg { width:22px; height:22px; margin-top:1px; color:var(--site-blue); }
.marketing-site .site-launch-facts p { color:var(--site-copy); font-size:15px; line-height:1.55; }
.marketing-site .site-launch-facts strong { display:block; margin-bottom:4px; color:var(--site-ink); font-size:16px; }
.marketing-site .site-fit { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:18px; }
.marketing-site .site-fit > div { padding:28px 30px; border-radius:20px; }
.marketing-site .site-fit h3 { font-size:18px; }
.marketing-site .site-fit-yes { background:var(--site-ink); color:white; }
.marketing-site .site-fit-no { border:1px solid var(--site-line); background:white; }
.marketing-site .site-fit ul { display:grid; gap:12px; margin-top:16px!important; }
.marketing-site .site-fit li { display:flex; gap:10px; font-size:15px; line-height:1.5; }
.marketing-site .site-fit li svg { width:18px; height:18px; margin-top:2px; }
.marketing-site .site-fit-yes li svg { color:#4ade80; }
.marketing-site .site-fit-no li { color:var(--site-copy); }
.marketing-site .site-fit-no li svg { color:#e5484d; }

/* Questions: the objections, answered in the terms' own words. */
.marketing-site .site-faq-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; align-items:start; }
.marketing-site .site-faq-grid > div:first-child { position:sticky; top:110px; }
.marketing-site .site-faq h2 { max-width:13ch; }
.marketing-site .site-faq-more { margin-top:20px!important; color:var(--site-copy); font-size:15px; line-height:1.7; }
.marketing-site .site-faq-video { margin-top:26px; }
.marketing-site .site-faq-list { border-top:1px solid var(--site-line); }
.marketing-site .site-faq details { border-bottom:1px solid var(--site-line); }
.marketing-site .site-faq summary { display:flex; justify-content:space-between; gap:16px; padding:20px 0; font-size:16.5px; font-weight:700; line-height:1.45; cursor:pointer; list-style:none; }
.marketing-site .site-faq summary::-webkit-details-marker { display:none; }
.marketing-site .site-faq summary svg { width:18px; height:18px; margin-top:3px; color:var(--site-muted); transition:transform .2s; }
.marketing-site .site-faq details[open] summary svg { transform:rotate(45deg); }
.marketing-site .site-faq details p { max-width:70ch; padding:0 34px 22px 0; color:var(--site-copy); font-size:15px; line-height:1.7; }

/* Closing: the video, once more, on night blue. */
.marketing-site .site-closing { margin:0 16px 16px; padding:104px 0; border-radius:32px; color:white; background:radial-gradient(800px 500px at 85% 20%,#2c4eba73,transparent 70%),var(--site-night); }
.marketing-site .site-closing-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center; }
.marketing-site .site-closing h2 { max-width:11ch; color:white; font-size:clamp(40px,4.8vw,66px); }
.marketing-site .site-closing-copy > p { max-width:44ch; margin-top:24px; color:var(--site-night-copy); font-size:18px; line-height:1.65; }
.marketing-site .site-closing-actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px 26px; margin-top:36px; }
.marketing-site .site-closing-actions .site-button { min-height:58px; padding:10px 24px 10px 11px; border-radius:16px; font-size:16px; }
.marketing-site .site-video-card { position:relative; display:flex; flex-direction:column; justify-content:space-between; aspect-ratio:16/10; padding:26px; overflow:hidden; border:1px solid #ffffff26; border-radius:24px; background:linear-gradient(160deg,#20368f,#0d1a4d); color:white; box-shadow:0 40px 80px -40px #000000a6; }
.marketing-site .site-video-card::before { content:""; position:absolute; inset:0; background:radial-gradient(#ffffff1f 1.1px,transparent 1.3px) 0 0/20px 20px; mask-image:linear-gradient(transparent,black); }
.marketing-site .site-video-card-play { position:relative; display:grid; place-items:center; align-self:center; margin-top:8%; width:84px; height:84px; border-radius:50%; background:white; color:var(--site-blue); box-shadow:0 0 0 14px #ffffff1a; transition:transform .2s; }
.marketing-site .site-video-card-play svg { width:30px; height:30px; margin-left:4px; fill:currentColor; }
.marketing-site .site-video-card:hover .site-video-card-play { transform:scale(1.06); }
.marketing-site .site-video-card-text { position:relative; display:grid; gap:6px; }
.marketing-site .site-video-card-text strong { max-width:24ch; font-size:20px; line-height:1.25; letter-spacing:-.02em; }
.marketing-site .site-video-card-text small { color:var(--site-night-copy); font-size:13px; }
.marketing-site .site-video-card-text .site-player-host { margin-top:8px; gap:10px; }
.marketing-site .site-video-card-text .site-player-host img { width:36px; height:36px; }

.marketing-site .site-sticky-cta { display:none; }

/* Advertising preferences: equal choices, independent of video access. */
.marketing-site .site-cookie-panel { position:fixed; z-index:80; right:20px; bottom:20px; width:min(480px,calc(100% - 40px)); padding:22px; border:1px solid var(--site-line); border-radius:18px; background:white; color:var(--site-ink); box-shadow:0 16px 64px #0e17332e; }
.marketing-site .site-cookie-panel > strong { font-size:16px; font-weight:800; }
.marketing-site .site-cookie-panel > p { margin:8px 0 0; font-size:13px; line-height:1.6; color:var(--site-copy); }
.marketing-site .site-cookie-panel a { color:var(--site-blue); text-decoration:underline; text-underline-offset:3px; }
.marketing-site .site-cookie-actions { display:flex; gap:10px; margin-top:16px; }
.marketing-site .site-cookie-actions button { flex:1; min-height:44px; padding:10px 8px; border:1px solid var(--site-blue); border-radius:9px; color:var(--site-blue); background:white; font-size:12px; font-weight:700; }
.marketing-site .site-cookie-actions button:hover { background:var(--site-soft); }
.marketing-site .site-cookie-actions button:disabled { opacity:.65; cursor:wait; }
.marketing-site .site-cookie-panel .site-cookie-status:empty { display:none; }
.marketing-site .site-cookie-preferences { position:fixed; bottom:12px; left:12px; z-index:45; min-height:36px; padding:6px 12px; border:1px solid var(--site-line); border-radius:9px; background:white; color:var(--site-copy); font-size:11px; font-weight:600; box-shadow:0 3px 16px #0e17331a; }
.marketing-site.has-cookie-panel .site-sticky-cta { display:none; }
@media (max-width:640px) {
  .marketing-site .site-cookie-panel { right:12px; bottom:12px; width:calc(100% - 24px); padding:18px; }
  .marketing-site.has-sticky-cta .site-cookie-preferences { bottom:80px; }
}

/* Shared footer, scoped so contact and legal typography is unaffected. */
.marketing-site .site-footer { padding:50px 0 28px; border-top:1px solid var(--site-line); }
.marketing-site .site-footer-top { display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:40px; }
.marketing-site .site-footer-brand img { width:106px; height:31px; object-fit:contain; }
.marketing-site .site-footer-brand p { max-width:36ch; margin:16px 0 0; font-size:13px; line-height:1.75; color:var(--site-copy); }
.marketing-site .site-footer nav h2 { margin:0 0 13px; font-size:13px; font-weight:700; }
.marketing-site .site-footer nav a { display:block; padding:6px 0; color:var(--site-copy); font-size:13px; }
.marketing-site .site-footer nav a:hover { color:var(--site-blue); }
.marketing-site .site-footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; border-top:1px solid var(--site-line); padding-top:22px; margin-top:40px; font-size:11px; line-height:1.7; color:var(--site-muted); }
.marketing-site .site-footer-bottom p { margin:0; }

/* The masterclass at /video, once signed up: a page with no header or
   footer, all night blue: the title, the video (a placeholder until it is
   on Wistia) and, right under it, the two ways to talk to the team. */
/* The funnel's two pages, the sign-up at /video and the masterclass after
   it: no header or footer, night blue edge to edge, html and body included,
   so no white shows past the end or when a phone overscrolls. */
html:has(.site-funnel), .marketing-site:has(> .site-funnel) { background:var(--site-night,#0b1742); }
.marketing-site .site-funnel { min-height:100vh; min-height:100dvh; background:radial-gradient(900px 520px at 50% -10%,#2c4eba66,transparent 70%),var(--site-night); color:white; }
.marketing-site .site-masterclass { padding:72px 0 96px; }
.marketing-site .site-masterclass :where(h1,h2,p) { margin:0; }
.marketing-site .site-masterclass-head { max-width:820px; margin-inline:auto; text-align:center; }
.marketing-site .site-masterclass-head h1 { font-size:clamp(32px,4.4vw,54px); font-weight:800; line-height:1.04; letter-spacing:-.045em; text-wrap:balance; }
.marketing-site .site-masterclass-head h1 + p { margin-top:16px; color:var(--site-night-copy); font-size:18px; line-height:1.55; }
.marketing-site .site-masterclass-video { position:relative; max-width:980px; aspect-ratio:16/9; margin:40px auto 0; overflow:hidden; border-radius:22px; background:#060f2e; box-shadow:0 50px 100px -40px #000000b3,0 0 0 1px #ffffff14; }
.marketing-site .site-masterclass-video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.marketing-site .site-masterclass-soon { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; background:radial-gradient(520px 300px at 50% 42%,#2c4eba59,transparent 70%); color:var(--site-night-copy); font-size:16px; font-weight:600; }
.marketing-site .site-video-play { display:grid; place-items:center; width:76px; height:76px; border-radius:50%; background:white; color:var(--site-blue); box-shadow:0 0 0 12px #ffffff14; }
.marketing-site .site-video-play svg { width:28px; height:28px; margin-left:3px; fill:currentColor; }
.marketing-site .site-funnel-logo { display:block; width:104px; height:auto; margin:0 auto 32px; filter:brightness(0) invert(1); }
.marketing-site .site-masterclass-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:36px; }
.marketing-site.has-motion .site-masterclass-actions:not([hidden]) { animation:site-rise .6s cubic-bezier(.2,.8,.2,1) both; }
.marketing-site .site-masterclass-actions .site-button { min-height:58px; padding-inline:28px; border-radius:16px; font-size:16px; }
.marketing-site .site-masterclass-actions .site-button svg { width:19px; height:19px; }
.marketing-site .site-button-ghost { border-color:#ffffff40; background:transparent; color:white; }
.marketing-site .site-button-ghost:hover { border-color:#ffffff73; background:#ffffff14; }
.marketing-site .site-button-ghost svg { color:#c9d4ff; }

/* The masterclass sign-up: what the visitor will see and who presents it, on
   night blue, then a name and an email. A dialog on every page, opened by
   any "Ver cómo funciona", and the page at /video. */
.marketing-site:has(.site-dialog[open]) { overflow:hidden; }
.marketing-site .site-dialog { width:min(940px,calc(100% - 32px)); max-width:none; max-height:calc(100dvh - 32px); margin:auto; padding:0; border:0; border-radius:28px; background:white; color:var(--site-ink); box-shadow:0 60px 120px -40px #0b1742e6; overflow:auto; overscroll-behavior:contain; }
.marketing-site .site-dialog::backdrop { background:#0b1742bf; backdrop-filter:blur(6px); }
.marketing-site.has-motion .site-dialog[open] { animation:site-dialog-in .3s cubic-bezier(.2,.8,.2,1); }
.marketing-site.has-motion .site-dialog[open]::backdrop { animation:site-backdrop-in .3s ease-out; }
@keyframes site-dialog-in { from { opacity:0; transform:translateY(18px) scale(.98); } }
@keyframes site-backdrop-in { from { opacity:0; } }
.marketing-site .site-dialog-close { position:absolute; top:16px; right:16px; z-index:2; display:grid; place-items:center; width:40px; height:40px; border:0; border-radius:50%; background:var(--site-soft); color:var(--site-ink); transition:background .15s; }
.marketing-site .site-dialog-close:hover { background:var(--site-line); }
.marketing-site .site-dialog-close svg { width:18px; height:18px; }
.marketing-site .site-signup { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.marketing-site .site-signup :where(h1,h2,p,ul) { margin:0; }
.marketing-site .site-signup-intro { display:flex; flex-direction:column; justify-content:center; padding:48px 44px; background:radial-gradient(520px 380px at 0 0,#2c4eba70,transparent 70%),var(--site-night); color:white; }
.marketing-site .site-signup-title { margin-top:16px!important; font-size:clamp(26px,2.6vw,32px); font-weight:800; line-height:1.1; letter-spacing:-.035em; text-wrap:balance; }
.marketing-site .site-signup-lead { max-width:34ch; margin-top:16px!important; color:var(--site-night-copy); font-size:17px; line-height:1.55; text-wrap:pretty; }
.marketing-site .site-signup-intro .site-player-host { margin-top:30px; padding-top:24px; border-top:1px solid #ffffff1f; }
.marketing-site .site-signup-body { display:flex; flex-direction:column; justify-content:center; padding:52px 44px 40px; }
.marketing-site .site-signup-form-title { font-size:24px; font-weight:800; line-height:1.2; letter-spacing:-.03em; }
.marketing-site .site-signup-form-lead { margin-top:8px!important; color:var(--site-copy); font-size:15.5px; line-height:1.5; }
.marketing-site .site-signup-form { display:flex; flex-direction:column; gap:18px; margin-top:28px; }
.marketing-site .site-field label { display:block; margin-bottom:7px; font-size:14px; font-weight:700; }
.marketing-site .site-field input { width:100%; min-height:52px; padding:13px 16px; border:1px solid #d6dcea; border-radius:12px; background:#fbfcfe; color:var(--site-ink); font-size:16px; transition:border-color .15s,box-shadow .15s,background .15s; }
.marketing-site .site-field input::placeholder { color:#97a0b8; }
.marketing-site .site-field input:focus, .marketing-site .site-field input:focus-visible { outline:none; border-color:var(--site-blue); border-radius:12px; background:white; box-shadow:0 0 0 4px #2c4eba29; }
.marketing-site .site-field input.is-invalid { border-color:#dc2626; background:#fff8f8; }
.marketing-site .site-field-error { margin:7px 0 0!important; color:#b91c1c; font-size:13.5px; line-height:1.4; }
.marketing-site .site-form-alert { margin:0; padding:12px 14px; border-radius:12px; background:#fef2f2; color:#b91c1c; font-size:14px; line-height:1.45; }
.marketing-site .site-form-status { margin:0; color:var(--site-copy); font-size:14px; line-height:1.45; }
/* Turnstile takes no room until Cloudflare needs a click (turnstile_controller.js
   adds is-visible). Never display:none: the challenge runs inside it. */
.marketing-site .site-turnstile:not(.is-visible) { position:absolute; }
.marketing-site .site-honeypot { display:none; }
.marketing-site .site-signup-submit { width:100%; margin-top:4px; }
.marketing-site .site-signup-privacy { color:var(--site-muted); font-size:13px; text-align:center; }
.marketing-site .site-signup-privacy a { display:inline-flex; align-items:center; gap:6px; color:inherit; text-decoration:none; }
.marketing-site .site-signup-privacy a:hover { color:var(--site-ink); text-decoration:underline; text-underline-offset:2px; }
.marketing-site .site-signup-privacy svg { flex-shrink:0; width:14px; height:14px; }
.marketing-site .site-signup-page { display:flex; align-items:center; padding:56px 0; }
.marketing-site .site-signup-page .site-signup { max-width:980px; margin-inline:auto; overflow:hidden; border-radius:28px; background:white; color:var(--site-ink); box-shadow:0 50px 100px -40px #000000b3,0 0 0 1px #ffffff1f; }

@media (max-width:1180px) {
  .marketing-site .site-journey-board { left:130px; }
  .marketing-site .site-journey-chip { left:250px; }
  .marketing-site .site-journey-deal { left:auto; right:18px; }
  .marketing-site .site-system-steps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 28px; }
  .marketing-site .site-system-steps > li:nth-child(2)::before { display:none; }
  .marketing-site .site-pain-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px 22px; }
}
@media (max-width:960px) {
  .marketing-site .site-header-nav { display:none; }
  .marketing-site .site-section { padding-block:96px; }
  .marketing-site .site-hero { padding:48px 0 80px; }
  .marketing-site .site-player { grid-template-columns:1fr; aspect-ratio:auto; max-width:680px; }
  .marketing-site .site-player-stage { order:-1; }
  .marketing-site .site-player-intro { padding:26px 10px 14px; }
  .marketing-site .site-journey { height:572px; }
  .marketing-site .site-journey-deal { left:auto; right:22px; }
  .marketing-site .site-clients { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .marketing-site .site-done-grid, .marketing-site .site-closing-grid, .marketing-site .site-meta-grid, .marketing-site .site-faq-grid { grid-template-columns:1fr; gap:40px; }
  .marketing-site .site-faq-grid > div:first-child { position:static; }
  .marketing-site .site-meta-art { max-width:380px; margin-bottom:18px; }
  .marketing-site .site-launch-steps { grid-template-columns:1fr; gap:26px; }
  .marketing-site .site-launch-steps::before, .marketing-site .site-launch-steps::after { top:20px; bottom:20px; left:19px; right:auto; width:2px; height:auto; }
  .marketing-site .site-launch-steps::after { transform-origin:top; }
  .marketing-site.has-motion .site-launch-steps::after { transform:scaleY(0); }
  .marketing-site .site-launch-steps > li { display:grid; grid-template-columns:40px 1fr; column-gap:16px; }
  .marketing-site .site-launch-dot { grid-row:1 / span 3; }
  .marketing-site .site-launch-steps > li > :not(.site-launch-dot) { grid-column:2; }
  .marketing-site .site-launch-day, .marketing-site .site-launch-steps h3 { margin-top:8px; }
  .marketing-site .site-launch-facts { grid-template-columns:1fr; margin-top:44px!important; }
  .marketing-site .site-footer-top { grid-template-columns:1.5fr 1fr 1fr; }
  .marketing-site .site-footer-brand { grid-column:1/-1; }
}
@media (max-width:760px) {
  .marketing-site .site-dialog { width:calc(100% - 24px); max-height:calc(100dvh - 24px); border-radius:22px; }
  .marketing-site .site-dialog-close { top:12px; right:12px; width:36px; height:36px; background:#ffffff1f; color:white; }
  .marketing-site .site-dialog-close:hover { background:#ffffff33; }
  .marketing-site .site-signup { grid-template-columns:1fr; }
  .marketing-site .site-signup-intro { padding:22px 20px 20px; }
  .marketing-site .site-dialog .site-signup-title { padding-right:36px; }
  .marketing-site .site-signup-title { margin-top:12px!important; font-size:21px; }
  .marketing-site .site-signup-lead { margin-top:10px!important; font-size:15px; }
  .marketing-site .site-signup-intro .site-player-host { margin-top:16px; padding-top:14px; }
  .marketing-site .site-signup-intro .site-player-host img { width:42px; height:42px; }
  .marketing-site .site-signup-intro .site-player-host :is(.site-player-by,small) { font-size:12.5px; }
  .marketing-site .site-signup-body { padding:20px 20px 22px; }
  .marketing-site .site-signup-form-title { font-size:19px; }
  .marketing-site .site-signup-form-lead { margin-top:4px!important; font-size:14px; }
  .marketing-site .site-signup-form { gap:12px; margin-top:16px; }
  .marketing-site .site-field label { margin-bottom:5px; font-size:13.5px; }
  .marketing-site .site-field input { min-height:48px; padding-block:11px; }
  .marketing-site .site-signup-page { align-items:flex-start; padding:22px 0 32px; }
  .marketing-site .site-funnel-logo { width:88px; margin-bottom:18px; }
  .marketing-site .site-masterclass { padding:40px 0 48px; }
  .marketing-site .site-masterclass-head h1 { font-size:30px; }
  .marketing-site .site-masterclass-head h1 + p { font-size:16px; }
  .marketing-site .site-masterclass-video { margin-top:28px; border-radius:16px; }
  .marketing-site .site-video-play { width:60px; height:60px; box-shadow:0 0 0 8px #ffffff14; }
  .marketing-site .site-masterclass-actions { flex-direction:column; margin-top:28px; }
  .marketing-site .site-signup-page .site-signup { border-radius:22px; }
}
@media (max-width:640px) {
  .marketing-site .site-container { width:calc(100% - 36px); }
  .marketing-site .site-header-inner { min-height:64px; }
  .marketing-site .site-logo img { width:96px; height:28px; }
  .marketing-site .site-header-actions { gap:8px; }
  .marketing-site .site-login { width:40px; padding:0; }
  .marketing-site .site-login span { display:none; }
  .marketing-site .site-header-actions .site-button-small { padding-inline:14px; }
  .marketing-site .site-section { padding-block:72px; }
  .marketing-site .site-heading { margin-bottom:36px; }
  .marketing-site .site-heading > p { font-size:16px; }
  .marketing-site .marketing-home h2 { font-size:34px; }
  /* The video invitation precedes a shorter example journey on phones. */
  .marketing-site .site-hero { padding:32px 0 56px; }
  .marketing-site .site-hero h1 { font-size:clamp(38px,11.4vw,48px); }
  .marketing-site .site-hero-lead { margin-top:16px; font-size:16.5px; }
  .marketing-site .site-player { margin-top:28px; padding:10px; border-radius:26px; }
  .marketing-site .site-player-stage { order:0; }
  .marketing-site .site-player-intro { padding:18px 10px 24px; }
  .marketing-site .site-player-kicker { padding:4px 10px; font-size:11.5px; }
  .marketing-site .site-player-title { margin-top:10px!important; font-size:20px; }
  .marketing-site .site-player-host { margin-top:14px; }
  .marketing-site .site-player-host img { width:40px; height:40px; }
  .marketing-site .site-player-intro .site-player-host small { font-size:12px; }
  .marketing-site .site-player-cta { align-self:stretch; justify-content:center; margin-top:18px!important; }
  .marketing-site .site-journey { height:554px; border-radius:18px; }
  .marketing-site .site-journey-pause { position:static; margin:10px auto 0; background:#ffffff1f; }
  .marketing-site .site-journey-board, .marketing-site .site-journey-toast { display:none; }
  .marketing-site .site-journey-story { display:block; position:absolute; top:16px; left:16px; right:16px; z-index:4; }
  .marketing-site .site-journey-bars { display:flex; gap:5px; }
  .marketing-site .site-journey-bars i { position:relative; flex:1; height:4px; overflow:hidden; border-radius:2px; background:#0e17331f; }
  .marketing-site .site-journey-bars i::after { content:""; position:absolute; inset:0; background:var(--site-blue); transform-origin:left; }
  .marketing-site .site-journey-captions { height:52px; margin-top:12px; }
  .marketing-site .site-journey-captions li { display:none; align-items:center; gap:10px; color:var(--site-ink); font-size:15.5px; font-weight:700; line-height:1.25; letter-spacing:-.015em; }
  .marketing-site .site-journey-captions b { display:grid; place-items:center; flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--site-blue); color:white; font-size:12px; }
  .marketing-site :is(.site-journey[data-step="1"] [data-caption="1"],.site-journey[data-step="2"] [data-caption="2"],.site-journey[data-step="3"] [data-caption="3"],.site-journey[data-step="4"] [data-caption="4"]) { display:flex; }
  .marketing-site.has-motion .site-journey-captions li { animation:site-rise .45s cubic-bezier(.2,.8,.2,1) both; }
  .marketing-site.has-motion .site-journey-bars i::after { transform:scaleX(0); }
  .marketing-site.has-motion .site-journey[data-step="2"] .site-journey-bars i:nth-child(1)::after,
  .marketing-site.has-motion .site-journey[data-step="3"] .site-journey-bars i:nth-child(-n+2)::after,
  .marketing-site.has-motion .site-journey[data-step="4"] .site-journey-bars i:nth-child(-n+3)::after { transform:none; }
  .marketing-site.has-motion .site-journey[data-step="1"] .site-journey-bars i:nth-child(1)::after { animation:site-fill 3.2s linear both; }
  .marketing-site.has-motion .site-journey[data-step="2"] .site-journey-bars i:nth-child(2)::after { animation:site-fill 3.8s linear both; }
  .marketing-site.has-motion .site-journey[data-step="3"] .site-journey-bars i:nth-child(3)::after { animation:site-fill 3.6s linear both; }
  .marketing-site.has-motion .site-journey[data-step="4"] .site-journey-bars i:nth-child(4)::after { animation:site-fill 4.4s linear both; }
  .marketing-site.has-motion .site-journey[data-paused="true"] .site-journey-bars i::after { animation-play-state:paused; }
  .marketing-site .site-phone { left:50%; top:92px; translate:-50% 0; width:234px; height:440px; }
  .marketing-site .site-chat-body { gap:5px; padding:8px; }
  .marketing-site .site-msg { padding:6px 8px 4px; font-size:10.5px; line-height:1.35; }
  .marketing-site .site-journey-chip { display:none; top:auto; bottom:22px; left:50%; translate:-50% 0; padding:8px 12px; font-size:12px; white-space:nowrap; }
  .marketing-site.has-motion .site-journey-chip { display:flex; }
  .marketing-site.has-motion .site-journey .site-journey-chip { transform:translateY(10px); }
  .marketing-site.has-motion .site-journey[data-step="4"] .site-journey-chip { opacity:0; transition-delay:0s; }
  .marketing-site .site-journey-deal { top:auto; bottom:18px; left:50%; translate:-50% 0; width:min(276px,calc(100% - 32px)); }
  .marketing-site.has-motion .site-journey .site-journey-deal { transform:translateY(60px) scale(.9); }
  .marketing-site.has-motion .site-journey[data-step="4"] .site-journey-deal { transform:none; }
  /* Pains: one card each, the sentence first and its scene under it, so the
     scene reads as the proof of what was just said. */
  .marketing-site .site-pain-grid { grid-template-columns:1fr; gap:14px; margin-top:32px; }
  .marketing-site .site-pain-grid > li { display:flex; flex-direction:column; padding:20px 20px 18px; border:1px solid #ffffff1a; border-radius:20px; background:#ffffff08; }
  .marketing-site .site-pain-grid > li > h3 { order:-2; font-size:19px; line-height:1.25; }
  .marketing-site .site-pain-grid > li > p { order:-1; margin:6px 0 16px; font-size:15px; }
  .marketing-site .site-pain-scene { height:auto; margin:0; border-color:#ffffff12; background:#05102e80; }
  .marketing-site .site-pain-scene.is-months { height:156px; }
  .marketing-site .site-pains-fact { flex-direction:column; align-items:flex-start; gap:10px; margin-top:44px!important; padding:20px; }
  .marketing-site .site-pains-fact strong { font-size:38px; }
  .marketing-site .site-pains-fact span { font-size:16px; }
  .marketing-site .site-pains-turn { margin-top:40px!important; padding-top:32px; }
  .marketing-site .site-meta-hub { width:116px; height:116px; }
  .marketing-site .site-meta-hub img { width:78px; }
  .marketing-site .site-meta-node svg { width:24px; height:24px; padding:13px; }
  .marketing-site .site-fit { grid-template-columns:1fr; }
  .marketing-site .site-fit > div { padding:24px; }
  .marketing-site .site-faq summary { font-size:15.5px; padding-block:18px; }
  .marketing-site .site-faq details p { padding-right:0; font-size:14.5px; }
  /* Past the hero the video button moves from the header to the thumb, as a
     pill that covers little: only one of the two shows at a time. */
  .marketing-site .site-sticky-cta { display:block; position:fixed; left:50%; bottom:16px; z-index:40; translate:-50% 0; }
  .marketing-site .site-sticky-cta .site-button { min-height:50px; padding:7px 22px 7px 7px; border-radius:999px; font-size:15px; white-space:nowrap; box-shadow:0 16px 36px -10px #0e1733a6,0 0 0 1px #ffffff1f; }
  .marketing-site .site-sticky-cta .site-play { width:36px; height:36px; }
  .marketing-site .site-header-actions .site-button-small { transition:opacity .2s,visibility .2s; }
  .marketing-site.has-sticky-cta .site-header-actions .site-button-small { visibility:hidden; opacity:0; }
  .marketing-site:has(.site-sticky-cta) .site-footer { padding-bottom:92px; }
  /* The method as a timeline: the number on the thread, then the piece's
     name, its line and its drawing, so each drawing sits with its step. */
  .marketing-site .site-system-steps { grid-template-columns:1fr; gap:40px; }
  .marketing-site .site-system-steps > li { display:grid; grid-template-columns:36px minmax(0,1fr); column-gap:16px; }
  .marketing-site .site-system-number { grid-area:1 / 1; }
  .marketing-site .site-system-steps h3 { grid-area:1 / 2; align-self:center; margin:0; }
  .marketing-site .site-system-steps li > p { grid-column:2; margin-top:6px; }
  .marketing-site .site-system-art { grid-column:2; grid-row:3; height:184px; margin:16px 0 0; }
  .marketing-site .site-mini-ad { width:96px; top:14px; }
  .marketing-site .site-mini-ad.is-gym { left:calc(50% - 112px); }
  .marketing-site .site-mini-ad.is-school { left:calc(50% + 16px); }
  .marketing-site .site-mini-ad.is-clinic { width:112px; left:calc(50% - 56px); top:6px; }
  .marketing-site .site-mini-window { top:12px; }
  .marketing-site .site-system-steps > li:not(:last-child)::before { display:block; top:44px; bottom:-32px; left:17px; right:auto; width:2px; height:auto; transform-origin:top; }
  .marketing-site.has-motion .site-system-steps > li:not(:last-child)::before { transform:scaleY(0); }
  .marketing-site.has-motion .site-system-steps.is-revealed > li::before { transform:none; }
  .marketing-site .site-video-band { flex-direction:column; align-items:stretch; margin-top:56px; padding:22px; text-align:center; }
  .marketing-site .site-video-band p { font-size:16px; }
  .marketing-site .site-sector-rows { gap:10px; }
  .marketing-site .site-sector-track { gap:8px; }
  .marketing-site.has-motion .site-sector-track { padding-right:8px; }
  .marketing-site .site-sector-track li { padding:9px 15px; font-size:14px; }
  .marketing-site .site-sector-foot { margin-top:32px; }
  .marketing-site .site-done-yours, .marketing-site .site-done-ours { padding:28px 24px; }
  .marketing-site .site-done-ours ul { grid-template-columns:1fr; }
  .marketing-site .site-crm-tabs { display:flex; width:100%; }
  .marketing-site .site-crm-tab { flex:1; justify-content:center; padding:10px 8px; font-size:13px; }
  .marketing-site .site-crm-tab svg { display:none; }
  .marketing-site .site-crm-screen { max-width:340px; margin-inline:auto; border:6px solid var(--site-ink); border-radius:34px; }
  .marketing-site .site-crm-caption { font-size:15px; }
  .marketing-site .site-clients { gap:22px 16px; margin-bottom:44px; }
  .marketing-site .site-clients li { height:40px; }
  .marketing-site .site-clients img { width:calc(var(--logo-w) * .7); max-height:30px; }
  .marketing-site .site-closing { margin:0 8px 8px; padding:64px 0; border-radius:24px; }
  .marketing-site .site-closing-copy > p { font-size:16px; }
  .marketing-site .site-closing-actions { flex-direction:column; align-items:stretch; }
  .marketing-site .site-closing-actions .site-text-link { justify-content:center; }
  .marketing-site .site-video-card { aspect-ratio:auto; justify-content:flex-start; gap:24px; padding:30px 20px 20px; }
  .marketing-site .site-video-card-play { margin-top:0; width:64px; height:64px; box-shadow:0 0 0 10px #ffffff1a; }
  .marketing-site .site-video-card-play svg { width:24px; height:24px; margin-left:3px; }
  .marketing-site .site-video-card-text strong { font-size:17px; }
  .marketing-site .site-footer-top { grid-template-columns:1fr 1fr; gap:28px; }
}
@media (prefers-reduced-motion:reduce) {
  .marketing-site *, .marketing-site *::before, .marketing-site *::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
}