/* Shared layout and type scale, based on the Sustainability page.
   Important declarations intentionally supersede legacy utilities and scoped page styles. */
:root {
  --site-gutter: 56px;
  --site-width: min(1320px, calc(100vw - var(--site-gutter) * 2));
  --site-h1: clamp(48px, 4.9vw, 76px);
  --site-h2: clamp(36px, 4vw, 58px);
  --site-h3: 26px;
  --site-body: 17px;
  --site-lead: 22px;
  --site-small: 12px;
  --site-label: 11px;
  --site-action: 14px;
}
body .container,
body .container-1800,
body .ab-container,
body .sus-container,
body .si-container,
body .sd-container,
body .editorial-container,
body .editorial-facts,
body .contact-editorial .tp-contact-map-area {
  width: var(--site-width) !important;
  max-width: 1320px !important;
  margin-inline: auto !important;
}
body .container { padding-inline: 0 !important; }
body .container > .row { --bs-gutter-x: 24px; margin-inline: -12px; }
body .container > .row > [class*="col-"] { padding-inline: 12px; }
/* Contact uses a border around its grid, rather than Bootstrap gutters. */
body .contact-editorial .tp-contact-ptb > .container > .row { margin-inline: 0; }
body .contact-editorial .tp-contact-ptb > .container > .row > [class*="col-"] { padding-inline: 0; }
body .ab-hero, body .sus-hero, body .service-intro {
  width: var(--site-width) !important;
  margin-inline: auto !important;
}
body .ab-hero-copy, body .sus-hero-copy { padding-left: 0 !important; }
body .service-intro .si-container { width: 100% !important; }
body .tp-header-menu > nav > ul > li > a { font-size: var(--site-action) !important; }
/* Anchor the language menu inward, including while it is hidden. */
body .tp-header-lan-content { left: auto; right: 0; }
/* Full-width fact grids must not extend their negative gutters off-screen. */
body .tp-fact-ptb > .container-fluid > .row { margin-inline: 0; }
body .tp-cn-blog-item-title { overflow-wrap: anywhere; }
body .tp-cn-blog-item-title br { display: none; }
body .tp-at-download-item-title { overflow-wrap: anywhere; hyphens: auto; }

/* Keep hero copy and statistics in the same container flow at every width.
   Viewport-based absolute offsets previously pushed the cards over the copy. */
body .brieker-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 34px;
  align-items: end;
}
body .brieker-hero-layout .tp-at-hero-wrapper {
  min-width: 0;
  max-width: 100%;
  padding-bottom: 0;
}
body .brieker-hero-layout .tp-at-hero-wrapper-box {
  position: static;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  max-width: 540px;
  min-width: 0;
  margin: 0;
  gap: 12px;
}
body .brieker-hero-layout .tp-at-hero-card {
  display: flex;
  flex-direction: column;
  width: auto;
  min-width: 0;
  padding: clamp(20px, 2vw, 32px);
  overflow-wrap: anywhere;
}
body .brieker-hero-layout .tp-at-hero-card-sub { margin-bottom: 28px; }
body .brieker-hero-layout .tp-at-hero-card p { margin-top: auto; }
body .brieker-hero-layout .tp-fi-hero-sub { min-width: 0; }
body .brieker-hero-layout .tp-fi-hero-sub > span { flex-shrink: 0; }
body .brieker-hero-layout .tp-fi-hero-sub p { min-width: 0; }
body .brieker-hero-layout .tp-fi-hero-sub br { display: none; }
@media (min-width: 1200px) {
  body .brieker-hero-layout {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 440px);
    gap: clamp(32px, 3vw, 48px);
  }
}
@media (max-width: 1399px) {
  body .brieker-hero-layout .tp-cn-hero-title br { display: none; }
}
@media (max-width: 479px) {
  body .brieker-hero-layout .tp-at-hero-wrapper-box { grid-template-columns: minmax(0, 1fr); }
}

