/* blocks — component ports on design-system tokens */

/* integrations tabs */
/* inline script swaps .active; this hides the rest */

.integrations_tab_content { display: none; }
.integrations_tab_content.active { display: block; }

.integrations_tabs_wrap { justify-content: center; padding-block: var(--space-3); }

.integrations_grid_wrap { min-height: 20rem; }
/* the bridge collapses every .column below 1023 */
@media (max-width: 1023px) {
  .integrations_grid_wrap .columns > .column { flex-basis: 33.333% !important; max-width: 33.333% !important; }
}
@media (max-width: 600px) {
  .integrations_grid_wrap .columns > .column { flex-basis: 50% !important; max-width: 50% !important; }
}
.grid_item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 120px;
  padding: var(--space-4);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  transition: border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.grid_item:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); transform: translateY(-2px); }
.grid_item_bg { width: 100%; height: 100%; object-fit: contain; }
/* these marks will not invert; keep the tile light */
[data-theme="dark"] .grid_item { background: #fff; border-color: rgba(255, 255, 255, 0.14); }

.integrations_tabs_title { font-size: var(--fs-h2); }
.integrations_tabs_subtitle,
.integrations_tabs_blurb { font-size: var(--fs-lead); color: var(--text-muted); margin-top: var(--space-3); }
.integrations_tabs_cta { margin-top: var(--space-6); }

/* recognitions */
/* flex track equalises slide heights */

.recognitions_wrap { position: relative; z-index: 2; padding-top: var(--space-9); margin-bottom: var(--space-9); }
.recognitions_title { font-size: var(--fs-h2); text-align: center; margin-bottom: var(--space-6); }
.recognitions_subtitle { font-size: var(--fs-lead); color: var(--text-muted); text-align: center; }
.recognitions_carousel_wrap { max-width: 125rem; margin-inline: auto; }
.recognitions_carousel .slick-track { display: flex; align-items: stretch; }
.recognitions_carousel .slick-slide { height: auto; float: none; }
/* before slick runs there is no track to stretch them */
.recognitions_carousel:not(.slick-initialized) { display: flex; align-items: stretch; overflow: hidden; }
.recognitions_carousel:not(.slick-initialized) .recognition_item_wrap { flex: 1 0 33%; }

/* wrap is the slide; no height */
.recognitions_carousel .recognition_item_wrap { display: flex; flex-direction: column; padding: var(--space-3); }
.recognition_item {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: var(--space-3);
  min-height: 19rem;
  padding: var(--space-5) var(--space-6);
  overflow: hidden;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  transition: border-color var(--dur) var(--ease);
}
.recognition_item:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }

.recognition_logo img { height: 60px; width: auto; max-width: 100%; }
[data-theme="dark"] .recognition_logo img { filter: grayscale(1) brightness(0) invert(1); opacity: 0.85; }
.recognition_title { font-size: var(--fs-h5); font-weight: var(--fw-bold); color: var(--text-strong); line-height: var(--lh-snug); }
.recognition_subtitle { flex-grow: 1; font-size: var(--fs-sm); color: var(--text-muted); }
.recognition_link { align-self: flex-start; }
/* colour key on the card edge */
.recognition_bg_color { position: absolute; left: 0; top: 0; width: 8px; height: 100%; }

/* screenshot quotes */

.screenshot_quote_card {
  position: relative;
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
}
.screenshot_quote_card .quote_pillar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--accent);
}
.screenshot_quote_card .quote_text {
  font-size: var(--fs-lead);
  line-height: var(--lh-snug);
  color: var(--text-strong);
  margin-block: var(--space-4);
}
.screenshot_quote_card .quote_text .first_mark { margin-right: 0.1em; }
.screenshot_quote_card .quote_name { font-size: var(--fs-sm); color: var(--text-muted); }

/* empty div in a flex row needs size */
.screenshot_quote_card .card-footer { border-top: 0; padding: 0 var(--space-5) var(--space-5); justify-content: flex-end; }
.screenshot_quote_card .quote_logo {
  width: 120px;
  height: 55px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom right;
}
[data-theme="dark"] .screenshot_quote_card .quote_logo { filter: grayscale(1) brightness(0) invert(1); opacity: 0.85; }

/* academy */

/* dead spacer for the old fixed navbar */
.hero_wrap.page_with_sidebar { display: none; }

/* scrolled backdrop at rest, so the rail connects */
.has-side-nav .site-header {
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  backdrop-filter: saturate(140%) blur(14px);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  border-bottom-color: var(--border);
}

/* side nav */
/* floats beside its sibling; z-index beats content */
.side_navigation_wrap {
  float: left;
  position: sticky;
  z-index: 3;
  top: calc(var(--header-height) + var(--space-4));
  width: 300px;
  max-height: calc(100vh - var(--header-height) - var(--space-6));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--space-3) var(--space-3) var(--space-3) 0;
  border-right: 1px solid var(--border);
  /* fade the cut edge; the menu scrolls */
  -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 3rem), transparent);
          mask-image: linear-gradient(180deg, #000 calc(100% - 3rem), transparent);
  scrollbar-width: thin;
}
.main_content_wrap.with_sidebar { margin-left: 300px; padding-left: var(--space-6); }

