/* === assets/css/global-cta.css === */
a.cta_button {
  box-sizing: content-box !important;
  vertical-align: middle;
}

.hs-breadcrumb-menu {
  list-style-type: none;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

.hs-breadcrumb-menu-item {
  float: left;
  padding: 10px 0 10px 10px;
}

.hs-breadcrumb-menu-divider:before {
  content: "›";
  padding-left: 10px;
}

.hs-featured-image-link {
  border: 0;
}

.hs-featured-image {
  float: right;
  margin: 0 0 20px 20px;
  max-width: 50%;
}

.hs-screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  width: 1px;
}

@media (max-width: 568px) {
  .hs-featured-image {
    float: none;
    margin: 0;
    width: 100%;
    max-width: 100%;
  }
}
/* === assets/template_main.min.css === */
/* Theme base styles */

/* Tools
Any animations, or functions used throughout the project.
Note: _macros.css needs to be imported into each stylesheet where macros are used and not included here
*/

/* ************************************************************************* */
/* ****************************   Accent Colors   **************************** */
/* ************************************************************************* */





/* ************************************************************************* */
/* ****************************   Dark Colors   **************************** */
/* ************************************************************************* */






/* ************************************************************************* */
/* ****************************   Light Colors   **************************** */
/* ************************************************************************* */





/* ************************************************************************* */
/* ****************************   Status Colors   **************************** */
/* ************************************************************************* */





/* ************************************************************************* */
/* ****************************  Typography   **************************** */
/* ************************************************************************* */
































/* ************************************************************************* */
/* ****************************  Layout   **************************** */
/* ************************************************************************* */














/* ************************************************************************* */
/* ****************************  Buttons   **************************** */
/* ************************************************************************* */
















































































/* ************************************************************************* */
/* ****************************  Forms   **************************** */
/* ************************************************************************* */









































  







  







  







  





























































/* ************************************************************************* */
/* ****************************  Table   **************************** */
/* ************************************************************************* */









  



  



  



  



  



  



  



  


/* ************************************************************************* */
/* ****************************  Header   **************************** */
/* ************************************************************************* */



















/* ************************************************************************* */
/* ****************************  Footer   **************************** */
/* ************************************************************************* */









/* ************************************************************************* */
/* ****************************  CSS Variables   **************************** */
/* ************************************************************************* */

:root {

  /* Global Colors */
  --accent-primary: #00BFA6;
  --accent-secondary: #477ECF;
  --accent-tertiary: #CFE2F3;
  --dark-primary: #1a1a1a;
  --dark-secondary: rgba(26, 26, 26, 80%);
  --dark-tertiary: rgba(26, 26, 26, 60%);
  --dark-quaternary: rgba(26, 26, 26, 40%);
  --light-primary: #F9FBF7;
  --light-secondary: #F2F5EE;
  --light-tertiary: #E8ECE4;
  --status-success: #6CB46B;
  --status-error: #DB4065;

  /* Animation */
  --transition: all 0.3s ease-in-out;

  /* Shadow */
  --shadow: 0 0 12px rgb(24 28 32 / 6%), 0 4px 48px rgb(24 28 32 / 3%);

  /* Typography */
  --primary-font-family: Montserrat, sans-serif;
  --secondary-font-family: Montserrat Alternates, sans-serif;

  --base-font-size: 18px;
  --letter-spacing: -0.03em;

  --body-text-family: Montserrat, sans-serif;
  --body-text-color: #1a1a1a;
  --body-text-weight: ;
  --body-text-size: px;
  --body-text-style: normal;

  --heading-weight: 700;
  --heading-color: #1a1a1a;
  --heading-family: Montserrat,, sans-serif;

  /* Heading 1 */--h1-family: Montserrat, sans-serif;--h1-color: #1a1a1a;--h1-weight: var(--heading-weight);--h1-size: 4rem;--h1-transform: none;

  /* Heading 2 */--h2-family: Montserrat, sans-serif;--h2-color: #1a1a1a;--h2-weight: var(--heading-weight);--h2-size: 3rem;--h2-transform: none;

  /* Heading 3 */--h3-family: Montserrat, sans-serif;--h3-color: #1a1a1a;--h3-weight: var(--heading-weight);--h3-size: 2.33rem;--h3-transform: none;

  /* Heading 4 */--h4-family: Montserrat, sans-serif;--h4-color: #1a1a1a;--h4-weight: var(--heading-weight);--h4-size: 1.67rem;--h4-transform: none;

  /* Heading 5 */--h5-family: Montserrat, sans-serif;--h5-color: #1a1a1a;--h5-weight: var(--heading-weight);--h5-size: 1.34rem;--h5-transform: none;

  /* Heading 6 */--h6-family: Montserrat, sans-serif;--h6-color: #1a1a1a;--h6-weight: var(--heading-weight);--h6-size: 1.11rem;--h6-transform: none;

  --link-style: italic;--link-underline: underline;--link-color: #1a1a1a;
  --link-style-hover: italic;--link-underline-hover: underline;--link-color-hover: #1a1a1a;

  /* Layout */
  --small-container: 600px;
  --default-container: 1356px;
  --blogpost-container: 600px;

  /* --vertical-spacing: rem;
  --vertical-spacing-1-3: calc( * 0.3)rem;
  --vertical-spacing-1-2: calc( * 0.5)rem;
  --vertical-spacing-3-4: calc( * 0.75)rem; */

  /* Corners */
  --radius: 0px;
  --half-radius: calc(0 / 2)px;

  /* Buttons */
  --btn-radius: 5px;
  
  --primary-btn-label: #1a1a1a;
  --primary-btn-fill: #00BFA6;
  --primary-btn-label-hover: #00BFA6;
  --primary-btn-fill-hover: #1a1a1a;
  --primary-btn-label-active: #00BFA6;
  --primary-btn-fill-active: #1a1a1a;
  
  --secondary-btn-label: #1a1a1a;
  --secondary-btn-fill: #477ECF;
  --secondary-btn-label-hover: #477ECF;
  --secondary-btn-fill-hover: #1a1a1a;
  --secondary-btn-label-active: #477ECF;
  --secondary-btn-fill-active: #1a1a1a;
  
  --tertiary-btn-label: #1a1a1a;
  --tertiary-btn-border-bottom: 1px solid rgba(26, 26, 26, calc(100 / 100));
  --tertiary-btn-border-left: 1px solid rgba(26, 26, 26, calc(100 / 100));
  --tertiary-btn-border-right: 1px solid rgba(26, 26, 26, calc(100 / 100));
  --tertiary-btn-border-top: 1px solid rgba(26, 26, 26, calc(100 / 100));

  --tertiary-btn-label-hover: rgba(26, 26, 26, 60%);
  --tertiary-btn-border-bottom-hover: 1px solid rgba(26, 26, 26, calc(60 / 100));
  --tertiary-btn-border-left-hover: 1px solid rgba(26, 26, 26, calc(60 / 100));
  --tertiary-btn-border-right-hover: 1px solid rgba(26, 26, 26, calc(60 / 100));
  --tertiary-btn-border-top-hover: 1px solid rgba(26, 26, 26, calc(60 / 100));
  
  --tertiary-btn-label-active: rgba(26, 26, 26, 60%);

  --inverted-btn-label: #1a1a1a;
  --inverted-btn-fill: #F9FBF7;
  --inverted-btn-label-hover: #1a1a1a;
  --inverted-btn-fill-hover: #F2F5EE;
  --inverted-btn-label-active: #1a1a1a;
  --inverted-btn-fill-active: #F2F5EE;

  --ink-btn-style: italic;
  --ink-btn-label: #1a1a1a;
  --ink-btn-fill: #477ECF;--ink-btn-width: 6px;--ink-btn-style-hover: italic;
  --ink-btn-label-hover: #1a1a1a;
  --ink-btn-fill-hover: #477ECF;--ink-btn-width-hover: 15px;--ink-btn-label-active: #1a1a1a;
  --ink-btn-fill-active: #477ECF;

  --featured-btn-style: italic;
  --featured-btn-label: #00BFA6;
  --featured-btn-underline-color: #00BFA6;
  --featured-btn-underline-width: 0.2em;
  --featured-btn-underline: 0 var(--featured-btn-underline-width) var(--featured-btn-underline-color);
  --featured-btn-style-hover: italic;
  --featured-btn-label-hover: #1a1a1a;
  --featured-btn-label-active: #1a1a1a;
  --featured-btn-underline-active: 0  #1a1a1a;

  /* Forms */--form-bg: none;--form-border-bottom: none;
  --form-border-left: none;
  --form-border-right: none;
  --form-border-top: none;--title-color: var(--h3-color);--title-bg: none;--label: var(--dark-primary);--help-text: var(--dark-tertiary);--placeholder: rgba(26, 26, 26, 60%);--field-text: #1a1a1a;--field-bg: #F9FBF7;--field-border-bottom: 1px solid rgba(232, 236, 228, calc(100 / 100));
  --field-border-left: 1px solid rgba(232, 236, 228, calc(100 / 100));
  --field-border-right: 1px solid rgba(232, 236, 228, calc(100 / 100));
  --field-border-top: 1px solid rgba(232, 236, 228, calc(100 / 100));--field-corner: 0;--field-outline-color: var(--dark-primary);--field-btn-label: #1a1a1a;--field-btn-label-hover: #00BFA6;--field-btn-fill: #00BFA6;--field-btn-fill-hover: #1a1a1a;--field-btn-border-bottom: none;
  --field-btn-border-left: none;
  --field-btn-border-right: none;
  --field-btn-border-top: none;

  --field-btn-border-bottom-hover: none;
  --field-btn-border-left-hover: none;
  --field-btn-border-right-hover: none;
  --field-btn-border-top-hover: none;--field-btn-corner: var(--btn-radius);--field-btn-corner-hover: var(--btn-radius);/* Tables */--table-header-text: #1a1a1a;--table-header-bg: #F2F5EE;--table-body-text: rgba(26, 26, 26, 80%);--table-body-bg: #F9FBF7;--table-footer-text: rgba(26, 26, 26, 80%);--table-footer-bg: #F9FBF7;--table-cell-spacing: 0.5em 1em 0.5em 1em;

  --table-cell-border-bottom: none;
  --table-cell-border-left: none;
  --table-cell-border-right: none;
  --table-cell-border-top: none;

  /* Header */
  --header-nav-color: #F9FBF7;
  --header-nav-color-hover: #00BFA6;
  --mega-menu-title-color: #1a1a1a;
  --mega-menu-text-color: rgba(26, 26, 26, 60%);
  --mega-menu-bg: #F9FBF7;
  --mega-menu-item-hover: #F2F5EE;
  --mega-menu-border: ;
  --header-bg: #1a1a1a;
  --header-bg-landing: #F9FBF7;--header-bottom-border: none;--header-logo-effect: none;--content-offset-desktop: 90px;
  --content-offset-mobile: 80px;

  /* Footer */
  --footer-text: ;
  --footer-bg: #00BFA6;
  --footer-nav-cols: 3;
  --footer-nav-width: 660px;--footer-border: none;}

/* Generic
This is where reset, normalize & box-sizing styles go.
*/

*, *:before, *:after {
  box-sizing: border-box;
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}
::selection {
  background-color: var(--accent-secondary);
  color: var(--dark-primary);
}

* {
  box-sizing: border-box;
}

html {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-tap-highlight-color: transparent;
  min-height: 100%;
  line-height: 1.2;
}

body {
  background-color: var(--light-primary);
  display: flex; /* Needed for footer to be stick to bottom when there is few content */
  flex-direction: column;
  min-height: 100vh;
  margin:  0;
  overflow-x: hidden; /* Prevents horizontal scrolling */
  -webkit-overflow-scrolling: touch;
  padding: 0;
  word-break: break-word;
}

figure {
  margin: 0;
  padding: 0;
}

img {
  max-width: 100%;
}

.img img {
  border-radius: var(--radius);
  width: 100%;
}

/* Objects
Non-cosmetic design patterns including grid and layout classes)
*/

.main-page-container {
  flex: 1 0 auto; /* Expands the container to move footer to the bottom of the page */
}

.container {
  max-width: var(--default-container);
  margin: 0 auto;
  padding: 0 2rem;
}

@media (max-width: 767px) {
  .container {
    padding: 0 1rem;
  }
}

.container--blogpost {
  max-width: var(--blogpost-container);
}

.container--small {
  max-width: var(--small-container);
}

.main-content-offset {
  margin-top: var(--content-offset-mobile);
}