body main :is(h1,h2,h3,h4,h5,h6), body footer :is(h2,h3) {
  font-family: var(--tp-ff-heading) !important;
  font-style: normal !important;
}
body main h1:not(.tp-error-title):not(.tp-cn-success-item-title) {
  font-size: var(--site-h1) !important;
  line-height: 1.04 !important;
  font-weight: 400 !important;
  letter-spacing: -.052em !important;
}
body main h2:not(.tp-cn-counter-number):not(.tp-footer-widget-title) {
  font-size: var(--site-h2) !important;
  line-height: 1.1 !important;
  font-weight: 400 !important;
  letter-spacing: -.045em !important;
}
body main h3:not(.tp-about-fact-item-title):not(.tp-contact-info-title) {
  font-size: var(--site-h3) !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  letter-spacing: -.025em !important;
}
/* Card headings retain their semantic size even in legacy h2 markup. */
body main :is(.tp-at-download-item-title,.tp-at-hero-card-title,.tp-case-studies-item-title,.tp-cn-blog-item-title) {
  font-size: var(--site-h3) !important;
  line-height: 1.25 !important;
}
body main p, body main :is(input,textarea,select) {
  font-size: var(--site-body) !important;
  line-height: 1.7 !important;
}
body main :is(input,textarea)::placeholder { font-size: var(--site-body) !important; }
body main :is(.ab-lead,.editorial-intro) { font-size: var(--site-lead) !important; line-height: 1.5 !important; }
body main :is(.ab-facts,.editorial-facts,.ab-market-grid,.tp-contact-info-content) p,
body main :is(.ab-experience-note,.ajax-response) { font-size: var(--site-action) !important; }
body main :is(.ab-eyebrow,.sus-kicker,.si-label,.sd-label,.editorial-eyebrow,.tp-section-sub,.tp-section-cn-sub,.tp-section-at-subtitle,.tp-contact-info-title) {
  font-size: var(--site-label) !important;
  line-height: 1.6 !important;
  letter-spacing: .12em !important;
}
body main :is(.ab-crumb,.ab-crumb a,.service-intro nav,.service-intro nav a,.tp-breadcrumb-list li,.tp-breadcrumb-list li a,.ab-principle-detail,.sus-detail,.sd-tags,.ab-market-role,.sus-step-tags) {
  font-size: var(--site-small) !important;
  line-height: 1.6 !important;
}
body main :is(.ab-button,.sus-button,.sd-button,.editorial-button,.tp-btn,.ab-link,.sus-text-link,.sd-link,.editorial-link),
body main .si-copy > a, body main .si-index a, body main .sus-index a {
  font-size: var(--site-action) !important;
  line-height: 1.5 !important;
}
body main :is(.tp-btn .btn-text,.sus-index a span,.si-index a span) { font-size: var(--site-action) !important; }
body footer .tp-footer-widget-title { font-size: var(--site-small) !important; line-height: 1.5 !important; letter-spacing: .12em !important; }
body footer :is(p,.tp-footer-widget-menu a,.tp-footer-contact-location,.tp-footer-contact-tel) { font-size: var(--site-action) !important; line-height: 1.7 !important; }
body footer :is(.tp-footer-copyright-text p,.tp-footer-copyright-link a) { font-size: var(--site-small) !important; }

@media(max-width:1100px) {
  :root { --site-gutter:32px; --site-h1:52px; --site-h2:clamp(36px,4vw,44px); }
}
@media(max-width:760px) {
  :root { --site-gutter:20px; --site-h1:clamp(40px,8vw,60px); --site-h2:34px; --site-h3:23px; --site-body:16px; --site-lead:21px; }
  body .ab-hero-copy, body .sus-hero-copy { padding-right:0 !important; }
  body main :is(.tp-section-title,.tp-breadcrumb-title) br { display:none; }
}

/* Shared inner-page breadcrumb: same placement, spacing and readable type. */
body main.career-page .tp-faq-wrap .accordion-buttons,
body main.career-page .tp-faq-wrap .accordion-buttons:hover,
body main.career-page .tp-faq-wrap .accordion-buttons:focus {
  color:#292826 !important;
}
body main.career-page .tp-faq-wrap .tp-faq-icon::before,
body main.career-page .tp-faq-wrap .tp-faq-icon::after {
  background-color:#292826 !important;
}
body main .site-breadcrumb {
  width:var(--site-width);
  margin:0 auto;
  padding:30px 0;
  font-family:var(--tp-ff-body);
}
body main .site-breadcrumb ol {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  list-style:none;
  padding:0;
  margin:0;
}
body main .site-breadcrumb :is(li,a) {
  font-size:16px !important;
  line-height:1.5 !important;
  font-weight:400;
  color:#62625e;
}
body main .site-breadcrumb [aria-current="page"] { color:#292826; }
body main .site-breadcrumb a:hover { color:#5a0e27; }
body main .site-breadcrumb a:focus-visible { outline:2px solid #5a0e27;outline-offset:4px; }
body main .ab-hero,body main .sus-hero,body main .service-intro { margin-top:0 !important; }

/* Supporting copy must remain readable at every breakpoint. */
body main :is(.ab-hero-foot,.sus-hero-foot),
body main :is(.ab-hero-foot,.sus-hero-foot) span {
  font-size:14px !important;
  line-height:1.6 !important;
  letter-spacing:0 !important;
}
body main :is(.ab-hero-foot,.sus-hero-foot) { flex-wrap:wrap;gap:12px 24px; }
body main :is(.ab-hero-image,.sus-hero-image) figcaption {
  display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;
  font-size:17px !important;line-height:1.5 !important;
}
body main :is(.ab-hero-image,.sus-hero-image) figcaption > span:first-child {
  font-size:17px !important;line-height:1.5 !important;
}
body main :is(.ab-hero-image,.sus-hero-image) figcaption > span+span {
  font-size:14px !important;line-height:1.5 !important;letter-spacing:.025em !important;
}
body main :is(.si-index,.sus-index) > span {
  font-size:14px !important;line-height:1.6 !important;letter-spacing:.025em !important;
}
body main :is(.si-index,.sus-index) a,
body main .service-intro .si-index a span,
body main .sustainability-editorial .sus-index a span {
  font-size:16px !important;line-height:1.6 !important;
}
body main :is(.si-index,.sus-index) a { min-height:44px;align-items:center; }
@media(max-width:1100px) and (min-width:761px) {
  body main :is(.si-index,.sus-index) {grid-template-columns:repeat(3,1fr);}
  body main :is(.si-index,.sus-index)>span {grid-column:1/-1;}
}
@media(max-width:760px) {
  body main .site-breadcrumb {padding:24px 0;}
  body main :is(.si-index,.sus-index) {grid-template-columns:1fr;}
}