.acd_sidebar_menu_wrap { position: relative; }
.side_navigation_wrap ul { list-style: none; padding-left: 0; margin: 0; }
.side_navigation_wrap li.page_item { position: relative; margin: 1px 5px; }
.side_navigation_wrap li.page_item > a {
  display: block;
  padding: 10px 12px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-snug);
  color: var(--text-muted);
  border-radius: var(--radius-sm);
  transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.side_navigation_wrap li.page_item > a:hover {
  color: var(--text-strong);
  background-color: color-mix(in srgb, var(--accent) 12%, transparent);
}
/* wp_list_pages emits these, never .is-active */
.side_navigation_wrap li.current_page_item > a,
.side_navigation_wrap li.current_page_ancestor > a {
  color: var(--text-strong);
  background-color: color-mix(in srgb, var(--accent) 14%, transparent);
}
.side_navigation_wrap li.page_item_has_children > a { padding-left: 28px; }
.side_navigation_wrap ul.children { display: none; overflow: hidden; padding: 0; margin: 0; }
.side_navigation_wrap li.expanded_menu_item > ul.children { display: block; overflow: visible; margin: 2px 0; }
.side_navigation_wrap li.expanded_menu_item > a { padding-left: 34px; }
.side_navigation_wrap ul.children li.page_item { margin-left: 20px; }
.side_navigation_wrap ul.children li.page_item > a { font-weight: var(--fw-regular); padding-left: 0.75rem; }

/* caret injected by the sidebar's own script */
.expand_menu_item_btn {
  position: absolute;
  top: 6px;
  left: 7px;
  width: 24px;
  height: 30px;
  z-index: 5;
  cursor: pointer;
  transition: transform var(--dur) var(--ease);
}
.expand_menu_item_btn::before {
  content: "";
  position: absolute;
  top: 11px;
  left: 7px;
  width: 7px;
  height: 7px;
  border-right: 2px solid var(--text-muted);
  border-bottom: 2px solid var(--text-muted);
  transform: rotate(-45deg);
}
.side_navigation_wrap li.expanded_menu_item > .expand_menu_item_btn { transform: rotate(90deg); }

@media (max-width: 1023px) {
  .side_navigation_wrap {
    float: none;
    position: static;
    width: 100%;
    max-height: none;
    overflow: visible;
    padding-right: 0;
    border-right: 0;
    border-bottom: 1px solid var(--border);
    -webkit-mask-image: none;
            mask-image: none;
  }
  .main_content_wrap.with_sidebar { margin-left: 0; padding-left: 0; }
}

/* breadcrumbs */
/* crumbs nest in a ul; style that */
.breadcrumbs_wrap { margin-bottom: var(--space-4); }
.breadcrumbs_wrap .breadcrumb ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  list-style: none;
  padding: 0;
  margin: 0;
}
.breadcrumbs_wrap .breadcrumb li { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-sm); }
.breadcrumbs_wrap .breadcrumb li + li::before { content: "/"; color: var(--text-faint); }
.breadcrumbs_wrap .breadcrumb a { color: var(--text-muted); transition: color var(--dur) var(--ease); }
.breadcrumbs_wrap .breadcrumb a:hover { color: var(--accent); }
.breadcrumbs_wrap .breadcrumb li.is-active a { color: var(--text-strong); }

/* tag links */
/* beats .content ul's prose column */
.content ul.listoftaglinks,
ul.listoftaglinks {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2);
  list-style: none;
  padding: 0;
  margin-block: var(--space-4);
}
ul.listoftaglinks li { margin: 0; }
ul.listoftaglinks li::marker { content: none; }
ul.listoftaglinks a { text-decoration: none; }

/* related articles */
.wiki_related_wrap {
  position: relative;
  margin-bottom: var(--space-6);
  padding: var(--space-6);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
}
.wiki_related_title,
.related_resources_title {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: var(--space-4);
}
.wiki_related_wrap .related_items { list-style: none; padding: 0; margin: 0; }
.wiki_related_wrap .related_items li + li { margin-top: var(--space-3); }
.wiki_related_wrap a.item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--text-muted);
  transition: color var(--dur) var(--ease);
}
.wiki_related_wrap a.item:hover { color: var(--accent); }
.wiki_related_wrap .item_title { flex-grow: 1; font-size: var(--fs-sm); line-height: var(--lh-snug); word-break: break-word; }
.wiki_related_wrap .item_arrow::after { content: "\2192"; }
.wiki_related_wrap li.list_more_link {
  position: relative;
  margin-top: var(--space-3);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--primary);
  cursor: pointer;
}

/* academy home cards */
.acd_homepage_title { font-size: var(--fs-h1); font-weight: var(--fw-extrabold); color: var(--text-strong); text-align: center; }
.acd_homepage_title.small_title { font-size: var(--fs-h3); }
.acd_homepage_title span { font-weight: var(--fw-regular); }
.acd_homepage_subtitle { max-width: 52rem; margin-inline: auto; text-align: center; }

.wiki_category_card,
.wiki_subscription_card_wrap {
  position: relative;
  height: 100%;
  overflow: hidden;
  padding: var(--space-5);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  transition: border-color var(--dur) var(--ease);
}
.wiki_category_card:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }

/* empty div; no box, no image */
.category_card_image {
  position: relative;
  height: 200px;
  margin: calc(var(--space-5) * -1) calc(var(--space-5) * -1) 0;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.category_card_image::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 6px;
  background: var(--gradient-primary);
}
.category_card_title { font-size: var(--fs-h5); font-weight: var(--fw-bold); color: var(--text-strong); }
.category_card_title a { color: inherit; transition: color var(--dur) var(--ease); }
.category_card_title a:hover { color: var(--accent); }
.category_card_description { font-size: var(--fs-body); color: var(--text-muted); }

