/* VUZURAN /app experiment. Remove its two app.html tags to undo.
   The attribute is deliberately absent from Studio and all authenticated apps. */
html:root[data-vz-infra-theme="pearl"] {
  --infra-paper: #f8f8f5;
  --infra-surface: #ffffff;
  --infra-soft: #eeefeb;
  --infra-ink: #232725;
  --infra-muted: #606862;
  --infra-line: #23272524;
  --infra-mist: #e6edf0;
  --infra-linen: #eee9e2;
  --vz-paper: var(--infra-paper);
  --vz-surface: var(--infra-soft);
  --vz-ink: var(--infra-ink);
  --vz-muted: var(--infra-muted);
  --vz-accent: var(--infra-ink);
  --vz-line: var(--infra-line);
  background: var(--infra-paper);
  color-scheme: light;
  accent-color: var(--infra-ink);
  caret-color: var(--infra-ink);
  scrollbar-color: #858c86 var(--infra-paper);
}
html:root[data-vz-infra-theme="pearl"] body,
html:root[data-vz-infra-theme="pearl"] .page-wrapper,
html:root[data-vz-infra-theme="pearl"] .main-wrapper {
  background: var(--infra-paper) !important;
  color: var(--infra-ink);
}
html:root[data-vz-infra-theme="pearl"] body :is(#integrations,#metrics,#about,#process,#pricing,#testimonials,#contact,#journal,#faq,.vk-process,.vk-faq,.vz-video-proof,.vz-contact-globe) {
  background-color: var(--infra-paper) !important;
  color: var(--infra-ink) !important;
}

/* Let the cinematic hero resolve into the same paper as the rest of the page.
   No media filters or changes to image/video sources. */
