/* Shared site alignment system — one outer grid across every public page. */
:root {
  --sl-shell: 1180px;
  --sl-gutter: 32px;
}

/* Keep compact social and footer styling while preserving usable touch targets. */
.follow-list .follow-btn,
.footer-socials a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  min-height: 32px !important;
}

.footer-contact a,
.footer-col a,
.footer-bottom a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

/* Preserve the complete wordmark in every shared header and footer. */
img[src*="socially-loud-horizontal"],
img[src*="socially-loud-logo-"] {
  display: block !important;
  width: auto;
  max-width: 100%;
  height: auto !important;
  object-fit: contain !important;
  object-position: left center !important;
  overflow: visible !important;
}

.nav-logo,
.brand,
footer a:has(img[src*="socially-loud-horizontal"]),
footer a:has(img[src*="socially-loud-logo-"]) {
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
}

footer img[src*="socially-loud-horizontal"],
footer img[src*="socially-loud-logo-"] {
  width: clamp(168px, 17vw, 205px) !important;
}

/* Primary page frames */
.container,
.shell,
.nav-inner,
.lib-hero-in,
.feat-band-in,
.controls-in,
.px-sec,
.px-seen-in,
.px-reel-in,
.px-pub-wrap {
  width: 100% !important;
  max-width: var(--sl-shell) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--sl-gutter) !important;
  padding-right: var(--sl-gutter) !important;
  box-sizing: border-box !important;
}

/* Components whose own vertical margins must remain untouched. */
.grid,
.empty {
  width: 100% !important;
  max-width: var(--sl-shell) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--sl-gutter) !important;
  padding-right: var(--sl-gutter) !important;
  box-sizing: border-box !important;
}

/* Homepage editorial cards: content-led height, consistent baselines. */
.loud-letter .posts-grid {
  align-items: stretch !important;
}

.loud-letter .post {
  min-height: 0 !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 20px 0 16px !important;
}

.loud-letter .post-title {
  min-height: 2.15em;
}

.loud-letter .post-excerpt {
  margin-bottom: 18px !important;
}

.loud-letter .post-meta {
  margin-top: auto !important;
}

/* Library cards use the same lower baseline without forced empty height. */
.grid {
  align-items: stretch;
}

.grid > .card,
.grid > a.card {
  height: 100%;
}

.grid .card-body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* The consultation page used a wider, unrelated grid; bring it onto the site frame. */
.decision-finder,
.sessions,
.bundles,
.randa,
.details {
  width: 100% !important;
  max-width: var(--sl-shell) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--sl-gutter) !important;
  padding-right: var(--sl-gutter) !important;
  box-sizing: border-box !important;
}

@media (min-width: 761px) {
  .site-head,
  .site-head + main .close,
  .site-head ~ footer {
    padding-left: max(var(--sl-gutter), calc((100vw - var(--sl-shell)) / 2 + var(--sl-gutter))) !important;
    padding-right: max(var(--sl-gutter), calc((100vw - var(--sl-shell)) / 2 + var(--sl-gutter))) !important;
  }

  .site-head + main .hero-copy {
    padding-left: max(var(--sl-gutter), calc((100vw - var(--sl-shell)) / 2 + var(--sl-gutter))) !important;
  }
}

@media (max-width: 700px) {
  :root { --sl-gutter: 20px; }

  .loud-letter .post-title {
    min-height: 0;
  }

  .decision-finder,
  .sessions,
  .bundles,
  .randa,
  .details {
    padding-left: var(--sl-gutter) !important;
    padding-right: var(--sl-gutter) !important;
  }
}

/* Final interaction sizing override after homepage-specific reset rules. */
body:has(.work-paths) .follow-list .follow-btn,
body:has(.work-paths) .follow-list .follow-btn .ico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  min-height: 32px !important;
}

/* V67 hybrid: restore the live site's depth without restoring its clutter. */
body:has(.work-paths) .work-services {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px 22px !important;
  margin-top: 25px !important;
  padding: 0 !important;
  border: 0 !important;
}

body:has(.work-paths) .work-services-label {
  color: var(--sl-navy) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}

body:has(.work-paths) .work-services a {
  color: rgba(24,42,74,.68) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
}

body:has(.work-paths) .work-services a:hover {
  color: var(--sl-navy) !important;
}

body:has(.work-paths) .stats {
  padding: 38px 0 40px !important;
}

body:has(.work-paths) .stats-note {
  display: none !important;
}

body:has(.work-paths) .stats .section-header {
  display: flex !important;
  margin: 0 0 27px !important;
}

body:has(.work-paths) .stats .eyebrow {
  color: var(--sl-yellow) !important;
  border-bottom-color: var(--sl-yellow) !important;
}

body:has(.work-paths) .stats .section-title {
  margin-top: 9px !important;
  color: #fff !important;
  font-size: clamp(38px, 4.1vw, 54px) !important;
  line-height: .96 !important;
}

body:has(.work-paths) .stats .section-title .it {
  color: #fff !important;
}

body:has(.work-paths) .testimonials {
  padding-top: 46px !important;
}

body:has(.work-paths) .testimonials .section-title {
  font-size: clamp(44px, 5vw, 66px) !important;
}

body:has(.work-paths) .testimonial-quote {
  font-size: 17px !important;
  line-height: 1.48 !important;
}

body:has(.work-paths) .testimonial-avatar {
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--sl-yellow) !important;
  color: var(--sl-navy) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
}

