html body.landing-home.landing-c-variant {
--landing-c-bg: #ffffff;
--landing-c-surface: #ffffff;
--landing-c-surface-soft: rgba(255, 255, 255, 0.88);
--landing-c-line: rgba(19, 22, 27, 0.08);
--landing-c-ink: #16181d;
--landing-c-muted: #686b74;
--landing-c-dark: #111215;
--landing-c-dark-soft: #1a1b20;
--landing-c-dark-line: rgba(255, 255, 255, 0.1);
--landing-c-accent: #4a69ff;
background:
radial-gradient(circle at 12% 6%, rgba(102, 122, 255, 0.06), transparent 22%),
linear-gradient(180deg, #ffffff 0%, #fbfbfc 100%) !important;
color: var(--landing-c-ink) !important;
}
html body.landing-home.landing-c-variant .smalltitle {
display: none !important;
}
html body.landing-home.landing-c-variant .content-wrapper {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
padding-bottom: 104px !important;
}
html body.landing-home.landing-c-variant .main-content {
width: 100% !important;
max-width: none !important;
}
html body.landing-home.landing-c-variant .container {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding-left: clamp(20px, 3.2vw, 44px) !important;
padding-right: clamp(20px, 3.2vw, 44px) !important;
}
html body.landing-home.landing-c-variant header.landing-topbar {
top: 8px !important;
margin: 0 clamp(12px, 3vw, 36px) 26px !important;
padding: 10px 16px 12px !important;
border-radius: 20px !important;
border: 1px solid rgba(255, 255, 255, 0.5) !important;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.66), rgba(255, 255, 255, 0.4)) !important;
box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
backdrop-filter: blur(20px) saturate(155%) !important;
-webkit-backdrop-filter: blur(20px) saturate(155%) !important;
}
html body.landing-home.landing-c-variant .landing-topbar-link,
html body.landing-home.landing-c-variant .landing-topbar-cta {
min-height: 42px !important;
border-radius: 999px !important;
font-weight: 700 !important;
}
html body.landing-home.landing-c-variant .landing-topbar-actions {
justify-content: flex-end !important;
}
html body.landing-home.landing-c-variant .landing-topbar-cta {
display: none !important;
}
html body.landing-home.landing-c-variant .landing-topbar-link {
color: var(--landing-c-ink) !important;
border: 1px solid rgba(17, 17, 17, 0.08) !important;
background: rgba(255, 255, 255, 0.72) !important;
}
html body.landing-home.landing-c-variant .landing-topbar-cta {
color: #ffffff !important;
background: linear-gradient(180deg, #1b1c21 0%, #111215 100%) !important;
border: 1px solid transparent !important;
}
html body.landing-home.landing-c-variant .container {
max-width: 100% !important;
}
html body.landing-home.landing-c-variant .vision.landing-page {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
overflow: visible !important;
overflow-x: visible !important;
gap: 92px !important;
}
html body.landing-home.landing-c-variant .enterprise-hero {
position: relative !important;
isolation: isolate !important;
overflow: visible !important;
margin-inline: 0 !important;
padding: 14px 0 0 !important;
border-radius: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .hero-video-shell {
display: block !important;
position: absolute !important;
z-index: 0 !important;
top: -34px !important;
bottom: -42px !important;
left: 50% !important;
width: 100vw !important;
transform: translateX(-50%) !important;
overflow: hidden !important;
pointer-events: none !important;
background-color: #f4f8ff !important;
background-image: url("assets/hero/reallink-silicon-valley-hero-v3.svg") !important;
background-size: cover !important;
background-position: center !important;
}
html body.landing-home.landing-c-variant .hero-bg-video {
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
object-position: center !important;
opacity: 0.82 !important;
}
html body.landing-home.landing-c-variant .hero-video-overlay {
display: block !important;
position: absolute !important;
z-index: 0 !important;
top: -34px !important;
bottom: -42px !important;
left: 50% !important;
width: 100vw !important;
transform: translateX(-50%) !important;
pointer-events: none !important;
background:
linear-gradient(90deg, rgba(255, 255, 255, 0.62) 0%, rgba(255, 255, 255, 0.34) 48%, rgba(255, 255, 255, 0.04) 100%),
linear-gradient(180deg, rgba(245, 247, 251, 0.32) 0%, rgba(245, 247, 251, 0.1) 56%, rgba(245, 247, 251, 0.58) 100%) !important;
}
html body.landing-home.landing-c-variant .enterprise-hero::after {
display: none !important;
content: none !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .hero-video-shell {
top: -18px !important;
bottom: auto !important;
height: min(980px, 118vh) !important;
background-position: center center !important;
}
html body.landing-home.landing-c-variant .hero-bg-video {
opacity: 0.7 !important;
object-position: center center !important;
}
html body.landing-home.landing-c-variant .hero-video-overlay {
top: -18px !important;
bottom: auto !important;
height: min(980px, 118vh) !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0.28) 50%, rgba(245, 247, 251, 0.72) 100%),
linear-gradient(90deg, rgba(255, 255, 255, 0.52) 0%, rgba(255, 255, 255, 0.18) 100%) !important;
}
}
/* Hero pricing/focus promise: a quiet startup-style trust band below the primary CTA. */
html body.landing-home.landing-c-variant .hero-promise-band {
position: relative !important;
width: min(100%, 1120px) !important;
margin: clamp(26px, 3.4vw, 44px) auto 0 !important;
padding: clamp(18px, 2.1vw, 26px) clamp(20px, 3.2vw, 40px) !important;
display: grid !important;
grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.18fr) !important;
gap: clamp(18px, 3vw, 44px) !important;
align-items: center !important;
border: 0 !important;
border-radius: 30px !important;
overflow: hidden !important;
background:
radial-gradient(circle at 8% 18%, rgba(37, 99, 235, 0.08), transparent 36%),
radial-gradient(circle at 94% 82%, rgba(20, 184, 166, 0.075), transparent 36%),
linear-gradient(135deg, rgba(248, 250, 255, 0.9) 0%, rgba(255, 255, 255, 0.72) 60%, rgba(244, 248, 255, 0.7) 100%) !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .hero-promise-band::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
pointer-events: none !important;
background:
linear-gradient(90deg, rgba(37, 99, 235, 0.08), transparent 30%, transparent 70%, rgba(20, 184, 166, 0.07)) top / 100% 1px no-repeat,
linear-gradient(90deg, rgba(15, 23, 42, 0.018), transparent 44%, rgba(15, 23, 42, 0.014)) !important;
opacity: 0.58 !important;
}
html body.landing-home.landing-c-variant .hero-promise-band::after {
content: none !important;
}
html body.landing-home.landing-c-variant .hero-promise-price,
html body.landing-home.landing-c-variant .hero-promise-focus {
position: relative !important;
z-index: 1 !important;
margin: 0 !important;
text-align: left !important;
word-break: keep-all !important;
overflow-wrap: break-word !important;
text-wrap: pretty !important;
}
html body.landing-home.landing-c-variant .hero-promise-price {
color: #111827 !important;
font-size: clamp(0.98rem, 1.18vw, 1.13rem) !important;
line-height: 1.62 !important;
letter-spacing: -0.022em !important;
font-weight: 780 !important;
}
html body.landing-home.landing-c-variant .hero-promise-focus {
color: #475569 !important;
font-size: clamp(0.96rem, 1.08vw, 1.06rem) !important;
line-height: 1.72 !important;
letter-spacing: -0.012em !important;
font-weight: 520 !important;
}
html body.landing-home.landing-c-variant .hero-promise-band + .hero-detail-grid {
margin-top: clamp(48px, 6.4vw, 86px) !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .hero-promise-band {
grid-template-columns: 1fr !important;
gap: 8px !important;
margin-top: 22px !important;
padding: 18px 18px 19px !important;
border-radius: 22px !important;
}
html body.landing-home.landing-c-variant .hero-promise-price {
font-size: 0.94rem !important;
line-height: 1.58 !important;
}
html body.landing-home.landing-c-variant .hero-promise-focus {
font-size: 0.9rem !important;
line-height: 1.62 !important;
}
html body.landing-home.landing-c-variant .hero-promise-band + .hero-detail-grid {
margin-top: 30px !important;
}
}
@media (prefers-reduced-motion: reduce) {
html body.landing-home.landing-c-variant .hero-bg-video {
display: none !important;
}
}
html body.landing-home.landing-c-variant .hero-grid {
position: relative !important;
z-index: 1 !important;
grid-template-columns: minmax(0, 0.84fr) minmax(560px, 1.16fr) !important;
gap: 78px !important;
align-items: center !important;
padding: 0 !important;
}
html body.landing-home.landing-c-variant .hero-copy-column {
display: grid !important;
align-content: start !important;
gap: 0 !important;
min-width: 0 !important;
}
html body.landing-home.landing-c-variant .hero-kicker,
html body.landing-home.landing-c-variant .section-kicker,
html body.landing-home.landing-c-variant .pricing-badge,
html body.landing-home.landing-c-variant .hero-preview-title {
display: flex !important;
align-items: center !important;
gap: 14px !important;
width: 100% !important;
min-height: auto !important;
padding: 0 0 12px !important;
color: #5c73ef !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
font-size: 0.78rem !important;
font-weight: 700 !important;
letter-spacing: -0.01em !important;
line-height: 1.2 !important;
}
html body.landing-home.landing-c-variant .hero-kicker::after,
html body.landing-home.landing-c-variant .section-kicker::after,
html body.landing-home.landing-c-variant .pricing-badge::after,
html body.landing-home.landing-c-variant .hero-preview-title::after {
content: "" !important;
flex: 1 1 auto !important;
min-width: 72px !important;
height: 1px !important;
background: rgba(92, 115, 239, 0.14) !important;
}
html body.landing-home.landing-c-variant .landing-headline {
max-width: 10.8ch !important;
margin-top: 18px !important;
color: #111317 !important;
font-size: clamp(3.1rem, 4.9vw, 5.1rem) !important;
line-height: 0.92 !important;
letter-spacing: -0.075em !important;
}
html body.landing-home.landing-c-variant .landing-copy {
max-width: 54ch !important;
margin-top: calc(24px - var(--hero-title-reserved-extra, 0px)) !important;
color: #555c69 !important;
font-size: 1.04rem !important;
line-height: 1.84 !important;
transition: margin-top 560ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}
html body.landing-home.landing-c-variant .hero-message-animated {
opacity: 1;
filter: blur(0);
transform: translate3d(0, 0, 0) scale(1);
transition:
opacity 560ms ease,
filter 560ms ease,
transform 620ms cubic-bezier(0.16, 1, 0.3, 1);
will-change: opacity, filter, transform;
}
html body.landing-home.landing-c-variant .js-hero-message-lead.hero-message-animated {
transition-delay: 70ms;
}
html body.landing-home.landing-c-variant .hero-message-animated.is-entering {
opacity: 0;
filter: blur(10px);
transform: translate3d(0, 18px, 0) scale(0.985);
}
html body.landing-home.landing-c-variant .hero-message-animated.is-exiting {
opacity: 0;
filter: blur(8px);
transform: translate3d(0, -14px, 0) scale(0.992);
}
html body.landing-home.landing-c-variant .js-hero-message-lead.hero-message-animated.is-exiting {
transform: translate3d(0, -8px, 0) scale(0.995);
}
@media (prefers-reduced-motion: reduce) {
html body.landing-home.landing-c-variant .hero-message-animated {
transition: none !important;
filter: none !important;
transform: none !important;
}
html body.landing-home.landing-c-variant .landing-copy {
transition: none !important;
}
}
html body.landing-home.landing-c-variant .cta-row {
gap: 12px !important;
margin-top: 28px !important;
}
html body.landing-home.landing-c-variant .cta-button {
min-height: 50px !important;
padding: 0 20px !important;
border-radius: 999px !important;
font-weight: 700 !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .cta-primary {
color: #ffffff !important;
background: #121317 !important;
border: 1px solid transparent !important;
}
html body.landing-home.landing-c-variant .cta-secondary {
color: #121317 !important;
background: rgba(255, 255, 255, 0.9) !important;
border: 1px solid rgba(17, 17, 17, 0.12) !important;
}
html body.landing-home.landing-c-variant .hero-note {
margin-top: 24px !important;
padding-top: 16px !important;
border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
color: #5f6672 !important;
}
html body.landing-home.landing-c-variant .hero-note strong {
color: #111317 !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid {
margin-top: 30px !important;
padding-top: 0 !important;
border-top: 0 !important;
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 22px !important;
}
html body.landing-home.landing-c-variant .mini-card {
min-width: 0 !important;
padding: 14px 0 0 !important;
border-radius: 0 !important;
border: 0 !important;
border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .mini-card strong {
color: #101216 !important;
}
html body.landing-home.landing-c-variant .mini-card span {
color: #646b77 !important;
}
html body.landing-home.landing-c-variant .hero-transform-band {
margin-top: 34px !important;
padding-top: 24px !important;
border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
}
html body.landing-home.landing-c-variant .hero-transform-line {
color: #181b20 !important;
font-size: clamp(1.2rem, 2vw, 1.54rem) !important;
line-height: 1.3 !important;
}
html body.landing-home.landing-c-variant .hero-transform-prefix,
html body.landing-home.landing-c-variant .hero-transform-suffix {
color: #22262c !important;
}
html body.landing-home.landing-c-variant .hero-transform-rolling {
width: 198px !important;
}
html body.landing-home.landing-c-variant .hero-transform-current {
color: #5c73ef !important;
}
html body.landing-home.landing-c-variant .product-stage {
display: block !important;
order: 1 !important;
min-height: auto !important;
}
html body.landing-home.landing-c-variant .hero-support-column {
order: 2 !important;
}
html body.landing-home.landing-c-variant .hero-preview-stack {
height: 100% !important;
}
html body.landing-home.landing-c-variant .hero-preview-title {
margin: 0 0 16px !important;
}
html body.landing-home.landing-c-variant .hero-preview-surface {
height: 100% !important;
padding: 0 !important;
border-radius: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .hero-preview-context {
padding-bottom: 16px !important;
border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
margin-bottom: 18px !important;
}
html body.landing-home.landing-c-variant .hero-preview-context-time {
color: #15191f !important;
}
html body.landing-home.landing-c-variant .hero-preview-context-copy {
color: #666d78 !important;
}
html body.landing-home.landing-c-variant .hero-preview-frame {
position: relative !important;
margin: 0 !important;
aspect-ratio: auto !important;
height: auto !important;
min-height: 0 !important;
padding: 18px !important;
border-radius: 26px !important;
background: #ffffff !important;
border: 1px solid rgba(17, 17, 17, 0.08) !important;
box-shadow: 0 24px 72px rgba(17, 17, 17, 0.08) !important;
}
html body.landing-home.landing-c-variant .hero-preview-iframe {
height: 760px !important;
}
html body.landing-home.landing-c-variant .trust-strip {
display: grid !important;
gap: 18px !important;
padding: 0 !important;
}
html body.landing-home.landing-c-variant .trust-strip-inline {
padding-top: 2px !important;
padding-bottom: 0 !important;
}
html body.landing-home.landing-c-variant .trust-strip-inline .trust-strip-kicker {
margin-bottom: 10px !important;
}
html body.landing-home.landing-c-variant .trust-strip-inline .trust-strip-marquee {
max-width: 100% !important;
}
html body.landing-home.landing-c-variant .proof-ribbon-inline {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 18px !important;
margin-top: 4px !important;
}
html body.landing-home.landing-c-variant .platform-summary {
display: none !important;
}
html body.landing-home.landing-c-variant .trust-strip-kicker {
margin: 0 !important;
text-align: left !important;
color: #7c8087 !important;
font-size: 0.82rem !important;
font-weight: 700 !important;
letter-spacing: 0.06em !important;
text-transform: uppercase !important;
}
html body.landing-home.landing-c-variant .trust-strip-marquee {
padding: 0 2px !important;
mask-image: none !important;
-webkit-mask-image: none !important;
}
html body.landing-home.landing-c-variant .trust-strip-rail {
gap: 14px !important;
padding-right: 14px !important;
animation-duration: 24s !important;
}
html body.landing-home.landing-c-variant .trust-strip-rail span {
min-height: 42px !important;
padding: 0 18px !important;
border-radius: 999px !important;
border: 1px solid rgba(17, 17, 17, 0.08) !important;
background: rgba(255, 255, 255, 0.96) !important;
color: #1c1f26 !important;
font-size: 0.96rem !important;
font-weight: 600 !important;
letter-spacing: -0.02em !important;
}
html body.landing-home.landing-c-variant .proof-ribbon-inline .proof-card {
min-width: 0 !important;
padding: 16px 0 0 !important;
border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
background: transparent !important;
box-shadow: none !important;
border-radius: 0 !important;
}
html body.landing-home.landing-c-variant .proof-ribbon-inline .proof-card h3 {
margin: 0 0 8px !important;
color: #1c1f26 !important;
font-size: 1rem !important;
line-height: 1.35 !important;
letter-spacing: -0.02em !important;
}
html body.landing-home.landing-c-variant .proof-ribbon-inline .proof-card p {
margin: 0 !important;
color: #666d78 !important;
font-size: 0.92rem !important;
line-height: 1.65 !important;
}
@media (min-width: 992px) {
html body.landing-home.landing-c-variant .proof-ribbon-inline {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 18px !important;
margin-top: 4px !important;
}
html body.landing-home.landing-c-variant .platform-summary {
display: none !important;
}
}
html body.landing-home.landing-c-variant .landing-section {
padding: 6px 0 !important;
border-radius: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
html body.landing-home.landing-c-variant .landing-section + .landing-section {
margin-top: 2px !important;
padding-top: 54px !important;
border-top: 1px solid rgba(17, 17, 17, 0.06) !important;
}
html body.landing-home.landing-c-variant #home-pricing,
html body.landing-home.landing-c-variant #home-how {
position: relative !important;
margin-top: 0 !important;
left: 50% !important;
width: 100vw !important;
transform: translateX(-50%) !important;
margin-left: 0 !important;
margin-right: 0 !important;
padding-top: 68px !important;
padding-bottom: 68px !important;
padding-left: max(24px, calc((100vw - 1400px) / 2)) !important;
padding-right: max(24px, calc((100vw - 1400px) / 2)) !important;
border-top: 0 !important;
}
html body.landing-home.landing-c-variant #home-pricing {
background:
radial-gradient(circle at 16% 14%, rgba(123, 137, 255, 0.16), transparent 24%),
radial-gradient(circle at 84% 20%, rgba(255, 255, 255, 0.04), transparent 18%),
linear-gradient(180deg, #191933 0%, #232347 100%) !important;
}
html body.landing-home.landing-c-variant #home-how {
background: #ffffff !important;
color: var(--landing-c-ink) !important;
}
html body.landing-home.landing-c-variant #home-pricing .section-title,
html body.landing-home.landing-c-variant #home-pricing .section-lead,
html body.landing-home.landing-c-variant #home-pricing .pricing-value {
color: #f5f7fb !important;
}
html body.landing-home.landing-c-variant #home-how .section-title,
html body.landing-home.landing-c-variant #home-how .how-step-copy h4 {
color: #111317 !important;
}
html body.landing-home.landing-c-variant #home-how .section-lead,
html body.landing-home.landing-c-variant #home-how .how-step-copy p {
color: #5f6672 !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-caption,
html body.landing-home.landing-c-variant #home-pricing .pricing-note,
html body.landing-home.landing-c-variant #home-pricing .pricing-list li,
html body.landing-home.landing-c-variant #home-pricing .section-lead {
color: rgba(245, 247, 251, 0.74) !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-list li {
border-top-color: rgba(255, 255, 255, 0.14) !important;
}
html body.landing-home.landing-c-variant #home-how .how-step {
border-top-color: rgba(17, 17, 17, 0.08) !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-grid {
border-top-color: rgba(255, 255, 255, 0.12) !important;
}
html body.landing-home.landing-c-variant #home-pricing .cta-primary {
color: #111317 !important;
background: #ffffff !important;
border-color: transparent !important;
}
html body.landing-home.landing-c-variant #home-pricing .cta-primary:hover {
background: #edf1f7 !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-shell {
border-color: rgba(17, 17, 17, 0.08) !important;
background: #f7f9fc !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-card {
background: #ffffff !important;
border: 1px solid rgba(255, 255, 255, 0.72) !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-card-header h4,
html body.landing-home.landing-c-variant #home-how .how-stage-item-copy strong {
color: #111217 !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-item-copy span {
color: #5f6672 !important;
}
html body.landing-home.landing-c-variant #home-how .how-step-number {
color: #7f93ff !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-badge {
background: #eef2ff !important;
color: #4254d8 !important;
border: 1px solid rgba(66, 84, 216, 0.12) !important;
}
html body.landing-home.landing-c-variant #home-themes {
position: relative !important;
left: 50% !important;
width: 100vw !important;
transform: translateX(-50%) !important;
margin-top: 0 !important;
padding: clamp(64px, 8vw, 104px) clamp(20px, 3.2vw, 44px) !important;
overflow: hidden !important;
border-top: 0 !important;
background:
radial-gradient(circle at 10% 8%, rgba(92, 115, 239, 0.14), transparent 24%),
radial-gradient(circle at 90% 18%, rgba(255, 117, 84, 0.12), transparent 22%),
linear-gradient(180deg, #f5f7fb 0%, #ffffff 58%, #f7f9fd 100%) !important;
}
html body.landing-home.landing-c-variant #home-themes .theme-showcase-inner {
width: 100% !important;
max-width: 1440px !important;
margin: 0 auto !important;
}
html body.landing-home.landing-c-variant #home-themes .section-header {
margin-bottom: 18px !important;
}
html body.landing-home.landing-c-variant #home-themes .section-title {
max-width: 13.5ch !important;
}
html body.landing-home.landing-c-variant .theme-showcase-actions {
display: flex !important;
align-items: center !important;
gap: 10px !important;
flex-wrap: wrap !important;
margin: 0 0 28px !important;
}
html body.landing-home.landing-c-variant .theme-showcase-stat {
display: inline-flex !important;
align-items: center !important;
min-height: 34px !important;
margin: 0 !important;
padding: 0 14px !important;
border: 1px solid rgba(92, 115, 239, 0.18) !important;
border-radius: 999px !important;
background: rgba(255, 255, 255, 0.72) !important;
color: #4f63d9 !important;
font-size: 0.86rem !important;
font-weight: 800 !important;
letter-spacing: -0.02em !important;
}
html body.landing-home.landing-c-variant .theme-showcase-more {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 7px !important;
min-height: 34px !important;
padding: 0 13px !important;
border: 1px solid rgba(15, 23, 42, 0.12) !important;
border-radius: 999px !important;
background: rgba(255, 255, 255, 0.92) !important;
color: #111827 !important;
text-decoration: none !important;
font-size: 0.82rem !important;
font-weight: 760 !important;
letter-spacing: -0.02em !important;
box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08) !important;
transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}
html body.landing-home.landing-c-variant .theme-showcase-more svg {
width: 15px !important;
height: 15px !important;
stroke: currentColor !important;
stroke-width: 2.3 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
}
html body.landing-home.landing-c-variant .theme-showcase-more:hover {
transform: translateY(-1px) !important;
border-color: rgba(79, 99, 217, 0.28) !important;
box-shadow: 0 16px 32px rgba(79, 99, 217, 0.16) !important;
}
html body.landing-home.landing-c-variant .theme-marquee-stage {
display: grid !important;
gap: 20px !important;
width: 100% !important;
}
html body.landing-home.landing-c-variant .theme-marquee-row {
display: flex !important;
gap: 18px !important;
width: 100% !important;
overflow: hidden !important;
-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
}
html body.landing-home.landing-c-variant .theme-marquee-track {
display: flex !important;
flex: 0 0 auto !important;
gap: 18px !important;
min-width: max-content !important;
animation: themeShowcaseMarquee 58s linear infinite !important;
}
html body.landing-home.landing-c-variant .theme-marquee-row-reverse .theme-marquee-track {
animation-duration: 64s !important;
animation-direction: reverse !important;
}
html body.landing-home.landing-c-variant .theme-marquee-stage:hover .theme-marquee-track {
animation-play-state: paused !important;
}
html body.landing-home.landing-c-variant .theme-showcase-card {
width: 174px !important;
flex: 0 0 174px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
html body.landing-home.landing-c-variant .theme-showcase-card img {
display: block !important;
width: 100% !important;
height: auto !important;
aspect-ratio: auto !important;
object-fit: contain !important;
overflow: hidden !important;
border-radius: 14px !important;
clip-path: inset(0 round 14px) !important;
-webkit-mask-image: -webkit-radial-gradient(white, black) !important;
background: transparent !important;
}
html body.landing-home.landing-c-variant .theme-showcase-card span {
display: block !important;
margin-top: 7px !important;
padding: 0 2px !important;
color: rgba(23, 26, 34, 0.62) !important;
font-size: 0.66rem !important;
font-weight: 500 !important;
line-height: 1.2 !important;
letter-spacing: -0.015em !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
text-align: center !important;
}
@keyframes themeShowcaseMarquee {
from {
transform: translateX(0);
}
to {
transform: translateX(calc(-100% - 18px));
}
}
@media (prefers-reduced-motion: reduce) {
html body.landing-home.landing-c-variant .theme-marquee-track {
animation: none !important;
}
}
html body.landing-home.landing-c-variant .footer-island nav a:hover,
html body.landing-home.landing-c-variant .footer-island nav a:focus-visible {
background: rgba(255, 255, 255, 0.92) !important;
background-color: rgba(255, 255, 255, 0.92) !important;
color: #101216 !important;
}
html body.landing-home.landing-c-variant .footer-island #menu-button:hover,
html body.landing-home.landing-c-variant .footer-island #menu-button:focus-visible {
background: rgba(255, 255, 255, 0.92) !important;
background-color: rgba(255, 255, 255, 0.92) !important;
color: #101216 !important;
}
html body.landing-home.landing-c-variant .footer-island {
z-index: 3200 !important;
}
html body.landing-home.landing-c-variant.menu-is-open .footer-island #menu-button {
background: rgba(255, 255, 255, 0.92) !important;
background-color: rgba(255, 255, 255, 0.92) !important;
color: #101216 !important;
}
html body.landing-home.landing-c-variant .footer-island nav a:hover svg,
html body.landing-home.landing-c-variant .footer-island nav a:focus-visible svg,
html body.landing-home.landing-c-variant.menu-is-open .footer-island #menu-button svg {
stroke: #101216 !important;
}
html body.landing-home.landing-c-variant .footer-island nav a:hover .button-label,
html body.landing-home.landing-c-variant .footer-island nav a:focus-visible .button-label,
html body.landing-home.landing-c-variant.menu-is-open .footer-island #menu-button .button-label {
color: #101216 !important;
}
html body.landing-home.landing-c-variant .section-header {
gap: 16px !important;
align-items: end !important;
}
html body.landing-home.landing-c-variant .section-kicker,
html body.landing-home.landing-c-variant .pricing-badge {
color: #4d60d7 !important;
background: transparent !important;
border: 0 !important;
}
html body.landing-home.landing-c-variant .section-title,
html body.landing-home.landing-c-variant .analysis-showcase-title {
color: var(--landing-c-ink) !important;
letter-spacing: -0.055em !important;
}
html body.landing-home.landing-c-variant .section-lead,
html body.landing-home.landing-c-variant .analysis-showcase-copy {
color: var(--landing-c-muted) !important;
}
html body.landing-home.landing-c-variant .proof-ribbon {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 26px !important;
padding-top: 0 !important;
border-top: 0 !important;
}
html body.landing-home.landing-c-variant .proof-card,
html body.landing-home.landing-c-variant .proof-card + .proof-card {
margin: 0 !important;
padding: 18px 0 0 !important;
border-radius: 0 !important;
border: 0 !important;
border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .proof-card h3,
html body.landing-home.landing-c-variant .pricing-value {
color: #12151b !important;
}
html body.landing-home.landing-c-variant .proof-card p,
html body.landing-home.landing-c-variant .pricing-note,
html body.landing-home.landing-c-variant .pricing-caption,
html body.landing-home.landing-c-variant .pricing-list li {
color: var(--landing-c-muted) !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-grid {
grid-template-columns: minmax(280px, 0.42fr) minmax(0, 0.58fr) !important;
gap: 32px !important;
padding-top: 24px !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-spotlight {
padding: 0 !important;
border-radius: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-badge,
html body.landing-home.landing-c-variant #home-pricing .pricing-value,
html body.landing-home.landing-c-variant #home-pricing .pricing-caption,
html body.landing-home.landing-c-variant #home-pricing .pricing-note {
color: #f5f7fb !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-badge {
background: transparent !important;
border-color: transparent !important;
opacity: 0.78 !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-value {
font-size: clamp(3.8rem, 5vw, 5.8rem) !important;
line-height: 0.94 !important;
letter-spacing: -0.08em !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-support {
padding: 4px 0 0 !important;
border-radius: 0 !important;
border: 0 !important;
background: transparent !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-list {
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
html body.landing-home.landing-c-variant #home-pricing .pricing-list li {
padding: 15px 0 !important;
border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html body.landing-home.landing-c-variant .pricing-cta-row {
margin-top: 22px !important;
}
html body.landing-home.landing-c-variant .analysis-showcase-stack {
display: grid !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
column-gap: 28px !important;
row-gap: 18px !important;
}
html body.landing-home.landing-c-variant .landing-barrier-card,
html body.landing-home.landing-c-variant .analysis-map-stage-expanded,
html body.landing-home.landing-c-variant .how-stage-shell {
border-radius: 22px !important;
border: 1px solid rgba(17, 17, 17, 0.08) !important;
background: rgba(255, 255, 255, 0.92) !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .landing-barrier-filter-btn,
html body.landing-home.landing-c-variant .analysis-map-control-btn,
html body.landing-home.landing-c-variant .journey-network-help-btn {
border-radius: 999px !important;
}
html body.landing-home.landing-c-variant .how-grid {
grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr) !important;
gap: 22px !important;
}
html body.landing-home.landing-c-variant .how-step {
padding: 16px 0 0 !important;
border-radius: 0 !important;
border: 0 !important;
border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
background: transparent !important;
}
html body.landing-home.landing-c-variant .how-step.is-active {
background: transparent !important;
border-color: rgba(74, 105, 255, 0.2) !important;
}
html body.landing-home.landing-c-variant .how-stage-shell {
padding: 18px !important;
}
html body.landing-home.landing-c-variant .how-stage-window {
border-radius: 16px !important;
background: #15171c !important;
}
html body.landing-home.landing-c-variant .how-stage-card {
border-radius: 14px !important;
}
html body.landing-home.landing-c-variant .copyright-wrapper {
padding-top: 8px !important;
}
html body.landing-home.landing-c-variant footer {
padding-bottom: max(34px, calc(24px + env(safe-area-inset-bottom, 0px))) !important;
}
html body.landing-home.landing-c-variant .merchant-footer-note {
display: flex !important;
flex-wrap: wrap !important;
justify-content: center !important;
gap: 8px 14px !important;
margin-top: 10px !important;
color: rgba(17, 24, 39, 0.58) !important;
font-size: 0.78rem !important;
line-height: 1.5 !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .merchant-footer-note span {
min-width: 0 !important;
max-width: 100% !important;
overflow-wrap: anywhere !important;
word-break: break-word !important;
}
@media (max-width: 1100px) {
html body.landing-home.landing-c-variant .hero-grid,
html body.landing-home.landing-c-variant .section-header,
html body.landing-home.landing-c-variant #home-pricing .pricing-grid,
html body.landing-home.landing-c-variant .analysis-showcase-stack,
html body.landing-home.landing-c-variant .how-grid {
grid-template-columns: 1fr !important;
}
html body.landing-home.landing-c-variant .landing-headline {
max-width: 11ch !important;
font-size: clamp(2.5rem, 5.5vw, 3.7rem) !important;
}
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant header.landing-topbar {
top: 6px !important;
margin: 0 12px 16px !important;
padding: 10px 12px !important;
}
html body.landing-home.landing-c-variant .landing-topbar-link {
min-height: 38px !important;
padding: 0 14px !important;
font-size: 0.84rem !important;
}
html body.landing-home.landing-c-variant .vision.landing-page {
gap: 48px !important;
}
html body.landing-home.landing-c-variant .enterprise-hero,
html body.landing-home.landing-c-variant .landing-section {
padding: 12px 0 !important;
border-radius: 0 !important;
background: transparent !important;
}
html body.landing-home.landing-c-variant .enterprise-hero {
margin-inline: 0 !important;
padding: 10px 0 8px !important;
background: transparent !important;
}
html body.landing-home.landing-c-variant .hero-grid {
gap: 26px !important;
}
html body.landing-home.landing-c-variant .landing-headline {
max-width: 10.6ch !important;
font-size: clamp(2.2rem, 9vw, 3rem) !important;
line-height: 0.98 !important;
}
html body.landing-home.landing-c-variant .landing-copy {
margin-top: 18px !important;
font-size: 0.96rem !important;
line-height: 1.7 !important;
}
html body.landing-home.landing-c-variant .cta-row {
margin-top: 22px !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid,
html body.landing-home.landing-c-variant .proof-ribbon {
grid-template-columns: 1fr !important;
gap: 18px !important;
}
html body.landing-home.landing-c-variant .mini-card,
html body.landing-home.landing-c-variant .proof-card,
html body.landing-home.landing-c-variant #home-pricing .pricing-support {
padding: 16px 0 0 !important;
}
html body.landing-home.landing-c-variant .hero-transform-band {
margin-top: 20px !important;
}
html body.landing-home.landing-c-variant .hero-transform-line {
font-size: 1.14rem !important;
}
html body.landing-home.landing-c-variant .hero-transform-dynamic {
display: block !important;
padding-left: 16px !important;
}
html body.landing-home.landing-c-variant .hero-transform-rolling {
width: 178px !important;
}
html body.landing-home.landing-c-variant .hero-kicker,
html body.landing-home.landing-c-variant .section-kicker,
html body.landing-home.landing-c-variant .pricing-badge,
html body.landing-home.landing-c-variant .hero-preview-title {
gap: 10px !important;
padding-bottom: 10px !important;
font-size: 0.74rem !important;
}
html body.landing-home.landing-c-variant .hero-kicker::after,
html body.landing-home.landing-c-variant .section-kicker::after,
html body.landing-home.landing-c-variant .pricing-badge::after,
html body.landing-home.landing-c-variant .hero-preview-title::after {
min-width: 40px !important;
}
html body.landing-home.landing-c-variant .hero-preview-surface {
padding: 0 !important;
border-radius: 0 !important;
}
html body.landing-home.landing-c-variant .hero-preview-frame {
padding: 12px !important;
border-radius: 22px !important;
}
html body.landing-home.landing-c-variant .hero-preview-iframe {
height: 700px !important;
}
html body.landing-home.landing-c-variant .trust-strip {
gap: 14px !important;
}
html body.landing-home.landing-c-variant .trust-strip-kicker {
font-size: 0.78rem !important;
}
html body.landing-home.landing-c-variant .trust-strip-rail {
gap: 12px !important;
padding-right: 12px !important;
}
html body.landing-home.landing-c-variant .trust-strip-rail span {
min-height: 38px !important;
padding: 0 16px !important;
font-size: 0.9rem !important;
}
}
html body.landing-home.landing-c-variant .hero-grid {
grid-template-columns: 1fr !important;
gap: 34px !important;
align-items: start !important;
}
html body.landing-home.landing-c-variant .hero-copy-column {
display: grid !important;
gap: 34px !important;
width: 100% !important;
max-width: none !important;
}
html body.landing-home.landing-c-variant .hero-main-block {
display: grid !important;
justify-items: center !important;
gap: 0 !important;
width: 100% !important;
max-width: 1040px !important;
margin: 0 auto !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-kicker {
justify-content: center !important;
text-align: center !important;
padding-bottom: 6px !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-kicker::after {
display: none !important;
}
html body.landing-home.landing-c-variant .landing-headline {
width: 100% !important;
max-width: none !important;
margin-top: 9px !important;
font-size: clamp(2.34rem, 3.55vw, 3.66rem) !important;
line-height: 1.05 !important;
letter-spacing: -0.05em !important;
text-align: center !important;
white-space: pre-line !important;
}
html body.landing-home.landing-c-variant .landing-copy {
max-width: 62ch !important;
margin-left: auto !important;
margin-right: auto !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .hero-main-block .cta-row {
justify-content: center !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-note {
max-width: 60ch !important;
margin-left: auto !important;
margin-right: auto !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .hero-detail-grid {
display: grid !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
gap: 36px !important;
align-items: start !important;
width: 100% !important;
}
html body.landing-home.landing-c-variant .hero-support-column {
display: grid !important;
gap: 28px !important;
min-width: 0 !important;
}
html body.landing-home.landing-c-variant .hero-copy-layer {
display: grid !important;
gap: 28px !important;
min-width: 0 !important;
padding: 10px !important;
border-radius: 24px !important;
background:
radial-gradient(circle at 16% 10%, rgba(92, 115, 239, 0.055), transparent 32%),
linear-gradient(180deg, rgba(247, 250, 255, 0.62) 0%, rgba(243, 247, 253, 0.44) 100%) !important;
box-shadow: inset 0 0 0 1px rgba(92, 115, 239, 0.045) !important;
}
html body.landing-home.landing-c-variant .hero-copy-layer .trust-strip-marquee {
width: calc(100% + 20px) !important;
max-width: none !important;
margin-left: -10px !important;
margin-right: -10px !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid {
margin-top: 0 !important;
}
html body.landing-home.landing-c-variant .hero-transform-band {
margin-top: 0 !important;
}
html body.landing-home.landing-c-variant .product-stage {
display: flex !important;
order: 1 !important;
justify-content: flex-start !important;
align-items: flex-start !important;
width: 100% !important;
}
html body.landing-home.landing-c-variant .hero-preview-stack {
width: min(100%, 520px) !important;
max-width: 520px !important;
margin-top: 6px !important;
}
html body.landing-home.landing-c-variant .pricing-plan-strip {
display: flex !important;
flex-wrap: wrap !important;
gap: 10px !important;
margin-top: 24px !important;
}
html body.landing-home.landing-c-variant .pricing-plan-strip span {
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
min-height: 34px !important;
padding: 0 12px !important;
border: 1px solid rgba(17, 17, 17, 0.08) !important;
border-radius: 999px !important;
background: rgba(255, 255, 255, 0.72) !important;
color: #1f2937 !important;
font-size: 0.84rem !important;
font-weight: 650 !important;
}
html body.landing-home.landing-c-variant .pricing-plan-strip strong {
color: #2563eb !important;
font-weight: 800 !important;
}
html body.landing-home.landing-c-variant .pricing-plan-summary {
margin: 14px 0 0 !important;
color: rgba(17, 24, 39, 0.68) !important;
font-size: 0.92rem !important;
line-height: 1.7 !important;
}
@media (max-width: 1100px) {
html body.landing-home.landing-c-variant .hero-main-block {
max-width: 100% !important;
}
html body.landing-home.landing-c-variant .hero-detail-grid {
grid-template-columns: 1fr !important;
gap: 32px !important;
}
html body.landing-home.landing-c-variant .hero-copy-layer {
border-radius: 20px !important;
}
html body.landing-home.landing-c-variant .landing-headline {
width: 100% !important;
max-width: none !important;
font-size: clamp(2.12rem, 6.15vw, 2.92rem) !important;
line-height: 1.04 !important;
letter-spacing: -0.048em !important;
}
html body.landing-home.landing-c-variant .landing-copy {
max-width: 100% !important;
}
html body.landing-home.landing-c-variant .hero-preview-stack {
width: min(100%, 460px) !important;
max-width: 460px !important;
margin-top: 0 !important;
}
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant #home-themes,
html body.landing-home.landing-c-variant #home-pricing,
html body.landing-home.landing-c-variant #home-how {
left: auto !important;
width: auto !important;
transform: none !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
padding-left: 18px !important;
padding-right: 18px !important;
}
html body.landing-home.landing-c-variant #home-themes {
padding-top: 54px !important;
padding-bottom: 58px !important;
}
html body.landing-home.landing-c-variant .theme-showcase-actions {
margin-bottom: 18px !important;
gap: 8px !important;
}
html body.landing-home.landing-c-variant .theme-showcase-stat {
font-size: 0.78rem !important;
}
html body.landing-home.landing-c-variant .theme-showcase-more {
min-height: 32px !important;
padding: 0 11px !important;
font-size: 0.76rem !important;
}
html body.landing-home.landing-c-variant .theme-marquee-stage {
gap: 12px !important;
}
html body.landing-home.landing-c-variant .theme-marquee-row {
display: block !important;
overflow: visible !important;
-webkit-mask-image: none !important;
mask-image: none !important;
}
html body.landing-home.landing-c-variant .theme-marquee-track {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px !important;
min-width: 0 !important;
animation: none !important;
}
html body.landing-home.landing-c-variant .theme-marquee-track[aria-hidden="true"] {
display: none !important;
}
html body.landing-home.landing-c-variant .theme-showcase-card {
width: auto !important;
flex: initial !important;
padding: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .theme-showcase-card img {
border-radius: 12px !important;
clip-path: inset(0 round 12px) !important;
}
html body.landing-home.landing-c-variant .theme-showcase-card span {
margin-top: 6px !important;
font-size: 0.62rem !important;
}
html body.landing-home.landing-c-variant .hero-copy-column {
gap: 28px !important;
}
html body.landing-home.landing-c-variant .hero-main-block .cta-row {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
width: min(100%, 360px) !important;
margin-left: auto !important;
margin-right: auto !important;
}
html body.landing-home.landing-c-variant .hero-main-block .cta-button {
width: 100% !important;
min-width: 0 !important;
padding: 0 12px !important;
white-space: nowrap !important;
font-size: 0.9rem !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid .mini-card,
html body.landing-home.landing-c-variant .hero-mini-grid .mini-card + .mini-card {
margin-left: 0 !important;
padding-left: 0 !important;
border-left: 0 !important;
}
html body.landing-home.landing-c-variant .mini-card strong {
font-size: 1.04rem !important;
line-height: 1.35 !important;
}
html body.landing-home.landing-c-variant .mini-card span {
font-size: 0.98rem !important;
line-height: 1.7 !important;
}
html body.landing-home.landing-c-variant .landing-headline {
width: 100% !important;
max-width: none !important;
font-size: clamp(1.88rem, 6.85vw, 2.34rem) !important;
line-height: 1.08 !important;
letter-spacing: -0.042em !important;
}
html body.landing-home.landing-c-variant .hero-preview-stack {
width: min(100%, 390px) !important;
max-width: 390px !important;
}
}
@media (min-width: 768px) {
html body.landing-home.landing-c-variant #home-pricing .section-title {
font-size: clamp(1.03rem, 1.8vw, 1.68rem) !important;
line-height: 1.16 !important;
letter-spacing: -0.035em !important;
width: min(100%, 720px) !important;
max-width: 720px !important;
}
}
html body.landing-home.landing-c-variant #home-insights {
position: relative !important;
left: 50% !important;
width: 100vw !important;
transform: translateX(-50%) !important;
margin-left: 0 !important;
margin-right: 0 !important;
padding-top: 68px !important;
padding-bottom: 68px !important;
padding-left: max(24px, calc((100vw - 1400px) / 2)) !important;
padding-right: max(24px, calc((100vw - 1400px) / 2)) !important;
border-top: 0 !important;
background:
radial-gradient(circle at 12% 16%, rgba(92, 115, 239, 0.22), transparent 26%),
radial-gradient(circle at 86% 28%, rgba(90, 220, 255, 0.08), transparent 22%),
linear-gradient(180deg, #191933 0%, #232347 100%) !important;
color: #f5f7fb !important;
}
html body.landing-home.landing-c-variant #home-insights .section-kicker {
color: #bac4ff !important;
}
html body.landing-home.landing-c-variant #home-insights .section-title,
html body.landing-home.landing-c-variant #home-insights .analysis-showcase-title {
color: #f8fafc !important;
}
html body.landing-home.landing-c-variant #home-insights .section-lead,
html body.landing-home.landing-c-variant #home-insights .analysis-showcase-copy {
color: rgba(245, 247, 251, 0.76) !important;
}
html body.landing-home.landing-c-variant #home-insights .landing-barrier-card {
border-color: rgba(255, 255, 255, 0.16) !important;
background: rgba(255, 255, 255, 0.94) !important;
}
html body.landing-home.landing-c-variant #home-insights .analysis-map-stage-expanded {
border-color: rgba(148, 163, 184, 0.32) !important;
background:
radial-gradient(circle at 50% 42%, rgba(59, 130, 246, 0.18), transparent 36%),
radial-gradient(circle at center, #172033 0%, #0f172a 100%) !important;
box-shadow: inset 0 2px 20px rgba(0, 0, 0, 0.42) !important;
}
html body.landing-home.landing-c-variant #home-insights .analysis-network-preview,
html body.landing-home.landing-c-variant #home-insights .analysis-network-preview .vis-network,
html body.landing-home.landing-c-variant #home-insights .analysis-network-preview canvas {
border-radius: inherit !important;
}
html body.landing-home.landing-c-variant #home-insights .landing-barrier-card h4,
html body.landing-home.landing-c-variant #home-insights .landing-barrier-card p {
color: #111317 !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant #home-how {
padding-top: 64px !important;
padding-bottom: 92px !important;
background:
radial-gradient(circle at 10% 6%, rgba(92, 115, 239, 0.11), transparent 32%),
linear-gradient(180deg, #ffffff 0%, #f5f7fb 100%) !important;
}
html body.landing-home.landing-c-variant #home-how .section-header {
gap: 14px !important;
margin-bottom: 28px !important;
}
html body.landing-home.landing-c-variant #home-how .section-kicker {
color: #5067e8 !important;
}
html body.landing-home.landing-c-variant #home-how .section-title {
color: #0f172a !important;
font-size: clamp(1.86rem, 7.2vw, 2.32rem) !important;
line-height: 1.12 !important;
letter-spacing: -0.045em !important;
}
html body.landing-home.landing-c-variant #home-how .section-lead {
color: #475569 !important;
font-size: 0.98rem !important;
line-height: 1.62 !important;
}
html body.landing-home.landing-c-variant #home-how .how-grid {
gap: 24px !important;
}
html body.landing-home.landing-c-variant #home-how .how-step {
padding: 16px 0 !important;
border-top-color: rgba(15, 23, 42, 0.1) !important;
}
html body.landing-home.landing-c-variant #home-how .how-step-number {
color: #5266ef !important;
font-weight: 800 !important;
}
html body.landing-home.landing-c-variant #home-how .how-step-copy h4 {
color: #111827 !important;
}
html body.landing-home.landing-c-variant #home-how .how-step-copy p {
color: #475569 !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-shell {
background: #eef3fb !important;
border-color: rgba(15, 23, 42, 0.08) !important;
}
html body.landing-home.landing-c-variant #home-how .how-stage-card {
border-color: rgba(15, 23, 42, 0.08) !important;
box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08) !important;
}
}
html body.landing-home.landing-c-variant .landing-headline {
max-width: min(100%, 26ch) !important;
white-space: pre-line !important;
overflow-wrap: normal !important;
word-break: keep-all !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .landing-headline {
max-width: min(100%, 16ch) !important;
}
}
/* Lightweight landing motion: CSS first, GSAP only as a late desktop enhancement. */
html body.landing-home.landing-c-variant .hero-kicker {
animation: rlHeroSoftRise 620ms cubic-bezier(0.22, 1, 0.36, 1) 80ms both;
}
html body.landing-home.landing-c-variant .landing-headline {
animation: rlHeroTitleRise 760ms cubic-bezier(0.22, 1, 0.36, 1) 150ms both;
}
html body.landing-home.landing-c-variant .landing-copy {
animation: rlHeroSoftRise 700ms cubic-bezier(0.22, 1, 0.36, 1) 260ms both;
}
html body.landing-home.landing-c-variant .hero-main-block .cta-row {
animation: rlHeroSoftRise 700ms cubic-bezier(0.22, 1, 0.36, 1) 390ms both;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-note {
animation: rlHeroSoftRise 680ms cubic-bezier(0.22, 1, 0.36, 1) 520ms both;
}
@media (min-width: 768px) {
html body.landing-home.landing-c-variant .hero-main-block .hero-note {
width: min(100%, 920px) !important;
max-width: 920px !important;
white-space: normal !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-note strong {
display: inline !important;
}
}
html.rl-motion-fallback body.landing-home.landing-c-variant .rl-motion-reveal {
opacity: 0;
transform: translate3d(0, 42px, 0);
transition:
opacity 760ms cubic-bezier(0.22, 1, 0.36, 1) var(--rl-reveal-delay, 0ms),
transform 760ms cubic-bezier(0.22, 1, 0.36, 1) var(--rl-reveal-delay, 0ms);
will-change: opacity, transform;
}
html.rl-motion-fallback body.landing-home.landing-c-variant .rl-motion-reveal.is-revealed,
html.rl-scroll-motion-ready body.landing-home.landing-c-variant .rl-motion-reveal.is-revealed {
opacity: 1;
transform: translate3d(0, 0, 0);
will-change: auto;
}
html.rl-scroll-motion-ready body.landing-home.landing-c-variant .rl-motion-gsap-target {
transition: none;
}
@keyframes rlHeroSoftRise {
from {
opacity: 0;
transform: translate3d(0, 20px, 0);
}
to {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
@keyframes rlHeroTitleRise {
from {
opacity: 0;
transform: translate3d(0, 28px, 0) scale(0.99);
}
to {
opacity: 1;
transform: translate3d(0, 0, 0) scale(1);
}
}
@media (prefers-reduced-motion: reduce) {
html body.landing-home.landing-c-variant .hero-kicker,
html body.landing-home.landing-c-variant .landing-headline,
html body.landing-home.landing-c-variant .landing-copy,
html body.landing-home.landing-c-variant .hero-main-block .cta-row,
html body.landing-home.landing-c-variant .hero-main-block .hero-note {
opacity: 1;
transform: none;
animation: none;
transition: none;
}
}
/* 2026-05-09: keep the two rolling hero messages, but lower the visual weight of supporting information. */
html body.landing-home.landing-c-variant .hero-main-block {
max-width: 1120px !important;
padding: clamp(22px, 4.2vw, 54px) clamp(8px, 2vw, 26px) 0 !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-kicker {
color: #4865df !important;
font-size: clamp(0.72rem, 0.9vw, 0.8rem) !important;
font-weight: 720 !important;
letter-spacing: -0.015em !important;
opacity: 0.92 !important;
}
html body.landing-home.landing-c-variant .landing-headline {
max-width: 980px !important;
margin-top: 7px !important;
font-size: clamp(2.6rem, 4.25vw, 4.48rem) !important;
line-height: 1.03 !important;
letter-spacing: -0.062em !important;
}
html body.landing-home.landing-c-variant .landing-copy {
max-width: 720px !important;
margin-top: calc(18px - var(--hero-title-reserved-extra, 0px)) !important;
color: #475569 !important;
font-size: clamp(0.98rem, 1.25vw, 1.08rem) !important;
line-height: 1.68 !important;
}
html body.landing-home.landing-c-variant .hero-main-block .cta-row {
margin-top: 24px !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-note {
width: auto !important;
max-width: 780px !important;
margin-top: 16px !important;
padding-top: 0 !important;
border-top: 0 !important;
color: #586273 !important;
font-size: clamp(0.82rem, 1vw, 0.92rem) !important;
line-height: 1.6 !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-note strong {
color: #1f2937 !important;
font-weight: 760 !important;
}
html body.landing-home.landing-c-variant .hero-detail-grid {
margin-top: clamp(70px, 8vw, 108px) !important;
padding-top: clamp(24px, 3.2vw, 36px) !important;
border-top: 1px solid rgba(71, 85, 105, 0.12) !important;
}
html body.landing-home.landing-c-variant .hero-support-column {
gap: clamp(22px, 3vw, 32px) !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid {
position: relative !important;
gap: 0 !important;
padding: 0 0 clamp(18px, 2.4vw, 26px) !important;
border-bottom: 1px solid rgba(71, 85, 105, 0.1) !important;
}
html body.landing-home.landing-c-variant .mini-card {
padding: 0 clamp(14px, 1.8vw, 22px) 0 0 !important;
border: 0 !important;
background: transparent !important;
}
html body.landing-home.landing-c-variant .mini-card + .mini-card {
padding-left: clamp(14px, 1.8vw, 22px) !important;
border-left: 1px solid rgba(71, 85, 105, 0.1) !important;
}
html body.landing-home.landing-c-variant .mini-card strong {
color: #111827 !important;
font-size: clamp(0.86rem, 1vw, 0.98rem) !important;
font-weight: 760 !important;
letter-spacing: -0.02em !important;
}
html body.landing-home.landing-c-variant .mini-card span {
margin-top: 5px !important;
color: #64748b !important;
font-size: clamp(0.76rem, 0.9vw, 0.84rem) !important;
line-height: 1.55 !important;
}
html body.landing-home.landing-c-variant .hero-copy-layer {
gap: clamp(20px, 2.6vw, 30px) !important;
padding: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .hero-transform-band {
padding-top: 0 !important;
border-top: 0 !important;
}
html body.landing-home.landing-c-variant .hero-transform-line {
color: #1f2937 !important;
font-size: clamp(1.16rem, 1.9vw, 1.72rem) !important;
line-height: 1.35 !important;
letter-spacing: -0.035em !important;
}
html body.landing-home.landing-c-variant .hero-transform-rolling {
color: #2563eb !important;
}
html body.landing-home.landing-c-variant .trust-strip-inline {
margin-top: 0 !important;
padding: 10px 0 2px !important;
border-top: 1px solid rgba(71, 85, 105, 0.09) !important;
}
html body.landing-home.landing-c-variant .trust-strip-kicker {
color: #475569 !important;
font-size: 0.78rem !important;
font-weight: 720 !important;
}
html body.landing-home.landing-c-variant .trust-strip-rail span {
background: rgba(255, 255, 255, 0.62) !important;
color: #5f6b7c !important;
border: 1px solid rgba(100, 116, 139, 0.11) !important;
font-size: 0.75rem !important;
}
html body.landing-home.landing-c-variant .proof-ribbon-inline {
gap: 16px !important;
padding-top: 20px !important;
border-top: 1px solid rgba(71, 85, 105, 0.09) !important;
}
html body.landing-home.landing-c-variant .proof-card {
padding: 0 !important;
border-top: 0 !important;
border-left: 0 !important;
}
html body.landing-home.landing-c-variant .proof-card h3 {
color: #111827 !important;
font-size: clamp(0.92rem, 1vw, 1rem) !important;
font-weight: 760 !important;
}
html body.landing-home.landing-c-variant .proof-card p {
margin-top: 5px !important;
color: #64748b !important;
font-size: clamp(0.78rem, 0.92vw, 0.88rem) !important;
line-height: 1.58 !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .hero-main-block {
padding-top: 20px !important;
}
html body.landing-home.landing-c-variant .landing-headline {
max-width: 100% !important;
font-size: clamp(2.08rem, 8.2vw, 2.7rem) !important;
line-height: 1.08 !important;
letter-spacing: -0.052em !important;
}
html body.landing-home.landing-c-variant .landing-copy {
max-width: 35rem !important;
margin-top: calc(16px - var(--hero-title-reserved-extra, 0px)) !important;
font-size: 0.98rem !important;
line-height: 1.66 !important;
}
html body.landing-home.landing-c-variant .hero-main-block .hero-note {
max-width: 34rem !important;
font-size: 0.84rem !important;
}
html body.landing-home.landing-c-variant .hero-detail-grid {
margin-top: 34px !important;
padding-top: 24px !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0 !important;
}
html body.landing-home.landing-c-variant .mini-card {
padding-right: 10px !important;
}
html body.landing-home.landing-c-variant .mini-card + .mini-card {
padding-left: 10px !important;
}
html body.landing-home.landing-c-variant .mini-card span {
font-size: 0.76rem !important;
}
html body.landing-home.landing-c-variant .hero-mini-grid .mini-card:nth-child(3) {
grid-column: 1 / -1 !important;
margin-top: 16px !important;
padding-top: 16px !important;
padding-left: 0 !important;
padding-right: 0 !important;
border-left: 0 !important;
border-top: 1px solid rgba(71, 85, 105, 0.1) !important;
}
}
/* 2026-05-11: split the product demo and use-case explanation into two calmer sections. */
html body.landing-home.landing-c-variant .demo-showcase-section {
position: relative !important;
left: 50% !important;
width: 100vw !important;
transform: translateX(-50%) !important;
margin-left: 0 !important;
margin-right: 0 !important;
border-top: 0 !important;
padding-top: clamp(72px, 8vw, 104px) !important;
padding-bottom: clamp(70px, 7vw, 102px) !important;
padding-left: max(20px, calc((100vw - 1400px) / 2)) !important;
padding-right: max(20px, calc((100vw - 1400px) / 2)) !important;
background:
radial-gradient(circle at 16% 12%, rgba(94, 114, 255, 0.24), transparent 26%),
radial-gradient(circle at 84% 22%, rgba(75, 93, 188, 0.18), transparent 24%),
linear-gradient(180deg, #191933 0%, #222244 100%) !important;
color: #f8fafc !important;
text-align: center !important;
overflow: hidden !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
z-index: 0 !important;
pointer-events: none !important;
background:
linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
linear-gradient(180deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px) !important;
background-size: 64px 64px !important;
opacity: 0.32 !important;
mask-image: radial-gradient(circle at 50% 18%, #000 0%, transparent 78%) !important;
-webkit-mask-image: radial-gradient(circle at 50% 18%, #000 0%, transparent 78%) !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header {
position: relative !important;
z-index: 1 !important;
width: min(100%, 680px) !important;
margin: 0 auto clamp(30px, 4vw, 48px) !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-title {
position: absolute !important;
width: 1px !important;
height: 1px !important;
margin: -1px !important;
padding: 0 !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-title::after {
margin-left: auto !important;
margin-right: auto !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
transition: opacity 0.42s cubic-bezier(0.22, 0.82, 0.2, 1), transform 0.42s cubic-bezier(0.22, 0.82, 0.2, 1) !important;
will-change: opacity, transform !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-row {
justify-content: center !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-time {
color: rgba(226, 232, 240, 0.78) !important;
font-size: clamp(0.9rem, 1.1vw, 1.02rem) !important;
font-weight: 680 !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-copy {
max-width: 48rem !important;
margin: 14px auto 0 !important;
color: #ffffff !important;
font-size: clamp(1.16rem, 1.96vw, 1.88rem) !important;
line-height: 1.28 !important;
letter-spacing: -0.045em !important;
font-weight: 760 !important;
}
html body.landing-home.landing-c-variant .product-stage-centered {
position: relative !important;
z-index: 1 !important;
display: flex !important;
justify-content: center !important;
align-items: flex-start !important;
width: 100% !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-stack {
width: min(100%, 540px) !important;
max-width: 540px !important;
margin: 0 auto !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-surface {
height: auto !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-frame {
margin: 0 auto !important;
padding: clamp(14px, 1.7vw, 18px) !important;
border-radius: 30px !important;
background: rgba(255, 255, 255, 0.9) !important;
border: 1px solid rgba(255, 255, 255, 0.18) !important;
box-shadow: 0 34px 110px rgba(0, 0, 0, 0.28) !important;
transition: opacity 0.42s cubic-bezier(0.22, 0.82, 0.2, 1), transform 0.42s cubic-bezier(0.22, 0.82, 0.2, 1) !important;
will-change: opacity, transform !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-iframe {
height: 760px !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section.is-switching-demo .hero-preview-context,
html body.landing-home.landing-c-variant .demo-showcase-section.is-switching-demo .hero-preview-frame {
opacity: 0 !important;
transform: translateY(12px) scale(0.992) !important;
}
@media (prefers-reduced-motion: reduce) {
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context,
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-frame {
transition: none !important;
will-change: auto !important;
}
}
html body.landing-home.landing-c-variant .offline-use-section {
border-top: 0 !important;
padding-top: clamp(66px, 7vw, 96px) !important;
padding-bottom: clamp(62px, 6.4vw, 92px) !important;
}
html body.landing-home.landing-c-variant .offline-use-section .offline-use-inner {
display: grid !important;
gap: clamp(34px, 4.6vw, 58px) !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-mini-grid {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: clamp(18px, 2.4vw, 32px) !important;
padding: 0 0 clamp(26px, 3vw, 38px) !important;
border-bottom: 1px solid rgba(71, 85, 105, 0.1) !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-support-column {
display: block !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card {
display: block !important;
padding: 0 clamp(16px, 1.8vw, 24px) 0 0 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card + .mini-card {
padding-left: clamp(16px, 1.8vw, 24px) !important;
border-left: 1px solid rgba(71, 85, 105, 0.1) !important;
border-top: 0 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card strong {
font-size: clamp(1.02rem, 1.35vw, 1.24rem) !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card span {
max-width: 24rem !important;
font-size: clamp(0.84rem, 0.95vw, 0.94rem) !important;
line-height: 1.62 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-copy-layer {
gap: clamp(22px, 3vw, 34px) !important;
min-width: 0 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-transform-band {
max-width: 920px !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-transform-line {
font-size: clamp(1.54rem, 3.1vw, 2.92rem) !important;
line-height: 1.18 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .trust-strip-inline {
padding-top: 22px !important;
}
html body.landing-home.landing-c-variant .offline-use-section .proof-ribbon-inline {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: clamp(18px, 2.2vw, 30px) !important;
}
@media (max-width: 900px) {
html body.landing-home.landing-c-variant .offline-use-section .hero-mini-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card {
padding: 0 12px 0 0 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card + .mini-card {
padding-left: 12px !important;
border-left: 1px solid rgba(71, 85, 105, 0.1) !important;
border-top: 0 !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-mini-grid .mini-card:nth-child(3) {
grid-column: 1 / -1 !important;
margin-top: 18px !important;
padding-top: 18px !important;
padding-left: 0 !important;
padding-right: 0 !important;
border-left: 0 !important;
border-top: 1px solid rgba(71, 85, 105, 0.1) !important;
}
html body.landing-home.landing-c-variant .offline-use-section .proof-ribbon-inline {
grid-template-columns: 1fr !important;
}
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .demo-showcase-section {
left: auto !important;
width: auto !important;
transform: none !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
padding-top: 56px !important;
padding-bottom: 58px !important;
padding-left: 18px !important;
padding-right: 18px !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section::before {
inset: 0 !important;
border-radius: 0 !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-copy {
font-size: clamp(1.08rem, 5.1vw, 1.42rem) !important;
line-height: 1.3 !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context {
justify-items: start !important;
text-align: left !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-row {
justify-content: flex-start !important;
text-align: left !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-time,
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-copy {
text-align: left !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-stack {
width: min(100%, 390px) !important;
max-width: 390px !important;
}
html body.landing-home.landing-c-variant .demo-showcase-section .hero-preview-iframe {
height: 700px !important;
}
html body.landing-home.landing-c-variant .offline-use-section {
padding-top: 50px !important;
padding-bottom: 50px !important;
}
html body.landing-home.landing-c-variant .offline-use-section .mini-card span {
max-width: none !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-transform-line {
font-size: clamp(1.34rem, 6vw, 2rem) !important;
}
}
/* 2026-05-11: tighten the demo handoff and keep rolling phrases from clipping. */
html body.landing-home.landing-c-variant .demo-showcase-header {
width: min(100%, 980px) !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context {
display: grid !important;
justify-items: center !important;
width: 100% !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-row {
width: 100% !important;
justify-content: center !important;
text-align: center !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-copy {
width: min(100%, 920px) !important;
max-width: 920px !important;
text-align: center !important;
white-space: pre-line !important;
text-wrap: balance !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-transform-rolling {
width: clamp(280px, 34vw, 520px) !important;
min-width: clamp(280px, 34vw, 520px) !important;
max-width: 100% !important;
}
html body.landing-home.landing-c-variant #home-insights {
margin-bottom: -92px !important;
}
html body.landing-home.landing-c-variant #home-insights + #home-themes {
margin-top: 0 !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .demo-showcase-header {
width: min(100%, 420px) !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context {
justify-items: start !important;
text-align: left !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-row {
justify-content: flex-start !important;
text-align: left !important;
}
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-time,
html body.landing-home.landing-c-variant .demo-showcase-header .hero-preview-context-copy {
text-align: left !important;
}
html body.landing-home.landing-c-variant .offline-use-section .hero-transform-rolling {
width: min(100%, 284px) !important;
min-width: min(100%, 284px) !important;
}
html body.landing-home.landing-c-variant #home-insights {
margin-bottom: -48px !important;
}
}
html body.landing-home.landing-c-variant .landing-headline::before {
content: "" !important;
display: inline-block !important;
width: 1em !important;
height: 1em !important;
margin-right: 0.22em !important;
vertical-align: -0.11em !important;
background: url("assets/hero/hero-qr-sparkle.svg?v=20260521qrBadge1") center / contain no-repeat !important;
}
@media (max-width: 767px) {
html body.landing-home.landing-c-variant .landing-headline::before {
width: 0.92em !important;
height: 0.92em !important;
margin-right: 0.16em !important;
vertical-align: -0.09em !important;
}
}