.wiki_subscription_card_wrap { display: flex; align-items: center; }
.wiki_subscription_card_wrap::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 6px;
  background: var(--gradient-primary);
}
.wiki_subscription_card { width: 100%; }
.hubspot_form_title { font-size: var(--fs-h5); font-weight: var(--fw-bold); color: var(--text-strong); }
.wiki_subscription_card .hubspot_form_wrap { max-width: none; margin-top: var(--space-4); }

.wiki_cta_card_wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  overflow: hidden;
  padding: var(--space-7);
  border-radius: var(--radius-lg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  text-align: center;
}
/* legibility over the photo */
.wiki_cta_card_wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(1, 15, 31, 0.55), rgba(1, 15, 31, 0.82));
}
.wiki_cta_card { position: relative; }
.cta_card_title { font-size: var(--fs-h3); font-weight: var(--fw-bold); color: #fff; }
.cta_card_subtitle { margin-top: var(--space-4); font-size: var(--fs-lead); color: rgba(255, 255, 255, 0.82); }
/* this label is a whole sentence */
.cta_card_button { margin-top: var(--space-4); white-space: normal; }
.wiki_cta_card .button { border-color: rgba(255, 255, 255, 0.5); color: #fff; }
.wiki_cta_card .button:hover { border-color: #fff; color: #fff; background: rgba(255, 255, 255, 0.12); }

/* academy recents */
.wiki_recent_wrap { position: relative; z-index: 5; }
.title.wiki_recent_title {
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  color: var(--text-strong);
  text-align: center;
  margin-bottom: var(--space-6);
}
.wiki_recent_item {
  position: relative;
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  transition: border-color var(--dur) var(--ease);
}
.wiki_recent_item:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.wiki_recent_item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 6px;
  background: var(--gradient-primary);
}
.wiki_recent_item a.item_link { display: block; height: 100%; padding: var(--space-5) var(--space-6); }
.wiki_recent_item .item_type { font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--text-faint); }
.wiki_recent_item .item_title {
  margin-top: var(--space-2);
  font-size: var(--fs-lead);
  color: var(--text-strong);
  transition: color var(--dur) var(--ease);
}
.wiki_recent_item a.item_link:hover .item_title { color: var(--accent); }

/* article title block */
/* never blanket `> *`; it catches .page_label */
.header_title_content_wrap,
.header_title_content_wrap > div:only-child { display: flex; flex-direction: column; gap: var(--space-4); }
/* flex gap owns the rhythm here; margins would add */
.header_title_content_wrap :is(.title, .subtitle) { margin-bottom: 0; }
.header_title_content_wrap :is(.title, .subtitle).is-spaced { margin-bottom: var(--space-4); }
.header_title_content_wrap .title:not(.is-spaced) + .subtitle { margin-top: 0; }
.header_title_content_wrap .page_ctas { display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--space-3); }

/* date is a bare text node */
.page_meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-4);
  font-size: var(--fs-sm);
  color: var(--text-muted);
}
.page_meta .author_info { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--text-muted); }
.page_meta .author_info:hover { color: var(--accent); }
/* shared .author_avatar has no size here */
.page_meta .author_avatar { width: 26px; height: 26px; flex: 0 0 auto; border: 1px solid var(--border); }

/* faqs */
/* slideToggle writes over this inline */
.v2_faqs_wrap { position: relative; z-index: 3; padding-top: var(--space-6); margin-bottom: var(--space-6); }
.v2_faqs_wrap .faqs_title { font-size: var(--fs-h2); margin-bottom: var(--space-4); }
.faq_item_wrap {
  position: relative;
  margin-bottom: var(--space-3);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
  transition: border-color var(--dur) var(--ease);
}
.faq_item_wrap:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.faq_question {
  display: block;
  padding: var(--space-4) var(--space-9) var(--space-4) var(--space-5);
  font-size: var(--fs-lead);
  font-weight: var(--fw-bold);
  color: var(--text-strong);
  cursor: pointer;
}
.faq_question::after {
  content: "";
  position: absolute;
  right: var(--space-5);
  top: var(--space-5);
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--accent);
  border-bottom: 2px solid var(--accent);
  transform: rotate(45deg);
  transition: transform var(--dur) var(--ease);
}
.faq_question.is-expanded::after { transform: rotate(-135deg); top: calc(var(--space-5) + 4px); }
.faq_answer { display: none; padding: 0 var(--space-5) var(--space-4); color: var(--text); }

/* scroll marketecture */
/* sticky stage; the steps below it create the scroll length */

.pscroll {
  --pscroll-stage: max(40rem, calc(100dvh - var(--header-height)));
  position: relative;
}

.pscroll__stage {
  position: sticky;
  top: var(--header-height);
  z-index: 2;
  display: flex;
  align-items: center;
  height: var(--pscroll-stage);
}

.pscroll__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: var(--space-8);
  width: 100%;
  transition: grid-template-columns var(--dur-slow) var(--ease);
}
/* the intro has only a heading, so the art gets the room */
.pscroll[data-aqd-active="intro"] .pscroll__grid { grid-template-columns: 0.7fr 1.3fr; }

