/* Panaccess Datacenter Service visual alignment | 27 October 2026
   Matches the Content Contribution service-page palette and section rhythm.
   Scoped to the Datacenter Service page; other services are unchanged. */
.panaccess-dc-page {
  --dc-pink: var(--global-palette1, #e21e51);
  --dc-violet: var(--global-palette2, #4d40ff);
  --dc-navy: var(--global-palette3, #040037);
  --dc-muted: var(--global-palette5, #514d7c);
  --dc-surface: #f0eff7;
  --dc-white: #fff;
  background: var(--dc-white);
  overflow: clip;
  color: var(--dc-navy);
}
.panaccess-dc-page *, .panaccess-dc-page *::before, .panaccess-dc-page *::after { box-sizing: border-box; }
/* Identical gradient family, centered headline and layered wave as the service titles. */
.panaccess-dc-page .panaccess-dc-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 535px;
  padding: clamp(9.3rem, 13vw, 12rem) 1.75rem clamp(8rem, 10vw, 10rem);
  text-align: center;
  background: linear-gradient(90deg, var(--dc-pink) 12%, var(--dc-violet) 100%);
  color: #fff;
}
.panaccess-dc-page .panaccess-dc-hero-inner { width: min(100%, 1040px); max-width: 1040px; margin-inline: auto; position:relative; z-index:1; }
.panaccess-dc-page .panaccess-dc-hero h1 { font-size: clamp(3rem, 5.2vw, 4.3rem); font-weight: 500; line-height: 1.14; margin: .8rem 0 1.2rem; color: #fff; letter-spacing: -.035em; text-shadow: 1px 1px 2px rgb(0 0 0 / 12%); }
.panaccess-dc-page .panaccess-dc-hero p:not(.panaccess-dc-eyebrow) { max-width: 800px; margin: 0 auto 1.1rem; font-size: clamp(1.08rem, 1.7vw, 1.42rem); line-height: 1.56; color:#fff; }
.panaccess-dc-page .panaccess-dc-hero .panaccess-dc-eyebrow { margin:0 auto; opacity:.92; letter-spacing:.18em; font-size:.8rem; color:white; }
.panaccess-dc-page .panaccess-dc-hero .panaccess-dc-button { background:white; color:#07206e!important; border-radius:60px; padding:.86rem 1.8rem; margin:1.65rem auto 0; box-shadow:0 6px 20px rgba(20, 0, 50, .1); }
.panaccess-dc-page .panaccess-dc-hero .panaccess-dc-button:hover {background:#eeeaff;}
.panaccess-dc-hero-wave { position:absolute; z-index:0; width:100%; bottom:-1px; left:0; height:clamp(64px, 7vw, 104px); pointer-events:none; }
.panaccess-dc-hero-wave svg { display:block; height:100%; width:100%; }
.panaccess-dc-hero-wave path:first-child { fill:#f3f2f9; }
.panaccess-dc-hero-wave path:last-child { fill:#fff; }
/* Full-width bands with the same pale background as Content Contribution. */
.panaccess-dc-page .panaccess-dc-content { width:100%; max-width:none; padding:0!important; margin:0; }
.panaccess-dc-page .panaccess-dc-intro {
  width:min(1200px, calc(100% - 3rem));
  max-width:1200px;
  margin:0 auto;
  padding:clamp(4rem, 7vw, 6.5rem) 0 clamp(5rem, 7vw, 7rem);
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap:clamp(2.4rem, 5vw, 5.2rem);
}
.panaccess-dc-page .panaccess-dc-intro h2, .panaccess-dc-page .panaccess-dc-services h2, .panaccess-dc-page .panaccess-dc-gallery h2, .panaccess-dc-page .panaccess-dc-workflow h2 { font-size:clamp(2rem, 3.15vw, 3rem); letter-spacing:-.025em; font-weight:650; }
.panaccess-dc-page .panaccess-dc-intro p { font-size:1.04rem; line-height:1.8; color:var(--dc-muted); }
.panaccess-dc-page .panaccess-dc-intro > img { height:clamp(360px, 37vw, 490px); object-fit:cover; border-radius:16px; box-shadow:0 18px 42px rgba(12, 9, 54, .16); }
.panaccess-dc-page .panaccess-dc-badges span { background:#f2eff9; color:#343181; border-radius:30px; font-size:.85rem; }
.panaccess-dc-page .panaccess-dc-eyebrow { color:var(--dc-pink); font-weight:700; letter-spacing:.13em; font-size:.75rem; }
.panaccess-dc-page .panaccess-dc-services {
  position:relative;
  background:var(--dc-surface);
  width:100%;
  padding:clamp(5rem, 8vw, 7.2rem) max(1.5rem, calc((100vw - 1160px)/2)) clamp(5rem, 8vw, 7.4rem);
  margin:0;
}
.panaccess-dc-page .panaccess-dc-services::before {
  content:""; position:absolute; top:-42px; left:0; width:100%; height:43px;
  background:var(--dc-surface); clip-path: polygon(0 75%, 17% 50%, 35% 75%, 55% 20%, 78% 62%, 100% 32%, 100% 100%, 0 100%);
}
.panaccess-dc-page .panaccess-dc-services h2 { max-width:800px; margin:0 0 2.25rem; }
.panaccess-dc-page .panaccess-dc-grid { gap:1.4rem; }
.panaccess-dc-page .panaccess-dc-grid article { background:#fff; border:1px solid rgba(11, 9, 76, .055); box-shadow:0 9px 23px rgba(30, 17, 72, .045); border-radius:15px; padding:2rem 1.85rem; min-height:230px; }
.panaccess-dc-page .panaccess-dc-grid h3 {font-size:1.26rem; letter-spacing:-.012em;}
.panaccess-dc-page .panaccess-dc-grid p { color:var(--dc-muted); font-size:.97rem; line-height:1.65; }
.panaccess-dc-page .panaccess-dc-card-icon { width:54px; height:54px; border-radius:50%; background:var(--dc-pink); font-size:.98rem; }
/* Feature band echoes the original magenta service headers without losing text legibility. */
.panaccess-dc-page .panaccess-dc-workflow {
  padding:clamp(5rem, 7vw, 6.7rem) max(1.5rem, calc((100vw - 1160px)/2));
  margin:0; border:0;
  background:linear-gradient(110deg, #de2056 0%, #92309f 56%, #5940dd 100%);
  color:#fff;
}
.panaccess-dc-page .panaccess-dc-workflow .panaccess-dc-eyebrow { color:#fff; opacity:.9; }
.panaccess-dc-page .panaccess-dc-workflow h2 { color:#fff; margin:.35rem 0 1rem; }
.panaccess-dc-page .panaccess-dc-workflow-lead { color:rgba(255,255,255,.93); max-width:820px; }
.panaccess-dc-page .panaccess-dc-workflow-steps { margin-top:2.3rem; gap:1.35rem; }
.panaccess-dc-page .panaccess-dc-workflow-steps article { background:#fff; color:var(--dc-navy); box-shadow:0 8px 27px rgba(16,7,52,.14); border:0; border-radius:15px; padding:2rem; }
.panaccess-dc-page .panaccess-dc-workflow-steps h3 {color:var(--dc-navy);}
.panaccess-dc-page .panaccess-dc-workflow-steps p {color:var(--dc-muted); line-height:1.68;}
.panaccess-dc-page .panaccess-dc-workflow-steps span {color:var(--dc-pink);}
.panaccess-dc-page .panaccess-dc-gallery {background:#f4f3f9; width:100%; margin:0; padding:clamp(5rem, 7vw, 6.8rem) max(1.5rem, calc((100vw - 1160px)/2));}
.panaccess-dc-page .panaccess-dc-gallery h2 {margin:.4rem 0 2.3rem; max-width:850px;}
.panaccess-dc-page .panaccess-dc-gallery-grid {gap:1.35rem;}
.panaccess-dc-page .panaccess-dc-gallery-grid article {background:#fff; border:1px solid rgba(18,9,65,.06); border-radius:16px; box-shadow:0 8px 18px rgba(18,9,65,.055);}
.panaccess-dc-page .panaccess-dc-gallery-grid img {height:200px;}
.panaccess-dc-page .panaccess-dc-gallery-grid h3 {color:var(--dc-navy); font-size:1.25rem;}
.panaccess-dc-page .panaccess-dc-gallery-grid p {color:var(--dc-muted); font-size:.96rem;}
.panaccess-dc-page .panaccess-dc-cta { width:min(1160px, calc(100% - 3rem)); margin:clamp(4.5rem, 7vw, 7rem) auto; border-radius:18px; padding:clamp(2rem, 4vw, 3.5rem); background:linear-gradient(112deg,#0c0c4d,#3e2582); color:#fff; }
.panaccess-dc-page .panaccess-dc-cta h2 {color:#fff; font-size:clamp(1.6rem,2.6vw,2.2rem);}
.panaccess-dc-page .panaccess-dc-cta p {color:#f0eeff; line-height:1.7;}
.panaccess-dc-page .panaccess-dc-cta .panaccess-dc-button {background:var(--dc-pink); flex-shrink:0; white-space:normal; text-align:center;}
@media(max-width:900px) {
  .panaccess-dc-page .panaccess-dc-intro { grid-template-columns:1fr; }
  .panaccess-dc-page .panaccess-dc-intro > img { height:390px; }
  .panaccess-dc-page .panaccess-dc-grid, .panaccess-dc-page .panaccess-dc-gallery-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:650px) {
  .panaccess-dc-page .panaccess-dc-hero { min-height:460px; padding:8.5rem 1.35rem 8rem; }
  .panaccess-dc-page .panaccess-dc-hero h1 {font-size:clamp(2.6rem,11vw,3.5rem);}
  .panaccess-dc-page .panaccess-dc-intro {width:calc(100% - 2.5rem); padding:3.2rem 0 5rem;}
  .panaccess-dc-page .panaccess-dc-intro > img {height:320px;}
  .panaccess-dc-page .panaccess-dc-grid, .panaccess-dc-page .panaccess-dc-gallery-grid, .panaccess-dc-page .panaccess-dc-workflow-steps {grid-template-columns:1fr;}
  .panaccess-dc-page .panaccess-dc-services, .panaccess-dc-page .panaccess-dc-workflow, .panaccess-dc-page .panaccess-dc-gallery {padding-inline:1.3rem;}
  .panaccess-dc-page .panaccess-dc-cta { width:calc(100% - 2.5rem); flex-direction:column; align-items:stretch; text-align:left; }
  .panaccess-dc-page .panaccess-dc-cta .panaccess-dc-button { width:100%; justify-content:center; }
}