/* One sky palette for both landing versions. Clear-sky pixels in hero-sky.webp:
   #89eaff (hue ≈191°); at the hero's .58 opacity over white: #bbf3ff.
   This layer changes colour only. Image pixels, brand marks and motion stay intact. */
body.ui-study{
 --sky:#89eaff;
 --sky-hero:#bbf3ff;
 --sky-faint:#f3fdff;
 --sky-soft:#e7fbff;
 --sky-wash:#d9f8ff;
 --sky-line:#c5e8ee;
 --sky-line-strong:#b6b9bc;
 --sky-ink:#25282b;
 --sky-muted:#5d6267;
 --sky-caption:#65696d;
 --sky-accent:#126e82;
 --sky-hover:#464b4f;
 --sky-clear:#89eaff00;
 --sky-panel:linear-gradient(145deg,#fff 0%,var(--sky-soft) 55%,var(--sky-wash) 100%);
 --sky-card:var(--sky-faint);
 --sky-section:radial-gradient(ellipse at 12% 12%,#ffffffd9,transparent 62%),linear-gradient(180deg,var(--sky-faint),var(--sky-soft) 55%,var(--sky-faint));
 --paper:#fff;--white:#fff;--ink:var(--sky-ink);--muted:var(--sky-muted);
 --accent:var(--sky-hero);--line:var(--sky-line);--tint:var(--sky-faint);
 color:var(--sky-ink);background:var(--paper)
}
body.ui-study ::selection{background:var(--sky-hero);color:var(--sky-ink)}
body.ui-study :focus-visible{outline-color:var(--sky-accent)}
/* Brand lettering is not part of the interface palette. All image/SVG logos are untouched. */
body.ui-study .brand-wordmark,body.ui-study .brand-tag,
body.ui-study .integration-core strong{color:#202020}
body.ui-study .integration-core strong span{color:#686868}

/* Navigation, controls and primary reading hierarchy. */
body.ui-study .site-header.is-scrolled{background:#f3fdfff2;border-bottom-color:var(--sky-line)}
body.ui-study .mobile-nav{background:var(--sky-faint)}
body.ui-study .mobile-cta{background:#f3fdfff2;border-color:var(--sky-line)}
body.ui-study .button-primary,body.ui-study .button-dark,
body.ui-study .starter-arrow{background:var(--sky-ink);color:#fff}
body.ui-study .button-primary:hover,body.ui-study .button-dark:hover,
body.ui-study .starter-arrow:hover{background:var(--sky-hover)}
body.ui-study .button-soft{background:#ffffffbd;border-color:var(--sky-line);color:var(--sky-ink)}
body.ui-study .button-soft:hover{background:var(--sky-soft)}
body.ui-study .icon-button{background:var(--sky-faint);color:var(--sky-ink);border-color:var(--sky-line)}
body.ui-study .icon-button:hover{background:var(--sky-soft)}
body.ui-study .text-link{color:var(--sky-ink);border-color:var(--sky-line-strong)}
body.ui-study .text-link:hover{color:var(--sky-accent);border-color:var(--sky-accent)}
body.ui-study .hero-free-label,body.ui-study #stats .proof-number,
body.ui-study .conversion-proof-metric strong,body.ui-study .growth-story-copy h3,
body.ui-study .starter-card,body.ui-study .faq summary{color:var(--sky-ink)}
body.ui-study .hero-description,body.ui-study .section-description,
body.ui-study .proof-grid p,body.ui-study .conversion-proof-metric p,
body.ui-study .revenue-difference p,body.ui-study .comparison-subtitle,
body.ui-study .price-booking p,body.ui-study .faq-grid h2+p,
body.ui-study .faq details>p,body.ui-study .lead-copy>p,
body.ui-study .lead-form h3+p,body.ui-study .form-success>p{color:var(--sky-muted)}
body.ui-study .hero .fine-print,body.ui-study .hero .launch-note,
body.ui-study .source-note,body.ui-study .starter-card-label,
body.ui-study .growth-story-eyebrow,body.ui-study .clients-bottom>p,
body.ui-study .form-note,body.ui-study .consent-note{color:var(--sky-caption)}
body.ui-study .proof-grid>div,body.ui-study .conversion-proof-metric{border-color:var(--sky-line)}

/* Section washes share the hero hue, with white kept between large colour fields. */
body.ui-study .product,body.ui-study .repeat-orders{background:var(--sky-section)}
body.ui-study .growth-tools.growth-story{background:var(--sky-faint);color:var(--sky-ink);border-color:var(--sky-line)}
body.ui-study .conversion-section,body.ui-study .how{background:var(--sky-faint)}
body.ui-study .starter-card,body.ui-study .growth-story-art.card-image-frame{background:var(--sky-card)}
body.ui-study .starter-card{box-shadow:none}
body.ui-study .growth-story-art{box-shadow:0 16px 40px -28px #00000020}

/* Both chart bars use the same blue at different strengths. */
body.ui-study .revenue-chart,body.ui-study .revenue-chart::before{border-color:var(--sky-line)}
body.ui-study .revenue-market{background:linear-gradient(160deg,var(--sky-faint),var(--sky-wash));color:var(--sky-muted)}
body.ui-study .revenue-goulash{background:radial-gradient(ellipse at 12% 0%,#fff9,transparent 65%),linear-gradient(150deg,var(--sky-hero),var(--sky));color:var(--sky-ink)}
body.ui-study .difference-rule{border-color:var(--sky-line-strong)}
body.ui-study .difference-rule::before,body.ui-study .difference-rule-top::before{border-bottom-color:var(--sky-line-strong)}

/* The falling cards retain their white faces and original artwork. */
body.ui-study .free-cards-scene{background:radial-gradient(ellipse at 50% 85%,var(--sky-wash) 0%,var(--sky-faint) 42%,var(--sky-clear) 72%)}
body.ui-study .free-card{background:#fff;color:var(--sky-ink)}
body.ui-study .free-card-note,body.ui-study .free-cards-replay{color:var(--sky-caption)}
body.ui-study .free-store-badges span{background:var(--sky-soft)}
body.ui-study .free-cards-replay:focus-visible{outline-color:var(--sky-accent)}
@media(hover:hover){body.ui-study .free-cards-replay:hover{background:var(--sky-soft);color:var(--sky-ink)}}
@media(max-width:899px){body.ui-study .free-cards-scene{background:radial-gradient(ellipse at 50% 60%,var(--sky-wash),var(--sky-clear) 70%)}}
body.ui-study .price-explanation.revenue-explanation{background:var(--sky-panel)}
body.ui-study .price-explanation.revenue-explanation p{color:var(--sky-muted)}
/* Keep the comparison's existing single-column highlight and sizing. */
body.ui-study .comparison{border-color:var(--sky-line);background-image:linear-gradient(180deg,var(--sky-soft),var(--sky-hero))}
body.ui-study .comparison th,body.ui-study .comparison td{border-color:var(--sky-line)}
body.ui-study .comparison th:nth-child(2),body.ui-study .comparison td:nth-child(2){color:var(--sky-accent)}
body.ui-study .comparison thead th,body.ui-study .comparison th small,
body.ui-study .comparison td:last-child,body.ui-study .comparison th:last-child{color:var(--sky-muted)}

/* Integration chrome changes colour; partner logo tiles and source images remain white/original. */
body.ui-study .integration-map{border-color:transparent;background-image:radial-gradient(ellipse at 50% 50%,var(--sky-wash),transparent 60%),radial-gradient(var(--sky-line) .8px,transparent .8px)}
body.ui-study .integration-map-v2 .integration-group h3{color:var(--sky-caption)}
body.ui-study .integration-map-v2 .integration-tile{border-color:transparent}
body.ui-study .integration-map-v2 .integration-more{background:var(--sky-soft);color:var(--sky-muted)}
body.ui-study .integration-map-v2 .integration-core{background:var(--sky-wash);border-color:transparent}
body.ui-study .integration-core::before{background:linear-gradient(145deg,var(--sky-soft),var(--sky-hero));border-color:transparent}
body.ui-study .integration-core::after{background:var(--sky-line-strong)}
body.ui-study .integration-core>div{background:var(--sky-panel);border-color:transparent}
body.ui-study .integration-map-v2 .integration-lines{color:var(--sky-line-strong)}
body.ui-study .integration-pulse{fill:var(--sky-accent);stroke:var(--sky-faint)}
body.ui-study .launch-steps-inline span{color:var(--sky-caption)}

/* Customer proof, questions and the booking form. */
body.ui-study .clients-board{background:var(--sky-panel)}
body.ui-study .client-card{border-color:transparent}
body.ui-study .client-card>a>.arrow-up-right,body.ui-study .client-case p,
body.ui-study .client-metric p,body.ui-study .client-case-link,
body.ui-study .clients-motion{color:var(--sky-muted)}
body.ui-study .clients-motion:hover{color:var(--sky-ink)}
body.ui-study .clients-window:focus-visible{outline-color:var(--sky-accent)}
body.ui-study .faq,body.ui-study .faq details{border-color:var(--sky-line)}
body.ui-study .faq details[open] summary .icon,body.ui-study .how h2 .muted{color:var(--sky-accent)}
body.ui-study .lead{background:radial-gradient(ellipse at 0% 100%,var(--sky-hero),transparent 70%),radial-gradient(ellipse at 75% 0%,#fff,transparent 75%),linear-gradient(135deg,var(--sky-faint),var(--sky-wash))}
body.ui-study .lead-copy h2>span{background:#ffffff8c;color:var(--sky-ink)}
body.ui-study .lead-perks .icon,body.ui-study .form-success>.icon{color:var(--sky-accent)}
body.ui-study .lead-form{background:#fffffff5;border-color:transparent}
body.ui-study .field input,body.ui-study .field select{background:var(--sky-faint);border-color:var(--sky-line);color:var(--sky-ink)}
body.ui-study .field input::placeholder,body.ui-study .select-wrap>.icon{color:var(--sky-caption);opacity:1}
body.ui-study .field input:focus,body.ui-study .field select:focus{background:#fff;border-color:var(--sky-accent);box-shadow:0 0 0 3px var(--sky-wash)}
body.ui-study .field input[aria-invalid=true]{border-color:var(--sky-ink)}
body.ui-study .field-error{color:var(--sky-ink)}
body.ui-study .consent-field input{accent-color:var(--sky-accent)}
body.ui-study .consent-field input:focus-visible{outline-color:var(--sky-accent)}
body.ui-study .reset-button{color:var(--sky-ink);border-color:var(--sky-line-strong)}

/* Keep footer branding white/cyan; only its surrounding UI joins the palette. */
body.ui-study .official-footer{background:var(--sky-ink)}
body.ui-study .official-footer>.container,body.ui-study .official-footer-bottom{border-color:#bbf3ff29}
body.ui-study .official-footer-nav{color:var(--sky-soft)}
body.ui-study .official-footer-legal{color:var(--sky-line-strong)}
body.ui-study .official-social{background:#bbf3ff17}
@media(hover:hover){body.ui-study .official-social:hover{background:#bbf3ff2a}}

@media(hover:hover) and (pointer:fine){body.ui-study .official-footer .official-logo:hover{color:#d6d6d6}}