.pscroll__copy { display: grid; }

.pscroll__panel {
  grid-area: 1 / 1;
  align-self: center;
  opacity: 0;
  visibility: hidden;
  transform: translateY(1.25rem);
  transition: opacity var(--dur-slow) var(--ease),
              transform var(--dur-slow) var(--ease),
              visibility 0s linear var(--dur-slow);
}
.pscroll__panel.is-active {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition-delay: 0s;
}

.pscroll__title {
  font-size: var(--fs-h2);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-tight);
  color: var(--text-strong);
  margin-top: var(--space-4);
  text-wrap: balance;
}
.pscroll__title--lead { font-size: var(--fs-h1); margin-top: 0; }
/* the eyebrow needs room under it; --lead zeroes its own top margin */
.pscroll__panel .eyebrow + .pscroll__title { margin-top: var(--space-5); }

/* never clamped: the copy has to appear in full */
.pscroll__text {
  margin-top: var(--space-4);
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: var(--text-muted);
}

.pscroll__actions { margin-top: var(--space-5); }

/* the capability list, authored as one rich-text field */
.pscroll__blurb {
  margin-top: var(--space-5);
  font-size: var(--fs-body);
  line-height: var(--lh-snug);
  color: var(--text-muted);
}
.pscroll__blurb > :first-child { margin-top: 0; }
.pscroll__blurb > :last-child { margin-bottom: 0; }
.pscroll__blurb ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.pscroll__blurb li { position: relative; padding-left: var(--space-5); }
.pscroll__blurb li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
}
.pscroll__blurb a { color: var(--text-strong); }
.pscroll__blurb a:hover { color: var(--accent); }

/* the art is drawn for a dark plate */
.pscroll__visual .aqd {
  --aqd-cap: 48rem;
  --aqd-max-width: min(var(--aqd-cap), calc((var(--pscroll-stage) - var(--space-9)) * 1.6));
  border-radius: var(--radius-xl);
  transition: max-width var(--dur-slow) var(--ease);
}
.pscroll[data-aqd-active="intro"] .pscroll__visual .aqd { --aqd-cap: 62rem; }
[data-theme="dark"] .pscroll__visual .aqd { --aqd-bg: transparent; }

.pscroll__steps { position: relative; z-index: 1; margin-top: calc(-1 * var(--pscroll-stage)); pointer-events: none; }
.pscroll__step { height: 78vh; }
.pscroll__step:last-child { height: 100vh; }

/* Short viewports keep the pin but tighten the panel, since the stage is
   capped at the viewport and the copy is never clamped. */
@media (min-width: 1024px) and (max-height: 880px) {
  .pscroll__title { font-size: var(--fs-h3); margin-top: var(--space-3); }
  .pscroll__panel .eyebrow + .pscroll__title { margin-top: var(--space-4); }
  .pscroll__text { margin-top: var(--space-3); font-size: var(--fs-body); }
  .pscroll__blurb { margin-top: var(--space-4); }
  .pscroll__blurb ul { gap: var(--space-2); }
  .pscroll__actions { margin-top: var(--space-4); }
}

/* unpinned below desktop: every panel in flow */
@media (max-width: 1023px) {
  .pscroll__stage { position: static; height: auto; min-height: 0; padding-block: var(--space-9); }
  /* contents lets the intro panel order against the art */
  .pscroll__grid { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-8); }
  .pscroll__copy { display: contents; }
  .pscroll__panel[data-aqd-panel="intro"] { order: -2; }
  .pscroll__visual { order: -1; }
  .pscroll__panel { grid-area: auto; align-self: stretch; opacity: 1; visibility: visible; transform: none; transition: none; }
  .pscroll__text { display: block; overflow: visible; }
  .pscroll__visual .aqd { --aqd-cap: 48rem; transition: none; }
  .pscroll__steps { display: none; }
}

html.a11y-no-motion .pscroll__panel { transition-duration: 1ms; }

/* horizontal cta */
/* the image wrap is a column, not an overlay */

.horizontal_cta_wrap {
  position: relative;
  z-index: 3;
  overflow: hidden;
  background: var(--ink-deep);
  color: #fff;
}
/* rounded only when it is not a full-bleed band */
.bouncing_blocks_wrap .horizontal_cta_wrap { border-radius: var(--radius-lg); }
.horizontal_cta_wrap .columns { align-items: stretch; margin: 0; }

.column.horizontal_cta_bg_image_wrap { position: relative; padding: 0; min-height: 300px; }
.horizontal_cta_bg_image {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
/* fade the photo into the panel */
.horizontal_cta_bg_image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(1, 15, 31, 0) 5%, var(--ink-deep) 95%);
}
.reverse-columns .horizontal_cta_bg_image::before {
  background: linear-gradient(to left, rgba(1, 15, 31, 0) 5%, var(--ink-deep) 95%);
}

