/* Shared editorial system for the existing site. Scoped to preserve demo layouts. */
:root {
  --cs-night: #0b1015;
  --cs-paper: #f3f4f0;
  --cs-ink: #17202a;
  --cs-blue: #0052ff;
  --cs-soft: #9bbdff;
  --cs-gutter: clamp(22px, 4.5vw, 88px);
  --cs-sans: Archivo, Arial, Helvetica, sans-serif;
  --cs-mono: "IBM Plex Mono", monospace;
}
html:has(.cloudly-page) {
  scroll-padding-top: 108px;
}
.cloudly-page {
  background: var(--cs-paper);
  color: var(--cs-ink);
  font-family: var(--cs-sans);
  -webkit-font-smoothing: antialiased;
}
.cloudly-page main,
.cloudly-page .about-main {
  overflow-wrap: anywhere;
  background: var(--cs-paper);
  font-family: var(--cs-sans) !important;
}
.cloudly-page ::selection {
  background: var(--cs-blue);
  color: white;
}
.cloudly-page :focus-visible {
  outline: 2px solid var(--cs-blue);
  outline-offset: 5px;
}
.cloudly-page .container {
  max-width: 1600px;
  width: 100%;
  padding-inline: var(--cs-gutter);
  margin-inline: auto;
}
.cloudly-page main h1,
.cloudly-page main h2,
.cloudly-page main h3 {
  hyphens: auto;
  font-family: var(--cs-sans);
  font-weight: 400 !important;
  letter-spacing: -0.045em !important;
}
.cloudly-page main h2 {
  line-height: 1.12;
}
.cloudly-page main .section-padding,
.cloudly-page main .service-section {
  padding-block: 96px;
}
.cloudly-page .about-scale {
  padding-block: 96px !important;
}
.cloudly-page .about-body-p,
.cloudly-page .about-founders-sub,
.cloudly-page .service-body-text p {
  font-size: 16px;
  line-height: 1.8;
  color: #53616d;
}
.cloudly-page .about-large-p {
  font-weight: 400;
  line-height: 1.4;
  font-size: clamp(22px, 2.5vw, 34px);
  letter-spacing: -0.035em;
}
.cloudly-page .about-section-h2 {
  font-size: clamp(32px, 3.7vw, 54px);
}
.cloudly-page .about-origin-label span,
.cloudly-page .about-eyebrow,
.cloudly-page .services-eyebrow,
.cloudly-page .service-number {
  font: 10px/1.6 var(--cs-mono);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.cloudly-page .about-spec-list li {
  font-size: 15px;
  line-height: 1.8;
}
.cloudly-page .about-scale-grid,
.cloudly-page .about-proof-grid,
.cloudly-page .about-founders-grid {
  border-color: #17202a30;
}
.cloudly-page .about-proof {
  background: #e7eae5;
}
.cloudly-page .article-teaser {
  background: transparent;
  border-radius: 0;
  border-color: #17202a26;
}
.cloudly-page .primary-btn,
.cloudly-page .research-pilot-btn,
.cloudly-page .services-cta .primary-btn {
  border-radius: 0 !important;
  box-shadow: none;
  background: var(--cs-blue);
  color: white;
  padding: 18px 25px;
  font-size: 13px;
  font-weight: 400;
}
.cloudly-page .primary-btn:hover,
.cloudly-page .research-pilot-btn:hover {
  background: #003ed0;
  transform: translateY(-2px);
}
/* Site-wide navigation, retaining each page's localized destinations. */
.cs-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: 80px;
  background: #0b1015f7;
  color: #f4f6f9;
  border-bottom: 1px solid #ffffff1c;
  backdrop-filter: blur(18px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 0 var(--cs-gutter);
  font-family: var(--cs-sans);
}
.cs-header a {
  text-decoration: none;
}
.cs-header .cloudly-wordmark {
  color: #f7f8f8;
}
.cs-header-links {
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 12px;
}
.cs-header-links a {
  color: #b6c0cb;
}
.cs-header-links a[aria-current],
.cs-header-links a:hover {
  color: var(--cs-soft);
}
.cs-actions {
  display: flex;
  align-items: center;
  gap: 23px;
}
.cs-contact {
  border: 1px solid #ffffff40;
  padding: 11px 16px;
  font-size: 12px;
  white-space: nowrap;
}
.cs-contact span {
  color: var(--cs-soft);
  margin-left: 20px;
}
.cs-contact:hover {
  background: var(--cs-blue);
  border-color: var(--cs-blue);
}
.cs-language {
  position: relative;
  font: 10px var(--cs-mono);
}
.cs-language summary {
  list-style: none;
  cursor: pointer;
  padding: 12px 0;
}
.cs-language summary::-webkit-details-marker {
  display: none;
}
.cs-language summary span {
  margin-left: 7px;
}
.cs-language nav {
  position: absolute;
  right: 0;
  top: 42px;
  min-width: 155px;
  padding: 10px;
  background: #19212b;
  border: 1px solid #ffffff25;
  box-shadow: 0 12px 30px #0004;
}
.cs-language a {
  display: block;
  padding: 11px 12px;
  color: white;
}
.cs-language a:hover {
  background: #ffffff15;
}
.cs-language a[aria-current] {
  color: var(--cs-soft);
}
.cs-menu-button {
  display: none;
  border: 0;
  background: none;
  color: white;
  width: 32px;
  height: 42px;
  cursor: pointer;
  padding: 8px 3px;
}
.cs-menu-button span {
  display: block;
  width: 24px;
  height: 1px;
  background: white;
  margin: 6px 0;
  transition: transform 0.2s;
}
.cs-mobile-nav {
  display: none;
}
.cs-skip {
  position: fixed;
  top: -100px;
  left: 20px;
  padding: 12px 18px;
  z-index: 150;
  background: #fff;
  color: #111;
}
.cs-skip:focus {
  top: 10px;
}
/* Each page begins with its purpose, before the supporting detail. */
.cloudly-page main {
  padding-top: 0 !important;
}
.cloudly-page .cs-page-hero {
  position: relative;
  background: radial-gradient(ellipse at 90% 35%, #1e2d3d, #0b1015 70%);
  background-color: #0b1015;
  color: #f4f6f9;
  padding: 164px 0 88px !important;
  border: 0;
  overflow: hidden;
}
.cloudly-page .cs-page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(#adc5df08 1px, transparent 1px),
    linear-gradient(90deg, #adc5df08 1px, transparent 1px);
  background-size: 80px 80px;
  pointer-events: none;
  mask-image: linear-gradient(90deg, transparent, black);
}
.cloudly-page .cs-page-hero .container {
  position: relative;
}
.cloudly-page .cs-page-hero h1 {
  color: #f5f6f5;
  font-size: clamp(46px, 5.5vw, 84px) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.06em !important;
  margin-bottom: 30px;
}
.cloudly-page .cs-page-hero h1 em {
  color: var(--cs-soft);
  font-style: normal;
}
.cloudly-page .cs-page-hero p {
  color: #aebdcc !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  font-weight: 400;
  max-width: 52ch;
}
.cloudly-page .cs-page-hero .about-eyebrow,
.cloudly-page .cs-page-hero .services-eyebrow,
.cloudly-page .cs-page-hero .cs-eyebrow {
  color: var(--cs-soft) !important;
  font: 9px/1.7 var(--cs-mono) !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 27px;
}
.cloudly-page .cs-page-hero .about-hero-grid {
  grid-template-columns: 1fr 1fr;
  gap: 70px;
}
.cloudly-page .cs-page-hero .about-hero-inner {
  max-width: none;
}
.cloudly-page .cs-page-hero .about-hero-visual {
  overflow: hidden;
}
.cloudly-page .cs-page-hero .about-hero-img {
  mix-blend-mode: normal;
  max-height: 530px;
  background: #f3f4f0;
}
.cloudly-page .cs-page-hero .research-hero-img {
  border-radius: 0;
  box-shadow: none;
}
.cs-hero-actions {
  display: flex;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
  margin-top: 33px;
}
.cs-hero-actions a {
  display: inline-flex;
  align-items: center;
  gap: 25px;
  font: 12px var(--cs-sans);
  color: #e2edff;
  border-bottom: 1px solid #adc5df66;
  padding-bottom: 10px;
}
.cs-hero-actions a span {
  color: var(--cs-soft);
  font-size: 19px;
}
.cs-hero-actions a:hover {
  color: white;
}
.cs-hero-actions a:first-child {
  color: var(--cs-soft);
}
.cloudly-page .services-hero-split {
  grid-template-columns: 1.2fr 1fr;
  align-items: end;
  gap: 10%;
}
.cloudly-page .services-hero-right {
  padding-bottom: 5px;
}
.cloudly-page .services-hero-lead {
  margin: 0;
}
.cloudly-page .services-nav-strip {
  top: 80px;
  background: #edf0ea;
  border-color: #17202a26;
  z-index: 30;
  padding-block: 0;
}
.cloudly-page .services-nav-strip-inner {
  overflow-x: auto;
  scrollbar-width: thin;
}
.cloudly-page .services-nav-item {
  color: #4f5f6e;
  flex-shrink: 0;
  border-radius: 0;
  font: 10px var(--cs-mono);
  letter-spacing: -0.01em;
}
.cloudly-page .service-header {
  min-width: 0;
  border-top: 1px solid #17202a25;
  padding-top: 35px;
}
.cloudly-page .service-header h2 {
  overflow-wrap: anywhere;
  hyphens: auto;
  font-size: clamp(36px, 4.5vw, 66px);
}
.cloudly-page .service-img-wrapper {
  border-radius: 0;
  background: #e6eae7;
}
.cloudly-page .service-img-wrapper img {
  border-radius: 0;
}
.cloudly-page .service-subtitle {
  color: #53616d;
  font-size: 17px;
  line-height: 1.6;
}
.cloudly-page .service-section[style*="background"],
.cloudly-page .services-system,
.cloudly-page .services-scale {
  background: #e7eae5 !important;
}
.cloudly-page .service-best-suited {
  border-radius: 0;
  background: #e5e9e2;
  border: 1px solid #17202a15;
}
.cloudly-page .service-live-demo {
  background: var(--cs-night);
  color: #edf3ff;
  border-radius: 0;
  border: 0;
}
.cloudly-page .service-live-demo-text span {
  color: #adbed0;
}
.cloudly-page .services-video-wrapper,
.cloudly-page .poc2-video {
  border-radius: 0 !important;
  box-shadow: none;
}
.cloudly-page .services-cta,
.cloudly-page .about-cta {
  padding: 84px 0 !important;
  background: var(--cs-blue);
  border: 0;
  color: white;
}
.cloudly-page .services-cta h2,
.cloudly-page .about-cta h2 {
  color: white;
  font-size: clamp(34px, 4vw, 56px);
}
.cloudly-page .services-cta p,
.cloudly-page .about-cta p {
  color: #eef4ff;
}
.cloudly-page .services-cta .primary-btn,
.cloudly-page .about-cta .primary-btn {
  background: white;
  color: var(--cs-blue);
}
.cs-studies {
  padding: 62px 0 74px;
  background: #10171f;
  color: white;
}
.cs-studies .cs-study-label {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 26px;
  font: 9px/1.7 var(--cs-mono);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #9baabd;
}
.cs-study-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 25px;
}
.cs-study {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  background: #1b2835;
  border: 1px solid #ffffff15;
  min-height: 220px;
  overflow: hidden;
  color: #f0f4f9;
}
.cs-study-picture {
  height: 230px;
  position: relative;
  overflow: hidden;
}
.cs-study-picture img {
  width: 100%;
  height: 150%;
  object-fit: contain;
  position: absolute;
  top: -25%;
  transform: rotate(40deg);
  transition: transform 0.7s;
}
.cs-study:last-child .cs-study-picture img {
  object-fit: cover;
  transform: none;
  height: 100%;
  top: 0;
}
.cs-study:hover img {
  transform: rotate(35deg) scale(1.04);
}
.cs-study:last-child:hover img {
  transform: scale(1.06);
}
.cs-study > div:last-child {
  padding: 25px;
}
.cs-study small {
  font: 8px/1.6 var(--cs-mono);
  color: #98aec5;
  text-transform: uppercase;
}
.cs-study h2 {
  font-size: 24px;
  line-height: 1.14;
  letter-spacing: -0.04em;
  margin: 14px 0 24px;
}
.cs-study .cs-study-link {
  font-size: 10px;
  color: #acc8ff;
}
.cs-study .cs-study-link span {
  margin-left: 14px;
}
.cs-studies-note {
  font: 8px/1.7 var(--cs-mono);
  color: #8699ad;
  margin-top: 22px;
}
/* Editorial library and long-form reading. */
.cloudly-page .services-system {
  background: var(--cs-night) !important;
  color: #f4f7fb;
}
.cloudly-page .services-system h2,
.cloudly-page .services-system h3 {
  color: #f4f7fb;
}
.cloudly-page .services-system p {
  color: #b7c5d4 !important;
}
.cloudly-page .services-system-num {
  color: #9bbdff;
}
.cloudly-page .services-system-grid,
.cloudly-page .services-system-item {
  border-color: #ffffff29;
}
.cloudly-page .services-cta-secondary,
.cloudly-page .services-cta-divider {
  color: #e1ebff;
}
.cs-delivery-detail {
  border-top: 1px solid #17202a2b;
  margin-top: 25px;
}
.cs-delivery-detail summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  list-style: none;
  cursor: pointer;
  padding: 17px 0;
  color: var(--cs-blue);
  font: 11px var(--cs-mono);
}
.cs-delivery-detail summary::-webkit-details-marker,
.cs-experiments > summary::-webkit-details-marker {
  display: none;
}
.cs-delivery-detail summary > span {
  font: 22px var(--cs-sans);
  transition: transform 0.2s;
}
.cs-delivery-detail[open] summary > span,
.cs-experiments[open] .cs-expand {
  transform: rotate(45deg);
}
.cs-delivery-detail > div {
  padding-top: 8px;
}
.cs-experiments {
  background: #e7eae5;
  border-top: 1px solid #17202a25;
}
.cs-experiments > summary {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: center;
  list-style: none;
  cursor: pointer;
  padding-block: 40px;
}
.cs-experiments summary small {
  display: block;
  font: 9px var(--cs-mono);
  color: #78858f;
  margin-bottom: 13px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.cs-experiments summary strong {
  display: block;
  font: 400 clamp(22px, 2.4vw, 35px)/1.2 var(--cs-sans);
  letter-spacing: -0.04em;
}
.cs-expand {
  font: 30px var(--cs-sans);
  color: var(--cs-blue);
  transition: transform 0.2s;
}
.cs-contact-page .cs-brief-note {
  font-size: 13px !important;
  line-height: 1.7 !important;
  color: #7b8893 !important;
  margin-top: 20px !important;
}
.cs-insights .about-hero-grid {
  display: block !important;
}
.cs-insights .about-hero-inner {
  max-width: 1000px !important;
}
.cs-insights .cs-page-hero h1 {
  font-size: clamp(48px, 7vw, 98px) !important;
}
.cs-insights main > section.container {
  padding-block: 70px 100px;
}
.cs-insights main > div:empty {
  display: none;
}
.cs-insights article {
  border: 1px solid #17202a24;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff;
}
.cs-insights article h3 {
  font-size: 23px !important;
  font-weight: 400 !important;
  letter-spacing: -0.035em !important;
}
.cs-insights article:hover {
  border-color: #8299b7;
}
.cs-article main {
  padding-block: 145px 100px !important;
}
.cs-article main > div.container {
  max-width: 1260px;
}
.cs-article main h1 {
  font-size: clamp(37px, 4.5vw, 66px) !important;
  line-height: 1.08 !important;
  color: var(--cs-ink);
  max-width: 1000px;
}
.cs-article main article {
  background: transparent;
}
.cs-article main article p {
  line-height: 1.85;
}
.cs-article main [style*="color: rgb(170, 170, 170)"] {
  color: #53616d !important;
}
.cs-article main [style*="color: rgb(22, 163, 74)"] {
  color: #13713b !important;
}
.cs-article main [style*="color: rgb(202, 138, 4)"] {
  color: #886000 !important;
}
.cs-article main [style*="background: rgb(22, 163, 74)"] {
  background: #13713b !important;
}
.cs-article main [style*="background: rgb(202, 138, 4)"],
.cs-article main [style*="background: rgb(217, 119, 6)"],
.cs-article main [style*="background: rgb(234, 179, 8)"] {
  background: #886000 !important;
}
.cs-article main [style*="background: rgb(17, 17, 17)"] span {
  color: #d3e1f3 !important;
}
.cs-article main [style*="minmax(300px"] {
  grid-template-columns: repeat(
    auto-fit,
    minmax(min(100%, 300px), 1fr)
  ) !important;
}
.cs-article main [class*="rounded"] {
  border-radius: 0 !important;
}
.cs-legal main {
  padding: 150px 0 90px !important;
}
.cs-legal main > .container {
  max-width: 1100px !important;
}
.cs-legal main h1 {
  font-size: clamp(40px, 5vw, 68px) !important;
  line-height: 1.1 !important;
}
/* A clear next step, before maps and company details. */
.cs-contact-page #booking {
  background: var(--cs-paper) !important;
  padding: 80px 0 !important;
}
.cs-contact-page #booking > .container {
  padding-block: 0 !important;
}
.cs-contact-page #booking h2 {
  font-size: clamp(36px, 4vw, 58px) !important;
}
.cs-contact-page #booking [style*="border-radius"] {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.cs-contact-page
  main
  > section:not(.cs-page-hero):not(#booking)
  > .container
  > div {
  grid-template-columns: 1fr 1fr !important;
  gap: 65px !important;
  padding-block: 75px !important;
}
.cs-contact-page
  main
  > section:not(.cs-page-hero):not(#booking)
  [style*="height: 600px"] {
  height: 420px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.cs-contact-page main a[href^="mailto:"]:not(.cs-hero-actions a) {
  color: var(--cs-ink) !important;
  font-size: clamp(21px, 2.7vw, 37px) !important;
  overflow-wrap: anywhere;
}
.cs-contact-page main address {
  font-size: 20px !important;
  line-height: 1.6 !important;
}
.cs-contact-page #booking iframe {
  background: white;
}
/* Existing translated homepages share the same palette and hierarchy. */
.cs-home .hero {
  background: var(--cs-night);
}
.cs-home .hero-grid {
  max-width: none;
  padding: 0;
  gap: 70px;
}
.cs-home .hero-h1-xl {
  font-size: clamp(42px, 5vw, 70px) !important;
}
.cs-home .hero-tagline {
  color: var(--cs-soft) !important;
}
.cs-home .hero-visual {
  border-radius: 0;
  background: white;
}
.cs-home .hero-visual img {
  opacity: 1;
}
.cs-home .card,
.cs-home .deliverable-card,
.cs-home .quality-card {
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  border-top: 1px solid #17202a30;
}
.cs-home .platforms,
.cs-home .deliver,
.cs-home .quality-section,
.cs-home .technology,
.cs-home .faq-section {
  background: var(--cs-paper) !important;
}
.cs-home .protocol-section,
.cs-home .proof-strip {
  background: #e7eae5;
}
.cs-home .section-title {
  font-size: clamp(34px, 4vw, 56px);
}
.cs-home .audience-section {
  background: var(--cs-night);
}
.cs-home .hero .primary-btn {
  background: var(--cs-blue);
  color: #fff;
}
/* Footers are consistent, with the original company and legal information retained. */
.cloudly-page footer#contact {
  font-family: var(--cs-sans) !important;
  background: var(--cs-night);
  color: #e5edf5;
  padding: 64px 0 30px !important;
  border: 0;
}
.cloudly-page footer#contact .footer-content {
  padding-top: 45px !important;
  border-color: #ffffff24 !important;
}
.cloudly-page footer#contact h2 {
  color: #f5f6f8;
}
.cloudly-page footer#contact h3 {
  color: #b7c6d5;
  font: 10px var(--cs-mono);
  text-transform: uppercase;
  letter-spacing: 0.09em;
}
.cloudly-page footer#contact a {
  color: #d7e3f2;
}
.cloudly-page footer#contact .email-link {
  color: #a8c4ff;
  font-size: 20px;
}
.cloudly-page footer#contact address {
  color: #8fa0b3;
  font-size: 12px;
  line-height: 1.8;
}
.cloudly-page footer#contact .copyright {
  border-color: #ffffff1c;
  color: #9aacbf;
  font: 9px var(--cs-mono);
  margin-top: 35px;
}
.cloudly-page footer#contact p,
.cloudly-page footer#contact .copyright p {
  color: #aebdcd !important;
}
.cloudly-page .service-insights-label,
.cloudly-page .cs-experiments small,
.cloudly-page .cs-experiments figcaption,
.cloudly-page .cs-experiments p,
.cloudly-page .about-origin-label span,
.cloudly-page .article-teaser-label,
.cloudly-page .insights-card-time,
.cloudly-page .research-field-label,
.cloudly-page .cs-brief-note,
.cs-insights main [style*="156, 163, 175"],
.cs-article main [style*="136, 136, 136"] {
  color: #53616d !important;
}
.cloudly-page .research-pilot .about-body-p {
  color: #b7c5d4;
}
.cloudly-page footer#contact .primary-btn {
  color: var(--cs-blue) !important;
  background: white !important;
  border-radius: 0 !important;
  font-size: 14px !important;
}
.cloudly-page #cookie-banner {
  position: fixed;
  z-index: 150;
  color: #f1f5fb;
  left: auto !important;
  right: 20px !important;
  bottom: 20px !important;
  max-width: 460px;
  background: #172431 !important;
  border: 1px solid #ffffff25 !important;
  padding: 22px !important;
  box-shadow: 0 10px 40px #0004;
}
.cloudly-page #cookie-banner[hidden] {
  display: none !important;
}
.cloudly-page #cookie-banner .container {
  display: block;
}
.cloudly-page #cookie-banner p {
  color: #d7e3f2 !important;
}
.cloudly-page #cookie-banner a {
  color: #b8ceff;
  text-decoration: underline;
}
.cloudly-page .cs-consent-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.cloudly-page .cs-consent-actions button {
  min-height: 44px;
  border: 1px solid #ffffff40;
  background: transparent;
  color: #fff;
  cursor: pointer;
}
.cloudly-page .cs-consent-actions button[data-consent="all"] {
  background: #fff;
  color: #172431;
}
.cloudly-page .service-header > div {
  min-width: 0;
}
.cloudly-page #cookie-banner .container {
  padding: 0;
  gap: 18px !important;
}
.cloudly-page #cookie-banner p {
  font-size: 12px !important;
}
.cloudly-page #cookie-banner p:first-child {
  font-size: 16px !important;
}
.cloudly-page #cookie-banner button {
  padding: 9px 18px !important;
  font-size: 12px !important;
}
@media (max-width: 1100px) {
  .cs-header-links {
    gap: 20px;
    font-size: 11px;
  }
  .cs-actions {
    gap: 15px;
  }
  .cs-contact {
    padding: 11px;
    font-size: 11px;
  }
  .cs-contact span {
    margin-left: 10px;
  }
  .cloudly-page .cs-page-hero .about-hero-grid {
    gap: 35px;
  }
  .cloudly-page .cs-page-hero h1 {
    font-size: 52px !important;
  }
  .cs-study {
    grid-template-columns: 0.9fr 1fr;
  }
  .cs-study > div:last-child {
    padding: 18px;
  }
  .cs-study h2 {
    font-size: 21px;
  }
  .cloudly-page .services-nav-item {
    font-size: 9px;
  }
}
@media (max-width: 900px) {
  .cs-header-links {
    display: none;
  }
  .cs-menu-button {
    display: block;
  }
  .cs-mobile-nav {
    display: flex;
    position: absolute;
    top: 79px;
    left: 0;
    right: 0;
    height: calc(100svh - 79px);
    padding: 25px var(--cs-gutter);
    background: var(--cs-night);
    flex-direction: column;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s;
  }
  .cs-mobile-nav > a {
    font-size: 28px;
    letter-spacing: -0.035em;
    border-bottom: 1px solid #ffffff22;
    padding: 20px 0;
  }
  .cs-mobile-nav > a:last-of-type {
    color: var(--cs-soft);
    font-size: 20px;
    margin-top: 15px;
  }
  .cs-mobile-languages {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    font: 10px var(--cs-mono);
    padding: 30px 0;
    color: #9bb5d1;
  }
  .cs-header.cs-open .cs-mobile-nav {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  .cs-header.cs-open .cs-menu-button span:first-child {
    transform: translateY(3.5px) rotate(45deg);
  }
  .cs-header.cs-open .cs-menu-button span:last-child {
    transform: translateY(-3.5px) rotate(-45deg);
  }
  .cloudly-page.cs-nav-open {
    overflow: hidden;
  }
  .cloudly-page .cs-page-hero .about-hero-grid {
    grid-template-columns: 1fr;
  }
  .cloudly-page .cs-page-hero .about-hero-visual {
    max-width: 620px;
  }
  .cloudly-page .cs-page-hero .about-hero-img {
    max-height: 420px;
  }
  .cloudly-page .cs-page-hero .about-hero-lead {
    max-width: 55ch;
  }
  .cloudly-page .services-hero-split {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .cs-study {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .cs-study-picture {
    height: 250px;
  }
  .cs-study > div:last-child {
    padding: 25px;
  }
  .cs-study h2 {
    font-size: 25px;
  }
  .cs-contact-page
    main
    > section:not(.cs-page-hero):not(#booking)
    > .container
    > div {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
}
@media (max-width: 760px) {
  html:has(.cloudly-page) {
    scroll-padding-top: 90px;
  }
  .cs-header {
    height: 66px;
    gap: 14px;
  }
  .cs-actions {
    gap: 14px;
  }
  .cs-contact {
    font-size: 10px;
    padding: 9px 12px;
  }
  .cs-language {
    font-size: 9px;
  }
  .cs-mobile-nav {
    top: 65px;
    height: calc(100svh - 65px);
  }
  .cloudly-page .cs-page-hero {
    padding: 121px 0 55px !important;
  }
  .cloudly-page .cs-page-hero h1 {
    font-size: 43px !important;
    line-height: 1.05 !important;
    margin-bottom: 24px;
  }
  .cloudly-page .cs-page-hero p {
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
  .cloudly-page .cs-page-hero .about-eyebrow,
  .cloudly-page .cs-page-hero .services-eyebrow,
  .cloudly-page .cs-page-hero .cs-eyebrow {
    font-size: 8px !important;
    margin-bottom: 22px;
  }
  .cloudly-page .cs-page-hero .about-hero-grid {
    gap: 35px;
  }
  .cloudly-page .cs-page-hero .about-hero-img {
    max-width: 100%;
    max-height: 370px;
  }
  .cs-hero-actions {
    margin-top: 27px;
    gap: 24px;
  }
  .cs-hero-actions a {
    font-size: 11px;
  }
  .cloudly-page main .section-padding,
  .cloudly-page main .service-section {
    padding-block: 60px;
  }
  .cloudly-page .about-scale {
    padding-block: 60px !important;
  }
  .cloudly-page .about-body-p,
  .cloudly-page .about-founders-sub,
  .cloudly-page .service-body-text p {
    font-size: 14px;
  }
  .cloudly-page .about-section-h2 {
    font-size: 33px;
  }
  .cloudly-page .about-origin-grid,
  .cloudly-page .about-scale-grid,
  .cloudly-page .about-beyond-grid,
  .cloudly-page .about-proof-grid {
    gap: 25px;
  }
  .cloudly-page .about-spec-list li {
    font-size: 13px;
  }
  .cloudly-page .services-nav-strip {
    top: 66px;
  }
  .cloudly-page .services-nav-item {
    font-size: 9px;
    padding: 17px 15px;
  }
  .cloudly-page .service-header h2 {
    font-size: 39px;
  }
  .cloudly-page .service-subtitle {
    font-size: 15px;
  }
  .cloudly-page .service-header {
    padding-top: 25px;
  }
  .cloudly-page .services-cta,
  .cloudly-page .about-cta {
    padding: 55px 0 !important;
  }
  .cs-studies {
    padding: 40px 0 48px;
  }
  .cs-study-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .cs-study {
    grid-template-columns: 1fr 1fr;
  }
  .cs-study-picture {
    height: 200px;
  }
  .cs-study > div:last-child {
    padding: 20px;
  }
  .cs-study h2 {
    font-size: 23px;
  }
  .cs-study small,
  .cs-study .cs-study-link {
    font-size: 8px;
  }
  .cs-studies .cs-study-label {
    font-size: 8px;
  }
  .cs-studies .cs-study-label span:last-child {
    display: none;
  }
  .cs-insights main > section.container {
    padding-block: 45px 60px;
  }
  .cs-insights article h3 {
    font-size: 23px !important;
  }
  .cs-article main {
    padding-block: 110px 60px !important;
  }
  .cs-article main h1 {
    font-size: 37px !important;
  }
  .cs-article main p {
    font-size: 15px;
  }
  .cs-legal main {
    padding: 115px 0 60px !important;
  }
  .cs-legal main h1 {
    font-size: 40px !important;
  }
  .cs-contact-page #booking {
    padding: 55px 0 !important;
  }
  .cs-contact-page #booking h2 {
    font-size: 34px !important;
  }
  .cs-contact-page
    main
    > section:not(.cs-page-hero):not(#booking)
    > .container
    > div {
    padding-block: 50px !important;
  }
  .cs-contact-page
    main
    > section:not(.cs-page-hero):not(#booking)
    [style*="height: 600px"] {
    height: 330px !important;
  }
  .cs-contact-page main address {
    font-size: 17px !important;
  }
  .cloudly-page footer#contact {
    padding: 45px 0 25px !important;
  }
  .cloudly-page footer#contact .footer-content {
    padding-top: 30px !important;
  }
  .cloudly-page #cookie-banner {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    max-width: none;
  }
  .cloudly-page .primary-btn {
    font-size: 12px;
    padding: 16px 22px;
  }
  .cs-home .hero-grid {
    gap: 35px;
  }
  .cs-home .hero-h1-xl {
    font-size: 42px !important;
  }
}
@media (max-width: 420px) {
  .cs-language {
    display: block;
  }
  .cs-contact {
    display: none;
  }
  .cs-study > div:last-child {
    padding: 14px;
  }
  .cs-study h2 {
    font-size: 20px;
  }
  .cs-study-picture {
    height: 190px;
  }
}
@media (max-width: 359px) {
  .cs-contact {
    display: none;
  }
  .cs-header .cloudly-wordmark {
    font-size: 23px;
  }
  .cloudly-page .cs-page-hero h1 {
    font-size: 37px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .cloudly-page *,
  .cloudly-page *::before,
  .cloudly-page *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
