/* FBPF Abogados — site implementation by Anatolii Krasnikov (an_cdmx)
   https://fbpf.com.mx/humans.txt */

@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Public+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap");

:root {
  --fbpf-blue: #041933;
  --fbpf-green: #163C37;
  --fbpf-white: #FFFFFF;
  --fbpf-grey: #C4C4C4;
  --fbpf-light: #F1F1EF;
  --fbpf-font-body: "Public Sans", sans-serif;
  --fbpf-font-title: "Lora", serif;
}

/* Animated / structural layout rules — brand green */
.c-border,
[data-load-container][data-theme="blue"] .c-border,
[data-load-container][data-theme="blue"] .u-background-silver .c-border,
[data-load-container][data-theme="blue"] .c-footer .c-border,
[data-theme="blue"] .c-border,
.u-background-silver .c-border {
  border-color: var(--fbpf-green) !important;
}

.c-panels_item {
  border-top-color: var(--fbpf-green) !important;
}

.c-panels_item_wrap:last-child .c-panels_item {
  border-bottom-color: var(--fbpf-green) !important;
}

.c-panels_item_clip_timeline {
  background-color: var(--fbpf-green) !important;
}

.c-fancy-content_borders_container {
  border-bottom-color: var(--fbpf-green) !important;
}

.c-footer_nav_main li:nth-child(odd),
.c-footer_nav_secondary li:nth-child(odd),
.c-footer_nav_main li:first-child,
.c-footer_nav_main li:nth-child(2),
.c-footer_nav_secondary li:first-child,
.c-footer_nav_secondary li:nth-child(2) {
  border-color: var(--fbpf-green) !important;
}

.c-content-full_list li {
  border-bottom-color: var(--fbpf-green) !important;
}

.c-nav_menu_list li::after,
.c-nav_visual::before {
  border-color: var(--fbpf-green) !important;
}