.horizontal_cta_content_wrap { position: relative; z-index: 1; padding-block: var(--space-9); }
.title.horizontal_cta_title { font-size: var(--fs-h2); font-weight: var(--fw-bold); color: #fff; }
.horizontal_cta_blurb { margin-top: var(--space-4); font-size: var(--fs-lead); color: rgba(255, 255, 255, 0.82); }
.horizontal_cta_blurb a { color: var(--brand-electric-blue); }
.horizontal_cta_blurb a:hover { text-decoration: underline; }
.button.horizontal_cta_button { margin-top: var(--space-6); border-color: rgba(255, 255, 255, 0.5); color: #fff; }
.button.horizontal_cta_button:hover { border-color: #fff; color: #fff; background: rgba(255, 255, 255, 0.12); }

@media (max-width: 1023px) {
  .horizontal_cta_bg_image::before {
    background: linear-gradient(to bottom, rgba(1, 15, 31, 0) 40%, var(--ink-deep) 95%);
  }
  .horizontal_cta_content_wrap { padding-block: var(--space-5) var(--space-8); }
}

/* featured resources */
.featured_resources_wrap { position: relative; z-index: 5; }
.title.featured_resources_title {
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  color: var(--text-strong);
  text-align: center;
  margin-bottom: var(--space-7);
}

/* highlights panel */
/* the cards are .card; this block only lays them out */

.highlights_panel { position: relative; z-index: 2; }
.highlights_wrap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: var(--gutter);
}
.highlight_panel { height: 100%; }
.highlight_subtitle { flex-grow: 1; }
.highlight_cta { align-self: flex-start; }

/* hero tabs v2 */
/* One expanded tab, the rest collapsed to their short title. JS mirrors
   .active onto the hovered item; widths are measured in bindHeroTabsV2. */

.hero_tabs_v2_section_wrap {
  position: relative;
  z-index: 3;
  width: 1800px;
  max-width: calc(100% - var(--space-6));
  margin: var(--space-9) auto 0;
  padding: var(--space-9) var(--space-6);
  color: #fff;
}
.hero_tabs_v2_section_wrap > .container { position: relative; z-index: 2; }

.hero_tabs_v2_bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 0.5);
  border-radius: var(--radius-xl);
  background-color: var(--ink-deep);
  box-shadow: 8px 8px 8px 2px rgb(1 15 31 / 0.05);
  pointer-events: none;
}
.hero_tabs_v2_bg img {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  transform: translate3d(-50%, -50%, 0);
  object-fit: cover;
}

.hero_tabs_v2 {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  width: 100%;
  height: 450px;
  margin: 0 calc(var(--space-4) * -1);
}

.hero_tabs_v2_item {
  position: relative;
  height: 100%;
  flex-basis: 20%;
  margin: 0 var(--space-2);
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 0.2);
  border-radius: var(--radius-lg);
  background: rgb(1 15 31 / 0.15);
  box-shadow: 0 3px 2px rgb(255 255 255 / 0.05);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  cursor: pointer;
  transition: flex-basis var(--dur-slow) ease;
}
.hero_tabs_v2_item.active { flex-basis: 80%; cursor: auto; }
.hero_tabs_v2_item:not(.active) .active_tab_content { pointer-events: none; }

.hero_tabs_v2_item .closed_tab_content {
  position: absolute;
  z-index: 1;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  text-align: center;
  opacity: 1;
  transition: opacity var(--dur-slow) ease;
}
.hero_tabs_v2_item.active .closed_tab_content { opacity: 0; }
.hero_tabs_v2_item .short_tab_title {
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--space-6);
  font-size: 1.375rem;
  font-weight: var(--fw-semibold);
}

.hero_tabs_v2_item .active_tab_content {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 700px;
  max-width: 100vw;
  height: 100%;
  max-height: 450px;
  padding: var(--space-6);
  overflow: hidden;
  text-align: left;
  opacity: 0;
  transition: opacity var(--dur-slow) ease;
}
.hero_tabs_v2_item.active .active_tab_content {
  opacity: 1;
  transition-delay: var(--dur);
}
.hero_tabs_v2_item .tab_title {
  margin-bottom: var(--space-5);
  font-size: 2.25rem;
  font-weight: var(--fw-bold);
  color: #fff;
}
.hero_tabs_v2_item .tab_short_text {
  margin-bottom: var(--space-6);
  font-size: var(--fs-lead);
  color: #fff;
}
.hero_tabs_v2_item .tab_cta { padding-top: var(--space-5); }

@media (max-width: 768px) {
  .hero_tabs_v2_section_wrap {
    margin-bottom: var(--space-6);
    padding: var(--space-6) var(--space-4);
  }
  .hero_tabs_v2 {
    flex-direction: column;
    align-items: stretch;
    height: auto;
    gap: var(--space-6);
    margin: 0 auto;
  }
  .hero_tabs_v2_item,
  .hero_tabs_v2_item.active { flex-basis: auto; height: auto; }
  .hero_tabs_v2_item .closed_tab_content { display: none; }
  .hero_tabs_v2_item .active_tab_content {
    position: relative;
    width: 100%;
    max-height: none;
    overflow: visible;
    opacity: 1;
  }
  .hero_tabs_v2_item .tab_spacer { display: none; }
  .hero_tabs_v2_item .tab_title { font-size: var(--fs-h5); }
  .hero_tabs_v2_item .tab_short_text {
    margin-bottom: var(--space-3);
    font-size: var(--fs-body);
  }
}

/* demo v2 */
/* A .container nested in a .container pays the gutter twice and lands on a
   different measure than the rest of the page. */
.container .container { max-width: none; padding-inline: 0; }

.demo_content_column .features_wrap ul { list-style: none; padding-left: 0; margin: 0; }
.demo_content_column .features_wrap li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
  font-size: var(--fs-lead);
  line-height: var(--lh-snug);
}
.demo_content_column .features_wrap li svg { flex: 0 0 auto; margin-top: 0.35em; }
/* the tick carries style="fill:#1904da" inline, invisible on the dark page */
.demo_content_column .features_wrap li svg path { fill: var(--accent) !important; }

