/* The selected card keeps its original glass surface and animated border. */
.h8-expanded { position:fixed; inset:auto; margin:0; max-width:none; max-height:none; padding:0; border:0; background:transparent; overflow:visible; color:var(--h8-expertise-text); font-family:var(--font-body); }
.h8-expanded::backdrop { background:transparent; }
.h8-expanded .h8-expertise__card.is-expanded { display:block; width:100%; height:100%; min-height:0; padding:0; margin:0; overflow:visible; }
.h8-expanded .is-expanded > [hidden] { display:none !important; }
.h8-card-placeholder { min-width:0; pointer-events:none; }
.h8-card-expanded { position:relative; display:flex; flex-direction:column; height:100%; overflow:hidden; }
.h8-expanded.is-closing .h8-card-expanded { pointer-events:none; }
.h8-expanded-fireflies { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:3; }
.h8-card-expanded *, .h8-card-expanded *::before, .h8-card-expanded *::after { box-sizing: border-box; }
.h8-card-expanded__head { flex-shrink: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-6); align-items: center; padding: var(--h8-expanded-padding); padding-bottom: var(--space-6); }
.h8-card-expanded__head .h8-expertise__icon { width: var(--h8-expanded-icon-box); height: var(--h8-expanded-icon-box); border-radius: var(--radius-lg); }
.h8-card-expanded__head .h8-expertise__icon svg { width: var(--h8-expanded-icon-size); height: var(--h8-expanded-icon-size); }
.h8-card-expanded__eyebrow { display: flex; align-items: center; gap: var(--space-3); margin: 0 0 var(--space-3); color: var(--brand-preview-teal); font: var(--h5-copy-eyebrow); letter-spacing: var(--h8-expanded-tracking); }
.h8-card-expanded__eyebrow::after { content: ''; flex: 1; height: var(--h8-expertise-border-width); background: var(--h8-expertise-rule); }
.h8-card-expanded h2 { margin: 0; font: 600 var(--h8-expanded-title)/1.25 var(--font-display); color: var(--h8-expertise-text); text-wrap: balance; }
.h8-card-expanded__tagline { margin: var(--space-2) 0 0; color: var(--h8-expertise-muted); font-size: var(--h8-expanded-tagline); letter-spacing: var(--h8-expanded-tracking); line-height: 1.6; text-transform: uppercase; }
.h8-card-expanded__close { display: grid; place-items: center; align-self: start; width: var(--tap-min); height: var(--tap-min); padding: var(--space-3); border: var(--h8-expanded-button-border); border-radius: var(--radius-lg); color: var(--h8-expertise-text); background: var(--h8-expertise-icon-bg); box-shadow: var(--h8-expanded-button-shadow); cursor: pointer; }
.h8-card-expanded__close svg { width: 100%; height: 100%; }
.h8-card-expanded__body { flex:1; min-height:0; overflow-y: auto; overscroll-behavior: contain; padding: 0 var(--h8-expanded-padding) var(--space-6); scrollbar-color: var(--brand-preview-teal) transparent; }
.h8-card-expanded__description { margin: 0; padding-top: var(--space-5); border-top: var(--h8-expanded-rule); color: var(--h8-expertise-text); font-size: var(--h8-expanded-copy); line-height: 1.55; }
.h8-expanded .h8-card-expanded__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-7); row-gap: var(--space-3); list-style: none; padding: 0; margin: var(--space-6) 0 0; position: relative; }
.h8-card-expanded__list::after { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; border-left: var(--h8-expanded-rule); }
.h8-expanded .h8-card-expanded__list li { display: flex; align-items: center; gap: var(--space-4); font: 400 var(--h8-expanded-copy)/1.4 var(--font-body); color: var(--h8-expertise-text); padding: 0; min-width: 0; }
.h8-expanded .h8-card-expanded__list li::before { display: none; }
.h8-card-expanded__list svg { flex: 0 0 var(--h8-expanded-list-icon); width: var(--h8-expanded-list-icon); height: var(--h8-expanded-list-icon); color: var(--brand-preview-yellow); }
.h8-card-expanded__foot { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-5); padding: var(--space-5) var(--h8-expanded-padding); border-top: var(--h8-expanded-rule); background: var(--h8-expertise-support-bg); }
.h8-card-expanded__mail-icon { display: grid; place-items: center; flex-shrink: 0; width: var(--space-7); height: var(--space-7); padding: var(--space-3); color: var(--brand-preview-teal); border: var(--h8-expertise-border); border-radius: var(--radius-lg); background: var(--h8-expertise-icon-bg); }
.h8-card-expanded__mail-icon svg { width: 100%; height: 100%; }
.h8-card-expanded__foot p { margin: 0; font-size: var(--h8-expanded-copy); line-height: 1.5; }
.h8-card-expanded__foot small { display: block; margin-top: var(--space-2); font-size: var(--h8-expanded-tagline); color: var(--h8-expertise-muted); letter-spacing: var(--h8-expanded-tracking); text-transform: uppercase; }
.h8-card-expanded__email.h5-talk { flex-shrink:0; margin-left:auto; color:var(--h5-theme-primary-ink); text-decoration:none; }
.h8-card-expanded__email.is-firefly-active { background:var(--h8-expertise-surface); color:var(--h5-theme-light); border-color:var(--h5-theme-light); box-shadow:var(--h5-services-card-hover-shadow); }
.h8-card-expanded__email > * { position:relative; z-index:4; }
.h8-card-expanded__email svg { width: var(--h5-nav-icon); height: var(--h5-nav-icon); }
.h8-card-expanded :is(button,a):focus-visible { outline: var(--h8-expertise-focus); outline-offset: var(--h8-expertise-focus-offset); }
@media (max-width: 899px) {
  .h8-card-expanded__head { gap: var(--space-4); }
  .h8-card-expanded__head .h8-expertise__icon { width: var(--space-7); height: var(--space-7); }
  .h8-card-expanded__head .h8-expertise__icon svg { width: var(--h8-expertise-icon-size); height: var(--h8-expertise-icon-size); }
  .h8-card-expanded__foot { flex-wrap: wrap; }
  .h8-card-expanded__foot small { letter-spacing: var(--tracking-caps); }
  .h8-card-expanded__mail-icon { display: none; }
}
@media (max-width: 559px) {
  .h8-card-expanded__head { grid-template-columns: minmax(0, 1fr) auto; padding-bottom: var(--space-4); }
  .h8-card-expanded__head .h8-expertise__icon { grid-row: 1; grid-column: 1; }
  .h8-card-expanded__heading { grid-column: 1 / -1; grid-row: 2; }
  .h8-card-expanded__close { grid-row: 1; grid-column: 2; }
  .h8-card-expanded__eyebrow { margin-bottom: var(--space-2); }
  .h8-card-expanded__tagline { letter-spacing: var(--tracking-caps); }
  .h8-expanded .h8-card-expanded__list { grid-template-columns: minmax(0,1fr); }
  .h8-card-expanded__list::after { display: none; }
  .h8-card-expanded__foot { gap: var(--space-3); padding-block: var(--space-4); }
  .h8-card-expanded__email.h5-talk { margin-left:auto; }
}

