/* Info pages on PageHero (Colocation, Dedicated Servers, Data Center, Company). Two tiers: ≥ 1024 / below. */

.info-pad { padding-top: 96px; padding-bottom: 96px; }
.info-pad2 { padding-top: 96px; padding-bottom: 96px; }
.info-band { padding-top: 80px; padding-bottom: 80px; }
.info-cta { padding-top: 96px; padding-bottom: 96px; }
.info-split { display: grid; grid-template-columns: minmax(0,4fr) minmax(0,8fr); gap: 40px; }
.info-split--baseline { align-items: baseline; }
.info-split--gap64 { gap: 64px; align-items: start; }
.info-h2--narrow { max-width: 12ch; }
.info-stack { display: flex; flex-direction: column; gap: 16px; }
.info-note { font-size: 16px; line-height: 1.6; color: var(--text-body); }
.info-note a { font-weight: 600; }
.info-lead { max-width: 34em; }

/* check lists */
.info-checks { list-style: none; display: grid; grid-template-columns: minmax(0,1fr); column-gap: 40px; }
.info-checks--2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.info-checks li { display: flex; gap: 12px; align-items: flex-start; padding: 16px 0; border-top: 1px solid var(--border-strong); font-size: 17px; line-height: 1.45; color: var(--text-strong); }
.info-checks--tight li { padding: 14px 0; }
.info-checks li > .icon { --icon-size: 20px; margin-top: 1px; color: var(--icon); }

/* Colocation pricing rows */
.info-pricing { display: flex; flex-direction: column; gap: 24px; }
.price-rows { display: flex; flex-direction: column; border-top: 2px solid var(--text-strong); }
.price-rows__row { display: grid; grid-template-columns: minmax(0,3fr) minmax(0,4fr) minmax(0,5fr); gap: 24px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--border-strong); }
.price-rows__item { font-family: var(--font-display); font-weight: 600; font-size: 18px; line-height: 1.3; color: var(--text-strong); }
.price-rows__price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-size: 15px; line-height: 1.3; color: var(--text-body); }
.price-rows__num { font-family: var(--font-display); font-weight: 600; font-size: 34px; line-height: 1; letter-spacing: var(--tracking-display); color: var(--text-strong); }
.price-rows__note { font-size: 15px; line-height: 1.5; color: var(--text-body); }

/* Colocation specs + features */
.info-features { display: grid; grid-template-columns: minmax(0,4fr) minmax(0,8fr); gap: 64px; align-items: start; }
.info-features__list { max-width: 680px; }
.specs-card { display: flex; flex-direction: column; gap: 20px; padding: 32px; background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-md); }
.specs-card h3 { font-family: var(--font-display); font-weight: 600; font-size: 20px; line-height: 1.3; letter-spacing: var(--tracking-heading); color: var(--text-strong); }
.specs-card dl { margin: 0; display: flex; flex-direction: column; border-top: 1px solid var(--border-strong); }
.specs-card dl > div { display: flex; flex-direction: column; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.specs-card dt { font-family: var(--font-mono); font-weight: 500; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-accent); }
.specs-card dd { margin: 0; font-size: 16px; line-height: 1.5; color: var(--text-strong); }

/* DS FeatureList */
.feature-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 48px; }
.feature-list--single { grid-template-columns: minmax(0,1fr); gap: 32px; }
.feature-list__item { position: relative; display: flex; flex-direction: column; gap: 10px; padding-top: 20px; border-top: 1px solid var(--border-strong); }
.feature-list__tick { position: absolute; top: -1px; left: 0; width: 40px; height: 2px; background: var(--graphic); }
.feature-list__n { font-family: var(--font-mono); font-weight: 500; font-size: 13px; letter-spacing: 0.08em; color: var(--text-accent); }
.feature-list h3 { font-family: var(--font-display); font-weight: 600; font-size: 20px; line-height: 1.3; letter-spacing: var(--tracking-heading); color: var(--text-strong); }
.feature-list--single h3 { font-size: 18px; }
.feature-list p { font-size: 16px; line-height: 1.6; color: var(--text-body); text-wrap: pretty; }

