/* SmartClicks credibility redesign — clear B2B hierarchy, September 2026. */
:root {
  --sc-ink: #10243e;
  --sc-muted: #53657a;
  --sc-line: #dbe5ee;
  --sc-paper: #f7f9fc;
  --sc-white: #ffffff;
  --sc-pink: #ef1975;
  --sc-pink-dark: #c90d5d;
  --sc-cyan: #08a9c5;
  --sc-yellow: #ffd84d;
  --sc-navy: #0d213a;
  --sc-radius: 22px;
  color-scheme: light;
}

html { background: var(--sc-paper) !important; scroll-behavior: smooth; }
body {
  background: var(--sc-paper) !important;
  color: var(--sc-ink) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  line-height: 1.6;
}
body::before, body::after, .home-atmosphere, .home-motion-toggle { display: none !important; }
.wrap { width: min(1180px, calc(100% - 40px)) !important; }
p, li, address, input, textarea, button { font-size: max(1rem, 16px); }
p { color: var(--sc-muted) !important; }
h1, h2, h3, h4, strong, summary { color: var(--sc-ink) !important; }
h2 { letter-spacing: -.035em !important; }
a { color: inherit; }

/* Navigation: familiar, light and calm. */
header, .home-page header {
  position: sticky !important;
  top: 0;
  z-index: 1000;
  min-height: 76px !important;
  background: rgba(255,255,255,.94) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(16,36,62,.1) !important;
  box-shadow: 0 8px 28px rgba(16,36,62,.06) !important;
  backdrop-filter: blur(14px);
}
.corner-brand { display: none !important; }
.nav { min-height: 76px !important; display: flex !important; justify-content: center !important; gap: 30px !important; }
.nav nav { display: flex !important; align-items: center !important; justify-content: center !important; gap: clamp(18px, 2.2vw, 34px) !important; }
.nav nav a {
  color: var(--sc-ink) !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  padding: 25px 0 20px !important;
  position: relative;
}
.nav nav a::after {
  content: "";
  position: absolute;
  left: 50%; right: 50%; bottom: 15px;
  height: 3px; border-radius: 10px;
  background: var(--sc-pink);
  transition: left .2s ease, right .2s ease;
}
.nav nav a:hover::after, .nav nav a:focus-visible::after { left: 0; right: 0; }
.languages { margin-left: auto !important; }
.language-toggle, .language-options {
  background: var(--sc-white) !important;
  border: 1px solid var(--sc-line) !important;
  color: var(--sc-ink) !important;
  box-shadow: 0 10px 30px rgba(16,36,62,.1) !important;
}

