/* Native cube panes form the face. Copy sits in the hero foreground to avoid 3D occlusion. */
.open.has-service-detail .rig { pointer-events:none; }
.h8-detail-pane { transform-style:preserve-3d; }
.h8-detail-origin { position:absolute; left:50%; top:50%; width:0; height:0; }
.h8-service-detail {
  position:absolute; left:50%; top:50%;
  width:var(--h8-detail-width); height:var(--h8-detail-height);
  transform:translate(-50%,-50%); z-index:var(--z-raised);
  box-sizing:border-box; padding:var(--h8-detail-padding);
  color:var(--h8-detail-ink); font-family:inherit; text-align:center; pointer-events:none;
}
.h8-service-detail[hidden] { display:none; }
.h8-service-detail::before {
  content:''; position:absolute; inset:0; border-radius:var(--h8-detail-frame-radius);
  background:var(--h8-detail-frame-highlights),var(--h8-detail-glass-wash),var(--h8-detail-background);
  -webkit-backdrop-filter:var(--h5-stats-backdrop-filter);
  backdrop-filter:var(--h5-stats-backdrop-filter);
  box-shadow:var(--h8-detail-frame-shadow); opacity:var(--h8-detail-glass-opacity,0);
  pointer-events:none;
}
.h8-service-detail::after {
  content:''; position:absolute; inset:var(--h8-detail-frame-inset);
  border:var(--h8-detail-inner-stroke); border-radius:var(--h8-detail-frame-inner-radius);
  pointer-events:none; opacity:var(--h8-detail-glass-opacity,0);
}
.h8-service-detail__content { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; }
.h8-service-detail__icon,.h8-service-detail li {
  --h8-detail-orb-shadow:inset 0 0 var(--space-3) rgb(var(--h8-accent) / .3),0 0 var(--space-3) rgb(var(--h8-accent) / .2);
  --h8-detail-benefit-shadow:inset 0 0 var(--space-4) rgb(var(--h8-accent) / .2),0 0 var(--space-2) rgb(var(--h8-accent) / .2);
}
.h8-service-detail__icon { --h8-accent:var(--h8-detail-yellow-rgb); color:rgb(var(--h8-accent)); margin-bottom:var(--space-2); width:var(--h8-detail-orb); height:var(--h8-detail-orb); flex-shrink:0; display:grid; place-items:center; border:var(--h8-detail-frame-stroke) solid rgb(var(--h8-accent) / .75); border-radius:var(--radius-pill); background:rgb(var(--h8-accent) / .08); box-shadow:var(--h8-detail-orb-shadow); }
.h8-service-detail__icon svg { display:block; width:var(--h8-detail-orb-icon); height:var(--h8-detail-orb-icon); fill:currentColor; }
.h8-service-detail__label { display:flex; align-items:center; gap:var(--space-3); margin:0 0 var(--space-2); color:var(--brand-preview-yellow); font-size:var(--h8-detail-label); text-transform:uppercase; letter-spacing:var(--h8-detail-label-spacing); }
.h8-service-detail__label::before,.h8-service-detail__label::after { content:''; width:var(--h8-detail-ornament-width); height:var(--h8-detail-ornament-height); background:linear-gradient(90deg,transparent,var(--brand-preview-yellow)); }
.h8-service-detail__label::after { transform:rotate(180deg); }
.h8-service-detail h2 { margin:0; font-size:var(--h8-detail-heading); line-height:var(--leading-tight); max-width:100%; text-wrap:balance; }
.h8-service-detail__copy { margin:var(--space-2) 0 0; font-size:var(--h8-detail-body); line-height:var(--leading-normal); color:var(--h8-detail-muted); }
.h8-service-detail ul { list-style:none; margin:var(--space-3) 0 0; padding:0; display:flex; justify-content:center; flex-wrap:wrap; gap:var(--space-2); }
.h8-service-detail li { --h8-accent:var(--h8-detail-cyan-rgb); display:flex; align-items:center; gap:var(--space-2); font-size:var(--h8-detail-chip-text); text-align:left; background:linear-gradient(145deg,rgb(var(--h8-accent) / .14),rgb(var(--h8-accent) / .025)); border:var(--h8-detail-frame-stroke) solid rgb(var(--h8-accent) / .7); border-radius:var(--h8-detail-benefit-radius); padding:var(--space-3) var(--space-2); box-shadow:var(--h8-detail-benefit-shadow); }
.h8-service-detail li:nth-child(2) { --h8-accent:var(--h8-detail-yellow-rgb); }
.h8-service-detail li:nth-child(3) { --h8-accent:var(--h8-detail-green-rgb); }
.h8-service-detail__benefit-icon { color:rgb(var(--h8-accent)); display:grid; place-items:center; width:var(--h8-detail-benefit-orb); height:var(--h8-detail-benefit-orb); flex-shrink:0; border:var(--h8-detail-frame-stroke) solid rgb(var(--h8-accent) / .6); border-radius:var(--radius-pill); background:rgb(var(--h8-accent) / .08); box-shadow:var(--h8-detail-orb-shadow); }
.h8-service-detail .h8-benefit-svg { display:block; width:var(--h8-detail-benefit-icon); height:var(--h8-detail-benefit-icon); fill:currentColor; }
.h8-service-detail__benefit-text { min-width:0; color:var(--h8-detail-ink); }
.h8-service-detail__next { position:relative; margin:var(--space-4) 0 0; padding-top:var(--space-3); border-top:var(--h8-detail-chip-stroke); width:100%; font-size:var(--h8-detail-footer); line-height:var(--leading-normal); color:var(--h8-detail-ink); }
.h8-service-detail__next::before { content:''; position:absolute; top:0; left:50%; transform:translate(-50%,-50%); width:var(--h8-detail-ornament-width); height:var(--h8-detail-ornament-height); background:var(--h8-detail-frame-ink); }
.h8-service-detail__cta { display:none; margin-top:var(--space-1); color:var(--brand-preview-yellow); font-size:var(--h8-detail-body); text-underline-offset:var(--space-1); }
.h8-service-detail__close { display:none; position:absolute; top:0; right:0; width:var(--tap-min); height:var(--tap-min); background:none; color:var(--h8-detail-ink); border:0; cursor:pointer; font:inherit; font-size:var(--h8-detail-heading); }
.h8-service-detail__close:focus-visible,.h5-service:focus-visible,.h8-service-detail__cta:focus-visible { outline:var(--h5-services-focus); outline-offset:var(--space-1); }
.h8-service-detail.is-inline { position:relative; left:auto; top:auto; transform:none; width:100%; height:auto; grid-column:1/-1; border-radius:var(--h8-detail-frame-radius); pointer-events:auto; }
.h8-service-detail.is-inline::before,.h8-service-detail.is-inline::after { opacity:1; }
.h8-service-detail.is-inline .h8-service-detail__close { z-index:var(--z-raised); }
.h8-service-detail.is-inline .h8-service-detail__close { display:block; }
.h8-service-detail.is-inline .h8-service-detail__cta { display:inline-block; }
@media (min-width:1280px) {
  .h8-service-detail ul { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; }
  .h8-service-detail li { justify-content:center; line-height:var(--leading-tight); }
}
@media (min-width:1280px) and (max-height:800px) {
  .h8-service-detail__icon { margin-bottom:var(--space-1); }
  .h8-service-detail h2 { font-size:var(--h8-detail-heading-short); }
  .h8-service-detail__copy { font-size:var(--h8-detail-body-short); }
  .h8-service-detail__label { font-size:var(--h8-detail-label-short); }
  .h8-service-detail ul { margin-top:var(--space-2); gap:var(--space-1); }
  .h8-service-detail ul { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; }
}
@media (max-width:599px) {
  .h8-service-detail ul { display:grid; grid-template-columns:minmax(0,1fr); width:100%; }
  .h8-service-detail li { padding:var(--space-2) var(--space-3); }
  .h8-service-detail__label { gap:var(--space-2); }
  .h8-service-detail__label::before,.h8-service-detail__label::after { width:var(--space-3); }
}