/* Leave the scenery untouched; prevent duplicate card content showing through glass. */

@media (min-width:900px) {
 .h8-card-expanded__head { padding-block:var(--space-6); }
 .h8-expanded .h8-card-expanded__list { margin-top:var(--space-5); row-gap:var(--space-2); }
}
@media (max-height:500px) {
 .h8-card-expanded__head { padding-block:var(--space-3); }
 .h8-card-expanded__eyebrow, .h8-card-expanded__tagline, .h8-card-expanded__foot p { display:none; }
 .h8-card-expanded__heading { grid-column:2; grid-row:1; }
 .h8-card-expanded__head { grid-template-columns:auto minmax(0,1fr) auto; }
 .h8-card-expanded__close { grid-column:3; }
 .h8-card-expanded__foot { padding-block:var(--space-2); }
}



/* Stretch the existing semantic button over the compact card: one keyboard stop. */
.h8-expertise__grid .h8-expertise__card .h8-expertise__link::after { content:''; position:absolute; inset:0; z-index:4; border-radius:var(--h8-expertise-radius); cursor:pointer; }
.h8-expertise__grid .h8-expertise__card:focus-within { outline:var(--h8-expertise-focus); outline-offset:var(--h8-expertise-focus-offset); }
.h8-expanded__clip { position:absolute; inset:0; overflow:hidden; border-radius:inherit; }
.h8-expanded .h8-card-preview { position:absolute; left:0; top:0; min-height:0; margin:0; border-color:transparent; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; pointer-events:none; }
.h8-expanded .is-expanded > .h8-expertise__border { z-index:5; }
.h8-expanded .is-expanded > .h8-expertise__border .h8-expertise__border-sweep { animation-play-state:running; }
@media (prefers-reduced-motion:reduce) { .h8-expanded .is-expanded > .h8-expertise__border { display:none; } }

.h8-expanded-fireflies { transition:opacity var(--h8-expanded-motion) var(--ease-out); }
.h8-expanded.is-closing .h8-expanded-fireflies { opacity:0; }

/* The full catalogue uses the same detail typography, icons and two-column list. */
.h8-all-category { padding-block:var(--space-5) var(--space-6); border-top:var(--h8-expanded-rule); }
.h8-all-category__head { display:flex; gap:var(--space-4); align-items:center; }
.h8-all-category__head h3 { margin:0; color:var(--h8-expertise-text); font:600 var(--h8-expertise-card-title)/1.4 var(--font-display); }
.h8-all-category .h8-card-expanded__description { border:0; padding-top:var(--space-4); color:var(--h8-expertise-muted); }
.h8-card-expanded--all .h8-card-expanded__body { padding-bottom:0; }
.h8-expanded .h8-all-category .h8-card-expanded__list { margin-top:var(--space-5); }
.h8-expanded .h8-card-preview.h8-expertise__support { padding:var(--space-1) var(--h8-expertise-padding); }
