.swd-package-hero {
  position: relative;
  min-height: 480px;
  height: 58vh;
  max-height: 600px;
  overflow: hidden;
  color: #fff;
  background: #16181e;
}

.swd-package-hero__image,
.swd-package-hero__image::after {
  position: absolute;
  inset: 0;
}

.swd-package-hero__image::after {
  content: "";
  background: rgba(0, 0, 0, 0.1);
}

.swd-package-hero__image img { width: 100%; height: 100%; object-fit: cover; }
.swd-package-hero__content { position: relative; z-index: 1; height: 100%; display: flex; align-items: center; justify-content: center; padding-block: 36px; }
.swd-package-hero__panel { width: min(760px, 100%); padding: 30px 36px; border-radius: var(--swd-radius-md); background: rgba(0, 0, 0, 0.45); box-shadow: 0 12px 34px rgba(0, 0, 0, 0.28); text-align: center; }
.swd-package-hero h1 { max-width: 700px; margin-inline: auto; font-size: clamp(2rem, 4vw, 3.35rem); font-weight: 400; }
.swd-package-hero__panel > p { max-width: 690px; margin-inline: auto; }
.swd-package-hero__lead { font-family: var(--swd-font-heading); font-size: clamp(1.15rem, 2vw, 1.55rem); font-weight: 600; }
.swd-package-hero .swd-button-row { justify-content: center; }

.swd-eyebrow { margin-bottom: .55rem; color: var(--swd-colour-blue); font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.swd-package-intro__grid,
.swd-feature-split,
.swd-clienthub__grid,
.swd-adoption__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); align-items: center; gap: clamp(2rem, 6vw, 5.5rem); }
.swd-package-intro h2,
.swd-feature-split h2,
.swd-clienthub h2,
.swd-adoption h2 { font-size: clamp(1.9rem, 3.5vw, 3rem); }
.swd-package-summary { padding: var(--swd-space-5); border-left: 4px solid var(--swd-colour-blue); border-radius: var(--swd-radius-md); background: var(--swd-colour-blue-soft); box-shadow: var(--swd-shadow-sm); }
.swd-package-summary h3 { font-size: 1.3rem; }
.swd-plain-checks,
.swd-detail-list { margin: 0; padding: 0; list-style: none; }
.swd-plain-checks li,
.swd-detail-list li { position: relative; margin: .7rem 0; padding-left: 1.6rem; }
.swd-plain-checks li::before,
.swd-detail-list li::before { content: "✓"; position: absolute; left: 0; color: var(--swd-colour-blue); font-weight: 700; }