/* v2 recognitions: a wrapped flex row, not a carousel, below the slick breakpoint */
.recognitions_v2_carousel_wrap { position: relative; z-index: 2; }
.recognitions_v2_items { display: flex; flex-wrap: wrap; margin-inline: calc(var(--space-4) * -1); }
.recognitions_v2_items .recognition_item_wrap {
  display: flex;
  flex-direction: column;
  flex: 1 1 50%;
  padding: var(--space-3);
}
.recognitions_v2_items.manyitems .recognition_item_wrap { flex-basis: 33%; }
@media (max-width: 768px) {
  .recognitions_v2_items { margin-inline: 0; }
  .recognitions_v2_items .recognition_item_wrap,
  .recognitions_v2_items.manyitems .recognition_item_wrap { flex-basis: 100%; }
}

/* modal dialog: hosts the ported .mfp-* lightbox */
.aqua-modal {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: transparent;
}
.aqua-modal::backdrop { background: rgba(1, 15, 31, 0.9); }
.aqua-modal .mfp-body { line-height: 0; }
.aqua-modal .mfp-iframe-scaler { position: relative; }
/* full-height HubSpot forms; the aspect scaler would fight a fixed height */
.aqua-modal.is_high .mfp-iframe-scaler { height: 80vh; padding-top: 0; }
.aqua-modal .mfp-img { max-height: calc(100vh - 88px); }
html.has-modal { overflow: hidden; }

/* hero tabs v1 */
/* The rail is absolute over the panel's left gutter, so the panel's
   padding-left is what keeps the copy clear of it. */

.hero_tabs_section_wrap { position: relative; z-index: 3; width: 100%; }
.hero_tabs_content_wrap { position: relative; }

.hero_tabs_wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  width: 220px;
  height: 100%;
}

.hero_tab_wrap {
  position: relative;
  flex: 1 1 0;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: 1px;
  padding: var(--space-5);
  overflow: hidden;
  background-color: rgb(1 15 31 / 0.2);
  color: #fff;
  font-size: 1.375rem;
  font-weight: var(--fw-semibold);
  line-height: 1.2;
  cursor: pointer;
  transition: background-color var(--dur) var(--ease);
}
.hero_tab_wrap:first-child { border-top-left-radius: var(--radius-xl); }
.hero_tab_wrap:last-child { margin-bottom: 0; border-bottom-left-radius: var(--radius-xl); }
.hero_tab_wrap:hover { background-color: rgb(1 15 31 / 0.35); }
.hero_tab_wrap.active { background-color: rgb(1 15 31 / 0.2); cursor: default; }
.hero_tab_wrap::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0;
  background-image: var(--gradient-accent);
  transition: height var(--dur) var(--ease);
}
.hero_tab_wrap:hover::before,
.hero_tab_wrap.active::before { height: 6px; }

.hero_tab_icon { flex: 0 0 auto; width: auto; height: auto; max-width: 35px; max-height: 35px; }

.hero_tab_content {
  display: none;
  min-height: 500px;
  padding: var(--space-9) var(--space-9) var(--space-9) 250px;
  border-radius: var(--radius-xl);
  background-color: var(--ink-deep);
  background-position: center right;
  background-size: cover;
  box-shadow: 0 0 10px 0 rgb(0 0 0 / 0.2);
  color: #fff;
}
.hero_tab_content.active { display: block; }