/* One clear first screen. No generated image is used as credibility proof. */
.visual-intro { background: var(--sc-white) !important; }
.world-banner {
  min-height: min(720px, calc(100svh - 76px)) !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 50px !important;
  padding: clamp(72px, 9vw, 118px) 20px 48px !important;
  background:
    radial-gradient(circle at 13% 18%, rgba(8,169,197,.11), transparent 25%),
    radial-gradient(circle at 86% 13%, rgba(239,25,117,.11), transparent 26%),
    linear-gradient(150deg, #fff 0 62%, #fff5f9 100%) !important;
  overflow: hidden !important;
  isolation: isolate;
}
.world-banner::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  background-image: radial-gradient(rgba(8,169,197,.22) 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
  opacity: .24 !important;
  mask-image: linear-gradient(to bottom, #000 0, transparent 62%);
  pointer-events: none;
  z-index: -1;
}
.world-banner::after {
  content: "" !important;
  position: absolute !important;
  display: block !important;
  width: 210px !important; height: 9px !important;
  top: 48px !important; left: 50% !important;
  translate: -50% 0 !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, var(--sc-cyan), var(--sc-pink) 58%, var(--sc-yellow)) !important;
  opacity: 1 !important;
}
.world-banner > img { display: none !important; }
.intro-pitch {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  z-index: 2 !important;
  width: min(980px, 100%) !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.intro-kicker, .small-label {
  color: var(--sc-pink-dark) !important;
  font-size: .82rem !important;
  font-weight: 850 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase;
}
.intro-pitch h1 {
  max-width: 940px !important;
  margin: 14px auto 22px !important;
  color: var(--sc-ink) !important;
  font-size: clamp(2.55rem, 6vw, 5.35rem) !important;
  line-height: 1.01 !important;
  letter-spacing: -.065em !important;
  text-shadow: none !important;
}
.intro-pitch h1 span { color: var(--sc-pink) !important; }
.intro-summary {
  max-width: 800px !important;
  margin: 0 auto !important;
  color: #3f5268 !important;
  font-size: clamp(1.08rem, 1.7vw, 1.28rem) !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
  text-align: center !important;
  text-shadow: none !important;
}
.intro-actions { justify-content: center !important; margin-top: 32px !important; }
.pink, a.pink, button.pink {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 50px !important;
  padding: 12px 24px !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: var(--sc-pink) !important;
  box-shadow: 0 10px 25px rgba(239,25,117,.22) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease !important;
}
.pink:hover, .pink:focus-visible {
  transform: translateY(-2px) !important;
  background: var(--sc-pink-dark) !important;
  box-shadow: 0 14px 30px rgba(201,13,93,.26) !important;
}

.world-stats {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  width: min(1080px, 100%) !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 14px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
.world-stats > div {
  min-height: 142px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 20px 14px !important;
  background: rgba(255,255,255,.95) !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 14px 40px rgba(16,36,62,.08) !important;
  text-align: center !important;
}
.world-stats > div::before, .world-stats > div::after { display: none !important; }
.world-stats b { color: var(--sc-pink) !important; font-size: 2.25rem !important; line-height: 1 !important; text-shadow: none !important; }
.world-stats span { color: var(--sc-ink) !important; font-size: .95rem !important; font-weight: 800 !important; line-height: 1.25 !important; }
.world-stats small { color: var(--sc-muted) !important; font-size: .72rem !important; line-height: 1.25 !important; }

/* Search becomes a distinct tool below the promise. */
.hero { min-height: 0 !important; padding: 34px 20px !important; background: #eef7fa !important; border: 0 !important; }
.hero::before, .hero::after, .hero-art { display: none !important; }
.hero-inner { min-height: 0 !important; padding: 0 !important; }
.search {
  max-width: 850px !important;
  margin: 0 auto !important;
  padding: 8px 8px 8px 20px !important;
  background: #fff !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: 999px !important;
  box-shadow: 0 12px 32px rgba(16,36,62,.09) !important;
}
.search input { color: var(--sc-ink) !important; background: #fff !important; }
.search input::placeholder { color: #7a8999 !important; opacity: 1; }
.search > span { color: var(--sc-cyan) !important; }

/* Light editorial rhythm across the homepage. */
main > section, .catalogue, .b2b-section, .story-path, .contact { border: 0 !important; }
.about-home, .combined-services, .catalogue > .wrap, .b2b-section, .launch-panel, .contact {
  margin-top: 0 !important;
  padding-top: clamp(58px, 7vw, 92px) !important;
  padding-bottom: clamp(58px, 7vw, 92px) !important;
}
.about-home {
  width: min(920px, calc(100% - 40px)) !important;
  display: block !important;
  text-align: center !important;
  background: transparent !important;
}
.about-home img { display: none !important; }
.about-home > div {
  padding: clamp(32px, 5vw, 58px) !important;
  background: #fff !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: var(--sc-radius) !important;
  box-shadow: 0 18px 50px rgba(16,36,62,.07) !important;
}
.about-home h2 { color: var(--sc-pink-dark) !important; }
.about-home .about-lead { color: var(--sc-ink) !important; font-size: clamp(1.35rem, 2.5vw, 2rem) !important; font-weight: 800 !important; }
.trend-watch, .proof-space { display: none !important; }

.combined-services {
  width: 100% !important;
  max-width: none !important;
  padding-left: max(20px, calc((100% - 1180px)/2)) !important;
  padding-right: max(20px, calc((100% - 1180px)/2)) !important;
  background: #eef6fa !important;
}
.combined-services > h2 { max-width: 760px; margin-inline: auto; text-align: center; }
.combined-services > .small-label, .services-caption { text-align: center !important; }
.project-steps, .service-grid { gap: 18px !important; }
.project-steps article, .service-grid article {
  background: #fff !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: var(--sc-radius) !important;
  color: var(--sc-ink) !important;
  box-shadow: 0 14px 36px rgba(16,36,62,.07) !important;
}
.project-steps b { color: var(--sc-pink) !important; }
.service-grid article a, .secondary-link {
  color: var(--sc-pink-dark) !important;
  font-weight: 800 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 4px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.catalogue { background: #fff !important; }
.catalogue-note { max-width: 850px; }
.filters button, .all, .carousel-controls button {
  color: var(--sc-ink) !important;
  background: #fff !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
.filters button.active, .filters button:hover, .all:hover { color: #fff !important; background: var(--sc-ink) !important; border-color: var(--sc-ink) !important; }
.product, .catalog-card {
  background: #fff !important;
  color: var(--sc-ink) !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: var(--sc-radius) !important;
  box-shadow: 0 14px 36px rgba(16,36,62,.08) !important;
}
.product-image, .catalog-card .image, .product-gallery, .main-image {
  background: #eef4f8 !important;
  border-color: var(--sc-line) !important;
}

.faq-preview { background: #fff7fa !important; width: 100% !important; max-width: none !important; padding-left: max(20px, calc((100% - 1180px)/2)) !important; padding-right: max(20px, calc((100% - 1180px)/2)) !important; }
.faq-list details {
  background: #fff !important;
  color: var(--sc-ink) !important;
  border: 1px solid #f0cadb !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(16,36,62,.05) !important;
}
.launch-panel {
  width: min(1180px, calc(100% - 40px)) !important;
  background: var(--sc-navy) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 28px !important;
  box-shadow: 0 22px 55px rgba(13,33,58,.18) !important;
}
.launch-panel h2, .launch-panel h3, .launch-panel strong, .launch-panel li { color: #fff !important; }
.launch-panel p { color: #d8e5f0 !important; }
.launch-checklist li { border-color: rgba(255,255,255,.2) !important; background: rgba(255,255,255,.06) !important; border-radius: 16px !important; }

.contact {
  width: 100% !important;
  max-width: none !important;
  padding-left: max(20px, calc((100% - 1180px)/2)) !important;
  padding-right: max(20px, calc((100% - 1180px)/2)) !important;
  background: #eef6fa !important;
}
.contact > div, .contact form, .contact aside > div, .resources .community, .meeting-card {
  background: #fff !important;
  color: var(--sc-ink) !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: var(--sc-radius) !important;
  box-shadow: 0 14px 36px rgba(16,36,62,.07) !important;
}
.contact > div, .contact form { padding: clamp(24px, 3vw, 38px) !important; }
.contact address a, .contact address span { color: var(--sc-ink) !important; }
.contact input, .contact textarea {
  color: var(--sc-ink) !important;
  background: #fff !important;
  border: 1px solid #bdcbd8 !important;
  border-radius: 13px !important;
}
.contact input:focus, .contact textarea:focus { border-color: var(--sc-cyan) !important; box-shadow: 0 0 0 4px rgba(8,169,197,.13) !important; outline: 0; }
.contact-world-map { display: none !important; }
.benefits { color: var(--sc-ink) !important; }

/* Interior pages keep the same visual language. */
body:not(.home-page) main { background: var(--sc-paper) !important; color: var(--sc-ink) !important; }
body:not(.home-page) .page-hero, body:not(.home-page) .service-hero, body:not(.home-page) .catalogue-hero {
  background: #eef6fa !important;
  color: var(--sc-ink) !important;
  border: 0 !important;
}
body:not(.home-page) section, body:not(.home-page) article, body:not(.home-page) .panel, body:not(.home-page) .card {
  border-color: var(--sc-line) !important;
}
body:not(.home-page) .product-detail, body:not(.home-page) .product-info, body:not(.home-page) .product-copy {
  color: var(--sc-ink) !important;
}

html body.space-page {
  background: var(--sc-paper) !important;
  background-image: none !important;
  color: var(--sc-ink) !important;
}
html body.space-page header {
  background: rgba(255,255,255,.96) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--sc-line) !important;
}
html body.space-page header .logo { display: none !important; }
html body.space-page header nav a { color: var(--sc-ink) !important; text-shadow: none !important; }
html body.space-page main.space-main {
  background: #fff !important;
  color: var(--sc-ink) !important;
  box-shadow: 0 20px 55px rgba(16,36,62,.07) !important;
}
html body.space-page .product-detail,
html body.space-page .product-info,
html body.space-page .product-support,
html body.space-page .product-answers,
html body.space-page .related-products {
  background: #fff !important;
  background-image: none !important;
  color: var(--sc-ink) !important;
}
html body.space-page .product-info p,
html body.space-page .product-info li,
html body.space-page .catalogue-disclaimer,
html body.space-page .gallery-note,
html body.space-page .product-support p,
html body.space-page .product-answers p,
html body.space-page .related-products p { color: var(--sc-muted) !important; text-shadow: none !important; }
html body.space-page .project-facts > *,
html body.space-page .buying-note,
html body.space-page .product-urgency-box,
html body.space-page .product-answers details,
html body.space-page .related-products article {
  background: #f7f9fc !important;
  background-image: none !important;
  color: var(--sc-ink) !important;
  border: 1px solid var(--sc-line) !important;
  box-shadow: none !important;
}
html body.space-page .project-facts * { color: var(--sc-ink) !important; text-shadow: none !important; }

footer {
  background: var(--sc-navy) !important;
  color: #dce8f2 !important;
  border: 0 !important;
}
footer a, footer small, footer span { color: #dce8f2 !important; }
footer .logo { filter: none !important; }

/* Motion supports hierarchy instead of competing with it. */
@media (prefers-reduced-motion: no-preference) {
  .intro-pitch { animation: sc-rise .6s ease-out both !important; }
  .world-stats > div { animation: sc-rise .55s ease-out both !important; }
  .world-stats > div:nth-child(2) { animation-delay: .08s !important; }
  .world-stats > div:nth-child(3) { animation-delay: .16s !important; }
  .world-stats > div:nth-child(4) { animation-delay: .24s !important; }
  .product:hover, .service-grid article:hover { transform: translateY(-5px) !important; box-shadow: 0 20px 42px rgba(16,36,62,.12) !important; }
}
@keyframes sc-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

@media (max-width: 820px) {
  header, .home-page header { min-height: 66px !important; }
  .nav { width: 100% !important; min-height: 66px !important; padding: 0 12px !important; justify-content: flex-start !important; overflow-x: auto !important; scrollbar-width: none; }
  .nav::-webkit-scrollbar { display: none; }
  .nav nav { min-width: max-content !important; gap: 18px !important; }
  .nav nav a { font-size: .86rem !important; padding: 22px 0 17px !important; }
  .languages { position: sticky !important; right: 0 !important; flex: 0 0 auto !important; padding-left: 10px !important; background: linear-gradient(90deg, transparent, #fff 22%) !important; }
  .world-banner { min-height: auto !important; gap: 34px !important; padding: 72px 16px 34px !important; }
  .world-banner::after { top: 34px !important; width: 140px !important; height: 7px !important; }
  .intro-pitch h1 { font-size: clamp(2.35rem, 12.5vw, 4rem) !important; }
  .intro-summary { font-size: 1rem !important; line-height: 1.55 !important; }
  .world-stats { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 10px !important; }
  .world-stats > div { min-height: 116px !important; padding: 16px 9px !important; }
  .world-stats b { font-size: 1.85rem !important; }
  .world-stats span { font-size: .8rem !important; }
  .world-stats small { font-size: .62rem !important; }
  .hero { padding: 22px 14px !important; }
  .search { border-radius: 18px !important; padding: 7px !important; display: grid !important; grid-template-columns: auto 1fr !important; }
  .search button { grid-column: 1 / -1 !important; width: 100% !important; margin-top: 7px !important; }
  .about-home { width: min(100% - 28px, 920px) !important; }
  .about-home > div { padding: 28px 20px !important; }
  .project-steps, .service-grid { grid-template-columns: 1fr !important; }
  .launch-panel { width: min(100% - 28px, 1180px) !important; border-radius: 22px !important; }
  .contact { grid-template-columns: 1fr !important; }
}

html body.home-page header.mobile-menu-ready .corner-brand,
html body.home-page header .corner-brand {
  display: flex !important;
}
@media (max-width: 820px) {
  html body.home-page header.mobile-menu-ready .corner-brand,
  html body.home-page header .corner-brand {
    position: absolute !important;
    top: 7px !important;
    left: 12px !important;
    width: 88px !important;
    height: 52px !important;
  }
  html body.home-page header.mobile-menu-ready .nav,
  html body.home-page header .nav { padding-left: 110px !important; }
}

/* Production refinement: visible brand, stronger project path and qualified briefs. */
.corner-brand,
header .nav > .logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 118px !important;
  width: 118px !important;
  height: 58px !important;
  padding: 4px 0 !important;
  overflow: visible !important;
  text-decoration: none !important;
}
.corner-brand {
  position: absolute !important;
  top: 9px !important;
  left: max(18px, calc((100% - 1180px) / 2)) !important;
  z-index: 4 !important;
}
.corner-brand img,
header .nav > .logo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  filter: drop-shadow(0 5px 10px rgba(16,36,62,.14)) !important;
}
.home-page header .nav { padding-left: 150px !important; }
header .nav > .logo { margin-right: 12px !important; }
html body.space-page header .logo { display: flex !important; }
header .nav nav { flex: 1 1 auto !important; }
header .nav nav a:last-child {
  min-height: 42px !important;
  margin-block: 10px !important;
  padding: 9px 17px !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: var(--sc-pink) !important;
  box-shadow: 0 8px 20px rgba(239,25,117,.18) !important;
}
header .nav nav a:last-child::after { display: none !important; }
header .nav nav a:last-child:hover,
header .nav nav a:last-child:focus-visible { background: var(--sc-pink-dark) !important; }

.sc-trust-strip {
  padding: 0 20px 76px !important;
  background: #fff !important;
}
.sc-trust-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.sc-trust-grid article {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 14px !important;
  padding: 22px !important;
  border: 1px solid var(--sc-line) !important;
  border-radius: 18px !important;
  background: var(--sc-paper) !important;
}
.sc-trust-grid span,
.service-number {
  color: var(--sc-pink) !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
}
.sc-trust-grid h3 { margin: 0 0 6px !important; font-size: 1rem !important; }
.sc-trust-grid p { margin: 0 !important; font-size: .92rem !important; line-height: 1.5 !important; }

.services-intro {
  max-width: 760px !important;
  margin: 0 auto 34px !important;
  text-align: center !important;
}
.project-steps-five {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  margin-bottom: 70px !important;
}
.project-steps-five article {
  min-height: 205px !important;
  padding: 24px 20px !important;
}
.project-steps-five h3 { margin-block: 12px 8px !important; }
.services-heading { max-width: 760px !important; margin: 0 auto 28px !important; text-align: center !important; }
.services-heading h2 { margin-top: 7px !important; }
.service-results article {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 430px !important;
  padding: 30px !important;
}
.service-results article > p { min-height: 76px !important; }
.service-results ul {
  display: grid !important;
  gap: 9px !important;
  margin: 2px 0 24px !important;
  padding: 0 !important;
  list-style: none !important;
}
.service-results li {
  position: relative !important;
  padding-left: 23px !important;
  color: var(--sc-muted) !important;
  font-size: .92rem !important;
  line-height: 1.45 !important;
}
.service-results li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--sc-cyan);
  font-weight: 900;
}
.service-results article > a { margin-top: auto !important; }
.service-cta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 26px !important;
  padding: 24px 28px !important;
  border-radius: 20px !important;
  background: var(--sc-navy) !important;
}
.service-cta p { max-width: 760px !important; margin: 0 !important; color: #e7eef5 !important; }
.service-cta .pink { flex: 0 0 auto !important; }

.contact select {
  width: 100% !important;
  min-height: 50px !important;
  padding: 12px 14px !important;
  color: var(--sc-ink) !important;
  background: #fff !important;
  border: 1px solid #bdcbd8 !important;
  border-radius: 13px !important;
  font: inherit !important;
}
.contact select:focus { border-color: var(--sc-cyan) !important; box-shadow: 0 0 0 4px rgba(8,169,197,.13) !important; outline: 0; }
.form-next-steps {
  margin-top: 18px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  color: var(--sc-ink) !important;
  background: #edf8fa !important;
  border: 1px solid #c9e8ed !important;
  font-size: .9rem !important;
  line-height: 1.5 !important;
}

footer .logo {
  display: flex !important;
  width: 132px !important;
  height: 72px !important;
  align-items: center !important;
}
footer .logo img { width: 100% !important; height: 100% !important; object-fit: contain !important; }

@media (max-width: 1080px) {
  .project-steps-five { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .project-steps-five article:nth-child(n+4) { min-height: 180px !important; }
}

@media (max-width: 820px) {
  .corner-brand,
  header .nav > .logo {
    display: flex !important;
    flex-basis: 88px !important;
    width: 88px !important;
    height: 52px !important;
  }
  .corner-brand { top: 7px !important; left: 12px !important; }
  .home-page header .nav { padding-left: 110px !important; }
  header .nav > .logo { margin-right: 4px !important; }
  header .nav nav a:last-child { min-height: 36px !important; margin-block: 13px !important; padding: 7px 12px !important; }
  .sc-trust-strip { padding: 0 14px 52px !important; }
  .sc-trust-grid { grid-template-columns: 1fr !important; }
  .home-page .project-steps-five { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .project-steps-five article { min-height: 170px !important; padding: 20px 16px !important; }
  .project-steps-five article:last-child { grid-column: 1 / -1 !important; min-height: auto !important; }
  .service-results article { min-height: 0 !important; }
  .service-results article > p { min-height: 0 !important; }
  .service-cta { align-items: stretch !important; flex-direction: column !important; }
  .service-cta .pink { width: 100% !important; }
}

@media (max-width: 430px) {
  .home-page .project-steps-five { grid-template-columns: 1fr !important; }
  .project-steps-five article:last-child { grid-column: auto !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* Defeat legacy preview selectors that previously forced the illustrated hero and mobile drawer. */
html body.home-page main .visual-intro .world-banner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 50px !important;
  min-height: min(720px, calc(100svh - 76px)) !important;
  height: auto !important;
  background:
    radial-gradient(circle at 13% 18%, rgba(8,169,197,.11), transparent 25%),
    radial-gradient(circle at 86% 13%, rgba(239,25,117,.11), transparent 26%),
    linear-gradient(150deg, #fff 0 62%, #fff5f9 100%) !important;
}
html body,
html body.home-page {
  background: var(--sc-paper) !important;
  background-image: none !important;
}
html body header,
html body.home-page header {
  background: rgba(255,255,255,.96) !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(16,36,62,.1) !important;
}
html body.home-page main .visual-intro .world-banner::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background-color: transparent !important;
  background-image: radial-gradient(rgba(8,169,197,.25) 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
  opacity: .2 !important;
  mask-image: linear-gradient(to bottom, #000 0, transparent 62%) !important;
  filter: none !important;
}
html body.home-page main .visual-intro .hero {
  min-height: 0 !important;
  height: auto !important;
  padding: 34px 20px !important;
  background: #eef7fa !important;
  background-image: none !important;
}
html body.home-page main .visual-intro .hero::before,
html body.home-page main .visual-intro .hero::after,
html body.home-page main .visual-intro .hero .hero-art { display: none !important; background-image: none !important; }
html body.home-page main .visual-intro .world-banner > img { display: none !important; visibility: hidden !important; }
html body.home-page main .visual-intro .world-banner .intro-pitch {
  grid-column: 1 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  opacity: 1 !important;
  order: 1 !important;
}
html body.home-page main .visual-intro .world-banner .world-stats {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  opacity: 1 !important;
  order: 2 !important;
  display: grid !important;
}
html body.home-page main .visual-intro .world-banner .world-stats > div {
  background: #fff !important;
  border: 1px solid var(--sc-line) !important;
  box-shadow: 0 14px 35px rgba(16,36,62,.08) !important;
  text-shadow: none !important;
}
html body.home-page main .visual-intro .world-banner .world-stats::before,
html body.home-page main .visual-intro .world-banner .world-stats::after {
  display: none !important;
  content: none !important;
  background: none !important;
  filter: none !important;
}
html body.home-page main .visual-intro .world-banner .world-stats b { text-shadow: none !important; }
html body.home-page main .visual-intro .world-banner .world-stats span {
  color: var(--sc-ink) !important;
  text-shadow: none !important;
}
html body.home-page main .visual-intro .world-banner .world-stats small {
  color: var(--sc-muted) !important;
  text-shadow: none !important;
}
html body.home-page main .visual-intro .world-banner .intro-pitch .intro-kicker {
  color: var(--sc-pink-dark) !important;
  text-shadow: none !important;
}
html body.home-page main .visual-intro .world-banner .intro-pitch h1,
html body.home-page main .visual-intro .world-banner .intro-pitch h1 * {
  color: var(--sc-ink) !important;
  text-shadow: none !important;
}
html body.home-page main .visual-intro .world-banner .intro-pitch h1 span { color: var(--sc-pink) !important; }
html body.home-page main .visual-intro .world-banner .intro-pitch .intro-summary {
  color: #3f5268 !important;
  text-shadow: none !important;
}
html body.home-page .trend-watch,
html body.home-page .proof-space,
html body.home-page .contact-world-map,
html body.home-page .about-home > img { display: none !important; }
html body header .nav nav a,
html body.home-page header .nav nav a {
  color: var(--sc-ink) !important;
  text-shadow: none !important;
  filter: none !important;
}
html body h1, html body h2, html body h3, html body h4 { text-shadow: none !important; }
html body.home-page .about-home p { color: var(--sc-muted) !important; text-shadow: none !important; }
html body.home-page .about-home .about-lead { color: var(--sc-ink) !important; }
html body.home-page .combined-services .service-grid article {
  background: #fff !important;
  background-image: none !important;
  color: var(--sc-ink) !important;
  border: 1px solid var(--sc-line) !important;
  box-shadow: 0 14px 36px rgba(16,36,62,.07) !important;
}
html body.home-page .combined-services .service-grid article h3 { color: var(--sc-ink) !important; }
html body.home-page .combined-services .service-grid article p { color: var(--sc-muted) !important; }
html body.home-page .catalogue .catalogue-note { color: var(--sc-muted) !important; text-shadow: none !important; }
html body.home-page .catalogue .filters a,
html body.home-page .catalogue .filters button {
  color: var(--sc-ink) !important;
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--sc-line) !important;
  box-shadow: none !important;
}
html body.home-page .catalogue .filters a:hover,
html body.home-page .catalogue .filters a.active,
html body.home-page .catalogue .filters button:hover,
html body.home-page .catalogue .filters button.active {
  color: #fff !important;
  background: var(--sc-ink) !important;
  border-color: var(--sc-ink) !important;
}
html body.home-page .catalogue .product,
html body.home-page .catalogue .product-body {
  background: #fff !important;
  background-image: none !important;
  color: var(--sc-ink) !important;
}
html body.home-page .catalogue .product h3 { color: var(--sc-ink) !important; }
html body.home-page .catalogue .product p { color: var(--sc-muted) !important; }

@media (max-width: 820px) {
  html body header .nav > nav {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: max-content !important;
    height: 66px !important;
    min-height: 66px !important;
    visibility: visible !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    opacity: 1 !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
    gap: 12px !important;
  }
  html body header .nav > nav a {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 22px 0 17px !important;
    font-size: .875rem !important;
  }
  html body header .nav > button,
  html body header .nav .menu-toggle,
  html body header .nav .mobile-menu-toggle { display: none !important; }
  html body.home-page main .visual-intro .world-banner { min-height: 680px !important; height: auto !important; padding: 72px 16px 34px !important; gap: 34px !important; }
  html body.home-page main .visual-intro .world-banner .world-stats { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}

/* Final specificity layer for the navigation action. */
html body header .nav nav a:last-child {
  min-height: 42px !important;
  margin-block: 10px !important;
  padding: 9px 17px !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: var(--sc-pink) !important;
}
html body header .nav nav a:last-child:hover,
html body header .nav nav a:last-child:focus-visible { background: var(--sc-pink-dark) !important; }

@media (max-width: 820px) {
  html body header .nav nav a:last-child {
    min-height: 36px !important;
    margin-block: 13px !important;
    padding: 7px 12px !important;
  }
  html body.home-page header .nav > nav {
    margin-left: 104px !important;
  }
}

/* Final contrast corrections after the legacy theme layers. */
html body.home-page #catalogue .section-heading h2,
html body.home-page #catalogue .section-heading h2 em {
  color: var(--sc-ink) !important;
  opacity: 1 !important;
}
html body.home-page #catalogue .product-body {
  background: #fff !important;
  background-image: none !important;
  color: var(--sc-ink) !important;
}
html body.home-page #catalogue .product-body h3 { color: var(--sc-ink) !important; }
html body.home-page #catalogue .product-body p { color: var(--sc-muted) !important; }
.brief-assistant h3,
.brief-assistant summary,
.brief-assistant strong { color: #fff !important; }
.brief-assistant .brief-help,
.brief-assistant .brief-progress-label,
.brief-assistant .brief-copy-status { color: #d8e5f0 !important; }

html body footer,
html body.home-page footer {
  min-height: 0 !important;
  padding: 38px 0 28px !important;
  background: linear-gradient(135deg, #0d213a 0%, #153a5b 68%, #4a2048 100%) !important;
  background-image: linear-gradient(135deg, #0d213a 0%, #153a5b 68%, #4a2048 100%) !important;
  border-top: 4px solid var(--sc-pink) !important;
  box-shadow: none !important;
}
html body footer::before,
html body footer::after { display: none !important; content: none !important; }
html body footer *,
html body footer a,
html body footer span,
html body footer small {
  color: #edf5fb !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html body footer .footer-inner,
html body footer .documents,
html body footer .contact-channels,
html body footer .legal-links { position: relative !important; z-index: 1 !important; }

/* Homepage hero with a real Shanghai photograph. */
html body.home-page main .visual-intro .world-banner {
  display: grid !important;
  grid-template-columns: minmax(0, 600px) minmax(340px, 500px) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 44px 54px !important;
  padding: clamp(56px, 7vw, 92px) max(20px, calc((100% - 1180px) / 2)) 48px !important;
}
html body.home-page main .visual-intro .world-banner .intro-pitch {
  width: 100% !important;
  max-width: 600px !important;
  margin: 0 !important;
  text-align: left !important;
}
html body.home-page main .visual-intro .world-banner .intro-pitch h1,
html body.home-page main .visual-intro .world-banner .intro-pitch .intro-summary {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}
html body.home-page main .visual-intro .world-banner .intro-actions { justify-content: flex-start !important; }
.hero-city {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  width: 100% !important;
  max-width: 500px !important;
  aspect-ratio: 4 / 5 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background: var(--sc-navy) !important;
  border: 1px solid rgba(16,36,62,.12) !important;
  box-shadow: 0 28px 65px rgba(16,36,62,.20) !important;
}
.hero-city::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 60%, rgba(5,20,40,.72));
}
.hero-city img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 55% !important;
}
.hero-city figcaption {
  position: absolute;
  left: 22px;
  bottom: 17px;
  z-index: 2;
  color: #fff !important;
  font-size: .76rem !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
}
html body.home-page main .visual-intro .world-banner .world-stats {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
}

@media (max-width: 900px) {
  html body.home-page main .visual-intro .world-banner {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    gap: 30px !important;
    padding: 56px 16px 34px !important;
  }
  html body.home-page main .visual-intro .world-banner .intro-pitch {
    grid-column: 1 !important;
    grid-row: 1 !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
  html body.home-page main .visual-intro .world-banner .intro-pitch h1,
  html body.home-page main .visual-intro .world-banner .intro-pitch .intro-summary {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
  html body.home-page main .visual-intro .world-banner .intro-actions { justify-content: center !important; }
  .hero-city {
    grid-column: 1 !important;
    grid-row: 2 !important;
    max-width: 520px !important;
    aspect-ratio: 4 / 3 !important;
    margin: 0 auto !important;
    border-radius: 22px !important;
  }
  .hero-city img { object-position: center 55% !important; }
  html body.home-page main .visual-intro .world-banner .world-stats {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
}

@media (max-width: 520px) {
  .hero-city { aspect-ratio: 1 / 1 !important; }
  .hero-city figcaption { left: 16px; bottom: 13px; }
}

/* Keep the desktop-style navigation readable on narrow screens without allowing links beneath the logo. */
@media (max-width: 900px) {
  html body.home-page header .nav {
    justify-content: flex-start !important;
    padding-left: 110px !important;
  }
  html body.home-page header .nav > nav {
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    transform: none !important;
    justify-content: flex-start !important;
  }
  html body.home-page header .languages { flex: 0 0 auto !important; }
}

/* Slightly larger Shanghai visual, with the skyline kept clear of the top crop. */
@media (min-width: 901px) {
  html body.home-page main .visual-intro .world-banner {
    grid-template-columns: minmax(0, 590px) minmax(380px, 540px) !important;
    gap: 44px 58px !important;
    padding-top: clamp(74px, 7vw, 104px) !important;
  }

  .hero-city {
    max-width: 540px !important;
    aspect-ratio: 3 / 4 !important;
  }

  .hero-city img {
    object-position: center 42% !important;
  }
}

@media (max-width: 900px) {
  .hero-city img {
    object-position: center 42% !important;
  }

  html body.home-page > header.mobile-menu-ready .nav,
  html body.home-page > header.mobile-menu-ready.menu-open .nav {
    justify-content: flex-start !important;
  }
}

/* Clear separation below the navigation and a lighter language selector. */
html body.home-page header .language-toggle,
html body.home-page header .languages > .language-toggle {
  min-width: 0 !important;
  padding: 5px !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.home-page header .language-toggle:hover,
html body.home-page header .language-toggle:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
}

html body.home-page header .language-toggle svg {
  width: 30px !important;
  height: 20px !important;
  border-radius: 2px !important;
  box-shadow: 0 2px 7px rgba(16, 36, 62, .16) !important;
}

html body.home-page header .language-toggle .caret {
  display: none !important;
}

html body.home-page main .visual-intro .intro-pitch h1 span {
  color: #e63876 !important;
  -webkit-text-fill-color: #e63876 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .5) !important;
}

html body.home-page main .visual-intro .intro-kicker {
  color: #bd1550 !important;
}

html body.home-page main .visual-intro .intro-summary {
  color: #263d53 !important;
  opacity: 1 !important;
}

@media (min-width: 901px) {
  html body.home-page main .visual-intro .world-banner {
    padding-top: clamp(124px, 9vw, 144px) !important;
  }
}

@media (max-width: 900px) {
  html body.home-page main .visual-intro .world-banner {
    padding-top: 86px !important;
  }
}

/* Open language menu: flags only, without a white dropdown card. */
html body header .language-options,
html body.home-page header .language-options {
  right: -4px !important;
  top: 0 !important;
  min-width: 0 !important;
  width: auto !important;
  padding: 2px !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body header .language-toggle[aria-expanded="true"] svg,
html body.home-page header .language-toggle[aria-expanded="true"] svg {
  opacity: 0 !important;
}

html body header .language-options:not([hidden]),
html body.home-page header .language-options:not([hidden]) {
  display: flex !important;
  align-items: center !important;
}

html body header .language-options button,
html body.home-page header .language-options button {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 3px !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body header .language-options button span,
html body.home-page header .language-options button span {
  display: none !important;
}

html body header .language-options button svg,
html body.home-page header .language-options button svg {
  width: 30px !important;
  height: 20px !important;
  border-radius: 2px !important;
  box-shadow: 0 2px 7px rgba(16, 36, 62, .16) !important;
}

html body header .language-options button:hover,
html body.home-page header .language-options button:hover {
  transform: translateY(-1px) scale(1.06) !important;
  background: transparent !important;
}

/* Position the primary header action in the visual centre between FAQ and language. */
html body.home-page header .nav > nav > a:last-child {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1.15 !important;
}

@media (min-width: 1200px) {
  html body.home-page header .nav > nav > a:last-child {
    transform: translateX(clamp(40px, 4.55vw, 66px)) !important;
  }
}

@media (min-width: 901px) and (max-width: 1199px) {
  html body.home-page header .nav {
    padding-left: 100px !important;
  }

  html body.home-page header .nav > nav {
    flex-wrap: nowrap !important;
    gap: clamp(10px, 1.4vw, 18px) !important;
    white-space: nowrap !important;
  }

  html body.home-page header .nav > nav > a:last-child {
    transform: translateX(clamp(14px, 1.75vw, 21px)) !important;
  }
}