/**
 * @file
 * Global styles.
 */

/* Add custom styles here */

/* Styles for Text Editor */
h2.glsub-ck-bluetext,
h3.glsub-ck-bluetext,
p.glsub-ck-bluetext,
.ssg-page-intro .glsub-ck-bluetext {
  color: var(--primary);
}

/* Make the hero full bleed vertically - used to be 90% */
.region--fixed-hero {
  --region-fixed-hero-height: max(500px, calc(50dvh - var(--drupal-displace-offset-top, 0px) - var(--drupal-displace-offset-bottom, 0px)));
}

/* The .full-width breakout formula assumes the element is inside a .container.
   In the fixed hero the gl-hero is already full-width, so reset the offset. */
.region--fixed-hero .full-width {
  margin-inline-start: 0;
  width: 100%;
}

/* On mobile, margin-inline-start: calc(-50cqw + 50%) on .full-width children
   resolves to 0 instead of the expected negative value, shifting sections right
   and overflowing the right edge. Adding padding-inline to region-container
   shrinks the % reference point so the calc() turns negative again, correctly
   breaking full-width elements out to the left. */
@media (width <= 900px) {
  .section-cta .grid-cell {
    grid-column: 1 / -1;
  }
}

@media (width <= 700px) {
  .region-container {
    padding-inline: var(--sp2);
  }

  .page-node-type-service .node__content.container {
    padding-inline: var(--sp2);
  }

  .section-cta .title-cta h2 {
    font-size: 2rem; /* 32px, down from 48px on mobile */
  }

  .stat__stat {
    --stat-stat-font-size: 3.75rem; /* 60px, down from 88px */
  }

  .section-cta .button {
    --button-height: 38px;
    --button-font-size: 13px;
    --button-padding-block: 8px;
    --button-padding-inline: 16px;
  }
}

/* Keep the chevron toggle on the same line as the level-1 menu text.
   flex: 1 fills the row so the button stays beside it;
   the submenu ul (flex-basis: 100%) still wraps to its own row. */
.popover-menu__list-item--level-1 > .popover-menu__link {
  flex: 1;
}

/* <nolink> items render as <a> without href, so the browser gives them
   default cursor and selectable text. Override both. */
.popover-menu__link--nolink {
  cursor: pointer;
  user-select: none;
}

/* Main layout tweaks */
.site-main {
  padding-top: 2rem;
}

.header-popover__logo {
  filter: none;
  max-width: 30px;
}

.article.node .grid {
  grid-template-areas: "sidebar-first content content content content content content content content content content sidebar-second";
}

/* Resize the menu logo */
.header-logo__link {
  --header-logo-max-height: 144px;
}

/* Augment the hero CTA with subtitles */
/* due to inability to insert linebreaks in URL title */

.path-frontpage .gl-hero__media > picture {
  opacity: 0.9;
}

.page-node-type-service .gl-hero__media::after {
  content: none;
}

.site-footer__bottom {
  border-image: linear-gradient(180deg, var(--footer-border-color) 1px, transparent 0) fill 0//0 100vw 0 100vw;
}

/* Fix the spacing for the 'current site' bullet in the footer */
.side-menu__link[class] {
  &.is-active {
    &::before {
      inset-inline-start: 0px;
    }
  }
}

.page-node-type-insight .block-field-blocknodeinsightfield-header-image img {
  width: 100%;
}

/* Push the homepage bios apart */

bio-card + .bio-card {
  margin-top: var(--spacing-m);
}

.bio-card img {
  border: 1px solid rgba(26, 58, 143, 0.25);
  border-radius: 6px;
  box-shadow: 3px 3px 2px rgba(26, 58, 143, 0.15);
}

tr {
  border-bottom: none;
}


/* Testimonial Tweaks */

.service--strategy .section-strategy-testimonials .testimonial__content {
  --testimonial-min-height: 300px;
}

.service--strategy .section-strategy-testimonials .testimonial__second img {
  object-fit: contain;
  padding: 1rem;
}

.service--media .section-strategy-testimonials .testimonial__content {
  --testimonial-min-height: 500px;
}

.service--media .section-strategy-testimonials .testimonial__second picture,
.service--media .section-strategy-testimonials .testimonial__second img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-strategy-testimonials .testimonial__second {
  display: flex;
  align-items: center;
  justify-content: center;

  img {
    position: static;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }
}

/* Service page intro — first paragraph blue, rest inherits default */

.ssg-page-intro p:first-child {
  color: var(--theme-text-color-primary);
}

/* Service card image fill — media variant only */

.service--media .service-card figure,
.service--media .service-card picture,
.service--media .service-card img {
  display: block;
  width: 100%;
}

/* Extra Parts */

.extra-nav {
  background-color: var(--neutral-200);
}