.hero_tabs_tab_title {
  width: 60%;
  margin-bottom: var(--space-5);
  font-size: 2.25rem;
  font-weight: var(--fw-bold);
  line-height: 1.2;
  color: #fff;
}
.hero_tabs_tab_short_text { width: 60%; margin-bottom: var(--space-6); font-size: 1.125rem; color: #fff; }
.hero_tabs_tab_cta { padding-top: var(--space-5); color: #fff; }

/* horizontal: the rail becomes a 70px strip across the panel's top */
.horizontal_hero_tabs_section_wrap .hero_tabs_wrap {
  flex-direction: row;
  width: 100%;
  height: 70px;
}
.horizontal_hero_tabs_section_wrap .hero_tab_wrap {
  justify-content: center;
  margin: 0 1px 0 0;
  padding: 0 var(--space-4);
  font-size: 1.25rem;
  text-align: center;
}
.horizontal_hero_tabs_section_wrap .hero_tab_wrap:first-child {
  border-radius: var(--radius-xl) 0 0 0;
}
.horizontal_hero_tabs_section_wrap .hero_tab_wrap:last-child {
  margin-right: 0;
  border-radius: 0 var(--radius-xl) 0 0;
}
.horizontal_hero_tabs_section_wrap .hero_tab_content {
  padding: 120px var(--space-9) var(--space-5) var(--space-8);
}

@media (max-width: 992px) {
  .hero_tabs_section_wrap .hero_tab_content { background-position: center center; }
  .hero_tabs_section_wrap .hero_tabs_tab_title,
  .hero_tabs_section_wrap .hero_tabs_tab_short_text { width: 90%; }
}

/* below tablet the tabs go away and every panel shows as its own card */
@media (max-width: 768px) {
  .hero_tabs_section_wrap { padding-bottom: var(--space-8); }
  .hero_tabs_wrap { display: none; }
  .hero_tab_content,
  .horizontal_hero_tabs_section_wrap .hero_tab_content {
    position: relative;
    display: block;
    min-height: 0;
    margin-bottom: var(--space-5);
    padding: var(--space-6) var(--space-5) var(--space-4);
    background-image: none !important;
    background-color: var(--surface);
    box-shadow: 0 0 3px 0.125em rgb(0 0 0 / 0.05);
    color: var(--text);
    transition: box-shadow var(--dur) var(--ease);
  }
  .hero_tab_content:hover { box-shadow: 0 0 8px 0.25em rgb(0 0 0 / 0.1); }
  .hero_tab_content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 6px;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    background-image: var(--gradient-accent);
  }
  .hero_tabs_tab_title {
    width: 100%;
    margin-bottom: var(--space-2);
    font-size: 1.25rem;
    line-height: 1.3;
    color: var(--text-strong);
  }
  .hero_tabs_tab_short_text { width: 100%; margin-bottom: var(--space-2); font-size: 1rem; color: var(--text); }
  .hero_tabs_tab_cta { padding-top: 0; color: inherit; }
}

/* features list. content-features.php and content-features_list.php share
   .feature_icon / _subtitle / _link but lay them out differently, and
   legacy-bridge only carries the first: a 60px icon stacked above the text.
   In the list it is a 30px mark absolute in the item's own gutter. */
.features_list_wrap { position: relative; z-index: 3; }
.features_list_wrap .features_title { font-size: var(--fs-h4); font-weight: var(--fw-regular); margin-bottom: var(--space-6); }
.features_list_item { position: relative; margin-bottom: var(--space-3); }
.features_list_item.with_feature_icon { min-height: 40px; padding-left: 48px; }
.features_list_item .feature_icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  margin-bottom: var(--space-3);
}
.features_list_item .feature_subtitle { margin-top: var(--space-3); font-size: var(--fs-h5); color: var(--text); }
.features_list_item .feature_subtitle ul li { font-size: var(--fs-body); margin-bottom: var(--space-4); }
.features_list_item .feature_link { display: inline-block; margin-block: var(--space-4); font-size: var(--fs-body); }
@media (max-width: 768px) {
  .features_list_wrap .features_title { font-size: var(--fs-h5); font-weight: var(--fw-semibold); }
}

/* logo strip */
.logostrip_logos_wrap { padding-block: var(--space-8); text-align: center; }
.logostrip_title { font-size: var(--fs-h4); font-weight: var(--fw-bold); color: var(--text-strong); }
.logostrip_logo { height: 58px; width: auto; margin: var(--space-5) var(--space-6); }
.logostrip_cta { padding-top: var(--space-5); }

/* demo template */
.demo-page .demo_title_content_wrap { padding-top: var(--space-5); padding-bottom: var(--space-9); }
.demo-page .title.demo_page_title {
  font-size: var(--fs-h1);
  font-weight: var(--fw-bold);
  color: var(--text-strong);
}
.demo-page .subtitle.demo_page_subtitle {
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  color: var(--text);
}
/* the original card was a royal-blue neomorph; on the dark page it is a surface */
.demo-page .demo_form_wrap {
  margin-top: var(--space-7);
  padding: var(--space-5);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-xl);
  background: var(--surface);
  box-shadow: var(--card-shadow);
}
.demo-page .demo_form_wrap .hubspot_form_wrap { padding-bottom: 0; }
.demo-page .demo_form_wrap .hs_submit { text-align: right; }
.demo-page .demo_form_wrap .hs_recaptcha { margin-top: var(--space-4); }
.demo-page .section.logostrip_logos_wrap { padding: var(--space-8) 0 var(--space-5); }
.demo-page .logostrip_title { font-size: var(--fs-h4); }
.demo-page .logostrip_logo { height: 38px; margin: var(--space-5) var(--space-3); }
.hubspot_form_subtitle { margin-bottom: var(--space-4); font-size: var(--fs-sm); color: var(--text-muted); }

/* integrations grid + featured carousel */
/* also serves page-integrations_brand.php */

.integrations_content_wrap { padding-bottom: 0; margin-bottom: 0; }
.integrations_filters_wrap { padding: var(--space-3); text-align: center; }

/* flex wrap stretches the card; .row-eq-height has no rule */
.integration_item_wrap { display: flex; padding-block: var(--space-3); }

/* min-width releases the flex min-content floor */
.integration_item {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 0;
  padding-bottom: var(--space-5);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  box-shadow: var(--card-shadow);
  text-decoration: none;
  transition: all var(--dur) var(--ease);
}
.integration_item:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--surface-border));
  box-shadow: var(--shadow-pop);
}

/* the span also holds the title; indent hides the duplicate */
.integration_item .integration_image {
  display: block;
  height: 130px;
  margin: var(--space-3) 0 var(--space-5);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  overflow: hidden;
  white-space: nowrap;
  text-indent: -9999px;
}
.integration_item .integration_title {
  display: block;
  margin-bottom: var(--space-3);
  padding-inline: var(--space-5);
  font-size: var(--fs-h5);
  font-weight: var(--fw-bold);
  line-height: var(--lh-snug);
  color: var(--text-strong);
}
.integration_item .integration_short_description {
  display: block;
  flex-grow: 1;
  padding: 0 var(--space-5) var(--space-5);
  font-size: var(--fs-body);
  line-height: var(--lh-snug);
  color: var(--text-muted);
}
.integration_item .integration_link {
  align-self: flex-start;
  margin-inline: var(--space-5);
  font-size: var(--fs-lead);
  font-weight: var(--fw-bold);
}

