/* The supplied reference boards are used unchanged as scenic backgrounds.
   Product screenshots are separate captures from the real test account. */
.cl-page{--cl-dark:#0b0a0f;--cl-paper:#fffaf7;--cl-rose:#ff3b8d;--cl-burgundy:#7a0f3d;background:var(--cl-paper)}
.cl-page .shell{width:min(100% - 80px,1280px)}
.cl-page h1,.cl-page h2,.cl-page h3{letter-spacing:-.058em}
.cl-page h2{font-size:clamp(2.65rem,4vw,4.75rem);line-height:1.05}
.cl-page em{color:#e73c78}
.cl-page .cl-eye{color:#f26a94;font-size:.72rem;letter-spacing:.16em}
.cl-page .site-header{position:sticky;top:0;z-index:40;background:#100d13f5;border-bottom:1px solid #f3abc826}
.cl-page .site-header__inner{min-height:72px}
.cl-page .cl-brand{font-size:1.45rem}
.cl-page .nav__list{gap:42px}
.cl-page .nav a{color:#f2e9ed;font-size:.83rem}
.cl-page .cl-btn,.cl-page .cl-header__cta{background:linear-gradient(180deg,#f85b94,#cf2f6b);border-color:#fd79a6;border-radius:10px;color:#fff;box-shadow:0 11px 26px #8d1c4750}
.cl-page .cl-btn{font-size:.98rem;min-height:56px;padding:0 26px}
.cl-page .cl-link{background:#190f16b8;border-color:#e2a6bd99}
.cl-page .cl-price-note{color:inherit;opacity:.83}

/* 01 — Hero: the photograph and light are kept from the supplied board. */
.cl-page .cl-hero{position:relative;isolation:isolate;min-height:clamp(700px,58.4vw,850px);background:#0b0a0f url('/assets/img/cherryleads-reference/hero-problem.png') center top/100% auto no-repeat}
.cl-page .cl-hero::before{content:'';position:absolute;z-index:0;inset:0 auto 0 0;width:59%;height:100%;background:linear-gradient(90deg,#0b0a0f 0%,#130d13 86%,transparent);filter:none;pointer-events:none}
.cl-page .cl-hero::after{content:'';position:absolute;z-index:0;inset:0;height:100%;background:linear-gradient(180deg,#0b0a0f 0%,#120c12 13%,transparent 21%,transparent 79%,#0b0a0f 100%);pointer-events:none}
.cl-page .cl-hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);gap:20px;min-height:inherit;padding:84px 0 66px;align-items:center}
.cl-page .cl-hero__copy{z-index:3;max-width:550px}
.cl-page .cl-hero h1{max-width:none;font-size:clamp(2.8rem,3.55vw,4.4rem);line-height:1.04}
.cl-page .cl-hero h1 em{color:#ef9db8}
.cl-page .cl-hero .cl-lead{max-width:49ch;margin-top:25px;color:#f0e7ea;font-size:clamp(1rem,1.11vw,1.17rem);line-height:1.62}
.cl-page .cl-hero .cl-actions{margin-top:29px}
.cl-page .cl-hero .cl-price-note{margin-top:16px}
.cl-page .cl-hero__note{margin-top:25px!important;max-width:53ch;border-top:1px solid #f7bbd03b;color:#d7c8ce}
.cl-page .cl-hero__visual{z-index:2;width:calc(100% + 14vw);margin-right:-14vw;align-self:center;transform-origin:left center}
.cl-page .cl-hero__visual::before{inset:8% 10% 5% -5%;background:#ed428175;filter:blur(60px)}
.cl-page .cl-product--hero{max-height:650px;overflow:hidden;border:1px solid #f38fb26b;border-radius:18px;box-shadow:0 30px 72px #020205ad,0 0 44px #d63d7340;transform:perspective(1400px) rotateY(-3deg) rotateZ(-1deg)}
.cl-page .cl-product--hero img{display:block;width:114%;max-width:none;height:auto}

/* 02 — The reference's photographic diagram remains visible on the right. */
.cl-page .cl-story{position:relative;isolation:isolate;min-height:clamp(800px,66.5vw,950px);padding:72px 0 72px;background:#fffaf7 url('/assets/img/cherryleads-reference/hero-problem.png') center bottom/100% auto no-repeat}
.cl-page .cl-story::before{content:'';position:absolute;z-index:0;inset:0 auto 0 0;width:60%;background:linear-gradient(90deg,#fffaf7 0%,#fffaf7 92%,transparent)}
.cl-page .cl-story__layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:0 4%;align-items:start}
.cl-page .cl-story__intro{padding-top:2px}
.cl-page .cl-story__intro h2{max-width:15ch;font-size:clamp(2.75rem,4.1vw,4.7rem);color:#111018}
.cl-page .cl-story__intro>p:not(.cl-eye){max-width:54ch;margin-top:22px;font-size:1.08rem;line-height:1.6;color:#4b444b}
.cl-page .cl-story__intro .cl-story__pivot{max-width:35ch;margin-top:30px!important;color:#ce2d67!important;font-size:clamp(1.35rem,1.9vw,2.05rem)!important}
.cl-page .cl-story__questions{margin-top:18px;grid-template-columns:1fr 1fr;gap:0 20px}
.cl-page .cl-story__questions li{min-height:60px;border:0;padding-left:37px;font-size:.92rem}
.cl-page .cl-story__questions li::before{width:29px;height:29px;border-radius:9px;font-size:.91rem}
.cl-page .cl-story__scene{grid-column:2;grid-row:1 / span 2;min-height:650px}
.cl-page .cl-story__closing{grid-column:1;max-width:590px;margin:22px 0 0!important;padding:23px 28px;border:0;border-radius:15px;background:linear-gradient(100deg,#fbe7eb,#fff0ef);font-family:'Inter',system-ui,sans-serif;font-size:clamp(1.1rem,1.5vw,1.42rem);font-weight:700;line-height:1.45!important;letter-spacing:-.025em}
.cl-page .cl-story__closing strong{display:block;color:#c82f65}

/* 03 — A real, locally switching product demo replaces the illustrative UI. */
.cl-page .cl-demo{position:relative;isolation:isolate;overflow:hidden;padding:76px 0 90px;background:#0b0a0f url('/assets/img/cherryleads-reference/demo-benefits.png') center top/100% auto no-repeat;color:#fff}
.cl-page .cl-demo::before{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,#0b0a0f 0%,#160e15 19%,#1b0b15de 44%,#0b0a0f 100%)}
.cl-demo__head{display:flex;justify-content:space-between;gap:40px;align-items:start}
.cl-demo__head>div{max-width:860px}
.cl-demo__head h2{font-size:clamp(2.6rem,3.8vw,4.5rem)}
.cl-demo__head>div>p:last-child{max-width:780px;margin-top:12px;color:#eadce3;font-size:1.04rem}
.cl-demo__notice{max-width:260px;padding:15px 19px;border:1px solid #e794b458;border-radius:12px;background:#3b162477;color:#f5dfe8;font-size:.8rem;line-height:1.45}
.cl-demo__frame{position:relative;margin-top:34px;overflow:hidden;border:1px solid #f4679a9c;border-radius:21px;background:#0b0e14;box-shadow:0 32px 75px #0009,0 0 42px #d4366940}
.cl-demo__toolbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:70px;padding:9px 21px;background:#101116;border-bottom:1px solid #ffffff18}
.cl-demo__wordmark{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-family:'Space Grotesk',system-ui,sans-serif;font-weight:700;font-size:1.1rem}
.cl-demo__wordmark img{object-fit:contain}
.cl-demo__tabs{display:flex;gap:7px;overflow-x:auto;scrollbar-width:thin}
.cl-demo__tabs button{min-height:43px;padding:0 19px;border:1px solid transparent;border-radius:8px;background:transparent;color:#ddd4da;font:600 .85rem 'Inter',system-ui,sans-serif;white-space:nowrap;cursor:pointer}
.cl-demo__tabs button[aria-selected=true]{border-color:#b75079;background:#5a2037;color:#fff}
.cl-demo__tabs button:focus-visible{outline:2px solid #ff87b3;outline-offset:2px}
.cl-demo__badge{white-space:nowrap;padding:9px 12px;border:1px solid #456258;border-radius:25px;color:#c9ead8;font-size:.74rem}
.cl-demo__badge::first-letter{color:#4ee7ae}
.cl-demo__image{height:clamp(440px,48vw,650px);overflow:hidden;background:#0b0e14}
.cl-demo__image img{display:block;width:100%;height:100%;object-fit:cover;object-position:left top;transition:opacity .18s ease,transform .24s ease}
.cl-demo__image img.is-switching{opacity:.45;transform:scale(.994)}

/* 04 — Four live benefit cards, each with an authentic product capture. */
.cl-page .cl-benefits{padding:80px 0 95px;background:#fffaf7}
.cl-benefits h2{margin-bottom:29px!important;color:#121018}
.cl-benefits__grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cl-benefit{display:grid;grid-template-columns:minmax(0,.47fr) minmax(0,.53fr);gap:18px;align-items:center;min-height:272px;padding:20px;border:1px solid #f4e5e7;border-radius:18px;background:#fff1f2cf}
.cl-benefit>div{position:relative;align-self:stretch;padding:2px 0 0 52px}
.cl-benefit__num{position:absolute;top:0;left:0;display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#ffd7e3;color:#d43e76;font-size:.8rem;font-weight:800}
.cl-benefit h3{font-size:clamp(1.18rem,1.55vw,1.55rem);letter-spacing:-.055em;color:#19131b}
.cl-benefit p{margin-top:16px!important;color:#5b515a;font-size:.88rem;line-height:1.55}
.cl-benefit figure{height:225px;overflow:hidden;border:1px solid #dfcdd1;border-radius:12px;background:#0d1118;box-shadow:0 12px 30px #4d1e3025}
.cl-benefit figure img{display:block;width:100%;height:100%;object-fit:cover;object-position:left top}

/* 05 — The original photographic desk/form scene is kept behind real UI. */
.cl-page .cl-integration{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(720px,67vw,920px);padding:80px 0;background:#fffaf7}
.cl-page .cl-integration::before{display:none}
.cl-integration__layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,.45fr);min-height:650px}
.cl-integration__copy{position:relative;z-index:2;max-width:640px}
.cl-integration h2{max-width:14ch}
.cl-integration__copy>p:not(.cl-eye){max-width:54ch;margin-top:23px!important;color:#514951;font-size:1.05rem;line-height:1.62}
.cl-integration__steps{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:start;gap:10px;margin-top:56px}
.cl-integration__steps>div{display:grid;justify-items:start;gap:8px}
.cl-integration__steps span{display:grid;place-items:center;width:75px;height:75px;border-radius:15px;background:#f9e2e9;color:#d23870;font-size:2.2rem}
.cl-integration__steps strong{font-size:.92rem;line-height:1.22}
.cl-integration__steps small{color:#665b63;font-size:.76rem;line-height:1.4}
.cl-integration__steps b{margin-top:20px;color:#e1467a;font-size:1.65rem;font-weight:400}
.cl-integration__scene{position:relative;min-height:620px;background:url('/assets/img/cherryleads-reference/integration-growth.png') right -80px/100vw auto no-repeat}
.cl-integration__scene::before{content:'';position:absolute;z-index:1;inset:0 auto 0 0;width:65px;background:linear-gradient(90deg,#fffaf7,transparent);pointer-events:none}
.cl-integration__screen{position:absolute;z-index:2;right:-10%;top:25%;width:90%;height:103%;overflow:hidden;border:11px solid #111016;border-radius:24px 24px 0 0;background:#0d1118;box-shadow:0 24px 55px #2411188c;transform:perspective(1000px) rotateY(-4deg) rotateZ(2deg)}
.cl-integration__screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:left top}

/* 06 — Development section uses the supplied dark desk scene. */
.cl-page .cl-growth{position:relative;isolation:isolate;overflow:hidden;padding:85px 0 72px;background:#0b0a0f url('/assets/img/cherryleads-reference/integration-growth.png') center bottom/100% auto no-repeat;color:#fff}
.cl-page .cl-growth::before{content:'';position:absolute;z-index:0;inset:0;background:linear-gradient(90deg,#0b0a0f 0%,#160d13 67%,transparent 77%),linear-gradient(0deg,#0b0a0f 0%,transparent 48%)}
.cl-page .cl-growth>.shell{position:relative;z-index:1}
.cl-growth__main{position:relative;display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,.35fr);gap:30px;min-height:400px}
.cl-growth__copy{max-width:745px}
.cl-growth h2{max-width:18ch}
.cl-growth__copy>p:not(.cl-eye){max-width:65ch;margin-top:22px!important;color:#ebdfe5;font-size:1.05rem}
.cl-growth__callout{display:grid;gap:5px;max-width:710px;margin-top:28px;padding:17px 21px;border:1px solid #e0679670;border-radius:12px;background:#371421c9;color:#f2e3e9}
.cl-growth__callout strong{color:#ffa3c2}
.cl-growth__callout span{font-size:.83rem}
.cl-growth__screen{position:absolute;z-index:2;top:-35px;right:-100px;width:46%;height:485px;overflow:hidden;border:8px solid #161116;border-radius:18px;background:#0b0e14;box-shadow:0 25px 55px #0009;transform:perspective(1000px) rotateY(-6deg) rotateZ(2deg)}
.cl-growth__screen img{width:100%;height:100%;object-fit:cover;object-position:left top}
.cl-growth__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-top:37px}
.cl-growth__cards>div{min-height:165px;padding:22px;border:1px solid #d954866b;border-radius:14px;background:#1e111ad9;backdrop-filter:blur(10px)}
.cl-growth__cards span{display:grid;place-items:center;width:41px;height:41px;margin-bottom:12px;border-radius:10px;background:#f879a6;color:#3b0d22;font-size:1.45rem}
.cl-growth__cards h3{font-size:1.22rem}
.cl-growth__cards p{margin-top:9px!important;color:#d5c8cf;font-size:.84rem}

/* 07 — Price uses the reference desk/laptop scene and live offer details. */
.cl-page .cl-pricing{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(760px,72.5vw,980px);padding:85px 0 75px;border:0;background:#fffaf7 url('/assets/img/cherryleads-reference/pricing-final.png') center top/100% auto no-repeat;color:#111018}
.cl-page .cl-pricing::before{content:'';position:absolute;z-index:0;inset:0 auto 0 0;width:60%;background:linear-gradient(90deg,#fffaf7 0%,#fffaf7 92%,transparent)}
.cl-pricing__layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.58fr) minmax(0,.42fr);min-height:650px}
.cl-pricing__copy{position:relative;z-index:2;max-width:700px}
.cl-pricing h2{max-width:15ch}
.cl-pricing__copy>p:not(.cl-eye):not(.cl-price-note){max-width:55ch;margin-top:23px!important;color:#574d55;font-size:1.04rem}
.cl-pricing__numbers{display:grid;grid-template-columns:auto auto auto;justify-content:start;align-items:center;gap:32px;margin-top:37px;white-space:nowrap}
.cl-pricing__numbers>div{display:grid;gap:4px}
.cl-pricing__numbers strong{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(3.8rem,6.4vw,7.2rem);line-height:.96;letter-spacing:-.08em}
.cl-pricing__numbers>div:first-child strong{color:#d82e6b}
.cl-pricing__numbers span{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(1rem,1.6vw,1.7rem);font-weight:700;letter-spacing:-.04em}
.cl-pricing__numbers b{color:#e483a6;font-size:2.6rem;font-weight:400}
.cl-pricing__single{margin-top:35px!important;padding-top:22px;border-top:1px solid #eadfe1}
.cl-pricing__included{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:20px 0 29px;padding:0;border:0;color:#51464f;list-style:none}
.cl-pricing__included li{display:grid;gap:8px;justify-items:start;font-size:.79rem}
.cl-pricing__included li::before{content:'✓';display:grid;place-items:center;width:37px;height:37px;margin:0;border-radius:10px;background:#f8e1e8;color:#d3356e;font-size:1rem}
.cl-pricing__copy>.cl-btn{min-width:310px}
.cl-pricing__copy>.cl-price-note{margin-top:11px!important;color:#6d626a}
.cl-pricing__scene{position:relative}
.cl-pricing__screen{position:absolute;z-index:2;top:29%;left:10%;width:115%;height:75%;overflow:hidden;border:12px solid #111116;border-radius:23px 23px 3px 3px;background:#0e1016;box-shadow:0 27px 60px #39282c73;transform:perspective(1000px) rotateY(-5deg) rotateZ(-2deg)}
.cl-pricing__screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:left top}

/* 08 — The original closing photograph remains, with live text and controls. */
.cl-page .cl-final-cta{position:relative;isolation:isolate;overflow:hidden;padding:85px 0 66px;background:#0b0a0f url('/assets/img/cherryleads-reference/pricing-final.png') center bottom/100% auto no-repeat;color:#fff}
.cl-page .cl-final-cta::before{content:'';position:absolute;z-index:0;inset:0;background:linear-gradient(0deg,#0b0a0f 0%,#0b0a0f 47%,transparent 72%),linear-gradient(90deg,#0b0a0f 0%,#150d13 72%,transparent 83%)}
.cl-page .cl-final-cta>.shell{position:relative;z-index:1}
.cl-final-cta__copy{max-width:780px}
.cl-final-cta h2{max-width:20ch;font-size:clamp(2.5rem,3.7vw,4.4rem)}
.cl-final-cta__copy>p:not(.cl-eye):not(.cl-price-note){max-width:62ch;margin:20px 0 23px!important;color:#e4d9df;font-size:1.04rem}
.cl-final-cta__copy>.cl-price-note{margin-top:10px!important}
.cl-final-cta__points{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;max-width:1110px;margin:67px 0 0;padding:25px 0 0;border-top:1px solid #f8b7d144;list-style:none}
.cl-final-cta__points li{display:grid;gap:3px;padding-left:40px;position:relative}
.cl-final-cta__points li::before{content:'✓';position:absolute;left:0;top:0;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#fba6c4;color:#4b1329;font-weight:800}
.cl-final-cta__points strong{font-size:.88rem}
.cl-final-cta__points span{color:#d5c3cc;font-size:.76rem}
.cl-page .cl-footer{background:#0b0a0f;border-top:1px solid #ffffff20}
.cl-page .cl-footer .wordmark__text small{display:block;margin-top:1px;color:#bcaab5;font:500 .55rem 'Inter',system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase}

/* Motion never hides content for no-JS or reduced-motion visitors. */
.js .cl-story.is-reveal-ready .cl-story__scene{opacity:0;transform:translateY(14px);transition:opacity .65s ease,transform .65s ease}
.js .cl-story.is-reveal-ready.is-visible .cl-story__scene{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.cl-page .cl-demo__image img,.js .cl-story.is-reveal-ready .cl-story__scene{opacity:1!important;transform:none!important;transition:none!important}}

@media(max-width:1000px){
  .cl-page .shell{width:min(100% - 48px,820px)}
  .cl-page .cl-hero{background-size:auto 100%;background-position:center top}
  .cl-page .cl-hero__inner{grid-template-columns:1fr;gap:35px;min-height:0;padding:75px 0 35px}
  .cl-page .cl-hero::before{width:100%;background:linear-gradient(90deg,#0b0a0fe8,#1c0c16ce)}
  .cl-page .cl-hero h1{max-width:18ch;font-size:clamp(3rem,6vw,4.8rem)}
  .cl-page .cl-hero__visual{width:calc(100% + 70px);margin:0 -70px -65px 0}
  .cl-page .cl-story{background-size:auto 100%;background-position:right bottom}
  .cl-page .cl-story::before{width:65%}
  .cl-page .cl-story__scene{min-height:520px}
  .cl-benefit{grid-template-columns:1fr;align-content:start}
  .cl-benefit figure{height:210px}
  .cl-integration__layout,.cl-pricing__layout{grid-template-columns:minmax(0,.6fr) minmax(0,.4fr)}
  .cl-integration__screen{right:-38%;width:118%}
  .cl-growth__main{grid-template-columns:minmax(0,.65fr) minmax(0,.35fr)}
}
@media(max-width:760px){
  .cl-page .shell{width:min(100% - 36px,600px)}
  .cl-page .cl-hero{min-height:0;background-image:linear-gradient(120deg,#0b0a0f,#321222)}
  .cl-page .cl-hero__inner{padding:55px 0 45px}
  .cl-page .cl-hero__visual{width:100%;margin:0}
  .cl-page .cl-product--hero{max-height:none;overflow-x:auto;transform:none}
  .cl-page .cl-product--hero img{width:max(680px,100%)}
  .cl-page .cl-story{min-height:0;padding:65px 0 70px;background-image:none}
  .cl-page .cl-story::before{display:none}
  .cl-page .cl-story__layout{grid-template-columns:1fr}
  .cl-page .cl-story__scene{grid-column:1;grid-row:auto;min-height:390px;margin:33px 0;background:url('/assets/img/cherryleads-reference/hero-problem.png') right bottom/auto 780px no-repeat;border-radius:18px}
  .cl-page .cl-story__closing{grid-column:1;margin-top:0!important}
  .cl-demo__head{display:block}
  .cl-demo__notice{margin-top:18px}
  .cl-demo__toolbar{display:grid;grid-template-columns:1fr;gap:8px;padding:14px}
  .cl-demo__badge{display:none}
  .cl-demo__image{height:390px}
  .cl-benefits__grid{grid-template-columns:1fr}
  .cl-benefit{grid-template-columns:minmax(0,.45fr) minmax(0,.55fr)}
  .cl-page .cl-integration{min-height:0;background-image:none;padding:70px 0 0}
  .cl-page .cl-integration::before{display:none}
  .cl-integration__layout{grid-template-columns:1fr}
  .cl-integration__scene{min-height:370px;margin-top:26px;background:radial-gradient(circle at 85% 15%,#f5c9d4,#fffaf7 62%);border-radius:18px}
  .cl-integration__scene::before{display:none}
  .cl-integration__screen{top:8%;right:2%;width:96%;height:86%;transform:none}
  .cl-growth__main{grid-template-columns:1fr}
  .cl-growth__screen{display:none}
  .cl-growth__cards{grid-template-columns:1fr}
  .cl-page .cl-pricing{min-height:0;padding:70px 0 0;background-image:none}
  .cl-page .cl-pricing::before{display:none}
  .cl-pricing__layout{grid-template-columns:1fr}
  .cl-pricing__scene{min-height:370px;margin-top:28px;background:radial-gradient(circle at 75% 20%,#edcad3,#fffaf7 65%);border-radius:18px}
  .cl-pricing__screen{top:8%;left:2%;width:96%;height:86%;transform:none}
  .cl-page .cl-final-cta{background-image:linear-gradient(120deg,#0b0a0f,#2c101e)}
  .cl-final-cta__points{grid-template-columns:1fr;gap:19px;margin-top:43px}
}
@media(max-width:480px){
  .cl-page h2{font-size:clamp(2.25rem,9vw,3rem)}
  .cl-page .cl-hero h1{font-size:clamp(2.5rem,10.3vw,3.3rem)}
  .cl-page .cl-hero .cl-lead{font-size:.98rem}
  .cl-page .cl-hero .cl-actions{display:grid;grid-template-columns:1fr}
  .cl-page .cl-story__intro h2{font-size:clamp(2.4rem,9vw,3.1rem)}
  .cl-page .cl-story__questions{gap:0 9px}
  .cl-page .cl-story__questions li{font-size:.78rem;padding-left:29px}
  .cl-page .cl-story__questions li::before{width:22px;height:22px}
  .cl-demo__head h2{font-size:2.4rem}
  .cl-demo__image{height:300px}
  .cl-benefit{grid-template-columns:1fr}
  .cl-benefit figure{height:210px}
  .cl-integration__steps{gap:5px}
  .cl-integration__steps span{width:52px;height:52px;font-size:1.6rem}
  .cl-integration__steps strong{font-size:.76rem}
  .cl-integration__steps small{font-size:.64rem}
  .cl-integration__steps b{font-size:1.1rem}
  .cl-pricing__numbers{gap:10px}
  .cl-pricing__numbers strong{font-size:3.2rem}
  .cl-pricing__numbers span{font-size:.86rem}
  .cl-pricing__included{grid-template-columns:repeat(3,1fr)}
  .cl-pricing__copy>.cl-btn{width:100%;min-width:0}
  .cl-page .cl-final-cta{background-size:auto 100%;background-position:right bottom}
  .cl-page .cl-final-cta::before{background:#0b0a0fdc}
}

/* Refinement: full product captures stay in document flow and retain their ratio. */
.cl-page main>section{scroll-margin-top:72px}
.cl-page .cl-hero{background:radial-gradient(circle at 78% 27%,#5d1836 0%,#251019 43%,#0b0a0f 78%)}
.cl-page .cl-hero__visual{width:calc(100% + 8vw);margin-right:-8vw}
.cl-page .cl-product--hero{max-height:none;overflow:hidden;transform:perspective(1400px) rotateY(-2deg)}
.cl-page .cl-product--hero img{width:100%;max-width:100%;height:auto;object-fit:contain}

.cl-page .cl-demo{padding-bottom:100px;background:radial-gradient(circle at 88% 15%,#4a152c,#0b0a0f 60%)}
.cl-page .cl-demo__frame{margin-top:36px;overflow:hidden}
.cl-page .cl-demo__guide{padding:25px 32px 18px;background:#141119;border-bottom:1px solid #ffffff18}
.cl-page .cl-demo__guide .cl-eye{margin:0 0 7px;color:#f68caf}
.cl-page .cl-demo__guide p:last-child{max-width:75ch;margin:0;color:#dcced5;font-size:.91rem;line-height:1.55}
.cl-page .cl-demo__panel{min-height:275px;padding:27px 32px 32px;background:linear-gradient(120deg,#171219,#23131e)}
.cl-page .cl-demo__panel[hidden]{display:none}
.cl-page .cl-demo__panel h3{margin:9px 0 10px;font-size:clamp(1.45rem,2vw,2.1rem);line-height:1.12;letter-spacing:-.04em}
.cl-page .cl-demo__panel p{max-width:68ch;color:#d5c8d0;font-size:.92rem;line-height:1.58}
.cl-page .cl-demo__step,.cl-page .cl-demo__detail-kicker{color:#f68caf;font-size:.7rem;font-weight:800;letter-spacing:.14em}
.cl-page .cl-demo__overview{display:flex;justify-content:space-between;gap:30px;align-items:center;min-height:210px}
.cl-page .cl-demo__overview>div{max-width:72ch}
.cl-page .cl-demo__next{display:inline-flex;align-items:center;justify-content:center;gap:15px;min-height:46px;padding:0 18px;border:1px solid #f28eb49c;border-radius:9px;background:#51213a;color:#fff;font:700 .85rem 'Inter',system-ui,sans-serif;white-space:nowrap;cursor:pointer}
.cl-page .cl-demo__next:hover{background:#782849}
.cl-page .cl-demo__next:focus-visible,.cl-page .cl-demo__lead:focus-visible,.cl-page .cl-demo__open:focus-visible{outline:2px solid #ff8fba;outline-offset:3px}
.cl-page .cl-demo__lead-layout{display:grid;grid-template-columns:minmax(235px,.38fr) minmax(0,.62fr);gap:24px}
.cl-page .cl-demo__lead-list h3{margin-bottom:17px}
.cl-page .cl-demo__lead{display:grid;gap:4px;width:100%;margin-top:9px;padding:12px 15px;border:1px solid #ffffff26;border-radius:10px;background:#211923;color:#fff;text-align:left;cursor:pointer}
.cl-page .cl-demo__lead.is-selected{border-color:#eb679b;background:#512038}
.cl-page .cl-demo__lead strong{font-size:.88rem}
.cl-page .cl-demo__lead span{color:#d4c5ce;font-size:.75rem}
.cl-page .cl-demo__lead-detail{padding:21px 25px;border:1px solid #ed8bb04f;border-radius:13px;background:#120f15}
.cl-page .cl-demo__detail-head{display:flex;align-items:center;justify-content:space-between;gap:15px}
.cl-page .cl-demo__detail-head span{padding:5px 10px;border-radius:30px;background:#5a2039;color:#ffbed4;font-size:.76rem;font-weight:800}
.cl-page .cl-demo__lead-detail dl{display:grid;grid-template-columns:1fr 1fr;gap:12px 22px;margin:10px 0 20px}
.cl-page .cl-demo__lead-detail dl div{padding-top:10px;border-top:1px solid #ffffff1b}
.cl-page .cl-demo__lead-detail dt{color:#a99aa4;font-size:.72rem}
.cl-page .cl-demo__lead-detail dd{margin:4px 0 0;color:#fff;font-size:.85rem;font-weight:600;line-height:1.42}
.cl-page .cl-demo__results{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start}
.cl-page .cl-demo__metrics{display:flex;gap:32px;margin-top:25px}
.cl-page .cl-demo__metrics strong{color:#ff7aa8;font-size:2.2rem;line-height:1}
.cl-page .cl-demo__metrics small{display:block;margin-top:5px;color:#d8cbd2;font-size:.73rem;font-weight:600}
.cl-page .cl-demo__sources{display:grid;gap:9px}
.cl-page .cl-demo__sources>div{display:grid;grid-template-columns:135px 1fr;align-items:center;gap:12px;color:#ded2d9;font-size:.8rem}
.cl-page .cl-demo__sources b{position:relative;display:block;min-height:22px;padding:3px 8px;border-radius:4px;background:linear-gradient(90deg,#cf376d var(--share),#32232d var(--share));color:#fff;font-size:.75rem;text-align:right}
.cl-page .cl-demo__image{height:auto;overflow:visible;margin:0;background:#0b0e14}
.cl-page .cl-demo__image img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:center;transform:none;transition:none}
.cl-page .cl-demo__open{display:block;padding:13px 22px;border-top:1px solid #ffffff18;background:#121218;color:#ff9dbd;font-size:.79rem;font-weight:700;text-align:right}

.cl-page .cl-integration{min-height:0;padding:90px 0 100px;overflow:hidden;background:#fffaf7}
.cl-page .cl-integration__layout{min-height:0;grid-template-columns:minmax(0,.55fr) minmax(0,.45fr);gap:44px;align-items:center}
.cl-page .cl-integration__scene{display:grid;align-items:center;min-height:0;padding:24px;border:1px solid #f1dbe2;border-radius:20px;background:radial-gradient(circle at 85% 12%,#f4c4d1,#fff7f5 57%)}
.cl-page .cl-integration__scene::before{display:none}
.cl-page .cl-integration__screen{position:relative;inset:auto;width:100%;height:auto;margin:0;overflow:hidden;border:7px solid #121016;border-radius:15px;box-shadow:0 22px 50px #3b1b2d47;transform:none}
.cl-page .cl-integration__screen img{display:block;width:100%;height:auto;object-fit:contain}

.cl-page .cl-growth{padding:90px 0 95px;background:radial-gradient(ellipse 56% 82% at 83% 37%,#501b34 0%,#2d1223 43%,transparent 100%),linear-gradient(100deg,#0b0a0f 0%,#140c15 61%,#21101e 100%)}
.cl-page .cl-growth::before{display:none}
.cl-page .cl-growth__main{display:grid;grid-template-columns:minmax(0,.57fr) minmax(0,.43fr);gap:48px;align-items:center;min-height:0}
.cl-page .cl-growth__screen{position:relative;inset:auto;align-self:center;width:100%;height:auto;margin:0;overflow:hidden;border:7px solid #241b24;border-radius:16px;box-shadow:0 24px 55px #0008;transform:none}
.cl-page .cl-growth__screen img{display:block;width:100%;height:auto;object-fit:contain}
.cl-page .cl-growth__cards{margin-top:47px}

.cl-page .cl-pricing{min-height:0;padding:90px 0 100px;background:#fffaf7}
.cl-page .cl-pricing::before{display:none}
.cl-page .cl-pricing__layout{grid-template-columns:minmax(0,.58fr) minmax(0,.42fr);gap:38px;align-items:center;min-height:0}
.cl-page .cl-pricing__scene{display:grid;align-items:end;min-height:0;padding:155px 10px 20px;background:linear-gradient(180deg,#fffaf700 0%,#fffaf7 54%),url('/assets/img/cherryleads-reference/pricing-final.png') right top/auto 1400px no-repeat}
.cl-page .cl-pricing__screen{position:relative;inset:auto;width:100%;height:auto;margin:0;overflow:hidden;border:8px solid #111116;border-radius:17px;box-shadow:0 24px 55px #39282c57;transform:none}
.cl-page .cl-pricing__screen img{display:block;width:100%;height:auto;object-fit:contain}
.cl-page .cl-integration__screen figcaption,.cl-page .cl-growth__screen figcaption,.cl-page .cl-pricing__screen figcaption{padding:11px 14px;border-top:1px solid #ffffff20;background:#121016;text-align:right}
.cl-page .cl-integration__screen figcaption a,.cl-page .cl-growth__screen figcaption a,.cl-page .cl-pricing__screen figcaption a{color:#ffa1c1;font-size:.73rem;font-weight:700}

@media(max-width:1000px){
  .cl-page .cl-hero__visual{width:100%;margin:0}
  .cl-page .cl-product--hero{transform:none}
  .cl-page .cl-growth__main{gap:26px}
  .cl-page .cl-integration__layout,.cl-page .cl-pricing__layout{gap:25px}
}
@media(max-width:760px){
  .cl-page .cl-hero__visual{margin:0}
  .cl-page .cl-product--hero{max-height:none;overflow:hidden}
  .cl-page .cl-product--hero img{width:100%;max-width:100%;height:auto}
  .cl-page .cl-demo{padding:70px 0 75px}
  .cl-page .cl-demo__guide{padding:22px}
  .cl-page .cl-demo__panel{min-height:0;padding:22px}
  .cl-page .cl-demo__overview,.cl-page .cl-demo__lead-layout,.cl-page .cl-demo__results{display:grid;grid-template-columns:1fr;gap:24px;min-height:0}
  .cl-page .cl-demo__lead-detail dl{grid-template-columns:1fr 1fr}
  .cl-page .cl-demo__toolbar{gap:13px}
  .cl-page .cl-demo__tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;overflow:visible}
  .cl-page .cl-demo__tabs button{width:100%;padding:0 8px}
  .cl-page .cl-integration,.cl-page .cl-pricing{padding:70px 0 80px}
  .cl-page .cl-integration__layout,.cl-page .cl-pricing__layout,.cl-page .cl-growth__main{grid-template-columns:1fr;gap:28px}
  .cl-page .cl-integration__scene,.cl-page .cl-pricing__scene{min-height:0;margin:0;padding:18px;background:radial-gradient(circle at 85% 15%,#f3c6d3,#fffaf7 67%)}
  .cl-page .cl-integration__screen,.cl-page .cl-pricing__screen{position:relative;inset:auto;width:100%;height:auto;transform:none}
  .cl-page .cl-growth__screen{display:block;max-width:620px}
  .cl-page .cl-growth__cards{margin-top:30px}
}
@media(max-width:480px){
  .cl-page .cl-demo__lead-detail dl{grid-template-columns:1fr}
  .cl-page .cl-demo__metrics{gap:20px}
  .cl-page .cl-demo__sources>div{grid-template-columns:112px 1fr}
  .cl-page .cl-pricing__numbers{white-space:normal}
}
@media(prefers-reduced-motion:reduce){
  .cl-page .cl-demo__image img{transition:none!important}
}

/* Keep the reference scene inside its own section; its source image also contains the hero. */
.cl-page .cl-story{background:#fffaf7}
.cl-page .cl-story::before{display:none}
.cl-page .cl-story__scene{border-radius:18px;background:url('/assets/img/cherryleads-reference/hero-problem.png') right bottom/auto 1550px no-repeat}
@media(max-width:760px){
  .cl-page .cl-story__scene{background-size:auto 780px}
}

/* Latest layout review: show the supplied scene completely and use fewer product screens. */
.cl-page .cl-story__scene{display:grid;place-items:center;min-height:0;background:none}
.cl-page .cl-story__scene img{display:block;width:min(100%,430px);height:auto;border-radius:18px}
.cl-page .cl-demo__frame{max-width:1200px;margin-inline:auto}
.cl-page .cl-demo__image{overflow:visible}
.cl-page .cl-integration{padding-block:105px}
.cl-page .cl-integration__layout{grid-template-columns:minmax(0,.52fr) minmax(0,.48fr);gap:60px;align-items:center}
.cl-page .cl-integration__scene{display:block;padding:38px 42px;border:1px solid #f0d8df;border-radius:24px;background:radial-gradient(circle at 95% 8%,#f8dbe3,#fff7f5 68%)}
.cl-page .cl-integration__scene .cl-eye{margin-bottom:24px}
.cl-page .cl-integration__steps{display:grid;grid-template-columns:1fr;gap:8px;margin:0}
.cl-page .cl-integration__steps>div{display:grid;grid-template-columns:66px 1fr;align-items:center;column-gap:16px;row-gap:2px;padding:14px 18px;border:1px solid #eddee2;border-radius:15px;background:#fffdfa;box-shadow:0 10px 22px #4b22310d}
.cl-page .cl-integration__steps span{grid-row:1 / span 2;width:58px;height:58px;border-radius:12px;font-size:1.7rem}
.cl-page .cl-integration__steps strong{align-self:end;font-size:.95rem}
.cl-page .cl-integration__steps small{align-self:start;font-size:.76rem}
.cl-page .cl-integration__steps b{justify-self:center;margin:0;line-height:1;transform:rotate(90deg)}
.cl-page .cl-growth__main{grid-template-columns:minmax(0,.6fr) minmax(0,.4fr);gap:70px}
.cl-page .cl-growth__manifesto{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:350px;padding:45px 42px;border:0;background:none}
.cl-page .cl-growth__manifesto img{display:block;width:68px;height:68px;object-fit:contain;margin-bottom:30px;filter:drop-shadow(0 0 24px #e4477766)}
.cl-page .cl-growth__manifesto p{color:#fff;font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(1.9rem,2.8vw,3rem);font-weight:700;line-height:1.08;letter-spacing:-.055em}
.cl-page .cl-growth__manifesto em{color:#ff8eb6;font-style:normal}
.cl-page .cl-growth__manifesto>span{display:block;max-width:32ch;margin-top:26px;color:#d8c5cf;font-size:.88rem;line-height:1.55}
.cl-page .cl-pricing{padding:105px 0;background:radial-gradient(circle at 88% 46%,#f9e5e9,#fffaf7 48%)}
.cl-page .cl-pricing__layout{grid-template-columns:minmax(0,.59fr) minmax(0,.41fr);gap:65px;align-items:center}
.cl-page .cl-pricing__promise{display:flex;flex-direction:column;justify-content:center;min-height:540px;padding:55px 45px;border-left:1px solid #d97c9d;background:linear-gradient(90deg,#fffaf700,#f8e6ea88)}
.cl-page .cl-pricing__promise-mark{color:#d43069;font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(9rem,16vw,15rem);font-weight:700;line-height:.8;letter-spacing:-.12em}
.cl-page .cl-pricing__promise>p{margin:12px 0 56px;color:#ad345f;font-size:1.06rem;font-weight:700}
.cl-page .cl-pricing__promise div{display:grid;gap:12px;padding-top:22px;border-top:1px solid #e6a8ba}
.cl-page .cl-pricing__promise strong{color:#171018;font-family:'Space Grotesk',system-ui,sans-serif;font-size:1.55rem;line-height:1.2}
.cl-page .cl-pricing__promise div span{max-width:34ch;color:#64545d;font-size:.9rem;line-height:1.6}
.cl-page .cl-final-cta{padding:90px 0 64px;background:radial-gradient(circle at 75% 27%,#511c31,#0b0a0f 64%)}
.cl-page .cl-final-cta::before{display:none}
.cl-page .cl-final-cta__layout{display:grid;grid-template-columns:minmax(0,.57fr) minmax(0,.43fr);gap:25px 45px;align-items:center}
.cl-page .cl-final-cta__copy{max-width:740px}
.cl-page .cl-final-cta__scene{justify-self:center;align-self:center;width:min(100%,430px);transform:translateX(-18px)}
.cl-page .cl-final-cta__scene img{display:block;width:100%;height:auto;border-radius:15px;box-shadow:0 20px 45px #0008}
.cl-page .cl-final-cta__points{grid-column:1 / -1;max-width:none;margin-top:36px}
@media(max-width:1000px){
  .cl-page .cl-integration__layout,.cl-page .cl-pricing__layout{gap:30px}
  .cl-page .cl-integration__scene{padding:25px}
  .cl-page .cl-growth__main{gap:30px}
}
@media(max-width:760px){
  .cl-page .cl-story__scene{margin:26px auto 32px}
  .cl-page .cl-story__scene img{width:min(100%,330px)}
  .cl-page .cl-integration,.cl-page .cl-pricing{padding-block:75px}
  .cl-page .cl-integration__layout,.cl-page .cl-pricing__layout,.cl-page .cl-growth__main,.cl-page .cl-final-cta__layout{grid-template-columns:1fr}
  .cl-page .cl-integration__scene{padding:24px}
  .cl-page .cl-integration__steps>div{grid-template-columns:58px 1fr;padding:12px}
  .cl-page .cl-integration__steps span{width:50px;height:50px}
  .cl-page .cl-growth__manifesto{min-height:280px;padding:30px 26px}
  .cl-page .cl-pricing__promise{min-height:0;padding:36px 28px;border-left:0;border-top:1px solid #d97c9d}
  .cl-page .cl-pricing__promise-mark{font-size:8rem}
  .cl-page .cl-pricing__promise>p{margin-bottom:35px}
  .cl-page .cl-final-cta__scene{width:min(100%,430px);transform:none}
  .cl-page .cl-final-cta__points{grid-column:1;margin-top:12px}
}

/* Price typography keeps the full amount inside the available column. */
.cl-page .cl-pricing__numbers{grid-template-columns:max-content auto max-content;gap:clamp(12px,2vw,26px);max-width:100%;white-space:nowrap}
.cl-page .cl-pricing__numbers strong{display:block;font-family:'Inter',system-ui,sans-serif;font-size:clamp(3.4rem,5vw,5.2rem);font-weight:800;line-height:1.12;letter-spacing:0;white-space:nowrap}
.cl-page .cl-pricing__numbers span{font-size:clamp(.9rem,1.3vw,1.2rem);white-space:nowrap}
.cl-page .cl-final-cta{background:radial-gradient(ellipse at 75% 37%,#5a2035 0%,#2a111f 34%,#0b0a0f 75%)}
.cl-page .cl-final-cta__scene{position:absolute;z-index:0;top:8%;bottom:auto;right:6%;width:50%;height:80%;transform:none;pointer-events:none}
.cl-page .cl-final-cta__scene img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:0;box-shadow:none;-webkit-mask-image:radial-gradient(ellipse 67% 60% at 50% 50%,#000 43%,transparent 100%);mask-image:radial-gradient(ellipse 67% 60% at 50% 50%,#000 43%,transparent 100%)}
.cl-page .cl-final-cta__copy,.cl-page .cl-final-cta__points{position:relative;z-index:1}
@media(max-width:1050px){
  .cl-page .cl-pricing__numbers{gap:12px}
  .cl-page .cl-pricing__numbers strong{font-size:clamp(3rem,5vw,4.3rem)}
}
@media(max-width:760px){
  .cl-page .cl-final-cta__scene{position:relative;inset:auto;width:calc(100% + 36px);height:340px;margin-inline:-18px;transform:none}
  .cl-page .cl-final-cta__scene img{object-position:center;-webkit-mask-image:radial-gradient(ellipse 75% 50% at 50% 50%,#000 40%,transparent 100%);mask-image:radial-gradient(ellipse 75% 50% at 50% 50%,#000 40%,transparent 100%)}
}
@media(max-width:480px){
  .cl-page .cl-pricing__numbers{grid-template-columns:max-content auto max-content;gap:8px}
  .cl-page .cl-pricing__numbers strong{font-size:clamp(2.75rem,11.7vw,3.2rem)}
  .cl-page .cl-pricing__numbers span{font-size:.78rem}
  .cl-page .cl-final-cta__scene{height:290px}
}

/* The idea lives in the hero; the actual product appears in the interactive demo. */
.cl-page .cl-hero{min-height:680px;background:radial-gradient(ellipse at 78% 45%,#55203a 0%,#24111d 39%,#0b0a0f 75%)}
.cl-page .cl-hero::before{background:linear-gradient(90deg,#0b0a0f 0%,#120c13 70%,transparent)}
.cl-page .cl-hero__inner{grid-template-columns:minmax(0,.48fr) minmax(0,.52fr);gap:4%;padding-block:80px}
.cl-page .cl-hero__visual{width:100%;max-width:600px;margin:0;justify-self:center;transform:none}
.cl-page .cl-hero__visual::before{inset:12% 7%;background:#c72c6860;filter:blur(75px)}
.cl-page .cl-flow{position:relative;z-index:1;display:grid;justify-items:center;width:100%;min-height:0;overflow:visible;padding:35px 30px 32px;border:1px solid #f18aae42;border-radius:24px;background:linear-gradient(145deg,#27121fdd,#130e17ee);box-shadow:0 30px 70px #0008,0 0 80px #a82a5540;color:#fff}
.cl-page .cl-flow__sources{position:static;inset:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:100%;margin:0;padding:0}
.cl-flow__sources span{display:grid;place-items:center;min-height:42px;padding:7px 10px;border:1px solid #d883a457;border-radius:10px;background:#3b2433;color:#f8e1ea;font-size:.78rem;font-weight:650;text-align:center}
.cl-flow__line{position:relative;width:2px;height:28px;overflow:hidden;background:linear-gradient(#ff8bb9,#82415c)}
.cl-flow__line::after{content:'';position:absolute;bottom:0;left:-3px;width:8px;height:8px;border-right:2px solid #ff95bc;border-bottom:2px solid #ff95bc;transform:rotate(45deg)}
.cl-flow__brand{display:grid;grid-template-columns:38px auto;column-gap:10px;align-items:center;width:min(100%,340px);padding:14px 18px;border:1px solid #f36a9ca8;border-radius:13px;background:linear-gradient(135deg,#85204b,#3b122a);box-shadow:0 10px 35px #f04d8240}
.cl-flow__brand img{grid-row:1 / span 2;object-fit:contain}.cl-flow__brand strong{font-family:'Space Grotesk',sans-serif;font-size:1.18rem}.cl-flow__brand small{color:#f7c5d7;font-size:.65rem}
.cl-flow__request,.cl-flow__step{display:grid;gap:3px;width:min(100%,340px);padding:12px 17px;border:1px solid #ffffff35;border-radius:12px;background:#211c25;box-shadow:0 12px 25px #0004}
.cl-flow__request>span,.cl-flow__step>span{color:#f89dbd;font-size:.63rem;font-weight:800;letter-spacing:.12em}.cl-flow__request strong,.cl-flow__step strong{font-size:.98rem}.cl-flow__request small{color:#c9b7c3;font-size:.68rem}
.cl-flow__outcomes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,340px)}
.cl-flow__outcomes span{padding:10px 8px;border:1px solid #bd6b8b73;border-radius:8px;background:#39202e;color:#ffe3ed;font-size:.72rem;font-weight:700;text-align:center}
.js .cl-flow__sources span,.js .cl-flow__brand,.js .cl-flow__request,.js .cl-flow__step,.js .cl-flow__outcomes{animation:cl-flow-in .55s ease-out both}
.js .cl-flow__sources span:nth-child(2){animation-delay:.12s}.js .cl-flow__sources span:nth-child(3){animation-delay:.24s}.js .cl-flow__sources span:nth-child(4){animation-delay:.36s}
.js .cl-flow__brand{animation-delay:.55s}.js .cl-flow__request{animation-delay:.8s}.js .cl-flow__step{animation-delay:1.05s}.js .cl-flow__outcomes{animation-delay:1.3s}
.js .cl-flow__line{animation:cl-flow-line .35s ease-out both;transform-origin:top}.js .cl-flow__line:nth-of-type(2){animation-delay:.47s}.js .cl-flow__line:nth-of-type(4){animation-delay:.73s}.js .cl-flow__line:nth-of-type(6){animation-delay:.98s}.js .cl-flow__line:nth-of-type(8){animation-delay:1.23s}
@keyframes cl-flow-in{from{opacity:0;transform:translateY(9px) scale(.99)}to{opacity:1;transform:none}}
@keyframes cl-flow-line{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}
.cl-page .cl-demo{background:radial-gradient(circle at 90% 15%,#42192f,#0b0a0f 58%)}
.cl-page .cl-demo__frame--live{max-width:1080px;min-height:660px;margin-top:34px;overflow:hidden;background:#101116}
.cl-demo__frame--live iframe{display:block;width:100%;height:660px;border:0;background:#101116}

/* Keep section navigation available throughout the compact header range. */
@media(max-width:1000px){
  .cl-page .nav{display:none}
  .cl-page .burger{display:inline-flex;margin-left:0;flex:none}
  .cl-page .cl-header__actions{display:flex;margin-left:auto}
  .cl-page .menu:not([hidden]){display:block;position:fixed;z-index:39;top:72px;left:0;right:0;background:#141016;padding:20px}
  .cl-page .menu__list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
  .cl-page .menu a{color:white;text-decoration:none}
}
@media(max-width:760px){
  .cl-page .site-header__inner{gap:10px}
  .cl-page .cl-header__login{display:none}
  .cl-page .cl-header__cta{padding:10px;font-size:.72rem;white-space:nowrap}
}
@media(max-width:600px){.cl-page .menu:not([hidden]){top:64px}}
@media(max-width:400px){
  .cl-page .cl-brand{font-size:.95rem;flex:none;gap:6px}
  .cl-page .cl-brand .wordmark__signet{width:24px;height:24px}
  .cl-page .cl-header__cta{padding:10px 8px;font-size:.68rem}
  .cl-page .site-header__inner{gap:8px}
}
@media(max-width:360px){
  .cl-page .cl-brand{font-size:.8rem}
  .cl-page .cl-brand .wordmark__signet{display:none}
  .cl-page .cl-header__cta{padding-inline:7px;font-size:.65rem}
}
.cl-demo__loading{position:absolute;inset:0;display:grid;place-items:center;background:#101116;color:#d9bdca;font-size:.85rem;pointer-events:none}
.cl-demo__loading[hidden]{display:none}
.cl-page .cl-demo__mobile-link{display:none}
@media(max-width:1000px){.cl-page .cl-hero__inner{grid-template-columns:1fr;gap:35px}.cl-page .cl-hero__visual{max-width:570px;margin:0 auto}.cl-page .cl-hero::before{width:100%;background:linear-gradient(90deg,#0b0a0fcc,#1c0c16aa)}}
@media(max-width:760px){.cl-page .cl-hero__inner{padding-block:55px}.cl-flow{padding:23px 18px}.cl-page .cl-demo__frame--live{display:none}.cl-page .cl-demo__mobile-link{display:inline-flex;margin-top:25px}.cl-page .cl-demo__head>div>p:last-child{font-size:.96rem}}
@media(prefers-reduced-motion:reduce){.js .cl-flow__sources span,.js .cl-flow__brand,.js .cl-flow__request,.js .cl-flow__step,.js .cl-flow__outcomes,.js .cl-flow__line{animation:none!important}}

/* The same supplied transparent scene now sits directly on both dark sections. */
.cl-page .cl-hero{overflow:hidden;background:radial-gradient(ellipse 43% 62% at 79% 58%,#99405280 0%,#682a453d 45%,transparent 80%),radial-gradient(ellipse 31% 46% at 99% 87%,#a6385a38 0%,transparent 72%),linear-gradient(108deg,#09090e 0%,#120c14 40%,#25111e 73%,#361823 100%)}
.cl-page .cl-hero::before{display:block;inset:17% -6% 3% 48%;width:auto;height:auto;border-radius:50%;background:radial-gradient(ellipse at 56% 58%,#d14b702e 0%,#8f2d4b24 42%,transparent 74%);filter:blur(48px);pointer-events:none}
.cl-page .cl-hero::after{background:radial-gradient(ellipse 90% 92% at 59% 55%,transparent 48%,#07060b66 100%),linear-gradient(180deg,#09080d8c 0%,transparent 22%,transparent 80%,#08070bb0 100%)}
.cl-page .cl-hero__inner{grid-template-columns:minmax(0,.48fr) minmax(0,.52fr)}
.cl-page .cl-hero__visual{position:relative;top:68px;justify-self:end;align-self:end;width:clamp(680px,58vw,850px);max-width:none;margin:0 calc(-1 * max(40px, (100vw - 1280px)/2)) 0 0;pointer-events:none}
.cl-page .cl-hero__visual::before{inset:21% 7% 8% 23%;background:#af365537;filter:blur(85px)}
.cl-page .cl-hero__cutout{position:relative;z-index:1;display:block;width:100%;height:auto;max-width:none;filter:drop-shadow(0 18px 24px #08040b75)}
.cl-page .cl-final-cta{background:radial-gradient(ellipse 52% 75% at 81% 43%,#63233e 0%,#371629 48%,transparent 92%),linear-gradient(90deg,#0b0a0f,#1b0e1a)}
.cl-page .cl-final-cta__scene{top:auto;right:calc(-1 * max(40px, (100vw - 1280px)/2));bottom:0;width:min(67vw,1010px);height:auto;margin:0;transform:none;isolation:isolate}
.cl-page .cl-final-cta__scene::before{content:'';position:absolute;z-index:-1;inset:18% 7% 10% 27%;border-radius:50%;background:#c9366950;filter:blur(65px)}
.cl-page .cl-final-cta__scene img{display:block;width:100%;height:auto;max-width:none;object-fit:contain;object-position:center;border:0;border-radius:0;box-shadow:none;-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 16px 25px #08040b72)}
@media(max-width:1000px){
  .cl-page .cl-hero__inner{grid-template-columns:1fr;gap:10px;padding-bottom:0}
  .cl-page .cl-hero__visual{top:0;justify-self:center;align-self:end;width:min(100% + 150px,850px);margin:0 -75px -2px}
  .cl-page .cl-final-cta__scene{right:calc(-1 * max(40px, (100vw - 1280px)/2));width:68vw}
}
@media(max-width:760px){
  .cl-page .cl-hero__inner{gap:8px;padding-bottom:0}
  .cl-page .cl-hero__visual{width:calc(100% + 36px);max-width:none;margin:0 -18px -2px}
  .cl-page .cl-final-cta__layout{grid-template-columns:minmax(0,1fr);gap:20px}
  .cl-page .cl-final-cta__scene{position:relative;inset:auto;justify-self:center;width:calc(100% + 36px);height:auto;margin:0 -18px -5px}
  .cl-page .cl-final-cta__points{margin-top:0}
}
@media(max-width:480px){
  .cl-page .cl-hero__visual{width:calc(100% + 36px);margin:0 -18px -2px}
  .cl-page .cl-final-cta__scene{width:calc(100% + 36px);height:auto;margin:0 -18px -5px}
}

/* Give the opening message two clear lines above the supporting copy. */
.cl-hero__visual>picture,.cl-story__scene>picture,.cl-final-cta__scene>picture{display:block;width:100%}
.cl-story__scene>picture{display:grid;place-items:center}
@media(max-width:360px){
  .cl-page .cl-pricing__numbers{gap:6px}
  .cl-page .cl-pricing__numbers strong{font-size:clamp(2.3rem,11.2vw,2.75rem)}
  .cl-page .cl-pricing__numbers b{font-size:2rem}
  .cl-page .cl-final-cta__copy>.cl-btn{max-width:100%;padding:14px 16px;white-space:normal;font-size:.92rem;gap:12px}
}

.cl-page .cl-hero h1>span{display:block}
@media(min-width:1001px){
  .cl-page .cl-hero__inner{display:block;padding-block:60px 66px}
  .cl-page .cl-hero__copy{position:relative;max-width:none}
  .cl-page .cl-hero h1{max-width:none}
  .cl-page .cl-hero h1>span{white-space:nowrap}
  .cl-page .cl-hero__visual{position:absolute;top:auto;bottom:0;right:0}
}