/* dark facility band (Colocation) */
.info-facility { display: grid; grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: 64px; align-items: center; }
.info-facility__text { display: flex; flex-direction: column; gap: 20px; }
.info-facility__link { padding-top: 4px; }
.info-stack .info-facility__link { padding-top: 8px; }
.info-dots { list-style: none; display: flex; flex-direction: column; }
.info-dots li { display: flex; gap: 12px; align-items: flex-start; padding: 14px 0; border-top: 1px solid var(--border); font-size: 16px; line-height: 1.5; color: var(--text-body); }
.info-dots li > .icon { --icon-size: 18px; margin-top: 2px; color: var(--icon); }

/* Dedicated statement bands */
.info-band__body { display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }
.info-band__body--tight { gap: 8px; max-width: 640px; }
.info-statement { font-family: var(--font-display); font-weight: 600; font-size: 28px; line-height: 1.35; letter-spacing: var(--tracking-heading); color: var(--text-strong); text-wrap: pretty; }
.info-statement--narrow { max-width: 32ch; }
.info-band__sub { font-size: 17px; line-height: 1.6; color: var(--text-body); }
.info-subtle-bottom { background: var(--surface-subtle); border-bottom: 1px solid var(--border); }

/* Data Center map + address */
.info-map { display: grid; grid-template-columns: minmax(0,7fr) minmax(0,5fr); gap: 64px; align-items: start; }
.info-map__side { display: flex; flex-direction: column; gap: 40px; }
.info-address { display: flex; flex-direction: column; gap: 8px; padding-top: 20px; border-top: 1px solid var(--border-strong); }
.info-address p { font-size: 18px; line-height: 1.55; color: var(--text-strong); }
.info-map__net { display: flex; flex-direction: column; gap: 16px; }

/* Company stats (DS StatStrip) */
.info-stats { background: var(--surface-subtle); border-bottom: 1px solid var(--border); }
.info-stats__pad { padding-top: 8px; padding-bottom: 32px; }
.stat-strip { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border-top: 1px solid var(--border-strong); }
.stat-strip li { position: relative; padding: 24px 24px 0; border-left: 1px solid var(--border); font-family: var(--font-display); font-weight: 600; font-size: 18px; line-height: 1.3; letter-spacing: var(--tracking-heading); color: var(--text-strong); text-wrap: balance; }
.stat-strip li:first-child { padding-left: 0; border-left: 0; }
.stat-strip__tick { position: absolute; top: -1px; left: 24px; width: 24px; height: 2px; background: var(--graphic); }
.stat-strip li:first-child .stat-strip__tick { left: 0; }
.stat-strip__v { color: var(--text-accent); }

@media (max-width: 1023px) {
  .info-pad { padding-top: 64px; padding-bottom: 64px; }
  .info-pad2 { padding-top: 56px; padding-bottom: 64px; }
  .info-band { padding-top: 56px; padding-bottom: 56px; }
  .info-cta { padding-top: 48px; padding-bottom: 64px; }
  .info-split { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .info-split--wide-gap { gap: 20px; }
  .info-split--company { gap: 28px; }
  .info-split--gap64 { gap: 32px; }
  .info-checks--2 { grid-template-columns: minmax(0,1fr); }
  .price-rows__row { grid-template-columns: minmax(0,1fr); gap: 8px; padding: 18px 0; }
  .price-rows__num { font-size: 30px; }
  .info-features { grid-template-columns: minmax(0,1fr); gap: 40px; }
  .specs-card { padding: 24px; }
  .feature-list { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .feature-list h3 { font-size: 18px; }
  .info-facility { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .info-statement { font-size: 22px; }
  .info-map { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .info-stats__pad { padding-bottom: 16px; }
  .stat-strip { grid-template-columns: 1fr 1fr; }
  .stat-strip li { font-size: 16px; padding: 18px 0 18px 16px; }
  .stat-strip li:nth-child(odd) { padding: 18px 12px 18px 0; border-left: 0; }
  .stat-strip__tick { left: 16px; }
  .stat-strip li:nth-child(odd) .stat-strip__tick { left: 0; }
  /* these pages use the CtaBand mobile variant below 1024 */
  .info-page .cta-band__inner { grid-template-columns: 1fr; gap: 28px; padding: 40px 24px; }
  .info-page .cta-band__motif { right: -80px; width: 260px; }
  .info-page .cta-band__title { font-size: 34px; }
  .info-page .cta-band__body { font-size: 16px; }
  .info-page .cta-band__actions { justify-content: stretch; }
  .info-page .cta-band__actions .btn { width: 100%; }
}