/* tooltip text lives in the badge; indent hides it */
.integration_item .integration_type {
  position: absolute;
  top: 0;
  right: var(--space-3);
  width: 50px;
  height: 50px;
  overflow: hidden;
  white-space: nowrap;
  text-indent: -9999px;
  border: 1px solid var(--border);
  border-top: 0;
  border-bottom-right-radius: var(--radius-sm);
  border-bottom-left-radius: var(--radius-sm);
  background-repeat: no-repeat;
  background-position: center;
}
/* 23x26 and 27x26; no background-size, it would blur */
.integration_item .integration_type.type_official { background-image: url(../../images/icon_integration_official.png); }
.integration_item .integration_type.type_contributed { background-image: url(../../images/icon_integration_contributed.png); }

/* featured carousel; scoped off .slider_with_arrows, recognitions shares it */
.center_carousel_wrap { position: relative; padding-inline: var(--space-6); }
.center_carousel .slick-track { display: flex; align-items: stretch; }
.center_carousel .slick-slide { height: auto; float: none; }
.center_carousel:not(.slick-initialized) { display: flex; overflow: hidden; }
.center_carousel:not(.slick-initialized) .featured_integration_item_wrap { flex: 1 0 100%; }
.center_carousel .slick-list,
.center_carousel .slick-list .slick-track {
  mask-image: linear-gradient(90deg, transparent 5%, #000 10%, #000 90%, transparent 95%);
}

.featured_integration_item_wrap { display: flex; flex-direction: column; padding: var(--space-4); }
.featured_integration_item {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 0;
  min-height: 300px;
  padding: var(--space-7) 0 var(--space-5) 205px;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  box-shadow: var(--card-shadow);
  text-decoration: none;
  transition: all var(--dur) var(--ease);
}
.featured_integration_item:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--surface-border));
  box-shadow: var(--shadow-pop);
}
.featured_integration_item .featured_integration_image {
  display: block;
  position: absolute;
  left: 10px;
  top: 10px;
  width: 200px;
  height: 180px;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
  overflow: hidden;
  white-space: nowrap;
  text-indent: -9999px;
}
.featured_integration_item .featured_integration_title {
  display: block;
  margin-bottom: var(--space-3);
  padding-inline: var(--space-5);
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  color: var(--text-strong);
}
.featured_integration_item .featured_integration_short_description {
  display: block;
  flex-grow: 1;
  padding: 0 var(--space-5) var(--space-4);
  font-size: var(--fs-lead);
  line-height: var(--lh-snug);
  color: var(--text-muted);
}
.featured_integration_item .featured_integration_link {
  align-self: flex-start;
  margin-inline: var(--space-5);
  font-size: var(--fs-lead);
  font-weight: var(--fw-bold);
}

@media (max-width: 800px) {
  .featured_integration_item { padding-left: 0; }
  .featured_integration_item .featured_integration_image {
    position: relative;
    left: 0;
    top: 0;
    height: 100px;
    margin-inline: auto;
  }
  .featured_integration_item .featured_integration_title { font-size: var(--fs-h5); }
}

@media (max-width: 768px) {
  .center_carousel .slick-list,
  .center_carousel .slick-list .slick-track { mask-image: none; }
}

/* platform page: patents + compliance */
/* .compliance is a distinct token from the compliance_* on page-trust_compliance */

.patents { padding-block: var(--space-10); }

/* headline needs 894px for one line; intro carries the section alone */
.patents__head { max-width: 72rem; margin-inline: auto; text-align: center; }

/* inline-block so the gradient box hugs the phrase, not the whole row */
/* .stat__num colour outranks .text-gradient on source order */
.patents__head .stat__num {
  display: inline-block;
  font-size: var(--fs-display);
  line-height: 1.05;
  color: transparent;
}
.patents__note { margin-top: var(--space-3); font-size: var(--fs-xs); color: var(--text-faint); }

.patents__head h2 {
  margin-top: var(--space-6);
  font-size: var(--fs-h2);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-tight);
  color: var(--text-strong);
  text-wrap: balance;
}
.patents__intro {
  margin-top: var(--space-4);
  font-size: var(--fs-h5);
  line-height: var(--lh-body);
  color: var(--text-muted);
  text-wrap: balance;
}


.patents__grid { margin-top: var(--space-7); }


.compliance { padding-block: var(--space-10); }
.compliance__grid { margin-top: var(--space-8); }

/* h3 is too big for 45-char questions in a 3-up card */
.patents__grid .feature__title,
.compliance__grid .feature__title { font-size: var(--fs-h5); line-height: var(--lh-snug); }

.compliance__frameworks {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-3) var(--space-6);
  max-width: 56rem;
  margin: var(--space-8) auto 0;
  padding: 0;
  list-style: none;
}
.compliance__frameworks li {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--fs-lead);
  color: var(--text);
}
/* placeholder mark until the real badges land */
.compliance__frameworks li::before {
  content: "✓";
  color: var(--accent);
  font-weight: var(--fw-bold);
}

/* bootstrap leftovers, as .col-xs-12 already is */
.col-md-12 { width: 100%; }
.padding-0 { padding: 0; }