@media only screen and (min-width: 768px) {
  .main-content-offset {
    margin-top: var(--content-offset-desktop);
  }
}



  /* CSS variables */
  
  :root {
    --column-gap: 2.13%;
    --column-width-multiplier: 8.333;
  }
  
  /* Mobile layout */
  
  .row-fluid {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  
  
    .row-fluid .span1,
    .row-fluid .span2,
    .row-fluid .span3,
    .row-fluid .span4,
    .row-fluid .span5,
    .row-fluid .span6,
    .row-fluid .span7,
    .row-fluid .span8,
    .row-fluid .span9,
    .row-fluid .span10,
    .row-fluid .span11,
    .row-fluid .span12{
    min-height: 1px;
    width: 100%;
  }
  
  /* Desktop layout */
  
  @media (min-width: 768px) {
    .row-fluid {
      flex-wrap: nowrap;
      justify-content: space-between;
    }
  
    
      .row-fluid .span1 {
        width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span2 {
        width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span3 {
        width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span4 {
        width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span5 {
        width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span6 {
        width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span7 {
        width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span8 {
        width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span9 {
        width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span10 {
        width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
      }
    
      .row-fluid .span11 {
        width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
      }
    
  }
.dnd-section > .row-fluid {
  margin: 0 auto;
  max-width: var(--default-container);
}

.dnd-section .dnd-column {
  padding: 0 2rem;
}

@media (max-width: 767px) {
  .dnd-section .dnd-column {
    padding: 0 1rem;
  }
}

/* Elements
Base HMTL elements are styled in this section (<body<, <h1>, <a>, <p>, <button> etc.)
*/

/* General typography styles */

@media only screen and (max-width: 768px) {
  html {
    font-size: calc(0.889 * var(--base-font-size));
  }
}

@media only screen and (min-width: 768px) {
  html {
    font-size: var(--base-font-size);
  }
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: antialiased;
  font-smoothing: antialiased;
  color: var(--body-text-color);
  font-family: var(--body-text-family);
  font-size: var(--body-text-size);
  font-weight: var(--body-text-weight);
  letter-spacing: var(--letter-spacing);
  line-height: 1.4;
  overflow-wrap: break-word;
}

html[lang^="ja"] body,
html[lang^="zh"] body,
html[lang^="ko"] body {
  line-break: strict;
  overflow-wrap: normal;
  word-break: break-all;
}

/* Paragraphs */

p {
  font-size: 1rem;
  letter-spacing: var(--letter-spacing);
  line-height: 1.4;
  margin: 0 0 1em;
}

.paragraph--xs,
.paragraph--xs p {
  font-size: 0.78rem;
  line-height: 1.4;
}

.paragraph--sm,
.paragraph--sm p {
  font-size: 0.89rem;
  line-height: 1.4;
}

.paragraph--md,
.paragraph--md p {
  font-size: 1rem;
  line-height: 1.4;
}

.paragraph--lg,
.paragraph--lg p {
  font-size: 1.167rem;
  line-height: 1.4;
}

.paragraph--xl,
.paragraph--xl p {
  font-size: 1.34rem;
  line-height: 1.4;
}

.paragraph--xxl,
.paragraph--xxl p {
  font-size: 1.56rem;
  line-height: 1.4;
}

.paragraph--xxxl,
.paragraph--xxxl p {
  font-size: 2rem;
  line-height: 1.2;
}

@media only screen and (max-width: 767px) {
  .paragraph--xxxl,
  .paragraph--xxxl p {
    font-size: 1.56rem;
  }
}

.text-centered {
  text-align: center;
}

.metadata {
  font-size: 0.667rem;
  line-height: 1;
}

.label {
  display: inline-block;
  font-size: 0.89rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-bottom: 1em;
  text-decoration: none;
  text-transform: uppercase;
}

.label--lg {
  font-size: 1rem;
  margin-bottom: 1.875em;
}

b,
strong {
  font-weight: 700;
}

em {
  font-style: italic;
}

.inverted,
p.inverted,
.inverted p,
.inverted.metadata,
.inverted.label {
  color: var(--light-primary);
}

/* Anchors */

a {
  color: var(--link-color);
  cursor: pointer;
  font-style: var(--link-style);
  letter-spacing: var(--letter-spacing);
  position: relative;
  text-decoration: var(--link-underline);
  transition: var(--transition);
}

a:hover,
a:focus {
  color: var(--link-color-hover);
  text-decoration: var(--link-underline-hover);
}

a:active {
  color: var(--link-color-active);
}

/* Headings */

h1,
h2,
h3,
h4,
h5,
h6,
.heading {
  color: var(--heading-color);
  font-family: var(--heading-family);
  font-weight: var(--heading-weight);
  letter-spacing: var(--letter-spacing);
  line-height: 1.1;
  margin: 0 0 0.5em 0;
}

h1,
.heading--primary,
.heading--primary * {
  color: var(--h1-color);
  font-family: var(--h1-family);
  font-size: var(--h1-size);
  font-weight: var(--h1-weight);
  text-transform: var(--h1-transform);
}

h2,
.heading--secondary,
.heading--secondary * {
  color: var(--h2-color);
  font-family: var(--h2-family);
  font-size: var(--h2-size);
  font-weight: var(--h2-weight);
  text-transform: var(--h2-transform);
}

h3,
.heading--tertiary,
.heading--tertiary * {
  color: var(--h3-color);
  font-family: var(--h3-family);
  font-size: var(--h3-size);
  font-weight: var(--h3-weight);
  text-transform: var(--h3-transform);
}

h4,
.heading--quaternary,
.heading--quaternary * {
  color: var(--h4-color);
  font-family: var(--h4-family);
  font-size: var(--h4-size);
  font-weight: var(--h4-weight);
  text-transform: var(--h4-transform);
}

h5,
.heading--quinary,
.heading--quinary * {
  color: var(--h5-color);
  font-family: var(--h5-family);
  font-size: var(--h5-size);
  font-weight: var(--h5-weight);
  text-transform: var(--h5-transform);
}

h6,
.heading--senary,
.heading--senary * {
  color: var(--h6-color);
  font-family: var(--h6-family);
  font-size: var(--h6-size);
  font-weight: var(--h6-weight);
  text-transform: var(--h6-transform);
}

@media only screen and (max-width: 767px) {
  h1,
  .heading--primary,
  .heading--primary * {
    font-size: calc(var(--h1-size) * 0.8);
  }

  h2,
  .heading--secondary,
  .heading--secondary * {
    font-size: calc(var(--h2-size) * 0.9);
  }

  h3,
  .heading--tertiary,
  .heading--tertiary * {
    font-size: calc(var(--h3-size) * 0.95);
  }

  h4,
  .heading--quaternary,
  .heading--quaternary * {
    font-size: calc(var(--h4-size) * 0.95);
  }
}

.inverted h1,
h1.inverted,
.inverted h2,
h2.inverted,
.inverted h3,
h3.inverted,
.inverted h4,
h4.inverted,
.inverted h5,
h5.inverted,
.inverted h6,
h6.inverted {
  color: var(--light-primary);
}

.no-margin h1,
.no-margin h2,
.no-margin h3,
.no-margin h4,
.no-margin h5,
.no-margin h6,
.no-margin.heading--primary,
.no-margin.heading--secondary,
.no-margin.heading--tertiary,
.no-margin.heading--quaternary,
.no-margin.heading--quinary,
.no-margin.heading--senary,
.no-margin p {
  margin: 0;
}

/* Lists */

ul,
ol {
  margin: 0 0 1.34rem;
}

ul ul,
ol ul,
ul ol,
ol ol {
  margin: 0;
}

ul.no-list {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

li {
  line-height: 1.4;
}

/* Code blocks */

pre {
  overflow: auto;
}

code {
  color: var(--dark-tertiary);
  vertical-align: bottom;
}

/* Blockquotes */

blockquote,
.quote,
.quote p {
  color: var(--dark-primary);
  font-family: var(--secondary-font-family);
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.2;
  margin: 0;
}

blockquote {
  padding: 2em 1em;
}

/* Horizontal rules */

hr {
  border: none;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: var(--light-tertiary);
  width: 100%;
}

/* Subscripts and superscripts */

sup,
sub {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Image alt text */

img {
  font-size: 0.583rem;
  letter-spacing: var(--letter-spacing);
  word-break: normal;
}

/* Highlighted text */

mark {
  background-color: var(--accent-secondary);
  color: var(--body-text-color);
  letter-spacing: var(--letter-spacing);
}
button,
.button,
input[type=submit],
.hs-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  align-items: center;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: var(--btn-radius);
  box-shadow: none;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font-family: var(--primary-font-family);
  font-size: 1rem;
  flex-shrink: 0;
  font-style: normal;
  font-weight: 500;
  margin: 0;
  padding: 0.625em 1.5em;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: var(--transition);
  white-space: normal;
}

button:disabled,
.button:disabled {
  background-color: #D0D0D0;
  border-color: #D0D0D0;
  color: #E6E6E6;
}

/* Primary Button */

.button--primary,
.button--primary:visited {
  background-color: var(--primary-btn-fill);
  color: var(--primary-btn-label);
  fill: var(--primary-btn-label);
}

.button--primary:hover {
  background-color: var(--primary-btn-fill-hover);
  color: var(--primary-btn-label-hover);
  fill: var(--primary-btn-label-hover);
}

.button--primary:active {
  background-color: var(--primary-btn-fill-active);
  color: var(--primary-btn-label-active);
  fill: var(--primary-btn-label-active);
}

/* Secondary Button */

.button--secondary,
.button--secondary:visited {
  background-color: var(--secondary-btn-fill);
  color: var(--secondary-btn-label);
  fill: var(--secondary-btn-label);
}

.button--secondary:hover {
  background-color: var(--secondary-btn-fill-hover);
  color: var(--secondary-btn-label-hover);
  fill: var(--secondary-btn-label-hover);
}

.button--secondary:active {
  background-color: var(--secondary-btn-fill-active);
  color: var(--secondary-btn-label-active);
  fill: var(--secondary-btn-label-active);
}

/* Tertiary Button */

.button--tertiary,
.button--tertiary:visited {
  border-bottom: var(--tertiary-btn-border-bottom);
  border-left: var(--tertiary-btn-border-left);
  border-right: var(--tertiary-btn-border-right);
  border-top: var(--tertiary-btn-border-top);
  color: var(--tertiary-btn-label);
  fill: var(--tertiary-btn-label);
}

.button--tertiary:hover {
  border-bottom: var(--tertiary-btn-border-bottom-hover);
  border-left: var(--tertiary-btn-border-left-hover);
  border-right: var(--tertiary-btn-border-right-hover);
  border-top: var(--tertiary-btn-border-top-hover);
  color: var(--tertiary-btn-label-hover);
  fill: var(--tertiary-btn-label-hover);
}

.button--tertiary:active {
  border: var(--tertiary-btn-border-active);
  color: var(--tertiary-btn-label-active);
  fill: var(--tertiary-btn-label-active);
}

/* Inverted Button */

.button--inverted,
.button--inverted:visited {
  background-color: var(--inverted-btn-fill);
  color: var(--inverted-btn-label);
  fill: var(--inverted-btn-label);
}

.button--inverted:hover {
  background-color: var(--inverted-btn-fill-hover);
  color: var(--inverted-btn-label-hover);
  fill: var(--inverted-btn-label-hover);
}

.button--inverted:active {
  background-color: var(--inverted-btn-fill-active);
  color: var(--inverted-btn-label-active);
  fill: var(--inverted-btn-label-active);
}

/* Ink Button */

.button--ink,
.button--ink:visited {
  color: var(--ink-btn-label);
  fill: var(--ink-btn-label);
  font-style: var(--ink-btn-style);
  padding-left:  0;
  padding-right: 0;
}

.button--ink:hover {
  color: var(--ink-btn-label-hover);
  fill: var(--ink-btn-label-hover);
  font-style: var(--ink-btn-style-hover);
}

.button--ink:active {
  color: var(--ink-btn-label-active);
  fill: var(--ink-btn-label-active);
}

.button--ink::before {
  background-color: var(--ink-btn-fill);
  bottom: 0.75em;
  content: "";
  display: block;
  height: var(--ink-btn-width);
  left: 0;
  mix-blend-mode: multiply;
  position: absolute;
  transition: var(--transition);
  width: 100%;
}

.button--ink:hover::before {
  background-color: var(--ink-btn-fill-hover);
  height: var(--ink-btn-width-hover);
}

.button--ink * {
  z-index: 1;
}

/* Featured Button */

.button--featured,
.button--featured:visited {
  box-shadow: var(--featured-btn-underline);
  color: var(--featured-btn-label);
  fill: var(--featured-btn-label);
  font-style: var(--featured-btn-style);
  font-weight: 700;
  padding: 0;
}

.button--featured:hover {
  box-shadow: 0 0 var(--featured-btn-label-hover);
  color: var(--featured-btn-label-hover);
  fill: var(--featured-btn-label-hover);
  font-style: var(--featured-btn-style-hover);
}

.button--featured:active {
  box-shadow: 0 0 var(--featured-btn-label-hover);
  color: var(--featured-btn-label-active);
  fill: var(--featured-btn-label-active);
}

/* No Button */

.no-button,
.no-button:hover,
.no-button:focus,
.no-button:active {
  background: none;
  border: none;
  border-radius: 0;
  color: initial;
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  margin-bottom: 0;
  padding: 0;
  text-align: left;
  text-decoration: none;
  transition: none;
}

/* Button Sizing */

.button--xs {
  font-size: 0.78rem;
}

.button--sm {
  font-size: 0.89rem;
}

.button--md {
  font-size: 1rem;
}

.button--lg {
  font-size: 1.33rem;
}

.button--xl {
  font-size: 1.67rem;
}

/* Button Icons */

.button__icon {
  align-items: center;
  display: flex;
  justify-content: center;
}

.button__icon svg {
  fill: inherit;
  height: 1em;
  margin-right: 0.4em;
  width:  1em;
}

.button__icon--fa svg {
  display: block;
  fill: inherit;
  height: 1em;
  margin-right: 0.4em;
}

.button.button--icon-right .button__icon,
.button.button--icon-right .button__icon--fa {
  order: 1;
}

.button.button--icon-right .button__icon svg,
.button.button--icon-right .button__icon--fa svg {
  margin-left: 0.4em;
  margin-right: 0;
}

/* Switcher Button */

.button--switcher,
.button--switcher .button {
  color: var(--primary-btn-label);
  fill: var(--primary-btn-label);
  font-size: 0.9rem;
  padding: 0;
}

.button--switcher .button::before {
  display: none;
}
/* Form general styles */

form {
  background: var(--form-bg);
  border-bottom: var(--form-border-bottom);
  border-left: var(--form-border-left);
  border-right: var(--form-border-right);
  border-top: var(--form-border-top);
}

.form-title {
  background: var(--title-bg);
  color: var(--title-color);
}

/* Fields */

.hs-form-field {
  margin-bottom: 1em;
}

/* Labels */

form label {
  color: var(--label);
  display: block;
  font-size: 0.78rem;
  letter-spacing: var(--letter-spacing);
  line-height: 1;
  margin-bottom: 0.45em;
  padding-bottom: 0.4em;
  padding-left: 1.33rem;
  padding-top: 0.4em;
}

/* Help text */

form legend {
  color: var(--help-text);
  font-size: 0.9rem;
}

/* Inputs */

form input[type=text],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
form select,
form textarea,
.select-selected {
  background-color: var(--field-bg);
  border-bottom: var(--field-border-bottom);
  border-left: var(--field-border-left);
  border-right: var(--field-border-right);
  border-top: var(--field-border-top);
  border-radius: var(--field-corner);
  -webkit-border-radius: var(--field-corner);
  color: var(--field-text);
  display: inline-block;
  font-size: 0.89rem;
  letter-spacing: var(--letter-spacing);
  line-height: 1.1;
  padding: 1.56em;
  width: 100% !important;
}

/* Style for successful validation */
/* form input[type='text']:valid,
form input[type='email']:valid,
form input[type='password']:valid,
form input[type='tel']:valid,
form input[type='number']:valid,
form select:valid,
form textarea:valid {
  border: none;
  border-top: 4px solid var(--status-success);
} */

form input[type='text']:focus,
form input[type='text']:active,
form input[type='email']:focus,
form input[type='email']:active,
form input[type='password']:focus,
form input[type='password']:active,
form input[type='tel']:focus,
form input[type='tel']:active,
form input[type='number']:focus,
form input[type='number']:active,
form select:focus,
form select:active,
form textarea:focus,
form textarea:active {
  outline: 1px solid var(--field-outline-color);
}

form fieldset {
  max-width: 100% !important;
}

::-webkit-input-placeholder {
  color: var(--placeholder);
  letter-spacing: var(--letter-spacing);
}

::-moz-placeholder {
  color: var(--placeholder);
  letter-spacing: var(--letter-spacing);
}

:-ms-input-placeholder {
  color: var(--placeholder);
  letter-spacing: var(--letter-spacing);
}

:-moz-placeholder {
  color: var(--placeholder);
  letter-spacing: var(--letter-spacing);
}

::placeholder {
  color: var(--placeholder);
  letter-spacing: var(--letter-spacing);
}

/* Inputs - checkbox/radio */

form .inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

form .inputs-list > li {
  display: block;
  margin: 0.7rem 0;
}

form .inputs-list input,
form .inputs-list span {
  vertical-align: middle;
}

form input[type=checkbox],
form input[type=radio] {
  cursor: pointer;
  margin-right: 0.35rem;
}

/* Inputs - date picker */

.hs-dateinput {
  position: relative;
}

.hs-dateinput:before {
  content:'\01F4C5';
  position: absolute;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
}

.fn-date-picker .pika-table thead th {
  color: #FFF;
}

.fn-date-picker td.is-selected .pika-button {
  border-radius: 0;
  box-shadow: none;
}

.fn-date-picker td .pika-button:hover,
.fn-date-picker td .pika-button:focus {
  border-radius: 0 !important;
  color: #FFF;
}

/* Inputs - file picker */

form input[type=file] {
  background-color: transparent;
  border: initial;
  padding: initial;
}

/* Headings and text */

form .hs-richtext,
form .hs-richtext p {
  font-size: 0.875rem;
  margin: 0 0 1.4rem;
}

form .hs-richtext img {
  max-width: 100% !important;
}

/* GDPR */

form .legal-consent-container,
form .legal-consent-container .hs-richtext,
form .legal-consent-container .hs-richtext p {
  color: var(--dark-tertiary);
  font-size: 0.8rem;
  margin-bottom: 1.67em;
}

.legal-consent-container .hs-form-booleancheckbox-display > span,
.legal-consent-container .hs-form-booleancheckbox-display > span p {
  margin-left: 1rem !important;
}

form .legal-consent-container label {
  padding-left: 0;
}

/* Validation */

.hs-form-required {
  color: var(--status-error);
}

.hs-input.invalid.error {
  border: none;
  border-top: 4px solid var(--status-error);
}

.hs-error-msg {
  color: var(--status-error);
  font-size: 0.72rem;
  margin-top: 1em;
  padding-left: 1.33rem;
}

/* Submit button */

form input[type=submit],
form .hs-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  align-items: center;
  appearance: none;
  background: var(--field-btn-fill);
  border-bottom: var(--field-btn-border-bottom);
  border-left: var(--field-btn-border-left);
  border-right: var(--field-btn-border-right);
  border-top: var(--field-btn-border-top);
  border-radius: var(--field-btn-corner);
  box-shadow: none;
  color: var(--field-btn-label);
  cursor: pointer;
  display: inline-flex;
  font-size: 1rem;
  fill: var(--field-btn-label);
  flex-shrink: 0;
  font-weight: 500;
  padding: 0.625em 1.5em;
  text-align: center;
  text-decoration: none;
  transition: var(--transition);
  white-space: normal;
}

form input[type=submit]:hover,
form .hs-button:hover {
  background: var(--field-btn-fill-hover);
  border-bottom: var(--field-btn-border-bottom-hover);
  border-left: var(--field-btn-border-left-hover);
  border-right: var(--field-btn-border-right-hover);
  border-top: var(--field-btn-border-top-hover);
  border-radius: var(--field-btn-corner-hover);
  color: var(--field-btn-label-hover);
  fill: var(--field-btn-label-hover);
}

/* Captcha */

.grecaptcha-badge {
  margin: 0 auto;
}

/* Custom selector */

/* The container must be positioned relative: */
.hs-fieldtype-select .input,
.custom-select {
  position: relative;
}

.hs-fieldtype-select .input select
.custom-select select {
  appearance: none; 
}

/* Style the arrow inside the select element: */
.select-selected::after {
  background-image: url("https://48932267.fs1.hubspotusercontent-na1.net/hubfs/48932267/raw_assets/public/@marketplace/Kohorta/Adamant/images/custom-select/icon-dropdown.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  content: "";
  height: 1.2em;
  position: absolute;
  right: 1.2em;
  top: 1.6em;
  transform: rotate(0deg);
  transition: var(--transition);
  width:  1.2em;
}

.custom-select .select-selected::after {
  top: 1em;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active::after {
  transform: translateY(0.2em) rotate(180deg);
}

/* style the items (options), including the selected item: */
.select-items div {
  border: none;
  color: var(--field-text);
  cursor: pointer;
  transition: var(--transition);
  width: 100%;
}

.custom-select .select-selected {
  background-color: var(--light-tertiary);
  font-size: 1rem;
  padding: 1.2em 1.67em;
  position: relative;
}

.select-selected__label {
  left: 0;
  position: absolute;
  top: 0;
}

.select-items div {
  font-size: 0.875rem;
  overflow: hidden;
  padding: 1em 1.67em;
  white-space: nowrap;
}

.select-items div:first-of-type {
  border-top: 1px solid var(--light-tertiary);
  padding-top: 1.67em;
}

.select-items div:last-of-type {
  padding-bottom: 1.67em;
}

/* Style items (options): */
.select-items {
  background-color: var(--light-secondary);
  left: 0;
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 100;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, 
.same-as-selected {
  background-color: var(--light-tertiary);
}
/* Table */

table {
  background-color: var(--table-body-bg) !important;
  border-bottom: var(--table-cell-border-bottom) !important;
  border-left: var(--table-cell-border-left) !important;
  border-right: var(--table-cell-border-right) !important;
  border-top: var(--table-cell-border-top) !important;
  border-collapse: collapse;
  font-size: 0.89rem;
  margin-bottom: 1.4rem;
  overflow-wrap: break-word;
}

/* Table cells */

td,
th {
  border-bottom: var(--table-cell-border-bottom);
  border-left: var(--table-cell-border-left);
  border-right: var(--table-cell-border-right);
  border-top: var(--table-cell-border-top);
  color: var(--table-body-text);
  padding: var(--table-cell-spacing);
  vertical-align: top;
}

/* Table header */

thead th {
  background-color: var(--table-header-bg);
  color: var(--table-header-text);
  font-weight: 700;
  padding-bottom: 1.2em;
  padding-top:    1.2em;
  vertical-align: bottom;
}

/* Table footer */

tfoot td {
  background-color: var(--table-footer-bg);
  color: var(--table-footer-text);
}

/* Components
Specific pieces of UI that are stylized. Typically used for global partial styling
*/

/* Header */

.header {
  background-color: var(--header-bg);
  border-bottom: var(--header-bottom-border);
  position: relative;
  width: 100%;
}

.header--fixed {
  left: 0;
  min-height: var(--main-content-offset);
  position: fixed;
  top: 0;
  z-index: 1000;
}

.header--landing {
  background-color: var(--header-bg-landing);
}

/* Logo */

.header__logo-effect a {
  position: relative;
}

.header__logo a::after {
  background: var(--header-logo-effect);
  background-position: -500%;
  background-repeat: no-repeat;
  background-size: 140px;
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: background-position 0.8s ease-in-out;
}

.header__logo a:hover::after {
  background-position: 500%;
  opacity: 1;
}

.header__logo * {
  display: block;
}

.header__logo a:not([class])::before {
  display: none;
}

/* Navigation skipper */

.header__skip {
  height: 1px;
  left: -1000px;
  overflow: hidden;
  position: absolute;
  text-align: left;
  top: -1000px;
  width: 1px;
}

.header__skip:hover,
.header__skip:focus,
.header__skip:active {
  height: auto;
  left: 0;
  overflow: visible;
  top: 0;
  width: auto;
}

/* Navigation */

.header__main {
  align-items: center;
  display: flex;
}

.header__nav {
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
}

@media screen and (min-width: 768px) {
  .header__nav {
    flex-grow: 1;
    justify-content: flex-end;
  }
}

.inner-header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 1.5rem;
  padding-top:    1.5rem;
  width: 100%;
}

.header__cta {
  margin-bottom: 2rem;
  padding-left: 2rem;
  display: flex;
}

.header__cta .btn-list {
  padding: 0;
}

.header__cta .btn-list__item {
  margin: 0;
}

.header__cta .button--secondary,
.header__cta .button--secondary:visited {
  border: none;
  /* padding-left: 0; */
}

.header__cta .button--secondary:hover {
  background-color: transparent;
}

@media screen and (min-width: 768px) {
  .header__cta {
    display: flex;
    flex-shrink: 0;
    margin-bottom: 0;
    padding-left: 0;
  }
}
  
.header__block {
  background-color: var(--header-bg);
  display: none;
  padding: 0;
}

.header__block.is-active {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: calc(100vh - var(--content-offset-mobile));
  min-height: calc(100dvh - var(--content-offset-mobile));
  margin: 0;
  left: 0;
  overflow: hidden;
  padding-top: 1.875rem;
  padding-bottom: 1.875rem;
  position: absolute;
  right: 0;
  top: var(--content-offset-mobile);
  z-index: 20;
}

.header__block-toggle {
  align-items: flex-start;
  color: var(--header-nav-color);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 24px;
  justify-content: space-around;
  padding: 3px;
  transform: translateY(0) rotate(0deg);
  transition: all .3s ease-in-out;
  width: 24px;
  z-index: 100;
}

.js-header__block-toggle--reverse {
  transform: rotate(90deg);
}

.header__block-toggle-item {
  background-color: var(--header-nav-color);
  height: 1px;
  transition: all .2s ease-in-out;
  transition-delay: .2s;
}

.header__block-toggle-item--s {
  transform: translateY(0) scale(1);
  width: 50%;
}

.header__block-toggle-item--l {
  width: 100%;
  transform: translateY(0) rotate(0deg);
}

.header__block-toggle-item--m {
  transform: translateY(0) rotate(0deg);
  width: 68%;
}

.js-header__block-toggle--reverse .header__block-toggle-item--s {
  transform: translateY(6px) scale(0);
}

.js-header__block-toggle--reverse .header__block-toggle-item--l {
  transform: translateY(0) rotate(45deg);
}

.js-header__block-toggle--reverse .header__block-toggle-item--m {
  transform: translateY(-6px) rotate(-45deg);
  width: 100%;
}

@media screen and (min-width: 768px) {
  .header__block-toggle {
    display: none;
  }

  .header__block {
    background-color: transparent;
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: space-between;
  }

  .header__block.is-active {
    flex-direction: row;
    height: auto;
    min-height: auto;
    justify-content: initial;
    overflow: initial;
    padding: 0;
    position: static;
  }
}



/* Language switcher */

.header__lang {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex-shrink: 0;
  margin-left: 1em;
  padding-right: 1em;
}

.header__lang-label {
  color: var(--header-nav-color);
  font-size: 0.89rem;
  margin-left: 0.35em;
  white-space: nowrap;
}

.header__lang:hover .lang_list_class {
  display: block;
}

.header__lang .lang_switcher_class {
  display: block;
}

.lang_switcher_class .globe_class {
  background-image: url("https://48932267.fs1.hubspotusercontent-na1.net/hubfs/48932267/raw_assets/public/@marketplace/Kohorta/Adamant/images/lang-switcher/icon-lang.svg");
  background-color: var(--dark-tertiary);
  background-size: 14px;
  border-radius: 50%;
  height: 20px;
  width: 20px;
}

.lang_switcher_class .lang_list_class {
  width: 160px;
}

.lang_switcher_class .lang_list_class li:first-child {
  border: none;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  padding-top: 1.6em;
}

.lang_switcher_class .lang_list_class li:last-child {
  border: none;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  padding-bottom: 1.6em;
}

.lang_switcher_class .lang_list_class {
  top: 18px;
}
.lang_switcher_class .lang_list_class li {
  background-color: var(--light-tertiary);
  border: none;
  font-size: 0.84rem;
  padding: 0.6em;
}

.lang_switcher_class .lang_list_class::after {
  border-bottom-color: var(--light-tertiary);
}

.lang_switcher_class .lang_list_class::before {
  border-bottom-color: var(--light-tertiary);
}

.lang_switcher_class .lang_list_class li a {
  color: var(--dark-primary);
  font-style: normal;
}

.lang_switcher_class .lang_list_class li a:hover {
  color: var(--dark-tertiary);
}
/* ----------- Footer ----------- */

.footer {
  background-color: var(--footer-bg);
  border-top: var(--footer-border);
  flex-shrink: 0;
}

.footer ul[role=menu] a:not([class]):hover::before {
  display: none;
}

/* Footer nav */

.footer__nav ul[role=menu], .footer__nav [role=navigation] ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer__nav ul[role=menu]:first-child, .footer__nav [role=navigation] ul:first-child {
  display: flex;
  flex-wrap: wrap;
  max-width: var(--footer-nav-width);
}

.footer__nav ul[role=menu] li, .footer__nav [role=navigation] ul li {
  padding: 0.4em 2em 0.4em 0;
}

.footer__nav ul[role=menu] .hs-menu-depth-1, .footer__nav [role=navigation] ul .hs-menu-depth-1 {
  flex-shrink: 0;
  margin-bottom: 1.8rem;
}

@media only screen and (min-width: 640px){
  .footer__nav ul[role=menu] li, .footer__nav [role=navigation] ul li {
    padding-right: 0.9em;
  }

  .footer__nav ul[role=menu] .hs-menu-depth-1, .footer__nav [role=navigation] ul .hs-menu-depth-1 {
    flex-basis: calc(100% / var(--footer-nav-cols));
    margin-bottom: 2.5rem;
  }
}

.footer__nav ul[role=menu] .hs-menu-depth-1 > a, .footer__nav [role=navigation] ul .hs-menu-depth-1 > a {
  color: var(--footer-nav-item-color);
  cursor: initial;
  display: block;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
  margin-bottom: 1em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

.footer__nav ul[role=menu] .hs-menu-depth-2 > a[href="javascript:;"], .footer__nav [role=navigation] ul .hs-menu-depth-2 > a[href="javascript:;"] {
  color: var(--footer-nav-item-disabled);
  cursor: auto;
  position: relative;
}

.footer__nav ul[role=menu] .hs-menu-depth-2 > a[href="javascript:;"]:hover, .footer__nav [role=navigation] ul .hs-menu-depth-2 > a[href="javascript:;"]:hover {
  color: var(--footer-nav-item-disabled);
}



.footer__nav ul[role=menu] li a, .footer__nav [role=navigation] ul li a {
  color: var(--footer-nav-item-color);
  font-size: 0.89rem;
  font-style: normal;
  text-decoration: none;
}

.footer__nav ul[role=menu] a:not([class]):hover, .footer__nav [role=navigation] ul a:not([class]):hover {
  color: var(--footer-nav-item-color-hover);
  text-decoration: underline;
}

.footer__nav ul[role=menu] a[href="javascript:;"]:hover, .footer__nav [role=navigation] ul a[href="javascript:;"]:hover {
  color: var(--footer-nav-item-color);
  text-decoration: none;
}

/* Footer logo */

.footer__logo a {
  display: block;
  width: 100px;
}

@media only screen and (min-width: 768px) {
  .footer__logo a {
    width: 140px;
  }
}

/* Footer meta nav */

.footer__meta-nav {
  color: var(--footer-meta);
  font-size: 0.89rem;
}

.footer__meta-nav a {
  color: var(--footer-meta);
  font-style: normal;
  text-decoration: underline;
}

.footer__meta-nav a:hover {
  color: var(--dark);
  text-decoration: none;
}

.footer__meta-nav a:not([class]):hover::before {
  display: none;
}

.footer__meta-nav a svg {
  display: inline-block;
  margin-bottom: -0.125em;
  margin-left: 0.2em;
}
/* Menu and simple menu */

.hs-menu-wrapper ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* Horizontal menu */

.hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-children-wrapper {
  flex-direction: column;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-horizontal ul {
    flex-direction: column;
  }
}

/* Vertical menu */

.hs-menu-wrapper.hs-menu-flow-vertical ul {
  flex-direction: column;
}

/* Flyouts */

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul {
  display: inline-flex;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-vertical ul {
    display: flex;
  }
}

.hs-menu-wrapper.flyouts .hs-item-has-children {
  position: relative;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper {
  left: -9999px;
  opacity: 0;
  position: absolute;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper a {
  display: block;
  white-space: nowrap;
}

.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 0;
  opacity: 1;
  top: 100%;
}

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 100%;
  opacity: 1;
  top: 0;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.flyouts .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
    left: 0;
    opacity: 1;
    position: relative;
    top: auto;
  }
}

/* CTA, logo, and rich text images */

.hs_cos_wrapper_type_cta img,
.hs_cos_wrapper_type_logo img,
.hs_cos_wrapper_type_rich_text img {
  height: auto;
  max-width: 100%;
}
.card__image {
  margin-bottom: 3rem;
}

.card__divider {
  border-bottom-width: 2px;
  margin-bottom: 1.875rem;
}

.card__title {
  position: relative;
}

.card--framed {
  background-color: var(--light-secondary);
  min-height: 100%;
  padding: 3rem 2rem;
}

.card__icon svg {
  display: block;
}

.card__desc,
.card__desc p {
  font-size: clamp(0.89rem, 5vw,1.167rem);
}

@media only screen and (min-width: 768px) {
  .card--framed {
    padding: clamp(1rem, 4vw, 3.67rem);
  }
}

/* Section */

.featured-cards {
  position: relative;
  z-index: 1;
}

@media only screen and (min-width: 768px) {
  .featured-cards .row-fluid,
  .featured-cards .dnd-module {
    display: flex !important;
  }
}
.testimonial__info {
  margin-bottom: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .testimonial__info {
    align-items: center;
    display: flex;
  }
}

.testimonial__meta {
  color: var(--dark-tertiary);
  display: block;
  font-size: 0.89rem;
}

.testimonial__name {
  margin-bottom: 0.5em;
}

/* Utilities
Helper classes with ability to override anything that comes before it
*/

/* ********* Layout ********* */

.footer-bottom__base {
  display: flex; /* Enables body content to acquire flex properties like grow, shrink and base */
  flex-direction: column; /* Fixes the row layout for body that comes from display: flex */
  min-height: 100vh;
  overflow-x: hidden;
}

.footer-bottom__shift {
  flex: 1 0 auto; 
  /* Makes div, which is footer's sibling, to grow and take all the height and shifts footer 
  element to the bottom of the browser window. It works when summarized height of the body's 
  children is less then the height of the browser's window */
}

.block {
  display: block;
}

.flex {
  display: flex;
}

.flex-centered-col {
  align-items: center;
  display: flex;
  flex-direction: column;
}

@media only screen and (max-width: 768px) {
  .m-hide {
    display: none;
  }
}

.relative {
  position: relative;
}

.mw-220 {
  max-width: 220px !important;
}

.mw-380 {
  max-width: 380px !important;
}

.mw-460 {
  max-width: 460px !important;
}

.mw-600 {
  max-width: 600px !important;
}

.mw-720 {
  max-width: 720px !important;
}

.mw-840 {
  max-width: 840px !important;
}

.full-width {
  width: 100%;
}

/* ********* Spacing ********* */

@media only screen and (min-width: 1024px) {
  .d-offset-left {
    margin-left: 7.5rem;
  }
}

/* Bottom */

.pb-0 {
  padding-bottom: 0;
}

.mb-0 {
  margin-bottom: 0;
}

.pb-xs {
  padding-bottom: 1rem;
}

.mb-xs {
  margin-bottom: 1rem;
}

.pb-sm {
  margin-bottom: 2rem;
}

.mb-sm {
  margin-bottom: 2rem;
}

.pb-md {
  padding-bottom: 3.75rem;
}

.mb-md {
  margin-bottom: 3.75rem;
}

.pb-lg {
  padding-bottom: 5rem;
}

.mb-lg {
  margin-bottom: 5rem;
}

.pb-xl {
  padding-bottom: 8rem;
}

.mb-xl {
  margin-bottom: 8rem;
}

@media (max-width: 767px) {
  .m-pb-0 {
    padding-bottom: 0;
  }
  
  .m-mb-0 {
    margin-bottom: 0;
  }
  
  .m-pb-xs {
    padding-bottom: 1rem;
  }
  
  .m-mb-xs {
    margin-bottom: 1rem;
  }
  
  .m-pb-sm {
    margin-bottom: 2rem;
  }
  
  .m-mb-sm {
    margin-bottom: 2rem;
  }
  
  .m-pb-md {
    padding-bottom: 3.75rem;
  }
  
  .m-mb-md {
    padding-bottom: 3.75rem;
  }
  
  .m-pb-lg {
    padding-bottom: 5rem;
  }
  
  .m-mb-lg {
    margin-bottom: 5rem;
  }
  
  .m-pb-xl {
    padding-bottom: 8rem;
  }
  
  .m-mb-xl {
    margin-bottom: 8rem;
  }
}

/* Top */

.pt-0 {
  padding-top: 0;
}

.mt-0 {
  margin-top: 0;
}

.pt-xs {
  padding-top: 1rem;
}

.mt-xs {
  margin-top: 1rem;
}

.pt-sm {
  padding-top: 2rem;
}

.mt-sm {
  margin-top: 2rem;
}

.pt-md {
  padding-top: 3.75rem;
}

.mt-md {
  margin-top: 3.75rem;
}

.pt-lg {
  padding-top: 5rem;
}

.mt-lg {
  margin-top: 5rem;
}

.pt-xl {
  padding-top: 8rem;
}

.mt-xl {
  margin-top: 8rem;
}

@media (max-width: 767px) {
  .m-pt-0 {
    padding-top: 0;
  }
  
  .m-mt-0 {
    margin-top: 0;
  }
  
  .m-pt-xs {
    padding-top: 1rem;
  }
  
  .m-mt-xs {
    margin-top: 1rem;
  }
  
  .m-pt-sm {
    padding-top: 2rem;
  }
  
  .m-mt-sm {
    margin-top: 2rem;
  }
  
  .m-pt-md {
    padding-top: 3.75rem;
  }
  
  .m-mt-md {
    margin-top: 3.75rem;
  }
  
  .m-pt-lg {
    padding-top: 5rem;
  }
  
  .m-mt-lg {
    margin-top: 5rem;
  }
  
  .m-pt-xl {
    padding-top: 8rem;
  }
  
  .m-mt-xl {
    margin-top: 8rem;
  }
}

/* Left */

.pl-0 {
  padding-left: 0;
}

.ml-0 {
  margin-left: 0;
}

.pl-xs {
  padding-left: 1rem;
}

.ml-xs {
  margin-left: 1rem;
}

.pl-sm {
  padding-left: 2rem;
}

.ml-sm {
  margin-left: 2rem;
}

.pl-md {
  padding-left: 3.75rem;
}

.ml-md {
  margin-left: 3.75rem;
}

.pl-lg {
  padding-left: 5rem;
}

.ml-lg {
  margin-left: 5rem;
}

.pl-xl {
  padding-left: 8rem;
}

.ml-xl {
  margin-left: 8rem;
}

@media (max-width: 767px) {
  .m-pl-0 {
    padding-left: 0;
  }
  
  .m-ml-0 {
    margin-left: 0;
  }
  
  .m-pl-xs {
    padding-left: 1rem;
  }
  
  .m-ml-xs {
    margin-left: 1rem;
  }
  
  .m-pl-sm {
    padding-left: 2rem;
  }
  
  .m-ml-sm {
    margin-left: 2rem;
  }
  
  .m-pl-md {
    padding-left: 3.75rem;
  }
  
  .m-ml-md {
    margin-left: 3.75rem;
  }
  
  .m-pl-lg {
    padding-left: 5rem;
  }
  
  .m-ml-lg {
    margin-left: 5rem;
  }
  
  .m-pl-xl {
    padding-left: 8rem;
  }
  
  .m-ml-xl {
    margin-left: 8rem;
  }
}

/* Right */

.pr-0 {
  padding-right: 0;
}

.mr-0 {
  margin-right: 0;
}

.pr-xs {
  padding-right: 1rem;
}

.mr-xs {
  margin-right: 1rem;
}

.pr-sm {
  padding-right: 2rem;
}

.mr-sm {
  margin-right: 2rem;
}

.pr-md {
  padding-right: 3.75rem;
}

.mr-md {
  margin-right: 3.75rem;
}

.pr-lg {
  padding-right: 5rem;
}

.mr-lg {
  margin-right: 5rem;
}

.pr-xl {
  padding-right: 8rem;
}

.mr-xl {
  margin-right: 8rem;
}

@media (max-width: 767px) {
  .m-pr-0 {
    padding-right: 0;
  }
  
  .m-mr-0 {
    margin-right: 0;
  }
  
  .m-pr-xs {
    padding-right: 1rem;
  }
  
  .m-mr-xs {
    margin-right: 1rem;
  }
  
  .m-pr-sm {
    padding-right: 2rem;
  }
  
  .m-mr-sm {
    margin-right: 2rem;
  }
  
  .m-pr-md {
    padding-right: 3.75rem;
  }
  
  .m-mr-md {
    margin-right: 3.75rem;
  }
  
  .m-pr-lg {
    padding-right: 5rem;
  }
  
  .m-mr-lg {
    margin-right: 5rem;
  }
  
  .m-pr-xl {
    padding-right: 8rem;
  }
  
  .m-mr-xl {
    margin-right: 8rem;
  }
}

/* Horizontal */

.px-xs {
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-sm {
  padding-left: 2rem;
  padding-right: 2rem;
}

.px-md {
  padding-left: 3.75rem;
  padding-right: 3.75rem;
}

.px-lg {
  padding-left: 5rem;
  padding-right: 5rem;
}

.px-xl {
  padding-left: 8rem;
  padding-right: 8rem;
}

@media (max-width: 767px) {
  .m-px-xs {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  
  .m-px-sm {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .m-px-md {
    padding-left: 3.75rem;
    padding-right: 3.75rem;
  }
  
  .m-px-lg {
    padding-left: 5rem;
    padding-right: 5rem;
  }
  
  .m-px-xl {
    padding-left: 8rem;
    padding-right: 8rem;
  }
}

/* Vertical */

.py-xs {
  padding-bottom: 1rem;
  padding-top: 1rem;
}

.py-sm {
  padding-bottom: 2rem;
  padding-top: 2rem;
}

.py-md {
  padding-bottom: 3.75rem;
  padding-top: 3.75rem;
}

.py-lg {
  padding-bottom: 5rem;
  padding-top: 5rem;
}

.py-xl {
  padding-bottom: 8rem;
  padding-top: 8rem;
}

@media (max-width: 767px) {
  .m-py-xs {
    padding-bottom: 1rem;
    padding-top: 1rem;
  }
  
  .m-py-sm {
    padding-bottom: 2rem;
    padding-top: 2rem;
  }
  
  .m-py-md {
    padding-bottom: 3.75rem;
    padding-top: 3.75rem;
  }
  
  .m-py-lg {
    padding-bottom: 5rem;
    padding-top: 5rem;
  }
  
  .m-py-xl {
    padding-bottom: 8rem;
    padding-top: 8rem;
  }
}

/* Auto */

.ml-auto {
  margin-left: auto;
}

.mr-auto {
  margin-right: auto;
}

.mx-auto {
  margin: 0 auto;
}

/* ********* Visuals ********* */

/* Images */

.img-cover {
  --max-width: 306px;
  display: block;
  max-width: var(--max-width) !important;
  overflow: hidden;
}

.img-cover img {
  object-fit: cover;
}

.img-cover--portrait-lg {
  --max-width: 597px;
}

.img-cover--portrait-lg,
.img-cover--portrait-lg img {
  aspect-ratio: 4/5;
}

.img-cover--portrait-md {
  --max-width: 392px;
}

.img-cover--portrait-md,
.img-cover--portrait-md img {
  aspect-ratio: 4/5;
}

.img-cover--portrait-md-tall {
  --max-width: 389px;
}

.img-cover--portrait-md-tall,
.img-cover--portrait-md-tall img {
  aspect-ratio: 2/3;
}

.img-cover--square-sm {
  --max-width: 114px;
}

.img-cover--square-sm,
.img-cover--square-sm img {
  aspect-ratio: 1/1;
}

.img-cover--square-md {
  --max-width: 306px;
}

.img-cover--square-md,
.img-cover--square-md img {
  aspect-ratio: 1/1;
}

.img-cover--square-lg {
  --max-width: 468px;
}

.img-cover--square-lg,
.img-cover--square-lg img {
  aspect-ratio: 1/1;
}

.img-cover--square-xl {
  --max-width: 597px;
}

.img-cover--square-xl,
.img-cover--square-xl img {
  aspect-ratio: 1/1;
}

.img-cover--landscape-sm {
  --max-width: 306px;
}

.img-cover--landscape-sm,
.img-cover--landscape-sm img {
  aspect-ratio: 3/2;
}

.img-cover--landscape-md {
  --max-width: 702px;
}

.img-cover--landscape-md,
.img-cover--landscape-md img {
  aspect-ratio: 3/2;
}

.img-cover--landscape-lg {
  --max-width: 1356px;
}

.img-cover--landscape-lg,
.img-cover--landscape-lg img {
  aspect-ratio: 2/1;
}

.img-cover--oval-lg {
  --max-width: 294px;
  border-radius: calc(var(--max-width) * 0.6);
}

.img-cover--oval-lg,
.img-cover--oval-lg img {
  aspect-ratio: 4/5;
}

.img-cover--oval-sm {
  --max-width: 114px;
  border-radius: calc(var(--max-width) * 0.6);
}

.img-cover--oval-sm,
.img-cover--oval-sm img {
  aspect-ratio: 4/5;
}

.img-cover--oval-xs {
  --max-width: 72px;
  border-radius: calc(var(--max-width) * 0.6);
}

.img-cover--oval-xs,
.img-cover--oval-xs img {
  aspect-ratio: 4/5;
}

/* Icons */

.icon--linkedin-fix svg {
  margin-top: -0.12em;
}

/* ********* Appearance ********* */

.bg-color {
  background-color: var(--accent-primary);
}

.bg-white {
  background-color: #FFF;
}

.bg-light {
  background-color: var(--light-primary);
}

.bg-light-sec {
  background-color: var(--light-secondary);
}

.bg-light-ter {
  background-color: var(--light-tertiary);
}

.bg-dark {
  background-color: var(--dark-primary);
}

.divider-b {
  border-bottom: 1px solid var(--light-tertiary);
}

.divider-t {
  border-top: 1px solid var(--light-tertiary);
}

@media only screen and (max-width: 768px) {
  .m-divider-b {
    border-bottom: 1px solid var(--light-tertiary);
  }
  
  .m-divider-t {
    border-top: 1px solid var(--light-tertiary);
  }
}

/* For content that needs to be visually hidden but stay visible for screenreaders */

.show-for-sr {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

@media (max-width: 767px) {
  .show-for-sr--mobile {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
  }
}

/* JS-related helpers */

.js-noscroll {
  overflow: hidden;
}

.js-hide {
  display: none;
}

@media (hover: hover) {
  .js-slidein-start {
    opacity: 0;
    transform: translateY(25%);
    transition-duration: 0.6s;
    transition-property: opacity,transform;
    transition-timing-function: ease-in-out;
  }

  .js-slidein-end {
    opacity: 1;
    transform: translateY(0);
  }
}
/* === assets/css/common.css === */
/* ============================================================
   VXM Design System - CSS Custom Properties
   ============================================================ */

:root {
  /* Brand Colors */
  --vxm-brand-blue: #477ECF;
  --vxm-dark: #1A1A1A;
  --vxm-white: #FFFFFF;
  --vxm-accent: #7FD2CD;
  --vxm-success: #20AD96;
  --vxm-teal: #4DC6BE;
  --vxm-black: #000000;

  /* Neutral Palette */
  --vxm-gray-100: #F9FAFB;
  --vxm-gray-200: #F2F5EE;
  --vxm-gray-300: #E5E7EB;
  --vxm-gray-400: #CCCCCC;
  --vxm-gray-500: #999999;
  --vxm-gray-600: #555555;
  --vxm-gray-700: #333333;
  --vxm-gray-900: #0A0E27;

  /* Typography Scale */
  --vxm-text-sm: 14px;
  --vxm-text-base: 16px;
  --vxm-text-lg: 18px;
  --vxm-text-xl: 24px;
  --vxm-text-2xl: 32px;
  --vxm-text-3xl: 40px;

  /* Heading scale (responsive) — normalized site-wide title/subtitle sizes.
     Matches the hero + "tradicional a digital" reference: desktop -> mobile. */
  --vxm-fs-hero: clamp(30px, 5vw, 44px);    /* page H1 / hero headline */
  --vxm-fs-title: clamp(26px, 5vw, 34px);   /* section titles (H2) */
  --vxm-fs-subtitle: 18px;                  /* subtitles / secondary text */
  --vxm-fs-eyebrow: 12px;                   /* small uppercase labels */

  /* Spacing Scale */
  --vxm-space-xs: 4px;
  --vxm-space-sm: 8px;
  --vxm-space-md: 16px;
  --vxm-space-lg: 24px;
  --vxm-space-xl: 40px;
  --vxm-space-2xl: 64px;

  /* Layout */
  --vxm-max-width: 1400px;
  --vxm-border-radius: 8px;

  /* Transitions */
  --vxm-transition-fast: 150ms ease;
  --vxm-transition-base: 300ms ease;
}

/* CSS Containment for third-party embeds — prevents layout shifts from propagating */
.embed_container,
.oembed_container {
  contain: layout;
}

/* Override vendor template_main.min.css color variables for WCAG contrast */
:root {
  --accent-primary: #477ECF;
  --accent-secondary: #477ECF;
  --primary-btn-fill: #477ECF;
  --primary-btn-label: #FFFFFF;
  --primary-btn-label-hover: #477ECF;
  --primary-btn-label-active: #477ECF;
  --secondary-btn-fill: #477ECF;
  --secondary-btn-label-hover: #477ECF;
  --secondary-btn-label-active: #477ECF;
  --ink-btn-fill: #477ECF;
  --ink-btn-fill-hover: #477ECF;
  --ink-btn-fill-active: #477ECF;
  --featured-btn-label: #477ECF;
  --featured-btn-underline-color: #477ECF;
  --header-nav-color-hover: #477ECF;
  --field-btn-label-hover: #477ECF;
  --field-btn-fill: #477ECF;
  --footer-bg: #4DC6BE;
}

/* ── Utility classes ── */

.img-responsive {
  max-width: 100%;
  height: auto;
}

.inline-block-wrap {
  display: inline-block;
  max-width: 100%;
}

.border-none {
  border: 0;
}

/* ============================================================
   Base Styles
   ============================================================ */

/* Center buttons in plataforma.html sections */

.button-wrapper {
  text-align: center;
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

a.cta_button {
  box-sizing: content-box !important;
  vertical-align: middle;
}

.hs-breadcrumb-menu {
  list-style-type: none;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

.hs-breadcrumb-menu-item {
  float: left;
  padding: 10px 0 10px 10px;
}

.hs-breadcrumb-menu-divider:before {
  content: "›";
  padding-left: 10px;
}

.hs-featured-image-link {
  border: 0;
}

.hs-featured-image {
  float: right;
  margin: 0 0 20px 20px;
  max-width: 50%;
}

.hs-screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  width: 1px;
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-header-logo .logo {
  max-width: 120px;
  margin-top: 0;
  margin-bottom: -200px;
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-hero-buttons .btn-list {
  padding: 0;
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-hero-buttons .button1 {
  background: linear-gradient(135deg, var(--vxm-gray-500) 0%, #777777 100%);
  color: var(--vxm-white);
  font-weight: bold;
  position: relative;
  overflow: hidden;
  border: none;
  box-shadow:
  0 4px 15px rgba(0, 0, 0, 0.2),
  0 0 20px rgba(153, 153, 153, 0.3),
  inset 0 1px 0 rgba(255, 255, 255, 0.2);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Ensure button text is visible above animations */

.vxm-hero-buttons .button1 span {
  position: relative;
  z-index: 1;
}

/* Cosmic shimmer effect - always active */

.vxm-hero-buttons .button1::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
  60deg,
  transparent 0%,
  transparent 40%,
  rgba(255, 255, 255, 0.3) 50%,
  transparent 60%,
  transparent 100%
  );
  animation: cosmic-shimmer 3s linear infinite;
  pointer-events: none;
}

/* Starfield overlay - always active */

.vxm-hero-buttons .button1::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image:
  radial-gradient(1px 1px at 20% 30%, rgba(255, 255, 255, 0.9), transparent),
  radial-gradient(1px 1px at 60% 70%, rgba(255, 255, 255, 0.8), transparent),
  radial-gradient(1px 1px at 50% 50%, rgba(255, 255, 255, 0.7), transparent),
  radial-gradient(1px 1px at 80% 10%, rgba(255, 255, 255, 0.8), transparent),
  radial-gradient(1px 1px at 90% 60%, rgba(255, 255, 255, 0.9), transparent),
  radial-gradient(1px 1px at 33% 80%, rgba(255, 255, 255, 0.7), transparent);
  background-size: 200% 200%;
  background-position: 0% 0%;
  animation: starfield-drift 20s linear infinite;
  pointer-events: none;
  opacity: 0.6;
}

.vxm-hero-buttons .button1:hover,
.vxm-hero-buttons .button1:focus {
  background: linear-gradient(135deg, var(--vxm-brand-blue) 0%, #6B9AE8 50%, var(--vxm-brand-blue) 100%);
  box-shadow:
  0 6px 25px rgba(0, 191, 166, 0.4),
  0 0 40px rgba(0, 191, 166, 0.3),
  0 0 60px rgba(71, 126, 207, 0.2),
  inset 0 1px 0 rgba(255, 255, 255, 0.3);
  transform: translateY(-2px) scale(1.03);
}

.vxm-hero-buttons .button1:hover::before {
  animation: cosmic-shimmer 1.5s linear infinite;
}

.vxm-hero-buttons .button1:hover::after {
  opacity: 1;
  animation: starfield-drift 10s linear infinite;
}

.vxm-hero-buttons .button1:active {
  background: linear-gradient(135deg, #3A6AB5 0%, var(--vxm-brand-blue) 100%);
  transform: translateY(0) scale(1);
  box-shadow:
  0 2px 10px rgba(0, 191, 166, 0.5),
  0 0 20px rgba(0, 191, 166, 0.4),
  inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* Keyframe animations */

@keyframes cosmic-shimmer {
  0% {
  transform: translateX(-100%) translateY(-100%) rotate(45deg);
  }
  100% {
  transform: translateX(100%) translateY(100%) rotate(45deg);
  }
}

@keyframes starfield-drift {
  0% {
  background-position: 0% 0%;
  }
  100% {
  background-position: 100% 100%;
  }
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-header-divider hr {
  border: 0 none;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #666666;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  width: 100%;
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-footer .global-footer-outer {
  padding: 90px 0 0;
  margin-top: 0;
  margin-bottom: 0;
}

.vxm-footer .global-footer-outer .inner .col1 .quote p,
.vxm-footer
  .global-footer-outer
  .inner
  .col1
  .need-help-img
  .help-text
  .help-title
  p,
.vxm-footer .global-footer-outer .inner .col2 .loc-add p,
.vxm-footer
  .global-footer-outer
  .inner
  .col2
  .cont-links
  .cont-link
  .con-link
  a,
.vxm-footer
  .global-footer-outer
  .inner
  .col
  .co-menu
  .hs-menu-wrapper
  ul
  li
  a,
.vxm-footer .global-footer-outer .copyright p {
  color: var(--vxm-white);
  font-size: 15px;
  font-family: Montserrat, sans-serif;
  letter-spacing: 0;
  text-transform: none;
}

.vxm-footer .global-footer-outer .inner .cont-links .type strong,
.vxm-footer .global-footer-outer .inner .cont-links .con-link a {
  color: var(--vxm-white);
}

.vxm-footer .global-footer-outer .inner .col1 .need-help-img .image img {
  border: 0 none;
  border-radius: 0;
}

.vxm-footer
  .global-footer-outer
  .inner
  .col1
  .need-help-img
  .help-text
  .help-link
  a {
  color: var(--vxm-white);
  font-size: 15px;
  font-family: Montserrat, sans-serif;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.vxm-footer
  .global-footer-outer
  .inner
  .col1
  .need-help-img
  .help-text
  .help-link
  a:hover {
  color: var(--vxm-teal);
}

.vxm-footer .global-footer-outer .inner .col-title h4 {
  color: var(--vxm-white);
  font-size: 21px;
  font-family: Montserrat, sans-serif;
  letter-spacing: 0;
  text-transform: none;
}

.vxm-footer .global-footer-outer .inner .col-title:before {
  background-color: var(--vxm-teal);
}

.vxm-footer .global-footer-outer .inner .col2 .loc-tit h5,
.vxm-footer .global-footer-outer .inner .col2 .contact-tit h5 {
  color: var(--vxm-white);
  font-size: 20px;
  font-family: Montserrat, sans-serif;
  letter-spacing: 0;
  text-transform: none;
}

.vxm-footer
  .global-footer-outer
  .inner
  .col2
  .cont-links
  .cont-link
  .type
  h6 {
  color: var(--vxm-white);
  font-size: 18px;
  font-family: Montserrat, sans-serif;
  letter-spacing: 0;
  text-transform: none;
}

.vxm-footer
  .global-footer-outer
  .inner
  .col2
  .cont-links
  .cont-link
  .con-link
  a:hover,
.vxm-footer
  .global-footer-outer
  .inner
  .col
  .co-menu
  .hs-menu-wrapper
  ul
  li
  a:hover {
  color: var(--vxm-brand-blue);
}

/* Shared across 10 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-footer-social .social-follow {
  margin-bottom: 20px;
  display: flex !important;
  justify-content: center !important;
  gap: 1.5rem !important;
  padding: 2rem 0 !important;
}

.vxm-footer-social .social-follow__link {
  padding: 0.75rem;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background:
  radial-gradient(circle at 30% 30%, rgba(40, 60, 120, 0.15), transparent 70%),
  rgba(15, 20, 45, 0.6) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(100, 120, 180, 0.15) !important;
  transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  position: relative !important;
  box-shadow:
  0 4px 20px rgba(0, 0, 0, 0.4),
  inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.vxm-footer-social .social-links {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.vxm-footer-social .social-follow__link svg {
  color: var(--vxm-white);
  width: 20px !important;
  height: 20px !important;
  fill: rgba(220, 230, 255, 0.85) !important;
  transition: all 0.5s ease !important;
  position: relative !important;
  z-index: 1 !important;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)) !important;
}

.vxm-footer-social .social-follow__link:hover svg,
.vxm-footer-social .social-follow__link:focus svg,
.vxm-footer-social .social-follow__link:active svg {
  color: rgba(26, 26, 26, 60%);
  fill: rgba(26, 26, 26, 60%);
}

/* Font declarations removed - using Google Fonts CDN from HTML */

/* Shared across 8 pages: administrar.html, alimentos-y-bebidas.html, autoseller.html */

.vxm-cta-btn .button-wrapper,
.vxm-feature-problems-btn .button-wrapper,
.vxm-feature-solutions-btn .button-wrapper,
.vxm-button-centered .button-wrapper {
  text-align: CENTER;
}

.vxm-cta-btn .button--featured:hover,
.vxm-hero-cta-btn .button--featured:hover,
.vxm-tabs-cta-btn .button--featured:hover,
.vxm-feature-problems-btn .button--featured:hover,
.vxm-feature-solutions-btn .button--featured:hover,
.vxm-button-centered .button--featured:hover,
.vxm-button-white-18 .button--featured:hover {
  box-shadow: 0 0;
}

.vxm-hero-cta-btn .button,
.vxm-feature-problems-btn .button,
.vxm-feature-solutions-btn .button,
.vxm-button-centered .button {
  color: var(--vxm-white);
  font-weight: bold;
}

/* Shared across 2 pages: alimentos-y-bebidas.html, calzado.html */

.vxm-tabs .hs-tabs-wrapper,
.vxm-tabs-primary .hs-tabs-wrapper {
  margin-top: 0;
  margin-bottom: 30px;
}

.vxm-tabs .hs-tabs__tab,
.vxm-tabs-primary .hs-tabs__tab {
  padding: 10px;
}

.vxm-tabs .hs-tabs__tab[aria-selected="true"],
.vxm-tabs-primary .hs-tabs__tab[aria-selected="true"] {
  border-top: 1px solid var(--vxm-teal);
  border-left: 1px solid var(--vxm-teal);
  border-right: 1px solid var(--vxm-teal);
  border-bottom: 2px solid var(--vxm-black);
  background-color: var(--vxm-teal);
}

.vxm-tabs .hs-tabs__tab[aria-selected="true"]:after,
.vxm-tabs .hs-tabs__tab[aria-selected="false"]:hover:after,
.vxm-tabs .hs-tabs__tab[aria-selected="false"]:focus:after,
.vxm-tabs-primary .hs-tabs__tab[aria-selected="true"]:after,
.vxm-tabs-primary .hs-tabs__tab[aria-selected="false"]:hover:after,
.vxm-tabs-primary .hs-tabs__tab[aria-selected="false"]:focus:after {
  border-bottom: 2px solid var(--vxm-black);
}

.vxm-tabs .hs-tabs__tab[aria-selected="false"],
.vxm-tabs-primary .hs-tabs__tab[aria-selected="false"] {
  border-top: 1px solid var(--vxm-gray-400);
  border-left: 1px solid var(--vxm-gray-400);
  border-right: 1px solid var(--vxm-gray-400);
  border-bottom: 2px solid var(--vxm-gray-400);
}

.vxm-tabs .hs-tabs__tab[aria-selected="false"]:after,
.vxm-tabs-primary .hs-tabs__tab[aria-selected="false"]:after {
  border-bottom: 2px solid var(--vxm-gray-400);
}

.vxm-tabs .hs-tabs__tab[aria-selected="false"]:hover,
.vxm-tabs .hs-tabs__tab[aria-selected="false"]:focus,
.vxm-tabs-primary .hs-tabs__tab[aria-selected="false"]:hover,
.vxm-tabs-primary .hs-tabs__tab[aria-selected="false"]:focus {
  border-top: 1px solid var(--vxm-gray-400);
  border-left: 1px solid var(--vxm-gray-400);
  border-right: 1px solid var(--vxm-gray-400);
  border-bottom: 2px solid var(--vxm-black);
}

.vxm-tabs .hs-tabs__content,
.vxm-tabs-primary .hs-tabs__content {
  border: 2px solid var(--vxm-brand-blue);
  background-color: var(--vxm-white);
}

.vxm-tabs .hs-tabs__content__panel,
.vxm-tabs-primary .hs-tabs__content__panel {
  margin-right: -100%;
  visibility: hidden;
}

.vxm-tabs .hs-tabs__content__panel--visible,
.vxm-tabs-primary .hs-tabs__content__panel--visible {
  visibility: visible;
}

.vxm-tabs-cta-btn .button,
.vxm-button-white-18 .button {
  color: var(--vxm-white);
  font-size: 18px;
  font-weight: bold;
}

/* Shared across 2 pages: alimentos-y-bebidas.html, calzado.html */

/* Shared across 2 pages: alimentos-y-bebidas.html, calzado.html */

/* Shared across 2 pages: alimentos-y-bebidas.html, calzado.html */

.vxm-logo-slider .jake-logo-slider,
.vxm-logo-slider .jake-logo-slider .swiper-slide {
  background: rgba(255, 255, 255, 0%);
  border-radius: 0;
}

.vxm-logo-slider .swiper-pagination {
  position: static;
  padding-bottom: 20px;
}

.vxm-logo-slider .swiper-pagination-bullet {
  opacity: 1;
  background-color: var(--vxm-gray-500);
  width: 12px;
  height: 12px;
  padding: 6px;
  box-sizing: content-box;
}

.vxm-logo-slider .swiper-pagination-bullet-active,
.vxm-logo-slider .swiper-scrollbar-drag {
  background-color: var(--vxm-brand-blue);
}

.vxm-logo-slider .swiper-button-next,
.vxm-logo-slider .swiper-button-prev {
  color: var(--vxm-gray-500);
}

.vxm-logo-slider .swiper-button-next:hover,
.vxm-logo-slider .swiper-button-prev:hover {
  color: var(--vxm-brand-blue);
}

.vxm-logo-slider .swiper-wrapper {
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  align-items: center;
}

.vxm-logo-slider .jake-logo-slider__swiper {
  position: relative;
  overflow: hidden;
}

.vxm-logo-slider .jake-logo-slider__swiper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 100%;
  background: linear-gradient(to right, var(--vxm-white), rgba(255, 255, 255, 0));
  pointer-events: none;
  z-index: 2;
}

.vxm-logo-slider .jake-logo-slider__swiper::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 30px;
  height: 100%;
  background: linear-gradient(to left, var(--vxm-white), rgba(255, 255, 255, 0));
  pointer-events: none;
  z-index: 2;
}

/* Mobile responsive adjustments */

/* ===================================================================
   REUSABLE COMPONENT STYLES - SHARED ACROSS MULTIPLE PAGES
   Centralized from 31 inline CSS files to reduce duplication

   Usage: Add vxm-* classes to HTML elements for shared styling
   =================================================================== */

/* -------------------------------------------------------------------
   BUTTON COMPONENTS
   ------------------------------------------------------------------- */

/* Centered button with white text and bold font - Used on 12 pages */


/* -------------------------------------------------------------------
   VIDEO/MEDIA COMPONENTS
   ------------------------------------------------------------------- */

/* White video thumbnail icon - Used on 7 pages */

.vxm-video-icon-white .oembed_custom-thumbnail_icon svg {
  fill: var(--vxm-white);
}

/* -------------------------------------------------------------------
   TABS COMPONENT - PRIMARY STYLE
   Used on: alimentos-y-bebidas, bazar-deco-regalos, ferreteria-y-construccion, libreriayoficina
   ------------------------------------------------------------------- */


@media only screen and (min-width: 220px) and (max-width: 767px) {

.vxm-footer .global-footer-outer {
  padding: 30px 0 0;
  margin-top: 0;
  margin-bottom: 0;
}

.vxm-footer .global-footer-outer .inner .col1 .quote p,
.vxm-footer
    .global-footer-outer
    .inner
    .col1
    .need-help-img
    .help-text
    .help-title
    p,
.vxm-footer
    .global-footer-outer
    .inner
    .col1
    .need-help-img
    .help-text
    .help-link
    a,
.vxm-footer .global-footer-outer .inner .col2 .loc-tit h5,
.vxm-footer .global-footer-outer .inner .col2 .loc-add p,
.vxm-footer .global-footer-outer .inner .col2 .contact-tit h5,
.vxm-footer
    .global-footer-outer
    .inner
    .col2
    .cont-links
    .cont-link
    .con-link
    a,
.vxm-footer
    .global-footer-outer
    .inner
    .col
    .co-menu
    .hs-menu-wrapper
    ul
    li
    a,
.vxm-footer .global-footer-outer .copyright p {
  font-size: 15px;
}

.vxm-footer .global-footer-outer .inner .col-title h4 {
  font-size: 21px;
}

.vxm-footer
    .global-footer-outer
    .inner
    .col2
    .cont-links
    .cont-link
    .type
    h6 {
  font-size: 14px;
}

}


@media only screen and (min-width: 768px) {

.vxm-footer-social .social-links {
  justify-content: center;
}

}


@media only screen and (min-width: 768px) and (max-width: 1024px) {

.vxm-footer .global-footer-outer {
  padding: 90px 0 0;
  margin-top: 0;
  margin-bottom: 0;
}

}


@media (max-width: 767px) {

.global_footer_by_growmeda.inner {
  flex-direction: column !important;
  gap: 2rem !important;
  padding: 3rem 0 !important;
}

.global_footer_by_growmeda.col1,
  .global_footer_by_growmeda.col2,
  .global_footer_by_growmeda.cold1,
  .global_footer_by_growmeda.cold2 {
  flex: 1 1 100% !important;
}

.vxm-footer-social .social-follow {
  gap: 1rem !important;
}

}


@media (max-width: 568px) {

.hs-featured-image {
  float: none;
  margin: 0;
  width: 100%;
  max-width: 100%;
}

}

/* Shared rules extracted from individual page CSS files */

.vxm-main-content {
  color: rgba(26, 26, 26, 60%) !important;
  display: block !important;
}

.vxm-main-content p,
.vxm-main-content li,
.vxm-main-content span,
.vxm-main-content label,
.vxm-main-content h1,
.vxm-main-content h2,
.vxm-main-content h3,
.vxm-main-content h4,
.vxm-main-content h5,
.vxm-main-content h6 {
  color: rgba(26, 26, 26, 60%) !important;
}

.vxm-cta-row-margin {
  margin-bottom: 1rem !important;
}

.vxm-cta-label,
.vxm-cta-heading {
  color: var(--vxm-white) !important;
  display: block !important;
}

.vxm-cta-label p,
.vxm-cta-label li,
.vxm-cta-label span,
.vxm-cta-label label,
.vxm-cta-label h1,
.vxm-cta-label h2,
.vxm-cta-label h3,
.vxm-cta-label h4,
.vxm-cta-label h5,
.vxm-cta-label h6,
.vxm-cta-heading p,
.vxm-cta-heading li,
.vxm-cta-heading span,
.vxm-cta-heading label,
.vxm-cta-heading h1,
.vxm-cta-heading h2,
.vxm-cta-heading h3,
.vxm-cta-heading h4,
.vxm-cta-heading h5,
.vxm-cta-heading h6 {
  color: var(--vxm-white) !important;
}

.vxm-hero-header-padding {
  padding-bottom: 1rem !important;
}

.vxm-section-1-padding {
  padding-top: 3rem !important;
}

.main_content-row-6-margin {
  margin-bottom: -100px !important;
}

.main_content-row-0-background-layers,
.main_content-row-4-background-layers {
  background-image: linear-gradient(var(--vxm-dark), var(--vxm-dark)) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.main_content-row-3-background-layers,
.main_content-row-5-background-layers {
  background-image: linear-gradient(var(--vxm-white), var(--vxm-white)) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.main_content-row-6-background-layers {
  background-image: linear-gradient(var(--vxm-brand-blue), var(--vxm-brand-blue)) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.vxm-logo-slider-margin {
  margin-bottom: 0.5rem !important;
}

.vxm-section-2-padding {
  padding-top: 1rem !important;
  padding-bottom: 3rem !important;
}

.vxm-video-player {
  display: block !important;
  padding-bottom: 20px !important;
}

/* ── Off-screen rendering optimization ── */
#main-content > .row-fluid-wrapper > .row-fluid > .row-fluid-wrapper.dnd-section:nth-child(n+4) {
  content-visibility: auto;
  contain-intrinsic-size: auto 500px;
}

/* ── Feature section text ── */

.vxm-fs-label,
.vxm-fs-heading {
  color: var(--vxm-white) !important;
  display: block !important;
}

.vxm-fs-label p,
.vxm-fs-label li,
.vxm-fs-label span,
.vxm-fs-label label,
.vxm-fs-label h1,
.vxm-fs-label h2,
.vxm-fs-label h3,
.vxm-fs-label h4,
.vxm-fs-label h5,
.vxm-fs-label h6,
.vxm-fs-heading p,
.vxm-fs-heading li,
.vxm-fs-heading span,
.vxm-fs-heading label,
.vxm-fs-heading h1,
.vxm-fs-heading h2,
.vxm-fs-heading h3,
.vxm-fs-heading h4,
.vxm-fs-heading h5,
.vxm-fs-heading h6 {
  color: var(--vxm-white) !important;
}

.vxm-fp-label,
.vxm-fp-heading {
  color: var(--vxm-dark) !important;
  display: block !important;
}

.vxm-fp-label p,
.vxm-fp-label li,
.vxm-fp-label span,
.vxm-fp-label label,
.vxm-fp-label h1,
.vxm-fp-label h2,
.vxm-fp-label h3,
.vxm-fp-label h4,
.vxm-fp-label h5,
.vxm-fp-label h6,
.vxm-fp-heading p,
.vxm-fp-heading li,
.vxm-fp-heading span,
.vxm-fp-heading label,
.vxm-fp-heading h1,
.vxm-fp-heading h2,
.vxm-fp-heading h3,
.vxm-fp-heading h4,
.vxm-fp-heading h5,
.vxm-fp-heading h6 {
  color: var(--vxm-dark) !important;
}

/* ── Flex positioning (shared across all pages) ── */

.vxm-cta-label-flex,
.vxm-cta-heading-flex,
.vxm-cta-btn-flex,
.vxm-feature-problems-img-flex,
.vxm-feature-solutions-img-flex,
.vxm-hero-action-flex {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start;
}

.vxm-cta-label-flex > div,
.vxm-cta-heading-flex > div,
.vxm-cta-btn-flex > div,
.vxm-feature-problems-img-flex > div,
.vxm-feature-solutions-img-flex > div,
.vxm-hero-action-flex > div {
  max-width: 100%;
  flex-shrink: 0 !important;
}

/* ==========================================================================
   Utility Classes (extracted from inline styles)
   ========================================================================== */
.text-18 { font-size: 18px; }
.text-16 { font-size: 16px; }
.text-white { color: #ffffff; }
.font-bold { font-weight: bold; }
.text-center { text-align: center; }
.bg-transparent { background-color: transparent; }
/* === assets/css/home.css === */
/* ── Home hero (static, pain-driven) ───────────────────────────── */
.vxm-home-hero-typing .vxm-hero-new {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 860px;
  margin: 0 auto;
  padding: 0 20px 40px;
}

.vxm-home-hero-typing .vxm-hero-new__title {
  font-family: Montserrat, sans-serif;
  font-weight: 800;
  color: var(--vxm-white);
  font-size: var(--vxm-fs-hero);
  line-height: 1.12;
  margin: 16px 0 0;
}

.vxm-home-hero-typing .vxm-hero-new__accent {
  color: var(--vxm-teal);
}

/* Marker-style underline drawn on the word on page load */
.vxm-underline {
  position: relative;
  white-space: nowrap;
}

.vxm-underline__mark {
  position: absolute;
  left: -2%;
  bottom: -0.16em;
  width: 104%;
  height: 0.42em;
  overflow: visible;
  pointer-events: none;
}

.vxm-underline__mark path {
  fill: none;
  stroke: var(--vxm-teal);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: vxm-underline-draw 0.7s ease-out 0.55s forwards;
}

@keyframes vxm-underline-draw {
  to { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .vxm-underline__mark path {
    animation: none;
    stroke-dashoffset: 0;
  }
}

/* Deferred variant: marker underline stays undrawn until JS adds .is-drawn
   (the section scrolls into view), then it draws like the hero. */
.vxm-underline--reveal .vxm-underline__mark path {
  animation: none;
  stroke-dashoffset: 1;
}

.vxm-underline--reveal.is-drawn .vxm-underline__mark path {
  animation: vxm-underline-draw 0.7s ease-out 0.1s forwards;
}

@media (prefers-reduced-motion: reduce) {
  .vxm-underline--reveal .vxm-underline__mark path,
  .vxm-underline--reveal.is-drawn .vxm-underline__mark path {
    animation: none;
    stroke-dashoffset: 0;
  }
}

/* ── Hero band animation: orders → boxes → conveyor → truck ─────── */
.vxm-hero-anim {
  align-self: flex-start;
  width: 100vw;
  margin: -10px 0 4px;
  margin-left: calc(50% - 50vw);
  text-align: center;
}

.vxm-hero-anim__svg {
  display: inline-block;
  width: min(1180px, 94vw);
  height: auto;
  overflow: visible;
  opacity: 0.8;
}

.vxm-belt__ticks {
  /* 70px loop at the same speed as the boxes (~129px/s) so the belt looks real */
  animation: vxm-belt-move 0.54s linear infinite;
}

@keyframes vxm-belt-move {
  from { transform: translateX(0); }
  to   { transform: translateX(70px); }
}

.vxm-truck {
  transform-box: fill-box;
  transform-origin: center;
  animation: vxm-truck-bob 2.8s ease-in-out infinite;
}

@keyframes vxm-truck-bob {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-2px); }
}

.vxm-pack {
  animation: vxm-box-flow 10s linear infinite;
  animation-delay: var(--d, 0s);
}

@keyframes vxm-box-flow {
  0%   { transform: translate(150px, 58px); opacity: 0; }
  3%   { opacity: 1; }
  12%  { transform: translate(150px, 58px); opacity: 1; }
  78%  { transform: translate(1000px, 58px); opacity: 1; }
  87%  { transform: translate(1042px, 42px); opacity: 0; }
  100% { transform: translate(1042px, 42px); opacity: 0; }
}

.vxm-pack__order {
  transform-box: fill-box;
  transform-origin: center;
  animation: vxm-order-fly 10s linear infinite;
  animation-delay: var(--d, 0s);
}

@keyframes vxm-order-fly {
  0%   { transform: translate(-90px, -30px); opacity: 0; }
  4%   { opacity: 1; }
  10%  { transform: translate(0, -28px); opacity: 1; }
  13%  { transform: translate(0, -24px); opacity: 0; }
  100% { opacity: 0; }
}

/* Pause the whole scene when the hero scrolls out of view (saves CPU) */
.vxm-hero-anim.is-paused * {
  animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
  .vxm-belt__ticks,
  .vxm-truck,
  .vxm-pack,
  .vxm-pack__order {
    animation: none !important;
  }
  .vxm-pack__order { opacity: 0; }
}

/* Hide the hero animation on mobile (not suited for small screens) */
@media (max-width: 768px) {
  .vxm-hero-anim {
    display: none;
  }
}

.vxm-home-hero-typing .vxm-hero-new__subtitle {
  font-family: Montserrat, sans-serif;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.9);
  font-size: var(--vxm-fs-subtitle);
  line-height: 1.5;
  margin: 20px 0 0;
  max-width: 680px;
}

.vxm-home-hero-typing .vxm-hero-new__cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  margin-top: 32px;
}

.vxm-home-hero-typing .vxm-hero-new__cta {
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  font-size: 16px;
  padding: 15px 40px;
  border-radius: 30px;
  text-decoration: none;
  display: inline-block;
  transition: all 0.3s ease;
}

.vxm-home-hero-typing .vxm-hero-new__cta--primary {
  background-color: var(--vxm-brand-blue);
  color: #fafafa;
  box-shadow: 0 4px 15px rgba(59, 109, 184, 0.4);
}

.vxm-home-hero-typing .vxm-hero-new__cta--primary:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 8px 30px rgba(59, 109, 184, 0.7), 0 0 30px rgba(59, 109, 184, 0.4);
}

.vxm-home-hero-typing .vxm-hero-new__cta--secondary {
  background-color: transparent;
  color: var(--vxm-white);
  border: 2px solid rgba(255, 255, 255, 0.55);
  box-shadow: none;
  padding: 13px 38px; /* compensate for the 2px border so heights match primary */
}

.vxm-home-hero-typing .vxm-hero-new__cta--secondary:hover {
  background-color: rgba(255, 255, 255, 0.08);
  border-color: var(--vxm-white);
  color: var(--vxm-white);
  transform: translateY(-3px);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.08);
}

.vxm-home-hero-typing .vxm-hero-new__social {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin: 40px 0 0;
}

.vxm-home-hero-typing .vxm-hero-new__social-label {
  font-family: Montserrat, sans-serif;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
  font-size: var(--vxm-fs-eyebrow);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.vxm-home-hero-typing .vxm-hero-new__logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 28px 36px;
}

.vxm-home-hero-typing .vxm-hero-new__logos img {
  /* uniform bbox so all logos look proportionally equal regardless of
     their native aspect ratio (Captain Fin is wide, Rockbros is stacked, etc.) */
  width: auto;
  height: auto;
  max-width: 120px;
  max-height: 34px;
  object-fit: contain;
  /* render dark client logos as soft white monochrome on the dark hero */
  filter: brightness(0) invert(1);
  opacity: 0.65;
  transition: opacity 0.3s ease;
}

.vxm-home-hero-typing .vxm-hero-new__logos img:hover {
  opacity: 1;
}

@media (max-width: 768px) {
  .vxm-home-hero-typing .vxm-hero-new__logos {
    gap: 18px 24px;
  }
  .vxm-home-hero-typing .vxm-hero-new__logos img {
    max-width: 96px;
    max-height: 26px;
  }
}


@media (max-width: 768px) {
  .vxm-home-hero-typing .vxm-hero-new__subtitle {
    font-size: 16px;
  }
  .vxm-home-hero-typing .vxm-hero-new__cta-row {
    flex-direction: column;
    width: 100%;
    align-items: stretch;
  }
  .vxm-home-hero-typing .vxm-hero-new__cta {
    width: 100%;
  }
}

@keyframes pulse-glow {
  0%, 100% {
  box-shadow: 0 4px 15px rgba(59, 109, 184, 0.4);
  transform: scale(1);
  }
  50% {
  box-shadow: 0 4px 25px rgba(59, 109, 184, 0.6), 0 0 20px rgba(59, 109, 184, 0.3);
  transform: scale(1.02);
  }
}

.vxm-home-hero-typing .banner_cta::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}

.vxm-home-hero-typing .banner_cta:hover {
  background-color: var(--vxm-brand-blue);
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 8px 30px rgba(59, 109, 184, 0.7), 0 0 30px rgba(59, 109, 184, 0.4);
  animation: none;
}

.vxm-home-hero-typing .banner_cta:hover::before {
  width: 300px;
  height: 300px;
}
.vxm-home-compare-btn .aw-button-btn2 a,
.vxm-home-demo-btn .aw-button-btn2 a,
.vxm-home-contact-btn .aw-button-btn2 a {
  text-decoration: none;
}

#oembed_container-widget_1747742596334 .oembed_custom-thumbnail_icon svg {
  fill: var(--vxm-brand-blue);
}

/* "Tradicional -> digital" section: static copy + frameless product panel.
   Sits between two var(--vxm-dark) sections, so it stays dark/seamless (no band) with a
   blue radial glow behind the panel as the only accent. */
.vxm-home-narration {
  /* glow contained vertically so it fades to var(--vxm-dark) before the top/bottom
     edges — keeps the edges flush with neighbouring sections (no seam line) */
  background:
    radial-gradient(60% 50% at 68% 50%, rgba(71, 126, 207, 0.45), rgba(71, 126, 207, 0) 65%),
    var(--vxm-dark);
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 5rem 24px 5.5rem;
}

.vxm-home-narration .vxm-narration-split {
  display: flex;
  align-items: center;
  gap: 56px;
  max-width: 1240px;
  width: 100%;
}

.vxm-home-narration .vxm-narration-copy {
  flex: 1 1 40%;
}

.vxm-home-narration .vxm-narration-title {
  color: var(--vxm-white);
  font-family: Montserrat, sans-serif;
  font-weight: 800;
  font-size: var(--vxm-fs-title);
  line-height: 1.15;
  margin: 0 0 16px;
}

.vxm-home-narration .vxm-narration-text {
  color: rgba(255, 255, 255, 0.92);
  font-family: Montserrat, sans-serif;
  font-weight: 500;
  font-size: var(--vxm-fs-subtitle);
  line-height: 1.55;
  margin: 0;
}

.vxm-home-narration .vxm-narration-visual {
  flex: 1 1 60%;
  min-width: 0;
}

.vxm-home-narration .vxm-narration-visual img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  box-shadow:
    0 34px 64px -16px rgba(0, 0, 0, 0.6),
    0 14px 28px -10px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.07);
}

@media (max-width: 768px) {
  .vxm-home-narration {
    padding: 3rem 20px 3.25rem;
    background:
      radial-gradient(78% 42% at 50% 64%, rgba(71, 126, 207, 0.5), rgba(71, 126, 207, 0) 72%),
      var(--vxm-dark);
  }
  .vxm-home-narration .vxm-narration-split {
    flex-direction: column;
    gap: 28px;
    text-align: center;
  }
}

.vxm-home-card-right .card,
.vxm-home-card-left .card,
.vxm-home-case-study .case-stud-section {
  background-color: var(--vxm-white);
}

.vxm-home-card-right .card__icon,
.vxm-home-card-right .card__icon svg {
  width: 200px;
  color: var(--vxm-dark);
  fill: var(--vxm-dark);
}

.vxm-home-card-left .card__icon,
.vxm-home-card-left .card__icon svg {
  width: 60px;
  color: var(--vxm-dark);
  fill: var(--vxm-dark);
}

/* ════════════════════════════════════════════════════════════════
   BUTTON SYSTEM — Opción B
   • brand-blue: conversion (hero primary, card 1 CTA, "Hablar con
     un experto", newsletter signup)
   • teal: try / learn (hero secondary, "Comparar con otras
     plataformas", "Probar tiendas demo", feature row CTAs)
   Geometry: pill 30px, Montserrat 700 16px, padding 15px 40px.
   ════════════════════════════════════════════════════════════════ */

/* Shared base for the 3 aw-button-button_2 instances on home */
.vxm-home-compare-btn .aw-button-btn2 .aw-button-button_2,
.vxm-home-demo-btn .aw-button-btn2 .aw-button-button_2,
.vxm-home-contact-btn .aw-button-btn2 .aw-button-button_2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 30px;
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 700;
  padding: 15px 40px;
  text-transform: none;
  border: 0 none;
  text-decoration: none;
  transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease, color 180ms ease;
  cursor: pointer;
}

/* TRY / LEARN — outline white (Comparación, Probar tiendas demo).
   Secondary style: transparent bg + white border + white text. */
.vxm-home-compare-btn .aw-button-button_2,
.vxm-home-demo-btn .aw-button-button_2 {
  background: transparent;
  color: var(--vxm-white);
  border: 2px solid rgba(255, 255, 255, 0.55) !important;
  padding: 13px 38px; /* compensate for the 2px border */
  box-shadow: none;
}

.vxm-home-compare-btn .aw-button-button_2:hover,
.vxm-home-demo-btn .aw-button-button_2:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--vxm-white) !important;
  color: var(--vxm-white);
  transform: translateY(-2px);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.08);
}

/* CONVERSION — brand-blue (Hablar con un experto) */
.vxm-home-contact-btn .aw-button-button_2 {
  background: var(--vxm-brand-blue);
  color: var(--vxm-white);
  box-shadow: 0 4px 14px rgba(71, 126, 207, 0.32);
}

.vxm-home-contact-btn .aw-button-button_2:hover {
  background: color-mix(in srgb, var(--vxm-brand-blue) 88%, white);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(71, 126, 207, 0.50);
}

.vxm-home-compare-btn .aw-button-button_2 span,
.vxm-home-demo-btn .aw-button-button_2 span,
.vxm-home-contact-btn .aw-button-button_2 span {
  position: relative;
  transition: 400ms;
}

.vxm-home-compare-btn .aw-button-button_2 span::after,
.vxm-home-demo-btn .aw-button-button_2 span::after,
.vxm-home-contact-btn .aw-button-button_2 span::after {
  content: "\00bb";
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 500ms;
}

.vxm-home-compare-btn .aw-button-button_2:hover span,
.vxm-home-demo-btn .aw-button-button_2:hover span,
.vxm-home-contact-btn .aw-button-button_2:hover span {
  padding-right: 25px;
}

.vxm-home-compare-btn .aw-button-button_2:hover span::after,
.vxm-home-demo-btn .aw-button-button_2:hover span::after,
.vxm-home-contact-btn .aw-button-button_2:hover span::after {
  opacity: 1;
  right: 0;
}

.vxm-home-compare-btn .aw-button-btn2,
.vxm-home-demo-btn .aw-button-btn2,
.vxm-home-contact-btn .aw-button-btn2 {
  display: flex;
}

.vxm-home-compare-btn .aw-button-btn2.start,
.vxm-home-demo-btn .aw-button-btn2.start,
.vxm-home-contact-btn .aw-button-btn2.start {
  display: flex;
  justify-content: start;
}

.vxm-home-compare-btn .aw-button-btn2.center,
.vxm-home-demo-btn .aw-button-btn2.center,
.vxm-home-contact-btn .aw-button-btn2.center {
  display: flex;
  justify-content: center;
}

.vxm-home-compare-btn .aw-button-btn2.right,
.vxm-home-demo-btn .aw-button-btn2.right,
.vxm-home-contact-btn .aw-button-btn2.right {
  display: flex;
  justify-content: end;
}

.vxm-home-compare-btn .aw-button-btn2.justify,
.vxm-home-demo-btn .aw-button-btn2.justify,
.vxm-home-contact-btn .aw-button-btn2.justify {
  display: block;
}

.vxm-home-logo-slider .jake-logo-slider,
.vxm-home-logo-slider .jake-logo-slider .swiper-slide {
  background: rgba(255, 255, 255, 0%);
  border-radius: 0;
}

/* (Legacy swiper-pagination rules removed — replaced by the
   defensive flex-layout block lower in the file that prevents the
   dots from wrapping into multiple rows.) */

/* Feature-row CTAs (button--ink): right-align inside the text column
   so the "Saber Más" button sits flush right, not floating centered. */
.vxm-home-feat-admin-btn,
.vxm-home-feat-grow-btn,
.vxm-home-feat-sellers-btn,
.vxm-home-feat-conditions-btn,
.vxm-home-feat-support-btn,
.vxm-home-feat-integ-btn,
.vxm-home-feat-struct-btn,
.vxm-home-feat-admin-btn .button-wrapper,
.vxm-home-feat-grow-btn .button-wrapper,
.vxm-home-feat-sellers-btn .button-wrapper,
.vxm-home-feat-conditions-btn .button-wrapper,
.vxm-home-feat-support-btn .button-wrapper,
.vxm-home-feat-integ-btn .button-wrapper,
.vxm-home-feat-struct-btn .button-wrapper {
  text-align: right !important;
}

/* Teal accents shared:
   - active pagination bullet on the logo slider
   - scrollbar drag handle
   - feature-row button--ink underline accents */
.vxm-home-logo-slider .swiper-pagination-bullet-active,
.vxm-home-logo-slider .swiper-scrollbar-drag,
.vxm-home-feat-admin-btn .button--ink::before,
.vxm-home-feat-admin-btn .button--ink:hover::before,
.vxm-home-feat-grow-btn .button--ink::before,
.vxm-home-feat-grow-btn .button--ink:hover::before,
.vxm-home-feat-sellers-btn .button--ink::before,
.vxm-home-feat-sellers-btn .button--ink:hover::before,
.vxm-home-feat-conditions-btn .button--ink::before,
.vxm-home-feat-conditions-btn .button--ink:hover::before,
.vxm-home-feat-support-btn .button--ink::before,
.vxm-home-feat-support-btn .button--ink:hover::before,
.vxm-home-feat-integ-btn .button--ink::before,
.vxm-home-feat-integ-btn .button--ink:hover::before,
.vxm-home-feat-struct-btn .button--ink::before,
.vxm-home-feat-struct-btn .button--ink:hover::before {
  background-color: var(--vxm-teal);
}

.vxm-home-logo-slider .swiper-button-next,
.vxm-home-logo-slider .swiper-button-prev {
  color: var(--vxm-gray-500);
}

.vxm-home-logo-slider .swiper-button-next:hover,
.vxm-home-logo-slider .swiper-button-prev:hover,
.vxm-home-case-study .case-bottomns .case-vall > a {
  color: var(--vxm-brand-blue);
}

.vxm-home-logo-slider .swiper-wrapper {
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  align-items: center;
}

.vxm-home-logo-slider .jake-logo-slider__swiper {
  position: relative;
  overflow: hidden;
}

.vxm-home-logo-slider .jake-logo-slider__swiper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 100%;
  background: linear-gradient(to right, var(--vxm-white), rgba(255, 255, 255, 0));
  pointer-events: none;
  z-index: 2;
}

.vxm-home-logo-slider .jake-logo-slider__swiper::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 30px;
  height: 100%;
  background: linear-gradient(to left, var(--vxm-white), rgba(255, 255, 255, 0));
  pointer-events: none;
  z-index: 2;
}

.vxm-home-cards-grid .card {
  background-color: rgba(59, 109, 184, 10%);
}

.vxm-home-cards-grid .card__title,
.vxm-home-cards-grid .card__desc,
.vxm-home-cards-grid .card__desc *,
.vxm-home-cards-grid .card__icon,
.vxm-home-case-study .case-stud-bottom > h3,
.vxm-home-case-study .case-stud-bottom .case-stud-links > a {
  color: var(--vxm-white);
}

.vxm-home-cards-grid .card__icon,
.vxm-home-cards-grid .card__icon svg {
  width: 30px;
}

.vxm-home-cards-grid .card__icon svg {
  fill: var(--vxm-white);
}

.vxm-home-cards-grid .card--framed {
  padding: 20px;
}

/* ════════════════════════════════════════════════════════════════
   "La Plataforma" cards — contained but premium
   Each card has a soft container frame so it reads as its own unit
   (was floating "en el aire" without it). Subtle 1px border, 20px
   radius, low-alpha background — feels like Linear / Vercel card.
   ════════════════════════════════════════════════════════════════ */
.vxm-home-cards-grid .cards-grid__item {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 20px !important;
  padding: 28px 26px !important;
  display: flex;
  flex-direction: column;
  transition: border-color 220ms ease, background 220ms ease, transform 220ms ease;
}

/* Card 1 (the CTA card) — same container as the others. The button
   inside is what marks it as the "talk to us" card. */
.vxm-home-cards-grid .cards-grid__item--1 {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Refined icon: just the glyph, no container. Smaller, calmer. */
.vxm-home-cards-grid .card__icon {
  width: 28px !important;
  height: 28px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  display: block !important;
  background: none !important;
  border: none !important;
  border-radius: 0;
  color: var(--vxm-teal);
}
.vxm-home-cards-grid .card__icon svg {
  width: 28px !important;
  height: 28px !important;
  color: var(--vxm-teal);
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  display: block;
}

/* Title — Linear-style, tighter weight, slightly smaller */
.vxm-home-cards-grid .card__title {
  font-family: Montserrat, sans-serif !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: var(--vxm-white) !important;
  margin: 0 0 10px !important;
  line-height: 1.35 !important;
  letter-spacing: -0.005em;
}

/* Description — calmer body text, looser leading */
.vxm-home-cards-grid .card__desc,
.vxm-home-cards-grid .card__desc * {
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}
.vxm-home-cards-grid .card__desc p { margin: 0 !important; }

/* CTA in card 1 — sits at the bottom, premium pill */
.vxm-home-cards-grid .cards-grid__item--1 .button {
  margin-top: 20px !important;
  align-self: flex-start;
}

@media (max-width: 768px) {
  .vxm-home-cards-grid .cards-grid__item {
    padding: 22px 20px !important;
    border-radius: 16px !important;
  }
  .vxm-home-cards-grid .card__icon,
  .vxm-home-cards-grid .card__icon svg {
    width: 26px !important;
    height: 26px !important;
  }
  .vxm-home-cards-grid .card__title { font-size: 16px !important; }
  .vxm-home-cards-grid .card__desc,
  .vxm-home-cards-grid .card__desc * { font-size: 14px !important; }
}

/* (Legacy demo-btn rule replaced by unified button system above) */

.vxm-home-feat-admin-btn .button--featured:hover,
.vxm-home-feat-grow-btn .button--featured:hover,
.vxm-home-feat-sellers-btn .button--featured:hover,
.vxm-home-feat-conditions-btn .button--featured:hover,
.vxm-home-feat-support-btn .button--featured:hover,
.vxm-home-feat-integ-btn .button--featured:hover,
.vxm-home-feat-struct-btn .button--featured:hover {
  box-shadow: 0 0;
}

.vxm-home-text-feed .anim-block {
  animation-duration: 10s;
}

.vxm-home-text-feed .text-feed__item,
.vxm-home-case-study .case-stud-top-content .case-stud-inner-heading,
.vxm-home-case-study .case-stud-inner-content {
  color: var(--vxm-dark);
}

/* (Legacy contact-btn rule replaced by unified button system above) */

.vxm-home-case-study .container {
  max-width: 100% !important;
  margin: 0 auto;
}

.vxm-home-case-study .case-stud-text * {
  font-size: 14px;
}

.vxm-home-case-study .case-stud-top-content {
  max-width: 768px;
}

.vxm-home-case-study .case-stud-inner-content p {
  font-size: 14px;
}

.vxm-home-case-study .case-stud-slide-inn {
  padding: 20px;
  justify-content: space-between !important;
  border-radius: 20px;
}

.vxm-home-case-study .case-stud-slide:nth-child(1) .case-stud-slide-inn:before,
.vxm-home-case-study .case-stud-slide:nth-child(2) .case-stud-slide-inn:before,
.vxm-home-case-study .case-stud-slide:nth-child(3) .case-stud-slide-inn:before,
.vxm-home-case-study .case-stud-slide:nth-child(4) .case-stud-slide-inn:before,
.vxm-home-case-study .case-stud-slide:nth-child(5) .case-stud-slide-inn:before,
.vxm-home-case-study .case-stud-slide:nth-child(6) .case-stud-slide-inn:before,
.vxm-home-case-study .case-stud-slide:nth-child(7) .case-stud-slide-inn:before {
  background-color: rgba(48, 55, 79, 0%);
}

.vxm-home-case-study .case-stud-slide:nth-child(1) .case-stud-bottom,
.vxm-home-case-study .case-stud-slide:nth-child(2) .case-stud-bottom,
.vxm-home-case-study .case-stud-slide:nth-child(3) .case-stud-bottom,
.vxm-home-case-study .case-stud-slide:nth-child(4) .case-stud-bottom,
.vxm-home-case-study .case-stud-slide:nth-child(5) .case-stud-bottom,
.vxm-home-case-study .case-stud-slide:nth-child(6) .case-stud-bottom,
.vxm-home-case-study .case-stud-slide:nth-child(7) .case-stud-bottom {
  background-color: rgba(12, 17, 29, 20%);
  border-color: rgba(12, 17, 29, 20%);
}

.vxm-home-case-study .case-stud-slide:nth-child(8) .case-stud-slide-inn:before {
  background-color: rgba(48, 55, 79, 50%);
}

.vxm-home-case-study .case-stud-slide:nth-child(8) .case-stud-bottom {
  background-color: rgba(12, 17, 29, 30%);
  border-color: rgba(12, 17, 29, 30%);
}

.vxm-home-case-study .case-stud-shape svg path {
  fill: var(--vxm-brand-blue) !important;
}

.vxm-home-case-study .case-stud-text > * {
  color: var(--vxm-white);
  font-size: 14px;
}

.vxm-home-case-study .case-stud-link {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 3;
}

.vxm-home-case-study .case-stud-slide-inn:hover {
  box-shadow:
  0 5px 20px rgba(26, 26, 26, 0.1),
  0 0 5px rgba(26, 26, 26, 0.1);
  cursor: pointer;
  transform: scale(1.01);
}

.dnd-section > .row-fluid:has(.case-stud-section) {
  max-width: 100%;
}

.dnd-section:has(.case-stud-section) {
  padding: 0;
}

.case-stud-section.widget_1747995355884 .button-primary {
  color: var(--vxm-white);
  background-color: var(--vxm-brand-blue);
  border-color: var(--vxm-brand-blue);
  border-radius: 5px;
}

.case-stud-section.widget_1747995355884 .button-primary:hover {
  color: var(--vxm-brand-blue);
  background-color: var(--vxm-brand-blue);
  border-color: var(--vxm-brand-blue);
}

.case-stud-section.widget_1747995355884 .button-secondary {
  color: #cecfd2;
  background-color: #161b26;
  border-color: #333741;
  border-radius: 8px;
}

.case-stud-section.widget_1747995355884 .button-secondary:hover {
  color: #cecfd2;
  background-color: #1f242f;
  border-color: #333741;
}

.vxm-home-faq-section .accordion__item:last-of-type {
  border: none;
}

.vxm-home-faq-section .accordion__item-heading {
  font-weight: 400;
  margin: 0;
}

.vxm-home-faq-section .accordion__item-desc {
  color: var(--vxm-dark);
  padding-left: 2.2rem;
}

.vxm-home-faq-section .accordion__item-icon.plus-minus::before,
.vxm-home-faq-section .accordion__item-icon.plus-minus::after {
  background-color: var(--vxm-dark);
}

.vxm-home-faq-section .accordion__item-icon.plus-minus--sm {
  margin-top: 0.2em;
  width: 1.2rem;
}

/* Font declarations removed - using Google Fonts CDN from HTML */

.vxm-home-ecommerce-label {
  display: block !important;
  font-size: var(--vxm-fs-eyebrow) !important;
  text-align: center !important;
}

.vxm-home-ecommerce-label p,
.vxm-home-ecommerce-label li,
.vxm-home-ecommerce-label span,
.vxm-home-ecommerce-label label,
.vxm-home-ecommerce-label h1,
.vxm-home-ecommerce-label h2,
.vxm-home-ecommerce-label h3,
.vxm-home-ecommerce-label h4,
.vxm-home-ecommerce-label h5,
.vxm-home-ecommerce-label h6,
.vxm-home-diff-label p,
.vxm-home-diff-label li,
.vxm-home-diff-label span,
.vxm-home-diff-label label,
.vxm-home-diff-label h1,
.vxm-home-diff-label h2,
.vxm-home-diff-label h3,
.vxm-home-diff-label h4,
.vxm-home-diff-label h5,
.vxm-home-diff-label h6,
.vxm-home-platform-label p,
.vxm-home-platform-label li,
.vxm-home-platform-label span,
.vxm-home-platform-label label,
.vxm-home-platform-label h1,
.vxm-home-platform-label h2,
.vxm-home-platform-label h3,
.vxm-home-platform-label h4,
.vxm-home-platform-label h5,
.vxm-home-platform-label h6 {
  font-size: var(--vxm-fs-eyebrow) !important;
}

.vxm-home-hero-embed {
  background-color: var(--vxm-dark) !important;
  background-image: none !important;
  border: none !important;
  border-radius: 15px !important;
  display: block !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6), 0 10px 28px rgba(0, 0, 0, 0.45) !important;
}

/* Remove only the top inset (keep the padding-bottom aspect-ratio spacer) so the
   video fills the rounded frame edge-to-edge with no square corner showing behind */
.vxm-home-hero-embed .iframe_wrapper {
  padding-top: 0 !important;
}

.vxm-home-diff-label,
.vxm-home-platform-label {
  display: block !important;
  font-size: var(--vxm-fs-eyebrow) !important;
}

.vxm-home-diff-heading {
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
  padding-bottom: 0 !important;
  padding-top: 30px !important;
  text-align: center !important;
}

.vxm-home-diff-heading p,
.vxm-home-diff-heading li,
.vxm-home-diff-heading span,
.vxm-home-diff-heading label,
.vxm-home-diff-heading h1,
.vxm-home-diff-heading h2,
.vxm-home-diff-heading h3,
.vxm-home-diff-heading h4,
.vxm-home-diff-heading h5,
.vxm-home-diff-heading h6,
.vxm-home-platform-heading p,
.vxm-home-platform-heading li,
.vxm-home-platform-heading span,
.vxm-home-platform-heading label,
.vxm-home-platform-heading h1,
.vxm-home-platform-heading h2,
.vxm-home-platform-heading h3,
.vxm-home-platform-heading h4,
.vxm-home-platform-heading h5,
.vxm-home-platform-heading h6,
.vxm-home-clients-heading p,
.vxm-home-clients-heading li,
.vxm-home-clients-heading span,
.vxm-home-clients-heading label,
.vxm-home-clients-heading h1,
.vxm-home-clients-heading h2,
.vxm-home-clients-heading h3,
.vxm-home-clients-heading h4,
.vxm-home-clients-heading h5,
.vxm-home-clients-heading h6 {
  color: var(--vxm-white) !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
}

.vxm-home-hero-img {
  display: block !important;
  padding-bottom: 40px !important;
}

.vxm-home-comparison-heading {
  background-color: var(--vxm-dark) !important;
  background-image: none !important;
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  font-weight: bold !important;
  padding-bottom: 1rem !important;
  padding-top: 0 !important;
  text-align: center !important;
}

.vxm-home-comparison-heading p,
.vxm-home-comparison-heading li,
.vxm-home-comparison-heading span,
.vxm-home-comparison-heading label,
.vxm-home-comparison-heading h1,
.vxm-home-comparison-heading h2,
.vxm-home-comparison-heading h3,
.vxm-home-comparison-heading h4,
.vxm-home-comparison-heading h5,
.vxm-home-comparison-heading h6 {
  color: var(--vxm-white) !important;
  font-size: var(--vxm-fs-subtitle) !important;
  font-weight: bold !important;
}

.vxm-home-faq-subheading {
  display: block !important;
  padding-bottom: 20px !important;
}

.vxm-home-platform-heading {
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
  padding-bottom: 0 !important;
  padding-top: 2rem !important;
  text-align: center !important;
}

.vxm-home-platform-subheading {
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
  text-align: center !important;
}

.vxm-home-platform-subheading p,
.vxm-home-platform-subheading li,
.vxm-home-platform-subheading span,
.vxm-home-platform-subheading label,
.vxm-home-platform-subheading h1,
.vxm-home-platform-subheading h2,
.vxm-home-platform-subheading h3,
.vxm-home-platform-subheading h4,
.vxm-home-platform-subheading h5,
.vxm-home-platform-subheading h6 {
  color: var(--vxm-white) !important;
  font-size: var(--vxm-fs-subtitle) !important;
}

.vxm-home-devices-img {
  display: block !important;
  padding-top: 30px !important;
}

.vxm-home-clients-heading {
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
  padding-bottom: 20px !important;
  padding-top: 30px !important;
  text-align: center !important;
}

.vxm-home-hero-text {
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  text-align: center !important;
}

.vxm-home-hero-text p,
.vxm-home-hero-text li,
.vxm-home-hero-text span,
.vxm-home-hero-text label,
.vxm-home-hero-text h1,
.vxm-home-hero-text h2,
.vxm-home-hero-text h3,
.vxm-home-hero-text h4,
.vxm-home-hero-text h5,
.vxm-home-hero-text h6 {
  color: var(--vxm-white) !important;
  font-size: var(--vxm-fs-subtitle) !important;
}

.vxm-home-demo-heading {
  color: var(--vxm-brand-blue) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  font-weight: bold !important;
  padding-bottom: 0 !important;
  padding-top: 2rem !important;
  text-align: center !important;
}

.vxm-home-demo-heading p,
.vxm-home-demo-heading li,
.vxm-home-demo-heading span,
.vxm-home-demo-heading label,
.vxm-home-demo-heading h1,
.vxm-home-demo-heading h2,
.vxm-home-demo-heading h3,
.vxm-home-demo-heading h4,
.vxm-home-demo-heading h5,
.vxm-home-demo-heading h6 {
  color: var(--vxm-brand-blue) !important;
  font-size: var(--vxm-fs-subtitle) !important;
  font-weight: bold !important;
}

.vxm-home-platform-video {
  display: block !important;
  padding-bottom: 2rem !important;
  padding-top: 30px !important;
}

.vxm-home-features-label,
.vxm-home-industries-label {
  color: var(--vxm-brand-blue) !important;
  display: block !important;
  font-size: var(--vxm-fs-eyebrow) !important;
}

.vxm-home-features-label p,
.vxm-home-features-label li,
.vxm-home-features-label span,
.vxm-home-features-label label,
.vxm-home-features-label h1,
.vxm-home-features-label h2,
.vxm-home-features-label h3,
.vxm-home-features-label h4,
.vxm-home-features-label h5,
.vxm-home-features-label h6,
.vxm-home-industries-label p,
.vxm-home-industries-label li,
.vxm-home-industries-label span,
.vxm-home-industries-label label,
.vxm-home-industries-label h1,
.vxm-home-industries-label h2,
.vxm-home-industries-label h3,
.vxm-home-industries-label h4,
.vxm-home-industries-label h5,
.vxm-home-industries-label h6,
.vxm-home-newsletter-label p,
.vxm-home-newsletter-label li,
.vxm-home-newsletter-label span,
.vxm-home-newsletter-label label,
.vxm-home-newsletter-label h1,
.vxm-home-newsletter-label h2,
.vxm-home-newsletter-label h3,
.vxm-home-newsletter-label h4,
.vxm-home-newsletter-label h5,
.vxm-home-newsletter-label h6 {
  color: var(--vxm-brand-blue) !important;
  font-size: var(--vxm-fs-eyebrow) !important;
}

.vxm-home-features-heading,
.vxm-home-industries-heading {
  color: var(--vxm-dark) !important;
  display: block !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
  padding-bottom: 0 !important;
  padding-top: 2rem !important;
  text-align: center !important;
}

.vxm-home-features-heading p,
.vxm-home-features-heading li,
.vxm-home-features-heading span,
.vxm-home-features-heading label,
.vxm-home-features-heading h1,
.vxm-home-features-heading h2,
.vxm-home-features-heading h3,
.vxm-home-features-heading h4,
.vxm-home-features-heading h5,
.vxm-home-features-heading h6,
.vxm-home-industries-heading p,
.vxm-home-industries-heading li,
.vxm-home-industries-heading span,
.vxm-home-industries-heading label,
.vxm-home-industries-heading h1,
.vxm-home-industries-heading h2,
.vxm-home-industries-heading h3,
.vxm-home-industries-heading h4,
.vxm-home-industries-heading h5,
.vxm-home-industries-heading h6,
.vxm-home-newsletter-heading p,
.vxm-home-newsletter-heading li,
.vxm-home-newsletter-heading span,
.vxm-home-newsletter-heading label,
.vxm-home-newsletter-heading h1,
.vxm-home-newsletter-heading h2,
.vxm-home-newsletter-heading h3,
.vxm-home-newsletter-heading h4,
.vxm-home-newsletter-heading h5,
.vxm-home-newsletter-heading h6 {
  color: var(--vxm-dark) !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
}

.vxm-home-built-heading {
  color: var(--vxm-dark) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  padding-bottom: 20px !important;
  padding-top: 0 !important;
  text-align: center !important;
}

.vxm-home-built-heading p,
.vxm-home-built-heading li,
.vxm-home-built-heading span,
.vxm-home-built-heading label,
.vxm-home-built-heading h1,
.vxm-home-built-heading h2,
.vxm-home-built-heading h3,
.vxm-home-built-heading h4,
.vxm-home-built-heading h5,
.vxm-home-built-heading h6,
.vxm-home-industries-subheading p,
.vxm-home-industries-subheading li,
.vxm-home-industries-subheading span,
.vxm-home-industries-subheading label,
.vxm-home-industries-subheading h1,
.vxm-home-industries-subheading h2,
.vxm-home-industries-subheading h3,
.vxm-home-industries-subheading h4,
.vxm-home-industries-subheading h5,
.vxm-home-industries-subheading h6 {
  color: var(--vxm-dark) !important;
  font-size: var(--vxm-fs-subtitle) !important;
}

.vxm-home-feat-admin-title,
.vxm-home-feat-grow-title,
.vxm-home-feat-sellers-title,
.vxm-home-feat-conditions-title,
.vxm-home-feat-support-title,
.vxm-home-feat-integ-title,
.vxm-home-feat-struct-title {
  display: block !important;
  font-weight: bold !important;
}

.vxm-home-feat-admin-title p,
.vxm-home-feat-admin-title li,
.vxm-home-feat-admin-title span,
.vxm-home-feat-admin-title label,
.vxm-home-feat-admin-title h1,
.vxm-home-feat-admin-title h2,
.vxm-home-feat-admin-title h3,
.vxm-home-feat-admin-title h4,
.vxm-home-feat-admin-title h5,
.vxm-home-feat-admin-title h6,
.vxm-home-feat-grow-title p,
.vxm-home-feat-grow-title li,
.vxm-home-feat-grow-title span,
.vxm-home-feat-grow-title label,
.vxm-home-feat-grow-title h1,
.vxm-home-feat-grow-title h2,
.vxm-home-feat-grow-title h3,
.vxm-home-feat-grow-title h4,
.vxm-home-feat-grow-title h5,
.vxm-home-feat-grow-title h6,
.vxm-home-feat-sellers-title p,
.vxm-home-feat-sellers-title li,
.vxm-home-feat-sellers-title span,
.vxm-home-feat-sellers-title label,
.vxm-home-feat-sellers-title h1,
.vxm-home-feat-sellers-title h2,
.vxm-home-feat-sellers-title h3,
.vxm-home-feat-sellers-title h4,
.vxm-home-feat-sellers-title h5,
.vxm-home-feat-sellers-title h6,
.vxm-home-feat-conditions-title p,
.vxm-home-feat-conditions-title li,
.vxm-home-feat-conditions-title span,
.vxm-home-feat-conditions-title label,
.vxm-home-feat-conditions-title h1,
.vxm-home-feat-conditions-title h2,
.vxm-home-feat-conditions-title h3,
.vxm-home-feat-conditions-title h4,
.vxm-home-feat-conditions-title h5,
.vxm-home-feat-conditions-title h6,
.vxm-home-feat-support-title p,
.vxm-home-feat-support-title li,
.vxm-home-feat-support-title span,
.vxm-home-feat-support-title label,
.vxm-home-feat-support-title h1,
.vxm-home-feat-support-title h2,
.vxm-home-feat-support-title h3,
.vxm-home-feat-support-title h4,
.vxm-home-feat-support-title h5,
.vxm-home-feat-support-title h6,
.vxm-home-feat-integ-title p,
.vxm-home-feat-integ-title li,
.vxm-home-feat-integ-title span,
.vxm-home-feat-integ-title label,
.vxm-home-feat-integ-title h1,
.vxm-home-feat-integ-title h2,
.vxm-home-feat-integ-title h3,
.vxm-home-feat-integ-title h4,
.vxm-home-feat-integ-title h5,
.vxm-home-feat-integ-title h6,
.vxm-home-feat-struct-title p,
.vxm-home-feat-struct-title li,
.vxm-home-feat-struct-title span,
.vxm-home-feat-struct-title label,
.vxm-home-feat-struct-title h1,
.vxm-home-feat-struct-title h2,
.vxm-home-feat-struct-title h3,
.vxm-home-feat-struct-title h4,
.vxm-home-feat-struct-title h5,
.vxm-home-feat-struct-title h6 {
  font-weight: bold !important;
}

.vxm-home-cta-label {
  color: var(--vxm-white) !important;
  display: block !important;
}

.vxm-home-cta-label p,
.vxm-home-cta-label li,
.vxm-home-cta-label span,
.vxm-home-cta-label label,
.vxm-home-cta-label h1,
.vxm-home-cta-label h2,
.vxm-home-cta-label h3,
.vxm-home-cta-label h4,
.vxm-home-cta-label h5,
.vxm-home-cta-label h6 {
  color: var(--vxm-white) !important;
}

.vxm-home-cta-heading {
  color: var(--vxm-white) !important;
  display: block !important;
  font-size: var(--vxm-fs-title) !important;
  padding-bottom: 25px !important;
  padding-top: 25px !important;
}

.vxm-home-cta-heading p,
.vxm-home-cta-heading li,
.vxm-home-cta-heading span,
.vxm-home-cta-heading label,
.vxm-home-cta-heading h1,
.vxm-home-cta-heading h2,
.vxm-home-cta-heading h3,
.vxm-home-cta-heading h4,
.vxm-home-cta-heading h5,
.vxm-home-cta-heading h6 {
  color: var(--vxm-white) !important;
  font-size: var(--vxm-fs-title) !important;
}

.vxm-home-industries-subheading {
  color: var(--vxm-dark) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
  text-align: center !important;
}

.vxm-home-faq-heading {
  color: var(--vxm-dark) !important;
  display: block !important;
  padding-bottom: 0 !important;
}

.vxm-home-faq-heading p,
.vxm-home-faq-heading li,
.vxm-home-faq-heading span,
.vxm-home-faq-heading label,
.vxm-home-faq-heading h1,
.vxm-home-faq-heading h2,
.vxm-home-faq-heading h3,
.vxm-home-faq-heading h4,
.vxm-home-faq-heading h5,
.vxm-home-faq-heading h6 {
  color: var(--vxm-dark) !important;
}

.vxm-home-newsletter-label {
  color: var(--vxm-brand-blue) !important;
  display: block !important;
  font-size: var(--vxm-fs-eyebrow) !important;
  padding-top: 80px !important;
}

.vxm-home-newsletter-heading {
  color: var(--vxm-dark) !important;
  display: block !important;
  font-size: var(--vxm-fs-title) !important;
  font-weight: bold !important;
  text-align: center !important;
}

.vxm-home-newsletter-text {
  color: var(--vxm-dark) !important;
  display: block !important;
  font-size: var(--vxm-fs-subtitle) !important;
  padding-bottom: -1px !important;
  text-align: center !important;
}

.vxm-home-newsletter-text p,
.vxm-home-newsletter-text li,
.vxm-home-newsletter-text span,
.vxm-home-newsletter-text label,
.vxm-home-newsletter-text h1,
.vxm-home-newsletter-text h2,
.vxm-home-newsletter-text h3,
.vxm-home-newsletter-text h4,
.vxm-home-newsletter-text h5,
.vxm-home-newsletter-text h6 {
  color: var(--vxm-dark) !important;
  font-size: var(--vxm-fs-subtitle) !important;
}

.vxm-home-newsletter-form {
  background-color: var(--vxm-white) !important;
  background-image: none !important;
  display: block !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Newsletter native form */
.vxm-newsletter {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 2rem 2.5rem;
}

.vxm-newsletter__form {
  position: relative;
}

.vxm-newsletter__fields {
  display: flex;
  gap: 0.75rem;
  align-items: stretch;
  max-width: 700px;
  margin: 0 auto;
}

.vxm-newsletter__field {
  flex: 1;
}

.vxm-newsletter__field input {
  width: 100%;
  padding: 0.875rem 1.25rem;
  font-family: "Montserrat", sans-serif;
  font-size: 0.95rem;
  color: var(--vxm-dark);
  background: var(--vxm-gray-100, #f5f5f5);
  border: 2px solid transparent;
  border-radius: 10px;
  outline: none;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  box-sizing: border-box;
}

.vxm-newsletter__field input::placeholder {
  color: var(--vxm-gray-500);
}

.vxm-newsletter__field input:focus {
  border-color: var(--vxm-brand-blue);
  background: var(--vxm-white);
}

.vxm-newsletter__btn {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--vxm-white);
  background: var(--vxm-brand-blue);
  border: none;
  border-radius: 30px;
  padding: 15px 40px;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(71, 126, 207, 0.32);
  transition: background-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.vxm-newsletter__btn:hover {
  background: color-mix(in srgb, var(--vxm-brand-blue) 88%, white);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(71, 126, 207, 0.50);
}

.vxm-newsletter__btn:active {
  transform: translateY(0);
}

@media (max-width: 768px) {
  .vxm-newsletter {
    padding: 2.5rem 1.25rem;
  }.vxm-newsletter__fields {
    flex-direction: column;
  }

  .vxm-newsletter__btn {
    width: 100%;
    padding: 1rem;
  }
}

.dnd_area-row-0-force-full-width-section > .row-fluid,
.dnd_area-row-4-force-full-width-section > .row-fluid,
.dnd_area-row-11-force-full-width-section > .row-fluid {
  max-width: none !important;
}

.module_17478172900976-flexbox-positioning,
.module_17479133664176-flexbox-positioning,
.module_17479133664177-flexbox-positioning,
.widget_1753779245342-flexbox-positioning,
.module_17537073955523-flexbox-positioning,
.module_1753569213161-flexbox-positioning,
.module_17535692131612-flexbox-positioning,
.module_1748006402380-flexbox-positioning,
.widget_1747913269607-flexbox-positioning,
.module_1748457816204-flexbox-positioning,
.module_17480191347943-flexbox-positioning,
.module_17480065332103-flexbox-positioning,
.module_1748090684515-flexbox-positioning,
.module_1748090738749-flexbox-positioning,
.module_1748090586587-flexbox-positioning,
.module_17479056853374-flexbox-positioning,
.module_17479056935416-flexbox-positioning,
.module_174790586192819-flexbox-positioning,
.module_174790586483112-flexbox-positioning,
.module_174790586826019-flexbox-positioning,
.module_17483361116552-flexbox-positioning,
.module_174833645550611-flexbox-positioning,
.widget_1747848679662-flexbox-positioning,
.module_17485998025595-flexbox-positioning,
.module_17485998025596-flexbox-positioning,
.module_17485998025597-flexbox-positioning,
.module_1755515394944-flexbox-positioning {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start;
}

.module_17478172900976-flexbox-positioning > div,
.module_17479133664176-flexbox-positioning > div,
.module_17479133664177-flexbox-positioning > div,
.widget_1753779245342-flexbox-positioning > div,
.module_17537073955523-flexbox-positioning > div,
.module_1753569213161-flexbox-positioning > div,
.module_17535692131612-flexbox-positioning > div,
.module_1748006402380-flexbox-positioning > div,
.widget_1747913269607-flexbox-positioning > div,
.module_1748457816204-flexbox-positioning > div,
.module_17480191347943-flexbox-positioning > div,
.module_17480065332103-flexbox-positioning > div,
.module_1748090684515-flexbox-positioning > div,
.module_1748090738749-flexbox-positioning > div,
.module_1748090586587-flexbox-positioning > div,
.module_17479056853374-flexbox-positioning > div,
.module_17479056935416-flexbox-positioning > div,
.module_174790586192819-flexbox-positioning > div,
.module_174790586483112-flexbox-positioning > div,
.module_174790586826019-flexbox-positioning > div,
.module_17483361116552-flexbox-positioning > div,
.module_174833645550611-flexbox-positioning > div,
.widget_1747848679662-flexbox-positioning > div,
.module_17485998025595-flexbox-positioning > div,
.module_17485998025596-flexbox-positioning > div,
.module_17485998025597-flexbox-positioning > div,
.module_1755515394944-flexbox-positioning > div {
  max-width: 100%;
  flex-shrink: 0 !important;
}

.dnd_area-row-0-padding {
  padding-top: 3rem !important;
  padding-bottom: 1rem !important;
}

.dnd_area-row-0-background-layers {
  background-image: none !important;
  background-color: var(--vxm-dark) !important;
  position: relative;
  overflow: hidden;
}

.dnd_area-row-0-background-layers > .row-fluid {
  position: relative;
  z-index: 1;
}

.vxm-hero-glow {
  position: absolute;
  left: 50%;
  top: 34%;
  width: 75%;
  max-width: 950px;
  height: 62%;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse at center, rgba(77, 198, 190, 0.30), transparent 70%);
  filter: blur(50px);
  pointer-events: none;
  z-index: 0;
  will-change: transform;
}

.dnd_area-row-1-background-layers,
.dnd_area-row-4-background-layers,
.dnd_area-row-5-background-layers,
.dnd_area-row-6-background-layers,
.dnd_area-row-7-background-layers,
.dnd_area-row-8-background-layers,
.dnd_area-row-11-background-layers,
.dnd_area-row-12-background-layers,
.dnd_area-row-13-background-layers,
.dnd_area-row-14-background-layers,
.dnd_area-row-15-background-layers,
.dnd_area-row-16-background-layers,
.dnd_area-row-17-background-layers,
.dnd_area-row-18-background-layers,
.cell_17477425965262-background-layers {
  background-image: linear-gradient(var(--vxm-dark), var(--vxm-dark)) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.dnd_area-row-3-background-layers,
.cell_17533618584582-background-layers {
  background-image: linear-gradient(var(--vxm-dark), var(--vxm-dark)) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.dnd_area-row-4-padding,
.dnd_area-row-9-padding,
.dnd_area-row-11-padding,
.dnd_area-row-19-padding,
.dnd_area-row-29-padding {
  padding-top: 4rem !important;
  padding-bottom: 0 !important;
}

.dnd_area-row-6-padding,
.dnd_area-row-7-padding,
.dnd_area-row-36-padding {
  padding-bottom: 1rem !important;
}

.dnd_area-row-8-padding,
.cell_1748334386902-padding {
  padding-bottom: 3rem !important;
}

.dnd_area-row-9-background-layers,
.dnd_area-row-10-background-layers,
.dnd_area-row-19-background-layers,
.dnd_area-row-21-background-layers,
.dnd_area-row-23-background-layers,
.dnd_area-row-25-background-layers,
.dnd_area-row-27-background-layers,
.dnd_area-row-29-background-layers,
.dnd_area-row-31-background-layers,
.dnd_area-row-32-background-layers,
.dnd_area-row-33-background-layers,
.dnd_area-row-34-background-layers,
.dnd_area-row-35-background-layers,
.dnd_area-row-36-background-layers,
.cell_17479953560862-background-layers,
.cell_17555151256912-background-layers {
  background-image: linear-gradient(var(--vxm-white), var(--vxm-white)) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.dnd_area-row-10-padding,
.dnd_area-row-31-padding {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.dnd_area-row-20-padding,
.dnd_area-row-21-padding,
.dnd_area-row-22-padding,
.dnd_area-row-23-padding,
.dnd_area-row-24-padding,
.dnd_area-row-25-padding,
.dnd_area-row-26-padding,
.dnd_area-row-28-padding {
  padding-top: 6rem !important;
  padding-bottom: 6rem !important;
}

.dnd_area-row-20-background-layers,
.dnd_area-row-22-background-layers,
.dnd_area-row-24-background-layers,
.dnd_area-row-26-background-layers {
  background-image: linear-gradient(#fafafa, #fafafa) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.dnd_area-row-28-background-layers {
  background-image: linear-gradient(
  to right,
  var(--vxm-teal),
  #486cbc
  ) !important;
  background-position: left top !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
}

.dnd_area-row-34-padding {
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.cell_17477425965262-margin,
.cell_17479056853369-margin,
.cell_17479058619288-margin,
.cell_17479058648319-margin,
.cell_17479058682608-margin,
.cell_17483361116542-margin,
.cell_17483364555062-margin {
  margin-bottom: 0 !important;
}

.cell_17477425965262-padding {
  padding-top: 0 !important;
  padding-bottom: 3rem !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.cell_1753780812022-padding,
.cell_17561153071184-padding {
  padding-bottom: 2rem !important;
}

.cell_1747742942588-row-1-margin {
  margin-bottom: 0.5rem !important;
}

.cell_17535692131602-row-1-margin {
  margin-bottom: 1rem !important;
}

.cell_1755514312312-padding {
  padding-left: 0 !important;
}

wistia-player[media-id="omewf7fpxv"]:not(:defined) {
  background: center / contain no-repeat
  url("https://fast.wistia.com/embed/medias/omewf7fpxv/swatch");
  display: block;
  filter: blur(5px);
  padding-top: 56.25%;
}

.vxm-home-cards-grid .cards-grid__item--1 {
  background: none;
}


@media (min-width: 768px) {

.dnd_area-row-6-vertical-alignment > .row-fluid,
.dnd_area-row-18-vertical-alignment > .row-fluid,
.dnd_area-row-20-vertical-alignment > .row-fluid,
.dnd_area-row-21-vertical-alignment > .row-fluid,
.dnd_area-row-22-vertical-alignment > .row-fluid,
.dnd_area-row-23-vertical-alignment > .row-fluid,
.dnd_area-row-24-vertical-alignment > .row-fluid,
.dnd_area-row-25-vertical-alignment > .row-fluid,
.dnd_area-row-26-vertical-alignment > .row-fluid,
.dnd_area-row-28-vertical-alignment > .row-fluid,
.cell_17480065452592-row-1-vertical-alignment > .row-fluid,
.cell_17381560371619-row-2-vertical-alignment > .row-fluid,
.vxm-footer-row-align > .row-fluid {
  display: flex !important;
  flex-direction: row;
}

.cell_17537073996862-vertical-alignment,
.cell_17480065452592-vertical-alignment,
.cell_1748334386902-vertical-alignment,
.cell_174790568533610-vertical-alignment,
.cell_17479056853369-vertical-alignment,
.cell_1748533890885-vertical-alignment,
.cell_17479056935414-vertical-alignment,
.cell_17479058619289-vertical-alignment,
.cell_17479058619288-vertical-alignment,
.cell_17479058648319-vertical-alignment,
.cell_174790586483110-vertical-alignment,
.cell_17479058682609-vertical-alignment,
.cell_17479058682608-vertical-alignment,
.cell_17483361116542-vertical-alignment,
.cell_17483361116543-vertical-alignment,
.cell_17483364555063-vertical-alignment,
.cell_17483364555062-vertical-alignment,
.cell_173815603716110-vertical-alignment,
.cell_17381560371619-vertical-alignment,
.cell_1755514312312-vertical-alignment,
.vxm-footer-cell-align {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.cell_17537073996862-vertical-alignment > div,
.cell_17480065452592-vertical-alignment > div,
.cell_1748334386902-vertical-alignment > div,
.cell_174790568533610-vertical-alignment > div,
.cell_17479056853369-vertical-alignment > div,
.cell_1748533890885-vertical-alignment > div,
.cell_17479056935414-vertical-alignment > div,
.cell_17479058619289-vertical-alignment > div,
.cell_17479058619288-vertical-alignment > div,
.cell_17479058648319-vertical-alignment > div,
.cell_174790586483110-vertical-alignment > div,
.cell_17479058682609-vertical-alignment > div,
.cell_17479058682608-vertical-alignment > div,
.cell_17483361116542-vertical-alignment > div,
.cell_17483361116543-vertical-alignment > div,
.cell_17483364555063-vertical-alignment > div,
.cell_17483364555062-vertical-alignment > div,
.cell_173815603716110-vertical-alignment > div,
.cell_17381560371619-vertical-alignment > div,
.cell_1755514312312-vertical-alignment > div,
.vxm-footer-cell-align > div {
  flex-shrink: 0 !important;
}

}


@media (min-width: 768px) and (max-width: 1280px) {

}


@media screen and (min-width: 768px) and (max-width: 1023px) {
}


@media (min-width: 1280px) {

}


@media (max-width: 768px) {

.dnd_area-row-0-padding {
  padding-top: 3em !important;
  padding-bottom: 0 !important;
}

.dnd_area-row-4-padding,
.dnd_area-row-11-padding {
  padding-top: 6rem !important;
  padding-bottom: 0 !important;
}

.dnd_area-row-9-padding,
.dnd_area-row-10-padding,
.dnd_area-row-20-padding,
.dnd_area-row-22-padding,
.dnd_area-row-24-padding,
.dnd_area-row-26-padding,
.dnd_area-row-28-padding {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.dnd_area-row-19-padding,
.dnd_area-row-29-padding {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.dnd_area-row-21-padding,
.dnd_area-row-25-padding {
  padding-top: 2rem !important;
  padding-bottom: 4rem !important;
}

.dnd_area-row-31-padding {
  padding-top: 3rem !important;
  padding-bottom: 0 !important;
}

.cell_17479056853369-margin,
.cell_17479058619288-margin,
.cell_17479058648319-margin,
.cell_17479058682608-margin,
.cell_17483361116542-margin,
.cell_17483364555062-margin {
  margin-bottom: 1.67rem !important;
}

.cell_17381560371619-margin {
  margin-bottom: 3rem !important;
}

.cell_17479953560862-padding {
  padding-top: -50px !important;
}

}


@media only screen and (max-width: 768px) {

.vxm-home-faq-section .accordion__item-btn {
  align-items: center;
  font-size: 1.167rem;
  padding: 1.4em 0;
}

}


@media screen and (max-width: 768px) {
}

/* ════════════════════════════════════════════════════════════════
   Comparison section redesign — premium comparison table
   Dark (var(--vxm-dark)) surface; the VentasxMayor column is highlighted teal.
   ════════════════════════════════════════════════════════════════ */
.vxm-home-comparison-heading .vxm-compare-accent {
  color: var(--vxm-teal) !important;
  font-weight: 700;
}

/* lead image of the comparison section (localized es/pt/en) */
.vxm-compare-img {
  display: block;
  max-width: 940px !important;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.vxm-compare {
  max-width: 940px;
  margin: 28px auto 0;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 22px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.025);
  font-family: Montserrat, sans-serif;
}

.vxm-compare__row {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1.05fr;
}
.vxm-compare__row + .vxm-compare__row {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.vxm-compare__dim,
.vxm-compare__cell,
.vxm-compare__col {
  padding: 17px 24px;
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: var(--vxm-fs-subtitle);
  line-height: 1.3;
  text-align: left;
}

.vxm-compare__dim {
  color: rgba(255, 255, 255, 0.92);
  font-weight: 700;
}
.vxm-compare__cell--them { color: rgba(255, 255, 255, 0.50); }
.vxm-compare__cell--us { color: var(--vxm-white); font-weight: 600; }
.vxm-compare__val { display: flex; align-items: center; gap: 11px; }
.vxm-compare__who { display: none; }  /* desktop: the header row carries the column names */

/* highlighted VentasxMayor column — continuous teal band */
.vxm-compare__col--us,
.vxm-compare__cell--us {
  background: rgba(77, 198, 190, 0.07);
  box-shadow: inset 1px 0 0 rgba(77, 198, 190, 0.22),
              inset -1px 0 0 rgba(77, 198, 190, 0.22);
}

/* header row */
.vxm-compare__head { border-bottom: 1px solid rgba(255, 255, 255, 0.10); }
.vxm-compare__head .vxm-compare__col {
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.vxm-compare__col--them { color: rgba(255, 255, 255, 0.6); }
.vxm-compare__col--us {
  color: var(--vxm-teal);
  background: rgba(77, 198, 190, 0.15);
  box-shadow: inset 1px 0 0 rgba(77, 198, 190, 0.35),
              inset -1px 0 0 rgba(77, 198, 190, 0.35),
              inset 0 2px 0 var(--vxm-teal);
}

/* icons */
.vxm-compare__ico { flex: 0 0 auto; width: 21px; height: 21px; }
.vxm-compare__ico--check { color: var(--vxm-teal); }
.vxm-compare__ico--x { color: rgba(255, 255, 255, 0.28); }

/* mobile reflow: stack the dimension label, then the two cells side by side */
@media (max-width: 768px) {
  .vxm-compare { margin-top: 20px; }
  .vxm-compare__head { display: none; }
  .vxm-compare__row {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "dim dim" "them us";
    padding: 8px 10px 14px;
    gap: 0 10px;
  }
  .vxm-compare__dim {
    grid-area: dim;
    padding: 14px 14px 6px;
    font-size: 14px;
    color: var(--vxm-teal);
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }
  .vxm-compare__cell {
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 14px;
    font-size: 15px;
    border-radius: 12px;
    gap: 5px;
  }
  .vxm-compare__who {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }
  .vxm-compare__cell--them .vxm-compare__who { color: rgba(255, 255, 255, 0.4); }
  .vxm-compare__cell--us .vxm-compare__who { color: var(--vxm-teal); }
  .vxm-compare__cell--them { grid-area: them; }
  .vxm-compare__cell--us { grid-area: us; }
  .vxm-compare__col--us,
  .vxm-compare__cell--us { box-shadow: none; }
  .vxm-compare__ico { width: 18px; height: 18px; }
}

/* CTA normalized to match the hero "Probar tienda demo" (secondary) button */
.vxm-home-compare-btn .aw-button-btn2 { text-align: center; }
.vxm-home-compare-btn .aw-button-btn2 .aw-button-button_2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--vxm-white);
  border: 2px solid rgba(255, 255, 255, 0.6);
  border-radius: 30px;
  padding: 15px 40px;
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 700;
  text-transform: none;
  transition: all 0.3s ease;
}
.vxm-home-compare-btn .aw-button-btn2 .aw-button-button_2:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: var(--vxm-white);
  transform: translateY(-3px);
}

/* ════════════════════════════════════════════════════════════════
   Hero band click easter-eggs:
   click the terminal -> $$$ float up · click a box -> opens + products
   pop out · click the truck -> it drives off. (Hover already brakes the
   loop; mouseleave resumes it and clears these effects.)
   ════════════════════════════════════════════════════════════════ */
.vxm-hero-anim__svg .vxm-terminal,
.vxm-hero-anim__svg .vxm-pack__box,
.vxm-hero-anim__svg .vxm-truck {
  cursor: pointer;
}

/* $$$ rising from the terminal */
@keyframes vxm-fx-cash {
  0%   { opacity: 0; transform: translateY(2px) scale(0.5); }
  25%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(-30px) scale(1.15); }
}
.vxm-fx-cash {
  fill: var(--vxm-teal);
  stroke: none;
  font: 700 15px Montserrat, sans-serif;
  transform-box: fill-box;
  transform-origin: center;
  animation: vxm-fx-cash 0.95s ease-out forwards;
  pointer-events: none;
}

/* products popping out of an opened box */
@keyframes vxm-fx-product {
  0%   { opacity: 0; transform: translate(0, 0) scale(0.2); }
  30%  { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--dx, 0px), var(--dy, -24px)) scale(1); }
}
.vxm-fx-product {
  fill: var(--vxm-teal);
  stroke: none;
  transform-box: fill-box;
  transform-origin: center;
  animation: vxm-fx-product 0.9s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
  pointer-events: none;
}

/* box lid lifting open */
.vxm-pack__box .vxm-box__lid {
  transform-box: fill-box;
  transform-origin: left bottom;
  transition: transform 0.25s ease;
}
.vxm-pack__box.is-open .vxm-box__lid {
  transform: translateY(-5px) rotate(-20deg);
}

/* truck driving off to the right (overrides the bob while active) */
@keyframes vxm-truck-drive {
  0%   { transform: translateX(0); }
  16%  { transform: translateX(-7px); }
  100% { transform: translateX(200px); }
}
.vxm-truck.is-driving {
  animation: vxm-truck-drive 1.2s cubic-bezier(0.45, 0, 0.75, 0.25) forwards;
}

/* Coin floating up from the terminal (richer than just $) */
@keyframes vxm-fx-coin {
  0%   { opacity: 0; transform: translateY(0) scale(0.4) rotate(0deg); }
  25%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(-28px) scale(1) rotate(360deg); }
}
.vxm-fx-coin {
  transform-box: fill-box;
  transform-origin: center;
  animation: vxm-fx-coin 1.4s ease-out forwards;
  pointer-events: none;
}

/* Dust puffs behind the departing truck */
@keyframes vxm-fx-puff {
  0%   { opacity: 0; transform: translate(0, 0) scale(0.4); }
  20%  { opacity: 0.7; }
  100% { opacity: 0; transform: translate(-14px, -4px) scale(1.6); }
}
.vxm-fx-puff {
  fill: rgba(255, 255, 255, 0.45);
  stroke: none;
  transform-box: fill-box;
  transform-origin: center;
  animation: vxm-fx-puff 0.9s ease-out forwards;
  pointer-events: none;
}

/* Honor reduced-motion: shorten and quiet down the click effects */
@media (prefers-reduced-motion: reduce) {
  .vxm-fx-cash,
  .vxm-fx-product,
  .vxm-fx-coin,
  .vxm-fx-puff {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
  }
  .vxm-truck.is-driving {
    animation-duration: 0.001s !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .vxm-fx-cash, .vxm-fx-product, .vxm-truck.is-driving { animation-duration: 0.01ms; }
}

/* ════════════════════════════════════════════════════════════════
   "Hechos para negocios" section — title, gap, logo sizing, dots
   ════════════════════════════════════════════════════════════════ */

/* Title at 34px (was inheriting default; normalise to title token).
   Targets any h-tag because section titles get h2 for semantic hierarchy.
   Also covers the FAQ heading ("Preguntas Frecuentes") below the slider. */
.s-social-proof .vxm-home-faq-subheading > h1,
.s-social-proof .vxm-home-faq-subheading > h2,
.s-social-proof .vxm-home-faq-subheading > h3,
.s-social-proof .vxm-home-faq-subheading > h4,
.s-social-proof .vxm-home-faq-subheading > h5,
.s-social-proof .vxm-home-faq-subheading > h6,
.vxm-home-faq-heading > h1,
.vxm-home-faq-heading > h2,
.vxm-home-faq-heading > h3,
.vxm-home-faq-heading > h4,
.vxm-home-faq-heading > h5,
.vxm-home-faq-heading > h6 {
  font-size: var(--vxm-fs-title) !important;
  font-weight: 700;
  color: var(--vxm-dark);
  margin: 0;
  line-height: 1.2;
}
/* Tighten the gap below the title */
.s-social-proof .vxm-home-faq-subheading {
  padding-bottom: 0 !important;
}

/* Reduce the big gap between the title section (row 9) and the slider (row 10) */
.s-social-proof.dnd_area-row-10-padding {
  padding-top: 1.25rem !important;
  padding-bottom: 1.5rem !important;
}

/* Slider logo cells: every brand sits in a FIXED 140x60 bbox so they look
   visually equal regardless of native resolution (some legacy assets like
   rid/her/dro/honky-tonk are only 61x33 native — without scaling them up
   they'd look much smaller than the bigger logos). The img fills the bbox
   with object-fit:contain so aspect ratio is preserved. */
.vxm-home-logo-slider .swiper-slide {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 80px;
}
.vxm-home-logo-slider .swiper-slide a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 140px;
  height: 60px;
}
/* Uniform display height — every logo renders at exactly 36px tall with
   auto width. This is the B2B gold-standard approach for client-logo strips:
   logos visually line up at the same vertical presence, widths vary
   naturally by aspect ratio, and the bbox container provides consistent
   horizontal spacing. */
.vxm-home-logo-slider .swiper-slide img {
  width: auto !important;
  height: 36px !important;
  max-width: 130px;
  max-height: 36px;
  object-fit: contain;
}

/* Quo logo is white text -> on the white slider bg it'd be invisible.
   Force it to black (overrides the swiper--grayscale-hover filter). */
.vxm-home-logo-slider img[src*="/quo.png"],
.vxm-home-logo-slider img[src*="assets/quo.png"] {
  filter: brightness(0) !important;
}

/* Pagination dots: smaller bullets in a centered single row + more
   breathing room above them. The defensive flex layout prevents bullets
   from wrapping into multiple rows when the slider has many slides. */
.vxm-home-logo-slider .swiper-pagination {
  position: static !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px;
  margin-top: 28px;
  padding-bottom: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.vxm-home-logo-slider .swiper-pagination-bullet {
  display: inline-block !important;
  flex: 0 0 auto;
  width: 6px !important;
  height: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.22);
  opacity: 1;
  box-sizing: border-box;
  vertical-align: middle;
  text-align: center !important;
}
.vxm-home-logo-slider .swiper-pagination-bullet-active {
  background-color: var(--vxm-teal) !important;
}

/* Mobile: tighter gap so all dots fit in one row even on small screens */
@media (max-width: 768px) {
  .vxm-home-logo-slider .swiper-pagination {
    gap: 6px;
    margin-top: 20px;
  }
  .vxm-home-logo-slider .swiper-pagination-bullet {
    width: 5px !important;
    height: 5px !important;
  }
}

/* ════════════════════════════════════════════════════════════════
   FOUNDATION — page-wide polish
   smooth scroll · focus states · button-shape consistency · selection
   ════════════════════════════════════════════════════════════════ */

/* Smooth scroll for anchor jumps (premium feel, respects reduced motion) */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* Text selection in brand color (subtle premium detail) */
::selection {
  background: rgba(77, 198, 190, 0.32);
  color: var(--vxm-white);
}

/* Accessible focus rings for keyboard users only (no rings on mouse clicks).
   Uses brand teal so it doesn't fight the design. */
:where(a, button, [role="button"], input, textarea, select, [tabindex]):focus-visible {
  outline: 2px solid var(--vxm-teal);
  outline-offset: 3px;
  border-radius: 4px;
}

/* (Legacy duplicate button-shape rules removed — the unified
   Opción B button system (lines ~440-518) now owns all CTAs.) */

/* Card 1 CTA (Agendar llamada) — secondary outline white, same
   shape as Comparación: transparent bg, 2px white-55 border, white
   text, pill 30px, Montserrat 700 16px, padding compensated for
   border. Hover lifts and brightens border. */
.vxm-home-cards-grid .cards-grid__item--1 .button.button--primary.button--md {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  color: var(--vxm-white) !important;
  border: 2px solid rgba(255, 255, 255, 0.55) !important;
  border-radius: 30px !important;
  padding: 13px 38px !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0.01em;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, color 180ms ease;
}
.vxm-home-cards-grid .cards-grid__item--1 .button.button--primary.button--md:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: var(--vxm-white) !important;
  color: var(--vxm-white) !important;
  transform: translateY(-2px);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.08) !important;
}

/* ════════════════════════════════════════════════════════════════
   EYEBROW LABELS — premium accent (subtle dot before the text).
   The labels (LA PLATAFORMA, HECHOS PARA NEGOCIOS, LAS DIFERENCIAS,
   etc.) were plain uppercase text. Add a small teal dot to make them
   read as deliberately-styled section markers, not generic captions.
   ════════════════════════════════════════════════════════════════ */
/* Center the social-proof eyebrow + title — the mw-720 block needs
   margin auto to actually center; text-align alone wasn't enough
   because the parent .span12 .dnd-module gave the block the full
   row width to sit inside, with the constrained content stuck
   at the left edge. */
.s-social-proof .label.js-slidein,
.s-social-proof .vxm-home-faq-subheading {
  text-align: center;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ════════════════════════════════════════════════════════════════
   PREMIUM POLISH — small details
   ════════════════════════════════════════════════════════════════ */

/* FAQ accordion: cleaner, smoother. Replace the harsh expand/collapse with
   a subtle hover bg tint, smooth icon rotation, and slightly bigger touch
   target. */
.vxm-home-faq-section .accordion__item {
  border-bottom: 1px solid rgba(26, 26, 26, 0.08);
  transition: background 0.25s ease;
}
.vxm-home-faq-section .accordion__item-btn {
  padding: 22px 8px !important;
  transition: color 0.25s ease;
  cursor: pointer;
}
.vxm-home-faq-section .accordion__item-btn:hover {
  color: var(--vxm-brand-blue);
}
.vxm-home-faq-section .accordion__item-icon.plus-minus {
  transition: transform 0.3s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.vxm-home-faq-section .accordion__item.is-active .accordion__item-icon.plus-minus,
.vxm-home-faq-section .accordion__item-btn[aria-expanded="true"] .accordion__item-icon.plus-minus {
  transform: rotate(180deg);
}

/* Newsletter form: tighter, more premium feel.
   The input + button row gets a cleaner hairline border treatment. */
.vxm-newsletter__field input {
  border-radius: 30px !important;
  padding: 14px 22px !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.vxm-newsletter__field input:focus {
  border-color: var(--vxm-brand-blue) !important;
  box-shadow: 0 0 0 3px rgba(71, 126, 207, 0.18) !important;
  outline: none !important;
}

/* Hero conveyor click cells: when not paused-on-hover, the SVG groups
   are decorative. The CSS cursor:pointer is already there but the SVG
   container also gets a subtle outline-on-focus for keyboard users
   (a11y bonus without breaking the look). */
.vxm-hero-anim__svg .vxm-terminal,
.vxm-hero-anim__svg .vxm-pack__box,
.vxm-hero-anim__svg .vxm-truck {
  transition: transform 0.18s ease, opacity 0.18s ease;
}
.vxm-hero-anim__svg .vxm-terminal:hover,
.vxm-hero-anim__svg .vxm-pack__box:hover,
.vxm-hero-anim__svg .vxm-truck:hover {
  opacity: 0.85;
}

/* Hero stat ("+500 empresas mayoristas...") — premium underline accent
   on hover of the whole hero-new__social block (subtle, draws attention
   to the social proof without screaming). */
.vxm-hero-new__social-label {
  position: relative;
}

/* Image rendering: keep crisp logos when scaled (the slider/hero logos
   are line-art); helps low-res legacy assets look slightly less blurry. */
.vxm-home-logo-slider .swiper-slide img,
.vxm-hero-new__logos img {
  image-rendering: -webkit-optimize-contrast;
}

/* Subtle scroll-margin so anchor jumps don't crash into the sticky header */
section[id], div[id^="row-"], h2 { scroll-margin-top: 80px; }

/* ════════════════════════════════════════════════════════════════
   ENTRANCE REVEALS — subtle, only on key elements (no over-animation).
   Cards fade in + slide up slightly as they scroll into view. Pure CSS
   via the existing js-slidein on key titles, plus a new lightweight
   approach for the platform cards.
   ════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: no-preference) {
  .vxm-home-cards-grid .cards-grid__item {
    opacity: 0;
    transform: translateY(16px);
    animation: vxm-card-rise 0.7s ease-out forwards;
  }
  /* Stagger so they appear in sequence -- not all at once */
  .vxm-home-cards-grid .cards-grid__item--1 { animation-delay: 0.05s; }
  .vxm-home-cards-grid .cards-grid__item--2 { animation-delay: 0.12s; }
  .vxm-home-cards-grid .cards-grid__item--3 { animation-delay: 0.19s; }
  .vxm-home-cards-grid .cards-grid__item--5 { animation-delay: 0.26s; }
  .vxm-home-cards-grid .cards-grid__item--6 { animation-delay: 0.33s; }
  .vxm-home-cards-grid .cards-grid__item--7 { animation-delay: 0.40s; }
}
@keyframes vxm-card-rise {
  to { opacity: 1; transform: translateY(0); }
}

/* Hero conveyor: at idle, the icons get a slight luminance pulse so the
   animation feels alive even when the page hasn't moved. Suppressed when
   user prefers reduced motion. */
@media (prefers-reduced-motion: no-preference) {
  .vxm-hero-anim__svg .vxm-terminal,
  .vxm-hero-anim__svg .vxm-truck {
    /* nothing here — the conveyor / box animation already runs */
  }
}

/* Tabs / accordions: when keyboard-focused on a heading, give a teal
   left-edge accent (premium signal without breaking the flush look). */
.vxm-home-faq-section .accordion__item-btn:focus-visible {
  outline: none;
  box-shadow: inset 3px 0 0 var(--vxm-teal);
}

/* ════════════════════════════════════════════════════════════════
   "Tus clientes podrán comprar..." section: subtitle → video → button.
   Give each block real breathing room — they were stuck together.
   ════════════════════════════════════════════════════════════════ */
.dnd_area-row-17-padding {
  padding-bottom: 3rem !important;
}
.dnd_area-row-18-padding {
  padding-top: 4rem !important;
  padding-bottom: 3rem !important;
}

/* Demo button below the video — give it real space, was pegado */
.vxm-home-demo-btn {
  margin-top: 3rem !important;
}

/* Industries (EXPLORAR RUBROS): tighten the gap between the title block
   and the case-study cards. The case-stud-section uses spacing-9xl-top
   which adds extra top padding on the carousel, making the gap too wide. */
.vxm-home-case-study .case-stud-section,
.vxm-home-case-study .case-stud-section.spacing-9xl-top {
  padding-top: 1.5rem !important;
}
.vxm-home-industries-subheading {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.vxm-home-industries-subheading h2,
.vxm-home-industries-subheading h3 {
  margin-bottom: 0 !important;
}
.vxm-home-demo-heading {
  font-size: 14px !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.7;
  padding-bottom: 0 !important;
}
.vxm-home-demo-heading h2,
.vxm-home-demo-heading h3 {
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  color: var(--vxm-teal) !important;
  margin: 0 !important;
}

/* The demo video: soft teal glow + remove ANY inherited frame.
   The "frame blanco" is the default browser fill of an empty <video>
   element before lazy-load attaches the source. We make the entire
   chain transparent so only the rounded video itself shows. */
.vxm-home-platform-video,
.vxm-home-platform-video span,
.vxm-home-platform-video > span,
.vxm-home-platform-video .hs_cos_wrapper_type_video {
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* Only the outer wrapper is the positioning context; inner spans stay inline */
.vxm-home-platform-video {
  position: relative;
  display: block !important;
  line-height: 0; /* kills inline whitespace before the video */
}

.vxm-home-platform-video video,
.vxm-home-platform-video iframe {
  display: block !important;
  border: 0 !important;
  outline: 0 !important;
  background: var(--vxm-dark) !important;
  box-shadow:
    0 0 60px rgba(77, 198, 190, 0.20),
    0 0 120px rgba(77, 198, 190, 0.08),
    0 30px 80px rgba(0, 0, 0, 0.5) !important;
  border-radius: 32px !important;
  object-fit: cover !important;
  vertical-align: middle !important;
}

/* Anchor the glow to the actual video element via a ::before halo on the
   video container — gives a clean offset glow even before video loads */
.vxm-home-platform-video {
  isolation: isolate;
}
.vxm-home-platform-video::before {
  content: "";
  position: absolute;
  inset: 8% 4%;
  background: radial-gradient(60% 60% at 50% 50%, rgba(77, 198, 190, 0.18), transparent 75%);
  filter: blur(40px);
  z-index: -1;
  pointer-events: none;
}
/* === assets/css/global-header.css === */
.vxm-header-logo .logo {
  max-width: 120px;
  margin-top: 0;
  margin-bottom: -200px;
}
/* === assets/module_mega-menu.min.css === */
.main-nav-list{display:flex;flex-direction:column;list-style:none;margin:0;padding:0;width:100%}.main-nav__item{cursor:pointer;display:inline-block;flex-grow:0;line-height:1;margin-left:.45em;margin-right:.45em;padding:.5em 0 .5em 1.25em;position:relative}.main-nav__item,.main-nav__item button{font-size:1.33rem}.main-nav__item a,.main-nav__item>button{color:var(--header-nav-color);fill:var(--header-nav-color);font-style:normal;font-weight:400;text-decoration:none}.main-nav__item a:hover,.main-nav__item>button:hover{color:var(--header-nav-color-hover)}.main-nav__item button{display:flex;padding:.5em 0;text-align:inherit}.main-nav__item button:hover *{color:var(--header-nav-color-hover);fill:var(--header-nav-color-hover)}.main-nav__item.menu-drop{padding:0;position:static;transition:var(--transition)}.main-nav__item.mega-link{position:static}.mega-link>a{align-items:center;display:flex;position:relative}.mega-link .main-nav__item-label{color:var(--header-nav-color);font-weight:400}.mega-drop{left:0;position:static;top:var(--content-offset-desktop);width:100vw;z-index:9}.mega-drop__item{display:block}.mega-drop__item img{display:none}.mega-drop__item p{display:none;margin:0}.menu-drop-panel{height:0;overflow:hidden;transition-property:height,visibility;transition-timing-function:ease;visibility:hidden}.menu-drop.is-active .menu-drop-panel{visibility:visible}.main-nav__item-icon{display:inline-block;margin-right:.2em;transition:var(--transition);width:1em}.drop-link .main-nav__item-icon,.mega-link .main-nav__item-icon{color:var(--header-nav-color)}.drop-link.is-active .main-nav__item-icon,.mega-link.is-active .main-nav__item-icon{transform:translateY(2px) rotate(180deg)}.sub-menu-drop{height:0;position:static}.sub-menu-drop li{padding-left:1rem}.sub-menu-drop a{display:block;padding-bottom:.8em;padding-top:.8em}@media screen and (max-width:767px){.main-nav__item.is-active .mega-drop{display:block}.main-nav__item.drop-link,.main-nav__item.mega-link{padding-left:1.25em}.mega-drop__item h5{display:block;padding-bottom:.8em;padding-top:.8em}.mega-drop__item h5,.sub-menu-drop a{color:var(--header-nav-color);font-size:1rem;font-weight:400}.mega-drop__item:hover h5,.sub-menu-drop a:hover{color:var(--header-nav-color-hover)}.sub-menu-drop li:last-of-type{padding-bottom:1rem}}@media screen and (min-width:768px){.main-nav-list{align-items:center;background-color:transparent;display:flex;flex-direction:row;height:auto;justify-content:center;position:static}.main-nav__item{font-size:.89rem;padding:.2em 0}.main-nav__item button{font-size:.875rem;padding-bottom:.25em;padding-top:.25em}.main-nav__item-icon{margin-right:0}.main-nav__item.is-active>button *{color:var(--header-nav-color-hover);fill:var(--header-nav-color-hover)}.mega-link.is-active{box-shadow:0 1px var(--dark-primary)}.mega-link.is-active .main-nav__item-icon{transform:translateY(1px) rotate(180deg)}.mega-drop{position:absolute}.mega-drop-wrapper{background-color:var(--mega-menu-bg);padding-bottom:4rem;padding-top:3rem}.mega-drop-container{display:flex;flex-wrap:wrap}.mega-drop__item{max-width:300px;padding:1.875rem}.mega-drop__item:hover{background-color:var(--mega-menu-item-hover)}.mega-drop__item img{display:block;flex-shrink:0;margin-right:1.875rem;max-width:60px}.mega-drop__item p{color:var(--mega-menu-text-color);display:block}.mega-drop__item-text h5{color:var(--mega-menu-title-color);flex-shrink:0}.mega-drop__item-text p{color:var(--mega-menu-text-color)}.main-nav__item:hover .sub-menu-drop{display:block}.sub-menu-drop{background-color:var(--mega-menu-bg);position:absolute;top:var(--content-offset-desktop);width:180px;z-index:9}.sub-menu-drop li{padding-left:1.5rem}.sub-menu-drop li:first-of-type{margin-top:1rem}.sub-menu-drop li:last-of-type{margin-bottom:1rem}.sub-menu-drop li a{color:var(--mega-menu-title-color);font-size:.89rem}.sub-menu-drop li:hover{background-color:var(--mega-menu-item-hover)}}@media only screen and (min-width:860px){.main-nav__item{font-size:.89rem;margin-left:1em;margin-right:1em}}@media only screen and (min-width:990px){.main-nav__item,.main-nav__item button{font-size:1rem}}
/* === assets/module_button-stack.min.css === */
.btn-list{align-items:center;display:flex;flex-wrap:wrap;justify-content:center;padding-bottom:1rem;padding-top:2rem}.btn-list__item{margin-bottom:.8rem;margin-right:.8rem}.btn-list__item:last-of-type{margin-right:0}@media only screen and (min-width:768px){.btn-list{justify-content:normal}}
/* === assets/css/global-hero-buttons.css === */
.vxm-hero-buttons .btn-list {
  padding: 0;
}

.vxm-hero-buttons .button1 {
  background-color: var(--vxm-gray-500);
  color: var(--vxm-white);
  font-weight: bold;
}

.vxm-hero-buttons .button1:hover,
.vxm-hero-buttons .button1:focus,
.vxm-hero-buttons .button1:active {
  background-color: var(--vxm-brand-blue);
}

.vxm-header-divider hr {
  border: 0 none;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #666666;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  width: 100%;
}