html:root[data-vz-infra-theme="pearl"] .vk-hero { background: var(--infra-paper); }
html:root[data-vz-infra-theme="pearl"] .vk-hero-shade {
  background: linear-gradient(180deg,#17242b45 0%,#182b3459 65%,#f8f8f5 100%) !important;
}
html:root[data-vz-infra-theme="pearl"] .vk-hero .vk-hero-watermark { color: #ffffff20 !important; }
html:root[data-vz-infra-theme="pearl"] .vk-hero h1 { letter-spacing: -.035em !important; }
html:root[data-vz-infra-theme="pearl"] .vk-hero-start > span[aria-hidden] {
  background: linear-gradient(145deg,#f1eee5,#dbe7e8) !important;
  box-shadow: inset 0 1px 0 #ffffffa0 !important;
}

/* One quiet, repeating material—not a different theme for every section. */
html:root[data-vz-infra-theme="pearl"] body #services.vz-ai-services {
  --service-ink: var(--infra-ink);
  --service-muted: var(--infra-muted);
  --service-line: var(--infra-line);
  --service-sage: var(--infra-ink);
  background: linear-gradient(180deg,var(--infra-paper),transparent 22%,transparent 78%,var(--infra-paper)),radial-gradient(ellipse at 0% 40%,#e6edf0b3,transparent 70%),radial-gradient(ellipse at 100% 65%,#eee9e2b3,transparent 70%),var(--infra-paper) !important;
  color: var(--infra-ink) !important;
}
html:root[data-vz-infra-theme="pearl"] body #services.vz-ai-services::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background: url('/media/premium-grain.png') repeat;
  background-size: 180px;
  opacity: .025;
  mask-image: linear-gradient(transparent,#000 20%,#000 80%,transparent);
}
html:root[data-vz-infra-theme="pearl"] body #services :is(h2,h3,summary) { color: var(--infra-ink) !important; }
html:root[data-vz-infra-theme="pearl"] body #services :is(header>p,.vz-ai-service-body>p) { color: var(--infra-muted) !important; }
html:root[data-vz-infra-theme="pearl"] body #services :is(.vz-ai-service,.vz-ai-service:last-of-type) { border-color: var(--infra-line) !important; }
html:root[data-vz-infra-theme="pearl"] body #services :is(.vz-ai-service-body li,.vz-ai-context-tags .vz-ai-tag) {
  background: #ffffffa6 !important;
  border: 1px solid var(--infra-line) !important;
  color: var(--infra-ink) !important;
  box-shadow: none !important;
  border-radius: 999px;
}
html:root[data-vz-infra-theme="pearl"] body #services :is(header>a,.vz-service-intro>a) {
  color: var(--infra-ink) !important;
  text-decoration-color: var(--infra-ink);
}
html:root[data-vz-infra-theme="pearl"] body #services .vz-service-toggle { background: var(--infra-soft); color: var(--infra-ink); }
html:root[data-vz-infra-theme="pearl"] body #services summary > svg:first-child { color: var(--infra-muted) !important; }

/* Integration tiles keep their real brand marks; only the UI chrome changes. */
html:root[data-vz-infra-theme="pearl"] .vz-integ-grid { opacity: .3; }
html:root[data-vz-infra-theme="pearl"] .vz-integ-fade-left { background: linear-gradient(90deg,var(--infra-paper),transparent) !important; }
html:root[data-vz-infra-theme="pearl"] .vz-integ-fade-right { background: linear-gradient(270deg,var(--infra-paper),transparent) !important; }
html:root[data-vz-infra-theme="pearl"] .vz-integ-pod { background: var(--infra-surface) !important; border-color: var(--infra-line) !important; box-shadow: none !important; }
html:root[data-vz-infra-theme="pearl"] :is(.vk-process,.section_home1_about,.section_home1_process,.section_home1_pricing,#journal,.vk-faq,.vz-video-proof) :is(h2,h3,h4) { color: var(--infra-ink) !important; }
html:root[data-vz-infra-theme="pearl"] :is(.vk-process,.section_home1_about,.section_home1_process,.section_home1_pricing,#journal,.vk-faq,.vz-video-proof) :is(p,.text-style-muted60,.text-style-muted,.bac-header-desc,.bac-card-desc) { color: var(--infra-muted) !important; }
html:root[data-vz-infra-theme="pearl"] :is(.home1_about_card,.home1_process_card,.vk-step-pill) { border-color: var(--infra-line) !important; }

/* Pricing stays a real pricing section, with the same plans and actions. */
html:root[data-vz-infra-theme="pearl"] body #pricing .home1_pricing_box {
  background: linear-gradient(125deg,#e6edf080,#eee9e280),var(--infra-paper) !important;
  color: var(--infra-ink) !important;
  border: 1px solid var(--infra-line);
}
html:root[data-vz-infra-theme="pearl"] body #pricing .home1_pricing_card {
  background: #fffffff0 !important;
  color: var(--infra-ink) !important;
  border-color: var(--infra-line) !important;
  box-shadow: none !important;
}
html:root[data-vz-infra-theme="pearl"] body #pricing :is(.text-style-badge,.pricing_price,.pricing_support-box,.vz-support-wordmark) { color: var(--infra-ink) !important; }
html:root[data-vz-infra-theme="pearl"] body #pricing .noise { opacity: .025 !important; pointer-events: none; }
html:root[data-vz-infra-theme="pearl"] body #pricing .pricing_list-item img { filter: brightness(.25); }
/* The mounted React pricing stage replaces the initial HTML near viewport. */
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-pricing { background: var(--infra-paper) !important; }
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-stage {
  background: linear-gradient(125deg,#e6edf080,#eee9e280),var(--infra-paper) !important;
  border: 1px solid var(--infra-line) !important;
}
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-shade { background: transparent !important; }
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-intro,
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-intro h2 { color: var(--infra-ink) !important; }
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-intro p { color: var(--infra-muted) !important; }
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-card {
  color: var(--infra-ink) !important;
  background: #fffffff0 !important;
  border: 1px solid var(--infra-line) !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-card :is(p,small) { color: var(--infra-muted) !important; opacity: 1 !important; }
html:root[data-vz-infra-theme="pearl"] body #pricing .vk-price-card .vk-button { background: var(--infra-ink) !important; color: white !important; }
html:root[data-vz-infra-theme="pearl"] body #contact :is(input,textarea) { background: var(--infra-surface) !important; color: var(--infra-ink) !important; border-color: var(--infra-line) !important; }
html:root[data-vz-infra-theme="pearl"] body #contact :is(input,textarea)::placeholder { color: var(--infra-muted) !important; opacity: 1; }

/* Identical action hierarchy throughout, without changing hover choreography. */
html:root[data-vz-infra-theme="pearl"] body :is(.vz-integ-btn,#pricing .button,#contact .button,#vz-contact-globe-form button[type=submit],.vzdi-cta) {
  background: var(--infra-ink) !important;
  color: #fff !important;
  border-color: var(--infra-ink) !important;
  box-shadow: none !important;
}
html:root[data-vz-infra-theme="pearl"] body #pricing .button.is-secondary { background: transparent !important; color: var(--infra-ink) !important; border: 1px solid var(--infra-line) !important; }

/* The shared cinematic footer is adapted only on this route. */
html:root[data-vz-infra-theme="pearl"] .vk-footer { background: var(--infra-paper) !important; color: var(--infra-ink) !important; }
html:root[data-vz-infra-theme="pearl"] .vk-footer::before { background:transparent!important; }
html:root[data-vz-infra-theme="pearl"] .vk-footer-scrim { background:transparent!important; }
html:root[data-vz-infra-theme="pearl"] .vk-footer-glass { background:var(--infra-paper)!important; border:0!important; box-shadow:none!important;backdrop-filter:none!important; }
html:root[data-vz-infra-theme="pearl"] .vk-footer :is(h2,h3,a,.vk-brand) { color: var(--infra-ink) !important; }
html:root[data-vz-infra-theme="pearl"] .vk-footer :is(p,small,.vk-footer-bottom) { color: var(--infra-muted) !important; border-color: var(--infra-line) !important; }
html:root[data-vz-infra-theme="pearl"] .vk-footer-news form { background: #ffffffd9; border-color: var(--infra-line); }
html:root[data-vz-infra-theme="pearl"] .vk-footer-news input { color: var(--infra-ink); }
html:root[data-vz-infra-theme="pearl"] .vk-footer-news input::placeholder { color: var(--infra-muted); }
html:root[data-vz-infra-theme="pearl"] .vk-footer-news button { background: var(--infra-ink); color: #fff; }
/* Shade belongs to the text plate, never over the landscape. */
html:root[data-vz-infra-theme="pearl"] .vk-footer .vk-footer-news h2 {color:white!important;text-shadow:0 2px 18px #10201bc0;}
html:root[data-vz-infra-theme="pearl"] .vk-footer .vk-news-consent {color:white!important;text-shadow:0 1px 6px #10201b;}
html:root[data-vz-infra-theme="pearl"] body #integrations {border-block:0!important;}
html:root[data-vz-infra-theme="pearl"] img[src^="/media/editorial/"] {object-fit:contain!important;background:var(--infra-soft);}
html:root[data-vz-infra-theme="pearl"] .vk-socials a { border-color: var(--infra-line); }
html:root[data-vz-infra-theme="pearl"] .vk-socials a:hover { background: var(--infra-soft); }
html:root[data-vz-infra-theme="pearl"] body :focus-visible { outline: 2px solid #4f6258 !important; outline-offset: 4px; }
html:root[data-vz-infra-theme="pearl"] ::selection { background: #dce6e2; color: #232725; }
@media (prefers-contrast: more) {
  html:root[data-vz-infra-theme="pearl"] { --infra-muted: #454c47; --infra-line: #68716a; }
}

/* Match the footer text plate to the continuous public surface. */
html:root[data-vz-infra-theme="pearl"] body #footer .vk-footer-glass{background:linear-gradient(120deg,#eff4f8,#faf5f7 55%,#f6f1e7)!important;color:#25323b!important}
html:root[data-vz-infra-theme="pearl"] body #footer .vk-footer-glass :is(a,p,small,.vk-footer-bottom){color:#4a5862!important;opacity:1!important}
html:root[data-vz-infra-theme="pearl"] body #footer .vk-footer-glass :is(h3,.vk-brand){color:#202b32!important}
html:root[data-vz-infra-theme="pearl"] body #footer .vk-footer-scrim{background:linear-gradient(0deg,transparent 45%,#152d374d)!important}
html:root[data-vz-infra-theme="pearl"] body #footer .vk-news-consent{background:#21353bcc!important;color:#fff!important;padding:6px 12px;border-radius:20px;text-shadow:none!important}