/* Refine the established Professional preview, using the contact panel's
   original dark-plum material. White product scenes and supplied art retain
   their own surfaces; these are not recoloured by the page canvas. */
:root {
  --bg: #000;
  --contact-purple-glow: #3c15b266;
  --contact-purple-base: #0e1015;
  --contact-purple-material: radial-gradient(ellipse at 75% 130%, var(--contact-purple-glow), transparent 60%), var(--contact-purple-base);
}
.professional-page {background:#000;}
.professional-page .contact,
.professional-page .nav-cta,
.professional-page .contact .star-cta {
  background:var(--contact-purple-material);
}
.professional-page .nav-cta,
.professional-page .contact .star-cta {
  color:#fff;
  border-color:#8875bc;
  box-shadow:inset 0 -10px 17px -14px #673de6, inset 0 1px 0 #ffffff18, 0 6px 20px #0005;
}
/* The headline belongs to the black laptop chapter; the logos below belong
   to the plum chapter. Both keep one accessible heading relationship. */
.crm-introduction {background:#000;padding:40px 0 74px;position:relative;}
.crm-introduction h2,
.services-intro h2 {
  font-family:'Inter Tight',Arial,sans-serif;
  font-size:clamp(42px,4.2vw,60px);
  font-weight:400;
  line-height:1.13;
  letter-spacing:-.025em;
  color:#fff;
  text-wrap:balance;
}
.crm-introduction h2 {max-width:1050px;margin:0 auto;text-align:center;}
.crm-introduction h2 em,
.services-intro h2 em {font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-style:italic;letter-spacing:0;}
.performance-zone {padding-top:0;}
.performance-background {
  /* Same plum pigment and soft radial falloff as the original bottom panel,
     distributed through the taller chapter instead of a flat saturated fill. */
  background:
    radial-gradient(ellipse at 75% 12%,var(--contact-purple-glow),transparent 48%),
    radial-gradient(ellipse at 75% 76%,var(--contact-purple-glow),transparent 60%),
    var(--contact-purple-base);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 80px,#000 calc(100% - 130px),transparent);
  mask-image:linear-gradient(180deg,transparent,#000 80px,#000 calc(100% - 130px),transparent);
}
.professional-page .performance-zone .platforms {padding:62px 0 46px;background:transparent;}
.performance-intro {padding-top:58px;padding-bottom:100px;align-items:center;}
.performance-visual {aspect-ratio:3/4;background:transparent;border-radius:0;overflow:visible;}
.performance-visual img {width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;object-position:center;padding:0;mix-blend-mode:normal;}
.performance-data {padding-bottom:150px;}
.data-context {font-size:22px;line-height:1.5;max-width:800px;color:#ede6f8;}
.data-heading {max-width:850px;}
.performance-stat dt {font-size:20px;line-height:1.4;}
/* The plum chapter ends before this intro. Preserve all seven image cards. */
.services-section {background:#000;padding-top:72px;padding-bottom:130px;}
.services-intro {max-width:880px;margin:0 auto 94px;text-align:center;}
.services-intro h2 {margin:0 0 28px;}
.services-intro p {font:400 22px/1.5 'Inter Tight',Arial,sans-serif;color:#e2dfe8;max-width:750px;margin:0 auto;text-wrap:pretty;}
.services-section > h2 {font:400 52px/1.15 'Inter Tight',Arial,sans-serif;letter-spacing:-.025em;margin-bottom:52px;color:#fff;}
.footer-bottom {flex-wrap:wrap;}
.footer-bottom .draft-claims-note {flex-basis:100%;font-size:12px;line-height:1.5;color:#a4a5af;}
@media(max-width:900px) {
  .crm-introduction {padding:30px 0 58px;}
  .crm-introduction h2,.services-intro h2 {font-size:40px;}
  .performance-intro {padding-top:40px;}
  .services-section {padding-top:58px;padding-bottom:95px;}
  .services-intro {margin-bottom:70px;}
  .services-section > h2 {font-size:44px;}
}
@media(max-width:700px) {
  .performance-visual {max-width:540px;aspect-ratio:3/4;}
  .performance-visual img {padding:0;}
}
@media(max-width:640px) {
  .crm-introduction {padding:30px 0 40px;}
  .crm-introduction h2,.services-intro h2 {font-size:40px;line-height:1.15;}
  .professional-page .performance-zone .platforms {padding:40px 0 32px;}
  .performance-intro {padding:34px 0 70px;}
  .data-context,.services-intro p {font-size:18px;line-height:1.5;}
  .performance-data {padding-bottom:105px;}
  .performance-stat dt {font-size:18px;}
  .services-section {padding-top:40px;padding-bottom:85px;}
  .services-intro {margin-bottom:64px;}
  .services-intro h2 {margin-bottom:22px;}
  .services-section > h2 {font-size:38px;margin-bottom:34px;}
}
@media(max-width:360px) {
  .crm-introduction h2,.services-intro h2 {font-size:36px;}
  .services-section > h2 {font-size:34px;}
}