body:has(.work-paths) .testimonial-author {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

body:has(.work-paths) footer .footer-grid {
  grid-template-columns: minmax(0,1fr) auto auto !important;
  gap: 42px !important;
  align-items: center !important;
}

body:has(.work-paths) footer .footer-trilogy,
body:has(.work-paths) footer .footer-explore {
  min-width: 135px !important;
}

body:has(.work-paths) footer .footer-trilogy ul,
body:has(.work-paths) footer .footer-explore ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body:has(.work-paths) footer .footer-trilogy li {
  margin: 0 0 5px !important;
}

@media (max-width: 900px) {
  body:has(.work-paths) footer .footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 22px 34px !important;
  }

  body:has(.work-paths) footer .footer-brand-block {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 700px) {
  body:has(.work-paths) .work-services {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px 16px !important;
  }

  body:has(.work-paths) .work-services-label {
    grid-column: 1 / -1 !important;
  }

  body:has(.work-paths) .stats .section-header {
    margin-bottom: 22px !important;
  }

  body:has(.work-paths) footer .footer-grid {
    grid-template-columns: 1fr !important;
  }

  body:has(.work-paths) footer .footer-brand-block {
    grid-column: auto !important;
  }
}

/* Homepage conversion pass: align the story, tighten the reading rhythm, clarify the next move. */
body:has(.work-paths) .founder {
  padding-bottom: 34px !important;
}

body:has(.work-paths) .founder-grid {
  grid-template-columns: minmax(320px, .82fr) minmax(0, 1.18fr) !important;
  gap: 36px !important;
}

body:has(.work-paths) .founder-content {
  width: 100% !important;
  max-width: none !important;
}

body:has(.work-paths) .founder-meta,
body:has(.work-paths) .follow-randa {
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
  gap: 24px !important;
}

body:has(.work-paths) .follow-randa {
  display: grid !important;
  align-items: center !important;
  margin-top: 10px !important;
}

body:has(.work-paths) .follow-label,
body:has(.work-paths) .follow-list {
  margin: 0 !important;
}

body:has(.work-paths) .follow-list {
  justify-content: flex-start !important;
  gap: 18px !important;
}

body:has(.work-paths) .follow-btn,
body:has(.work-paths) .follow-btn .ico {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--sl-navy) !important;
}

body:has(.work-paths) .we-build {
  padding-top: 30px !important;
}

body:has(.work-paths) .community-heading {
  grid-template-columns: minmax(300px, .82fr) minmax(380px, 1.18fr) !important;
  gap: 36px !important;
  align-items: start !important;
  margin-bottom: 22px !important;
}

body:has(.work-paths) .community-heading-copy {
  max-width: 610px !important;
  padding-top: 2px !important;
}

body:has(.work-paths) .loud-letter {
  padding: 38px 0 40px !important;
}

body:has(.work-paths) .loud-letter .section-header {
  margin-bottom: 20px !important;
}

body:has(.work-paths) .loud-letter .section-title {
  font-size: clamp(40px, 4.1vw, 56px) !important;
}

body:has(.work-paths) .loud-letter .posts-grid {
  gap: clamp(28px, 3.2vw, 42px) !important;
}

body:has(.work-paths) .loud-letter .post {
  min-height: 0 !important;
  height: auto !important;
  padding: 15px 0 4px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:has(.work-paths) .loud-letter .post-title {
  min-height: 0 !important;
  margin: 15px 0 9px !important;
  font-size: clamp(23px, 2vw, 28px) !important;
}

body:has(.work-paths) .loud-letter .post-excerpt {
  margin: 0 !important;
}

body:has(.work-paths) .loud-letter .post-meta {
  margin-top: 18px !important;
  padding-top: 0 !important;
}

body:has(.work-paths) .work-paths {
  padding: 42px 0 38px !important;
}

body:has(.work-paths) .ways-intro {
  grid-template-columns: minmax(520px, 1.08fr) minmax(340px, .92fr) !important;
  gap: 48px !important;
  align-items: end !important;
  margin-bottom: 28px !important;
}

body:has(.work-paths) .ways-intro p {
  max-width: 520px !important;
}

body:has(.work-paths) .work-paths-grid-v39 {
  gap: 34px !important;
}

body:has(.work-paths) .work-paths-grid-v39 .work-path {
  min-height: 210px !important;
  padding-top: 6px !important;
}

body:has(.work-paths) .work-path h3 {
  margin-top: 10px !important;
}

body:has(.work-paths) .work-path-actions a,
body:has(.work-paths) .work-path-actions button {
  width: 100% !important;
  justify-content: space-between !important;
  font-size: 11px !important;
  letter-spacing: .13em !important;
  text-align: left !important;
}

@media (max-width: 900px) {
  body:has(.work-paths) .founder-grid,
  body:has(.work-paths) .community-heading,
  body:has(.work-paths) .ways-intro {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  body:has(.work-paths) .follow-randa {
    grid-template-columns: minmax(110px, auto) 1fr !important;
    gap: 18px !important;
  }
}

@media (max-width: 700px) {
  body:has(.work-paths) .founder {
    padding-bottom: 26px !important;
  }

  body:has(.work-paths) .we-build {
    padding-top: 26px !important;
  }

  body:has(.work-paths) .follow-randa {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body:has(.work-paths) .loud-letter .posts-grid {
    gap: 20px !important;
  }

  body:has(.work-paths) .work-paths-grid-v39 .work-path {
    min-height: 0 !important;
  }
}