.swd-feature-split { grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr); }
.swd-feature-split__visual { min-height: 310px; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; border-radius: var(--swd-radius-lg); color: #fff; background: linear-gradient(rgba(7,12,32,.62), rgba(7,12,32,.62)), url("../../../img/hero-officeview.webp") center/cover; box-shadow: var(--swd-shadow-md); }
.swd-feature-split__visual span { font-size: 4.5rem; font-weight: 700; opacity: .4; }
.swd-feature-split__visual strong { font-family: var(--swd-font-heading); font-size: 2rem; }
.swd-feature-split__visual small { color: #d9deef; }

.swd-ecosystem { overflow: hidden; }
.swd-ecosystem-flow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.swd-ecosystem-flow li { position: relative; min-width: 0; padding: 24px 16px; border: 1px solid var(--swd-colour-border); border-radius: var(--swd-radius-md); text-align: center; background: #fff; box-shadow: var(--swd-shadow-sm); }
.swd-ecosystem-flow li:not(:last-child)::after { content: "→"; position: absolute; z-index: 2; top: 50%; right: -14px; width: 16px; color: var(--swd-colour-blue); font-weight: 700; transform: translateY(-50%); }
.swd-ecosystem-flow span { width: 34px; height: 34px; display: grid; place-items: center; margin: 0 auto 12px; border-radius: 50%; color: #fff; background: var(--swd-colour-blue); font-weight: 700; }
.swd-ecosystem-flow strong,
.swd-ecosystem-flow small { display: block; }
.swd-ecosystem-flow small { margin-top: 6px; color: var(--swd-colour-muted); }

.swd-products .swd-section-heading p { color: #bdc3d0; }
.swd-products .swd-eyebrow { color: #aeb8ff; }
.swd-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--swd-space-4); }
.swd-product { scroll-margin-top: 70px; padding: clamp(1.5rem, 4vw, 2.4rem); border: 1px solid #333746; border-radius: var(--swd-radius-md); background: #11141c; }
.swd-product h3 { margin-bottom: .4rem; font-size: 1.65rem; }
.swd-product p,
.swd-product li { color: #c5cad5; }
.swd-product ul { padding-left: 1.2rem; }
.swd-product__number { margin-bottom: .25rem !important; color: #9facff !important; font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.swd-product__note { margin-top: 1.2rem; padding: .8rem 1rem; border-left: 3px solid #8796ff; background: rgba(255,255,255,.05); }

.swd-clienthub { background: linear-gradient(135deg, #f3f5ff, #fff 60%); }
.swd-clienthub-preview { overflow: hidden; border: 1px solid #cdd2e7; border-radius: var(--swd-radius-lg); background: #fff; box-shadow: var(--swd-shadow-md); }
.swd-clienthub-preview__bar { display: flex; justify-content: space-between; gap: 16px; padding: 18px 20px; color: #fff; background: var(--swd-colour-black); }
.swd-clienthub-preview__body { display: grid; gap: 12px; padding: 20px; background: #f5f6fa; }
.swd-clienthub-preview__body div { padding: 16px; border-left: 4px solid var(--swd-colour-blue); border-radius: var(--swd-radius-sm); background: #fff; }
.swd-clienthub-preview__body small,
.swd-clienthub-preview__body strong { display: block; }
.swd-clienthub-preview__body small { color: var(--swd-colour-muted); }
.swd-clienthub-preview > p { margin: 0; padding: 10px 20px; color: var(--swd-colour-muted); font-size: .72rem; text-align: right; }

.swd-workflow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; counter-reset: workflow; list-style: none; }
.swd-workflow li { min-width: 0; padding: 22px 18px; border-top: 4px solid var(--swd-colour-blue); background: #fff; }
.swd-workflow li:nth-child(even) { background: #eef1ff; }
.swd-workflow span { display: block; margin-bottom: 10px; color: var(--swd-colour-blue); font-weight: 700; }
.swd-workflow p { margin: 0; color: var(--swd-colour-muted); font-size: .86rem; }

.swd-adoption__options { display: grid; gap: 12px; }
.swd-adoption__options article { padding: 18px 20px; border-left: 4px solid var(--swd-colour-blue); border-radius: var(--swd-radius-sm); background: var(--swd-colour-surface-alt); }
.swd-adoption__options strong,
.swd-adoption__options span { display: block; }
.swd-adoption__options span { margin-top: 4px; color: var(--swd-colour-muted); }
.swd-btn--dark-outline { color: var(--swd-colour-ink); }
.swd-suitable-grid .swd-card { border-top: 4px solid var(--swd-colour-blue); }

.swd-video-frame { max-width: 960px; margin-inline: auto; padding: 10px; border-radius: var(--swd-radius-lg); background: #08090d; box-shadow: var(--swd-shadow-md); }
.swd-video-frame video { width: 100%; max-height: 70vh; border-radius: calc(var(--swd-radius-lg) - 8px); background: #000; }
.swd-package-video__mobile { display: none; }

.swd-final-cta { color: #fff; background: linear-gradient(130deg, var(--swd-colour-blue-dark), var(--swd-colour-blue)); }
.swd-final-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--swd-space-5); }
.swd-final-cta__inner h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); }
.swd-final-cta__inner p { max-width: 700px; margin-bottom: 0; }

@media (max-width: 900px) {
  .swd-package-intro__grid,
  .swd-feature-split,
  .swd-clienthub__grid,
  .swd-adoption__grid { grid-template-columns: 1fr; }
  .swd-feature-split__visual { min-height: 250px; }
  .swd-ecosystem-flow { grid-template-columns: 1fr; }
  .swd-ecosystem-flow li { display: grid; grid-template-columns: 42px 1fr; column-gap: 12px; text-align: left; }
  .swd-ecosystem-flow li:not(:last-child)::after { content: "↓"; top: auto; right: 50%; bottom: -17px; transform: translateX(50%); }
  .swd-ecosystem-flow span { grid-row: 1 / 3; margin: 0; }
  .swd-workflow { grid-template-columns: 1fr; gap: 8px; }
  .swd-final-cta__inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 680px) {
  .swd-package-hero { min-height: 500px; height: 68svh; max-height: 620px; }
  .swd-package-hero__content { padding-block: 30px; }
  .swd-package-hero__panel { padding: 22px 16px; background: rgba(0, 0, 0, 0.48); }
  .swd-package-hero h1 { font-size: clamp(1.75rem, 8vw, 2.35rem); }
  .swd-package-hero__panel p:not(.swd-hero__eyebrow) { font-size: 0.9rem; }
  .swd-product-grid { grid-template-columns: 1fr; }
  .swd-product { scroll-margin-top: 54px; }
  .swd-package-video__desktop { display: none; }
  .swd-package-video__mobile { display: block; max-height: 75vh !important; object-fit: contain; }
}

@media (max-width: 360px) {
  .swd-package-hero__panel { padding: 20px 14px; }
  .swd-package-hero__lead { font-size: 1rem; }
  .swd-package-summary,
  .swd-product { padding: 1.25rem; }
}