/* Slower, smoother line draw on scroll (theme default is 1s) */
.c-border {
  transition: transform 1.6s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

/* Body / subtitles / UI — Public Sans (Tipografía de la Marca) */
html,
body,
button,
input,
select,
textarea,
.u-text-label,
.u-text-big,
.c-panels_item_description,
.c-fancy-content_text,
.c-button_label,
.c-button,
.c-nav_fixed,
.c-nav_menu_list,
.c-nav_menu_list_item_label,
.c-member_role,
.c-contact_address,
.c-contact_contact,
.c-footer,
.c-link,
.c-form_checkbox_label,
.c-filters_item,
.c-accordion_item_toggler,
.c-wysiwyg,
.c-fbpf-hero-intro {
  font-family: var(--fbpf-font-body) !important;
}

/* Titles / accents / short phrases — Lora (Tipografía Secundaria) */
.c-heading,
.c-title,
.c-summary,
.c-fancy_cta_title_item,
.c-fancy-cta_content_summary,
.c-project_title,
.c-member_name,
.c-expertise_title,
.c-content-full_title,
.c-content-full_title .c-summary,
.c-panels_item_summary,
h1, h2, h3, h4, h5, h6 {
  font-family: var(--fbpf-font-title) !important;
}

/* Lora descenders (g, y, p, q) were clipped by split line-wrap overflow */
.c-summary,
.c-panels_item_summary {
  line-height: 1.28 !important;
}

/* Theme uses margin:-0.6em on .c-title>span for char-split; after we restore
   plain text that pulls "Servicios" / "FBPF" (and Equipo / FBPF) on top of each other. */
.c-page-header .c-title > span {
  display: block;
  overflow: visible;
  margin: 0;
  line-height: 1.05;
}

.c-summary .line-wrap,
.c-panels_item_summary .line-wrap,
.c-heading .line-wrap,
.c-title .line-wrap,
.c-fancy-cta_content_summary .line-wrap {
  padding-bottom: 0.22em;
  margin-bottom: -0.08em;
  overflow: hidden;
}

/* Body copy line reveal — animation only, inherit normal paragraph type */
.c-fbpf-body-split + .c-fbpf-body-split {
  margin-top: 1rem;
}

.c-fbpf-body-split .line-wrap {
  overflow: hidden;
  padding-bottom: 0.08em;
  margin-bottom: -0.04em;
}

.c-fbpf-body-split .line-wrap > span {
  display: block;
  transform: translate3d(0, 100%, 0);
  transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.c-fbpf-body-split.is-inview .line-wrap > span {
  transform: translate3d(0, 0, 0);
}

.c-fbpf-body-split.is-inview .line-wrap:nth-child(1) span { transition-delay: 0.1s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(2) span { transition-delay: 0.2s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(3) span { transition-delay: 0.3s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(4) span { transition-delay: 0.4s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(5) span { transition-delay: 0.5s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(6) span { transition-delay: 0.6s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(7) span { transition-delay: 0.7s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(8) span { transition-delay: 0.8s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(9) span { transition-delay: 0.9s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(10) span { transition-delay: 1s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(11) span { transition-delay: 1.1s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(12) span { transition-delay: 1.2s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(13) span { transition-delay: 1.3s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(14) span { transition-delay: 1.4s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(15) span { transition-delay: 1.5s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(16) span { transition-delay: 1.6s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(17) span { transition-delay: 1.7s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(18) span { transition-delay: 1.8s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(19) span { transition-delay: 1.9s; }
.c-fbpf-body-split.is-inview .line-wrap:nth-child(20) span { transition-delay: 2s; }

/* Brand colors */
.u-text-blue,
[data-theme="blue"] .u-text-blue {
  color: var(--fbpf-blue) !important;
}

.u-text-gray {
  color: var(--fbpf-grey) !important;
}

/* Soft muted: "Áreas de Especialización" + service index 01–08 on dark blue.
   Must beat main.css `[data-load-container][data-theme="blue"] .c-summary_label { color:#fff }`.
   Numbers stay light (not navy) so they remain visible on #041933. */
[data-load-container][data-theme="blue"] .u-text-label.c-summary_label,
[data-load-container][data-theme="blue"] .c-content-full .u-text-label.u-text-gray {
  color: rgba(241, 241, 239, 0.42) !important;
}

/* Summary / body intros stay left so words are not clipped or split.
   `break-word` only kicks in when a word cannot fit its line at all, so it
   guards narrow phones without splitting words that would otherwise wrap. */
.c-fbpf-summary-end,
.c-fbpf-summary-end .line-wrap,
.c-fbpf-text-end,
.c-fbpf-body-split,
.c-fbpf-body-split .line-wrap,
.c-panels_item_description,
.c-member_bio p {
  text-align: left !important;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
  -webkit-hyphens: none;
}

/* Headline-sized summaries: same wrapping guard, alignment left to the theme. */
.c-summary,
.c-summary .line-wrap,
.c-member_name,
.c-title {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
  -webkit-hyphens: none;
}

.c-home .u-text-right,
.c-summary.u-text-right,
#expertises .u-text-right {
  text-align: left !important;
}

/* Phones: clip rare 100vw overflow without breaking full-bleed hero/CTA */
@media (max-width: 999px) {
  html,
  body,
  [data-load-container] {
    overflow-x: clip;
  }
}

/* Home title above hero — original grey (as in early commits / screenshot) */
.c-home .c-title .u-text-gray {
  color: #676767 !important;
}

.u-background-silver {
  background-color: var(--fbpf-light) !important;
}

body,
[data-load-container] {
  color: var(--fbpf-blue);
}

.c-fbpf-logo {
  display: block;
  height: auto;
  width: auto;
  max-height: 2.5rem;
}

.c-header_logo .c-fbpf-logo {
  max-height: 3.5rem;
}

.c-header_logo .c-fbpf-logo--header {
  max-height: 2.75rem;
  width: auto;
  max-width: min(20rem, 58vw);
  object-fit: contain;
}

/* Keep header wordmark dark on light header (don't invert with blue theme) */
[data-theme="blue"] .c-header_logo .c-fbpf-logo--header {
  filter: none;
}

/* Inner pages: logosAbogados-08 light wordmark (already light for dark bars) */
.c-header_logo .c-fbpf-logo--header-light {
  max-height: 2.75rem;
  width: auto;
  max-width: min(20rem, 58vw);
  object-fit: contain;
  /* On light page backgrounds, force a dark mark */
  filter: brightness(0);
}

[data-theme="blue"] .c-header_logo .c-fbpf-logo--header-light {
  filter: none !important;
}

.c-nav_button .c-fbpf-logo {
  display: block;
  max-height: 1.5rem;
  width: auto;
  margin: 0 2.25rem 0 0;
  padding: 0.12rem 0;
  object-fit: contain;
}

.c-nav_button_link {
  display: inline-flex;
  align-items: center;
  line-height: 0;
  margin-right: 0.35rem;
}

.c-nav_button_close {
  flex-shrink: 0;
  margin-left: 0.15rem;
}

.c-transition_logo .c-fbpf-logo {
  max-height: 2.5rem;
  filter: brightness(0) invert(1);
}

/* After load the overlay collapses to height 0; keep the transition isotype
   from sticking to the top of the viewport */
.c-transition_overlay {
  overflow: hidden !important;
}

html.has-dom-ready:not(.is-preloading) .c-transition_logo,
html.has-dom-ready:not(.is-preloading) .c-transition_logo .c-fbpf-logo {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

[data-theme="blue"] .c-fbpf-logo--nav,
[data-theme="blue"] .c-header_logo .c-fbpf-logo:not(.c-fbpf-logo--header-light) {
  filter: brightness(0) invert(1);
}

.c-nav_langswitcher {
  display: none !important;
}

.c-projects-slider,
.c-projects-slider_controls {
  display: none !important;
}

.c-stats,
.c-projects-list_wrap {
  display: none !important;
}

.c-contact_career {
  display: none !important;
}

.c-contact_banner {
  display: none !important;
}

/*
 * Contour half — FIT inside left red box (contain, no crop).
 * Box @1440: left 0 → left vertical border 245.4px, height = main 410px.
 * Width = container pad + 58.333% of first quarter (= space left of borders_col_inner).
 */
.c-fancy-content_circle,
.c-fancy-content_circles,
.c-fancy-content_circles::before,
.c-fancy-content_circles::after {
  display: none !important;
}

.c-fancy-content_main {
  position: relative;
}

.c-fbpf-fancy-iso-layer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  /* pad + (1 - 41.66667%) of first 1/4 column */
  width: calc(3.125rem + (100% - 6.25rem) * 0.14583333);
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.c-fancy-content_main > .o-container {
  position: relative;
  z-index: 1;
}

.c-fbpf-fancy-iso {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.c-fbpf-fancy-iso img {
  display: block !important;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
  opacity: 0.45;
}

@media (max-width: 999px) {
  .c-fbpf-fancy-iso-layer {
    display: none;
  }
}

@media (max-width: 699px) {
  .c-fbpf-fancy-iso-layer {
    width: calc(2.5rem + (100% - 5rem) * 0.14583333);
  }
}

/* —— FBPF hero video —— */
.c-home .c-fbpf-hero {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 36rem;
  max-height: none;
  background: var(--fbpf-blue);
  overflow: hidden;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}

.c-home .c-fbpf-hero .c-cover {
  position: absolute;
  inset: 0;
  background-color: #041933;
  background-image: url("/assets/videos/hero-brand-poster.png?v=20260819f");
  background-size: cover;
  background-position: center center;
}

.c-home .c-fbpf-hero .c-cover video {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transform: translate3d(0, -50%, 0);
  background-color: #041933;
  opacity: 0;
}

.c-home .c-fbpf-hero .c-cover video.is-playing {
  opacity: 1;
}

@media (max-width: 999px) {
  .c-home .c-fbpf-hero,
  .c-home .c-fbpf-hero .c-cover {
    background-color: var(--fbpf-blue) !important;
  }
}

.u-nowrap {
  white-space: nowrap;
}

.c-fbpf-hero_stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.c-fbpf-hero_scroll {
  position: absolute;
  inset: 0;
  will-change: transform;
  pointer-events: none;
}

.c-fbpf-hero_panels {
  position: absolute;
  inset: -10%;
  background:
    linear-gradient(125deg, transparent 0%, transparent 38%, rgba(255, 255, 255, 0.035) 38%, rgba(255, 255, 255, 0.035) 62%, transparent 62%),
    linear-gradient(125deg, transparent 0%, transparent 55%, rgba(22, 60, 55, 0.18) 55%, rgba(22, 60, 55, 0.18) 78%, transparent 78%);
  animation: fbpfPanelDrift 26s linear infinite;
}

@keyframes fbpfPanelDrift {
  0% { transform: translate(-6%, -4%) rotate(0deg); }
  50% { transform: translate(6%, 4%) rotate(2deg); }
  100% { transform: translate(-6%, -4%) rotate(0deg); }
}

.c-fbpf-hero_lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.c-fbpf-hero_arc1 {
  transform-origin: 15% 20%;
  animation: fbpfArc1 22s ease-in-out infinite;
}

.c-fbpf-hero_arc2 {
  transform-origin: 85% 75%;
  animation: fbpfArc2 28s ease-in-out infinite;
}

.c-fbpf-hero_rect1 {
  transform-origin: 12% 30%;
  animation: fbpfRect1 18s ease-in-out infinite;
}

.c-fbpf-hero_rect2 {
  transform-origin: 10% 78%;
  animation: fbpfRect2 24s ease-in-out infinite;
}

.c-fbpf-hero_diag1 {
  transform-origin: 70% 8%;
  animation: fbpfDiag1 20s ease-in-out infinite;
}

@keyframes fbpfArc1 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); }
  50% { transform: translate(60px, -40px) rotate(10deg) scale(1.08); }
  100% { transform: translate(0, 0) rotate(0deg) scale(1); }
}

@keyframes fbpfArc2 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); }
  50% { transform: translate(-50px, 50px) rotate(-8deg) scale(1.05); }
  100% { transform: translate(0, 0) rotate(0deg) scale(1); }
}

@keyframes fbpfRect1 {
  0% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(25px, -70px) rotate(4deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}

@keyframes fbpfRect2 {
  0% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(-20px, 55px) rotate(-3deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}

@keyframes fbpfDiag1 {
  0% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(-45px, 35px) rotate(-6deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}

.c-fbpf-hero_vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 50%, rgba(4, 25, 51, 0) 35%, rgba(2, 12, 26, 0.6) 100%);
  pointer-events: none;
}

/* Tagline sits in the light band above the hero, vertically centered. */
.c-home {
  padding-top: 0;
}

.c-home > .o-container:has(.c-fbpf-hero-intro) {
  display: flex;
  align-items: center;
  min-height: 8.5rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.c-fbpf-hero-intro {
  margin: 0;
  max-width: min(42rem, 100%);
  color: var(--fbpf-blue);
  font-family: var(--fbpf-font-body);
  font-size: clamp(1.05rem, 1.9vw, 1.35rem);
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0.01em;
}

html.has-dom-ready-callback .c-home .c-fbpf-hero-intro.u-anim:not([data-scroll]) {
  transition-delay: 0.75s;
}

/* Centered brand mark over hero video. */
.c-fbpf-hero_center {
  --fbpf-hero-brand-width: min(48rem, 86vw);
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem clamp(1rem, 3vw, 2.5rem);
  text-align: center;
  pointer-events: none;
}

.c-fbpf-hero_center-stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: var(--fbpf-hero-brand-width);
  max-width: 100%;
}

.c-fbpf-hero_center-logo {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 8px 28px rgba(0, 0, 0, 0.35));
}

@media (max-width: 699px) {
  .c-fbpf-hero_center {
    --fbpf-hero-brand-width: min(22rem, 90vw);
  }

  /* Fixed nav ~4.5rem; equal air between nav, text, and hero. */
  .c-home > .o-container:has(.c-fbpf-hero-intro) {
    min-height: 0;
    padding-top: 6.75rem;
    padding-bottom: 2.25rem;
  }

  .c-fbpf-hero-intro {
    font-size: clamp(1rem, 4vw, 1.15rem);
  }
}

.c-member_bio p {
  margin: 0 0 1rem;
}

.c-member_cred {
  font-size: 0.95em;
  line-height: 1.45;
  color: var(--fbpf-blue);
  opacity: 0.85;
}

.c-member_cred + .c-member_cred {
  margin-top: -0.5rem;
}

.c-member_cred:last-of-type {
  margin-bottom: 1.5rem;
}

/* Equipo — wider bios + scroll room before next sticky panel covers text */
#team .c-panels_item_description {
  max-width: 42rem;
}

#team .c-member_bio {
  max-width: 42rem;
  line-height: 1.7;
}

#team .c-member_bio p {
  margin-bottom: 1.15rem;
}

#team .c-panels_item_wrap:not(:last-child) .c-panels_item {
  padding-bottom: clamp(10rem, 48vh, 26rem) !important;
}

#team .c-panels_item_wrap:last-child .c-panels_item {
  padding-bottom: clamp(5rem, 18vh, 10rem) !important;
}

/* Contact — infos: no right-edge clipping */
.c-contact_infos {
  position: relative;
  overflow: visible;
}

.c-fbpf-contact-info {
  z-index: 1;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.c-fbpf-contact-info .c-contact_address,
.c-fbpf-contact-info .c-contact_contact {
  max-width: 100%;
  word-break: normal;
  overflow-wrap: normal;
}

@media (min-width: 1000px) {
  .c-fbpf-contact-info .c-contact_address a,
  .c-fbpf-contact-info .c-contact_contact a,
  .c-fbpf-contact-info .c-contact_contact span {
    white-space: nowrap;
  }
}

/* Contact — Google Map */
.c-contact_map {
  position: relative;
  width: 100%;
  height: min(28rem, 55vh);
  min-height: 18rem;
  background: var(--fbpf-light);
  overflow: hidden;
}

.c-contact_map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(0.15) contrast(1.02);
}

/* Panels — same AE reference animation everywhere (v3 webm).
   Only the container size changes; no crop/offset variants. */
.c-fbpf-panel-visual {
  background: var(--fbpf-green);
}

.c-fbpf-panel-stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: var(--fbpf-green);
}

.c-fbpf-panel-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  background: var(--fbpf-green);
  pointer-events: none;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .c-fbpf-panel-video {
    display: none;
  }
}

/* Footer visual: hide failed FBPF experiment, keep only the top border */
.c-footer .c-footer_visual {
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

.c-footer .c-footer_visual .c-border.-top {
  position: relative;
  display: block;
}

/* —— Site-wide side/CTA visuals: same AE brand video as panels —— */
.c-content-full_visual,
.c-page-header_visual {
  position: relative;
  overflow: hidden;
  background: var(--fbpf-green);
}

.c-fbpf-service-visual {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: var(--fbpf-green);
  overflow: hidden;
}

.c-fbpf-service-stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.c-fbpf-service-stage .c-fbpf-panel-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  background: var(--fbpf-green);
  pointer-events: none;
}

/* Fancy CTA: full-bleed brand video behind text */
.c-fancy-cta_clip .c-fbpf-service-visual,
.c-fbpf-service-visual--cta {
  position: relative;
  width: 100vw;
  height: 100vh;
}

.c-fancy-cta_clip .c-fbpf-service-visual::after,
.c-fbpf-service-visual--cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(2, 11, 22, 0.35) 0%,
    rgba(2, 11, 22, 0.55) 55%,
    rgba(2, 11, 22, 0.72) 100%
  );
}

@media (prefers-reduced-motion: reduce) {
  .c-fbpf-service-stage .c-fbpf-panel-video {
    display: none;
  }
}

/* Servicios: stacked body paragraphs */
.c-content-full .o-grid_item > p + p {
  margin-top: 1rem;
}

/*
  Servicios articles: match homepage panel vertical rhythm.
  Home uses .c-panels.-min-height .c-panels_item_content {
    display:flex; flex-direction:column; justify-content:space-between;
    min-height: calc(90vh - 6.25rem);
  }
  So the body sits near the bottom of a tall column — not a small margin under the title.
*/
@media (min-width: 1000px) {
  #expertises .c-content-full [class*="u-gc-12/24"] {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    min-height: 100%;
  }

  /* Push body block to the bottom of the text column (same idea as space-between) */
  #expertises .c-content-full [class*="u-gc-12/24"] > .o-grid {
    margin-top: auto;
    padding-top: 9.375rem; /* keep at least homepage huge gap under the title */
  }

  #expertises .c-content-full [class*="u-gc-7/12"] {
    transform: translateX(-2cm);
  }

  /* Odd rows used to force right-align; keep left so words stay whole. */
  #expertises .c-content-full [class*="u-gc-7/12"],
  #expertises .c-content-full [class*="u-gc-7/12"] p,
  #expertises .c-content-full [class*="u-gc-7/12"] .c-fbpf-body-split,
  #expertises .c-content-full [class*="u-gc-7/12"] .line-wrap {
    text-align: left !important;
  }
}