/* SELF ENTOURAGE — GLOBAL CENTERING & COMPLETION V11
   Canonical centering for every shared customer-facing panel.
   This layer intentionally excludes the isolated Chapter 38 experience. */

/* Hero layouts and the recurring middle information box. */
body[data-se-page] .page-hero .page-hero-grid,
body[data-se-canonical-product="true"] .product-hero > .wrap {
  justify-items: center !important;
}

body[data-se-page] .page-hero .page-hero-grid > *,
body[data-se-canonical-product="true"] .product-hero > .wrap > * {
  min-width: 0;
}

body[data-se-page] .hero-aside {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(100%, 52rem) !important;
  max-width: 52rem !important;
  margin: clamp(1.5rem,4vw,2.5rem) auto 0 !important;
  padding: clamp(1.75rem,4vw,2.75rem) !important;
  text-align: center !important;
}

body[data-se-page] .hero-aside > * {
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body[data-se-page] .hero-aside::after {
  position: static !important;
  display: block !important;
  margin-top: 1rem !important;
  text-align: center !important;
  order: 99;
}

body[data-se-page] .hero-brand-lockup,
body[data-se-page] .brand-lockup,
body[data-se-page] .hero-wordmark {
  justify-content: center !important;
  align-items: center !important;
}

body[data-se-page] .hero-aside h2 {
  max-width: 22ch !important;
  margin-top: 1.15rem !important;
  text-align: center !important;
}

body[data-se-page] .hero-aside p,
body[data-se-page] .hero-aside ul {
  max-width: 42rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body[data-se-page] .hero-aside ul {
  display: inline-block;
  padding-left: 1.25rem !important;
  text-align: left !important;
}

/* Every recurring callout panel now uses one centered composition. */
body[data-se-page] :is(.decision-panel,.contact-panel,.notice),
body[data-se-canonical-product="true"] :is(.price-card,.product-offer-panel,.next-step,.delivery-card) {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

body[data-se-page] .decision-panel {
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  width: min(100%, 64rem);
}

body[data-se-page] .decision-panel .cta-row,
body[data-se-page] .decision-panel .next-actions {
  justify-content: center !important;
}

body[data-se-page] .decision-panel p,
body[data-se-page] .contact-panel p,
body[data-se-canonical-product="true"] .next-step p {
  margin-left: auto !important;
  margin-right: auto !important;
}

body[data-se-canonical-product="true"] .product-offer-panel,
body[data-se-canonical-product="true"] .price-card {
  justify-items: center !important;
  align-items: center !important;
}

body[data-se-canonical-product="true"] .offer-panel-head,
body[data-se-canonical-product="true"] .turnaround-badge {
  justify-content: center !important;
  text-align: center !important;
}

body[data-se-canonical-product="true"] .product-proof-strip {
  justify-items: center !important;
}

body[data-se-canonical-product="true"] .product-proof {
  width: 100%;
  text-align: center !important;
}

/* Center card internals consistently without flattening forms or lists. */
body[data-se-page] :is(.feature-card,.step-card,.number-card,.catalog-card,.related-card,.poster-pillar),
body[data-se-canonical-product="true"] :is(.step-card,.related-card,.standards-grid > div) {
  align-items: center !important;
  justify-content: flex-start;
  text-align: center !important;
}

body[data-se-page] :is(.feature-card,.step-card,.number-card,.catalog-card,.related-card,.poster-pillar) > :is(h2,h3,p,.card-action,.card-price,.catalog-price),
body[data-se-canonical-product="true"] :is(.step-card,.related-card,.standards-grid > div) > :is(h2,h3,p) {
  margin-left: auto !important;
  margin-right: auto !important;
}

body[data-se-page] .pill-row,
body[data-se-page] .catalog-filters,
body[data-se-page] .footer-legal {
  justify-content: center !important;
}

/* Mobile navigation becomes a centered premium panel instead of a left-heavy list. */
@media (max-width: 1100px) {
  .site-header .wrap {
    justify-content: space-between !important;
  }

  .nav-toggle {
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  .nav-links {
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .nav-links[data-open="true"] {
    margin-top: .65rem;
    padding: 1.25rem 1rem 1.5rem !important;
    border: 1px solid rgba(237,203,123,.2);
    border-radius: 18px;
    background:
      radial-gradient(circle at 50% 0%,rgba(45,77,89,.22),transparent 35%),
      rgba(3,17,22,.98);
    box-shadow: 0 24px 60px rgba(0,0,0,.3);
  }

  .nav-links a,
  .nav-dropdown > button,
  .nav-butler-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: min(100%, 30rem) !important;
    min-height: 2.8rem;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: .72rem 1rem !important;
    text-align: center !important;
  }

  .nav-dropdown {
    width: 100% !important;
    text-align: center !important;
  }

  .nav-dropdown-menu {
    width: min(100%, 30rem) !important;
    margin: 0 auto !important;
    padding: .2rem 0 .5rem !important;
    text-align: center !important;
  }

  .nav-dropdown-menu a {
    min-height: 2.55rem !important;
    color: #b8c9ce !important;
  }

  .nav-butler-button,
  [data-crown-butler-open].nav-butler-button {
    margin-top: .55rem !important;
    border-color: rgba(237,203,123,.45) !important;
    border-radius: 999px !important;
    color: #edcb7b !important;
  }
}

/* The recurring middle panel remains truly centered on every phone width. */
@media (max-width: 700px) {
  body[data-se-page] .hero-aside {
    display: flex !important;
    width: min(100%, 38rem) !important;
    margin-top: 2rem !important;
    padding: 1.65rem 1.25rem !important;
  }

  body[data-se-page] .hero-brand-lockup {
    flex-direction: column !important;
    gap: .75rem !important;
  }

  body[data-se-page] .hero-aside h2 {
    margin-top: .85rem !important;
  }

  body[data-se-page] .hero-aside p {
    max-width: 32rem !important;
  }

  body[data-se-page] .decision-panel,
  body[data-se-page] .contact-panel,
  body[data-se-canonical-product="true"] :is(.price-card,.product-offer-panel,.next-step,.delivery-card) {
    width: min(100%, 38rem) !important;
  }
}
