:root {
  /* ================================
     Core Brand Colours
  ================================ */

  --axon-navy: #2B3741;
  --axon-navy-dark: #17212A;
  --axon-navy-deep: #101820;
  --axon-navy-soft: #3A4650;

  --axon-white: #FFFFFF;
  --axon-page: #FFFFFF;

  --axon-surface: #F8F9FA;
  --axon-surface-cool: #EEF2F5;
  --axon-surface-dark: var(--axon-navy-dark);

  --axon-text: #18222B;
  --axon-text-soft: #35414B;
  --axon-muted: #59646E;
  --axon-muted-light: #646F79;
  --axon-placeholder: #646F79;
  --axon-inverse: var(--axon-white);

  --axon-border: #D8DEE5;
  --axon-border-strong: #BFC8D2;

  /* ================================
     Action Colour
     Bronze is reserved for buttons
     and important CTAs.
  ================================ */

  --axon-action: #965F3F;
  --axon-action-hover: #844F35;
  --axon-action-soft: rgba(150, 95, 63, 0.12);
  --axon-action-border: rgba(150, 95, 63, 0.52);
  --axon-action-shadow: rgba(150, 95, 63, 0.20);
  --axon-action-shadow-strong: rgba(150, 95, 63, 0.26);

  /* ================================
     Premium Cool Accents
     Decorative lines, borders, dots
     and card accents only.
  ================================ */

  --axon-platinum: #D7DDE6;
  --axon-platinum-dark: #AEB8C6;
  --axon-platinum-line: rgba(174, 184, 198, 0.48);
  --axon-platinum-soft: rgba(174, 184, 198, 0.14);
  --axon-platinum-faint: rgba(174, 184, 198, 0.10);
  --axon-platinum-border: rgba(174, 184, 198, 0.34);

  /* ================================
     Legacy Compatibility Aliases
     Preserve until old CSS has been
     fully migrated.
  ================================ */

  --axon-bronze: var(--axon-platinum-dark);
  --axon-bronze-dark: #6F7B88;
  --axon-bronze-line: var(--axon-platinum-line);

  /* ================================
     Dark Section Tokens
  ================================ */

  --axon-dark-gradient:
    linear-gradient(
      135deg,
      var(--axon-navy-dark),
      var(--axon-navy-deep)
    );

  --axon-dark-text: rgba(255, 255, 255, 0.88);
  --axon-dark-text-soft: rgba(255, 255, 255, 0.82);
  --axon-dark-text-muted: rgba(255, 255, 255, 0.76);

  --axon-dark-border-faint: rgba(255, 255, 255, 0.08);
  --axon-dark-border-soft: rgba(255, 255, 255, 0.10);
  --axon-dark-border: rgba(255, 255, 255, 0.14);
  --axon-dark-border-strong: rgba(255, 255, 255, 0.20);

  --axon-dark-glass-faint: rgba(255, 255, 255, 0.035);
  --axon-dark-glass-soft: rgba(255, 255, 255, 0.055);
  --axon-dark-glass-hover: rgba(255, 255, 255, 0.09);

  /* ================================
     State Tokens
  ================================ */

  --axon-error: #B42318;
  --axon-error-soft: #FEF3F2;

  --axon-selection-bg: rgba(174, 184, 198, 0.28);
  --axon-focus-ring: rgba(43, 55, 65, 0.58);
  --axon-form-focus-ring: rgba(43, 55, 65, 0.16);

  /* ================================
     Typography
  ================================ */

  --font-heading:
    "Manrope",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  --font-body:
    "Inter",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  /*
    Premium readable type scale.

    12px is reserved for exceptional
    metadata or legal text.

    Meaningful supporting text should
    normally be at least 13–15px.
  */

  --text-micro: 0.75rem;      /* 12px */
  --text-xs: 0.8125rem;       /* 13px */
  --text-caption: 0.875rem;   /* 14px */
  --text-sm: 0.9375rem;       /* 15px */
  --text-base: 1.0625rem;     /* 17px */
  --text-lg: 1.1875rem;       /* 19px */
  --text-xl: 1.375rem;        /* 22px */

  --h1: clamp(2.25rem, 3.6vw, 3.375rem);
  --h2: clamp(1.875rem, 2.7vw, 2.5rem);
  --h3: clamp(1.375rem, 1.8vw, 1.75rem);
  --h4: var(--text-xl);
  --h5: var(--text-lg);
  --h6: var(--text-base);

  --leading-heading: 1.12;
  --leading-body: 1.65;
  --leading-relaxed: 1.78;
  --leading-tight: 1.22;
  --leading-compact: 1.42;

  --tracking-display: -0.025em;
  --tracking-heading: -0.012em;


  /* ================================
     Semantic Typography Roles
     Component styles must consume
     these tokens rather than raw values.
  ================================ */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-semibold-strong: 650;
  --weight-bold: 700;
  --weight-extrabold: 800;

  --type-eyebrow-tight: 0.68rem;
  --type-relative-small: 0.9em;
  --type-ui-meta: 0.8125rem;
  --type-ui-compact: 0.875rem;
  --type-ui: 0.9375rem;
  --type-control: 1rem;
  --type-body-compact: 1.05rem;
  --type-body: 1.0625rem;
  --type-body-readable: 1.125rem;
  --type-card-copy: 1rem;
  --type-card-title: 1.25rem;
  --type-form-control: 1rem;
  --type-lead-readable: 1.25rem;
  --type-commerce-total: 1.65rem;
  --type-card-compact: clamp(1.05rem, 2vw, 1.3rem);
  --type-card-standard: clamp(1.08rem, 1.35vw, 1.25rem);
  --type-card-emphasis: 1.12rem;
  --type-card-feature: clamp(1.35rem, 1.75vw, 1.7rem);
  --type-card-feature-fixed: 1.35rem;
  --type-section-compact: clamp(1.4rem, 2vw, 1.8rem);
  --type-section-balanced: clamp(1.35rem, 2vw, 1.7rem);

  --leading-none: 1;
  --leading-display-tight: 1.08;
  --leading-display: 1.1;
  --leading-badge: 1.2;
  --leading-snug: 1.25;
  --leading-control: 1.3;
  --leading-ui: 1.35;
  --leading-label: 1.45;
  --leading-balanced: 1.5;
  --leading-copy-tight: 1.55;
  --leading-copy: 1.6;
  --leading-lead: 1.62;
  --leading-loose: 1.7;
  --leading-extra-loose: 1.8;

  --tracking-none: 0;
  --tracking-tight: -0.01em;
  --tracking-subtle: 0.01em;
  --tracking-label: 0.04em;
  --tracking-label-wide: 0.05em;
  --tracking-eyebrow: 0.06em;
  --tracking-caps: 0.08em;

  /* ================================
     Semantic Colour Roles
  ================================ */

  --axon-overlay-dark: rgba(23, 33, 42, 0.88);
  --axon-warning-text: #80520F;
  --axon-warning-soft: #FFF6D9;
  --axon-success-text: #166534;
  --axon-success-soft: #EAF8EE;
  --axon-success-border: #C2E19A;
  --axon-newsletter-success: #498C84;

  --axon-whatsapp: #B8835A;
  --axon-whatsapp-hover: #A7744D;
  --axon-whatsapp-border-faint: rgba(184, 131, 90, 0.16);
  --axon-whatsapp-border: rgba(184, 131, 90, 0.20);
  --axon-whatsapp-border-strong: rgba(184, 131, 90, 0.32);
  --axon-whatsapp-soft: rgba(184, 131, 90, 0.12);
  --axon-whatsapp-surface: rgba(245, 238, 226, 0.72);
  --axon-whatsapp-muted: rgba(43, 55, 65, 0.62);
  --axon-whatsapp-shadow: rgba(184, 131, 90, 0.34);
  --axon-whatsapp-shadow-hover: rgba(184, 131, 90, 0.42);
  --axon-widget-shadow: rgba(43, 55, 65, 0.14);
  --axon-white-border-soft: rgba(255, 255, 255, 0.22);
  --axon-white-glass: rgba(255, 255, 255, 0.78);
  --axon-action-faint: rgba(150, 95, 63, 0.05);



  /* ================================
     Readable Measures and Rhythm
  ================================ */

  --measure-display-title: 22ch;
  --measure-page-title: 24ch;
  --measure-article-title: 28ch;
  --measure-section-title: 28ch;
  --measure-lead: 58ch;
  --measure-copy: 64ch;
  --measure-copy-wide: 68ch;
  --measure-section-header: 48rem;
  --measure-faq-copy: 72ch;
  --measure-section-note: 72ch;
  --measure-solution-copy: 100%;

  --space-heading-copy: clamp(0.875rem, 1.2vw, 1.125rem);
  --space-title-copy: clamp(1rem, 1.5vw, 1.25rem);
  --space-copy-stack: 1rem;
  --space-heading-block-content: clamp(2rem, 4vw, 3rem);
  --space-card-heading-copy: 0.75rem;

  /* ================================
     Layout Scale
  ================================ */

  --container-max: 1240px;
  --container-padding: 1.25rem;

  /* Shared sticky layout offsets. */
  --axon-site-header-height: 78px;
  --axon-product-section-nav-height: 64px;
  --axon-sticky-gap: 1.25rem;

  --section-y-sm: clamp(3rem, 5vw, 4.5rem);
  --section-y-md: clamp(4rem, 7vw, 6.5rem);
  --section-y-lg: clamp(5rem, 9vw, 8rem);

  /* ================================
     Shape
  ================================ */

  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  /* ================================
     Shadows
  ================================ */

  --shadow-xs:
    0 3px 12px rgba(43, 55, 65, 0.045);

  --shadow-sm:
    0 8px 24px rgba(43, 55, 65, 0.065);

  --shadow-md:
    0 16px 42px rgba(43, 55, 65, 0.095);

  --shadow-lg:
    0 26px 68px rgba(43, 55, 65, 0.13);

  /* ================================
     Motion
  ================================ */

  --ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
  --transition-fast: 160ms var(--ease-standard);
  --transition-base: 240ms var(--ease-standard);
}

/* ================================
   Reset / Base
================================ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  font-synthesis: none;
  scroll-behavior: smooth;
  text-size-adjust: 100%;
}

body {
  min-height: 100%;
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--type-body-readable);
  line-height: var(--leading-body);
  color: var(--axon-text);
  background: var(--axon-page);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img,
picture,
svg,
video,
canvas {
  display: block;
  max-width: 100%;
}

img {
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

::selection {
  color: var(--axon-navy);
  background: var(--axon-selection-bg);
}

:focus-visible {
  outline: 3px solid var(--axon-focus-ring);
  outline-offset: 3px;
}

body,
input,
select,
textarea,
button {
  font-family: var(--font-body);
}

/* ================================
   Typography
================================ */

h1,
h2,
h3,
h4,
h5,
h6,
.heading,
.section-title,
.card-title,
.product-title,
.article-title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: var(--leading-heading);
  color: var(--axon-navy);
}

h1,
h2,
.heading-1,
.heading-2 {
  font-weight: 800;
  letter-spacing: var(--tracking-display);
}

h3,
h4,
h5,
h6,
.heading-3,
.heading-4,
.heading-5,
.heading-6,
.card-title,
.product-title,
.article-title {
  letter-spacing: var(--tracking-heading);
}

h1,
.heading-1 {
  font-size: var(--h1);
}

h2,
.heading-2 {
  font-size: var(--h2);
}

h3,
.heading-3 {
  font-size: var(--h3);
}

h4,
.heading-4 {
  font-size: var(--h4);
}

h5,
.heading-5 {
  font-size: var(--h5);
}

h6,
.heading-6 {
  font-size: var(--h6);
}

p {
  margin: 0;
  color: var(--axon-text-soft);
}

p + p {
  margin-top: 1rem;
}

strong,
b {
  font-weight: 700;
  color: inherit;
}

small {
  font-size: var(--text-caption);
  line-height: var(--leading-compact);
}

.lead {
  max-width: var(--measure-lead);
  font-size: var(--type-lead-readable);
  line-height: var(--leading-lead);
  color: var(--axon-text-soft);
}















/*
  Platinum is too pale for normal text.
  This class uses a readable neutral.
*/


.link {
  color: var(--axon-navy);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--axon-platinum-line);
  text-underline-offset: 0.22em;
}

.link:hover {
  color: var(--axon-navy-dark);
  text-decoration-color: var(--axon-platinum-dark);
}



/* ================================
   Embedded / Integration Utilities
================================ */

.gtm-noscript-frame {
  display: none;
  visibility: hidden;
}

.newsletter-message-shell {
  position: relative;
}

.newsletter-success-message {
  position: absolute;
  display: none;
  width: 90%;
  margin: 0.625rem 0 0.625rem 4%;
  padding: 0.1875rem;
  border: 3px solid var(--axon-success-border);
  color: var(--axon-newsletter-success);
  background: var(--axon-white);
  word-break: break-all;
}

.newsletter-success-copy {
  color: var(--axon-newsletter-success);
  font-family: var(--font-body);
  font-size: var(--text-caption);
  line-height: var(--leading-compact);
  word-break: break-word;
}

/* ================================
   Accessibility Utilities
================================ */

.visually-hidden,
.screen-reader-text,
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ================================
   Layout Utilities
================================ */

.container {
  width:
    min(
      100% - calc(var(--container-padding) * 2),
      var(--container-max)
    );
  margin-inline: auto;
}

.container-narrow {
  width:
    min(
      100% - calc(var(--container-padding) * 2),
      920px
    );
  margin-inline: auto;
}



.site-main {
  background: var(--axon-page);
}

.section {
  padding-block: var(--section-y-md);
}





.section-white {
  background: var(--axon-white);
}

.section-soft {
  background: var(--axon-surface);
}









.section-header {
  max-width: var(--measure-section-header);
  margin-bottom: var(--space-heading-block-content);
}

.section-header.center {
  margin-inline: auto;
  text-align: center;
}





.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}

.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}

.stack {
  display: grid;
  gap: 1rem;
}





/* ================================
   Page Heroes
================================ */











/* ================================
   Shared Heading Rhythm and Measures
================================ */

.section-header > :is(h1, h2, h3),
.section-intro > :is(h1, h2, h3) {
  max-width: var(--measure-section-title);
}

.section-header.center > :is(h1, h2, h3),
.section-intro.center > :is(h1, h2, h3) {
  margin-inline: auto;
}

.section-header > :is(h1, h2, h3) + p,
.section-intro > :is(h1, h2, h3) + p {
  max-width: var(--measure-lead);
  margin-top: var(--space-heading-copy);
}

.section-header.center > :is(h1, h2, h3) + p,
.section-intro.center > :is(h1, h2, h3) + p {
  margin-inline: auto;
}

/* ================================
   Buttons
================================ */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0 1.4rem;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition:
    color var(--transition-base),
    background-color var(--transition-base),
    border-color var(--transition-base),
    box-shadow var(--transition-base),
    transform var(--transition-base);
}

.btn:hover {
  transform: translateY(-1px);
}

.btn:active {
  transform: translateY(0);
}

.btn-primary {
  color: var(--axon-white);
  background: var(--axon-action);
  border-color: var(--axon-action);
  box-shadow:
    0 14px 34px var(--axon-action-shadow);
}

.btn-primary:hover {
  color: var(--axon-white);
  background: var(--axon-action-hover);
  border-color: var(--axon-action-hover);
  box-shadow:
    0 18px 42px var(--axon-action-shadow-strong);
}

.btn-secondary {
  color: var(--axon-navy);
  background: var(--axon-white);
  border-color: var(--axon-border);
  box-shadow: var(--shadow-xs);
}

.btn-secondary:hover {
  color: var(--axon-navy);
  background: var(--axon-white);
  border-color: var(--axon-border-strong);
  box-shadow: var(--shadow-sm);
}





.btn-text {
  min-height: auto;
  padding: 0;
  color: var(--axon-navy);
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.btn-text:hover {
  color: var(--axon-action-hover);
  transform: none;
}



.btn-sm {
  min-height: 40px;
  padding-inline: 1rem;
  font-size: var(--text-sm);
}

/* Product CTAs may include the product name; allow safe wrapping without
   changing the shared button colour, weight or hover behaviour. */
.btn.product-name-button {
  min-height: 44px;
  padding-block: 0.65rem;
  line-height: var(--leading-snug);
  white-space: normal;
}

.btn-lg {
  min-height: 54px;
  padding-inline: 1.65rem;
  font-size: var(--text-base);
}

/* ================================
   Badges
================================ */

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  width: max-content;
  max-width: 100%;
  min-height: 32px;
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--axon-border);
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.25;
  color: var(--axon-navy);
  background: var(--axon-white);
}

.badge-accent {
  border-color: var(--axon-platinum-line);
  color: var(--axon-navy);
  background: var(--axon-white);
}

/* ================================
   Cards / Reusable Surfaces
================================ */

.card {
  background: var(--axon-white);
  border: 1px solid var(--axon-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
}

.card-body {
  padding: clamp(1.25rem, 3vw, 1.75rem);
}

.card.card-body.card-hover:not(.stack) > h3 + p {
  margin-top: var(--space-card-heading-copy);
}

.card-hover {
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.card-hover:hover {
  transform: translateY(-2px);
  border-color: var(--axon-platinum-line);
  box-shadow: var(--shadow-md);
}

.card-accent {
  position: relative;
  overflow: hidden;
}

.card-accent::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 3px;
  background: var(--axon-platinum);
}

/* ================================
   Icon / Specification Components
================================ */

.icon-box {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--axon-border);
  border-radius: var(--radius-sm);
  color: var(--axon-navy);
  background: var(--axon-white);
}











/* ================================
   Shared Icons / Trust Strip
================================ */

.site-icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ================================
   Trust Strip Layout
================================ */

.trust-strip {
  padding-block: 1.5rem;
  border-block: 1px solid var(--axon-border);
  background: var(--axon-white);
}

.trust-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.trust-item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  grid-template-rows: auto auto;
  grid-template-areas:
    "icon title"
    "icon subtitle";
  align-items: center;
  column-gap: 0.9rem;
  row-gap: 0.18rem;
  padding: 1rem;
  border: 1px solid var(--axon-border);
  border-radius: var(--radius-md);
  text-align: left;
  background: var(--axon-white);
  box-shadow: var(--shadow-xs);
}

.trust-item .trust-icon {
  grid-area: icon;
  display: grid;
  place-items: center;
  align-self: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--axon-platinum-line);
  border-radius: var(--radius-sm);
  color: var(--axon-navy-soft);
  background: var(--axon-white);
}


.trust-item .trust-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.trust-item > strong {
  grid-area: title;
  display: block;
  margin: 0;
  white-space: nowrap;
  color: var(--axon-navy);
  font-size: var(--text-sm);
  font-weight: 800;
  line-height: 1.25;
}

.trust-item > span {
  grid-area: subtitle;
  display: block;
  margin: 0;
  color: var(--axon-muted);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.35;
}

@media (max-width: 1180px) {
  .trust-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  :root {
    --axon-site-header-height: 70px;
  }

  .trust-grid {
    grid-template-columns: 1fr;
  }
}

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















/* ================================
   Header / Footer Base
================================ */

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  color: var(--axon-navy);
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid var(--axon-border);
  backdrop-filter: blur(18px);
}

.site-footer {
  color: var(--axon-dark-text);
  background: var(--axon-dark-gradient);
}

.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
  color: var(--axon-white);
}

.site-footer p {
  color: var(--axon-dark-text-soft);
}

.site-footer a {
  color: var(--axon-dark-text-soft);
}

.site-footer a:hover {
  color: var(--axon-white);
}

/* ================================
   Mobile Sticky CTA
================================ */



/* ================================
   Responsive Global Layout
================================ */

@media (max-width: 1024px) {
  .grid-4 {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .grid-3 {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  

  
}

@media (max-width: 720px) {
  :root {
    --container-padding: 0.875rem;
  }

  /*
    Keep body copy readable on mobile.
    Do not reduce readability.
  */
  body {
    font-size: var(--type-body-readable);
  }

  

  .section {
    padding-block:
      clamp(3.25rem, 12vw, 4.75rem);
  }

  .grid-4,
  .grid-3 {
    grid-template-columns: 1fr;
  }

  .btn {
    min-height: 46px;
  }

  

  
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ================================
   Section Background Rhythm
================================ */

.section-gradient {
  background:
    linear-gradient(
      135deg,
      var(--axon-white) 0%,
      var(--axon-surface) 52%,
      var(--axon-surface-cool) 100%
    );
}

/* ================================
   Editorial Heading Rhythm
================================ */

.editorial-section .split h2,
.audience-section .split h2,
.contact-section h2 {
  margin-bottom:
    clamp(0.9rem, 1.4vw, 1.25rem);
}

.editorial-section .split h2 + p,
.audience-section .split h2 + p,
.contact-section h2 + p {
  margin-top: 0;
}

.editorial-section .split p + p,
.audience-section .split p + p,
.contact-section p + p {
  margin-top: 1rem;
}

/* =================================
   Shared CRM privacy disclosure
   Same non-leaking interaction on normal pages and paid LPs.
================================= */
.axon-privacy-disclosure-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--axon-text);
  padding: 0;
  margin: 0;
  font: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.16em;
  cursor: pointer;
}

.axon-privacy-disclosure-button:hover,
.axon-privacy-disclosure-button:focus-visible {
  color: var(--axon-action-hover);
}

body.axon-privacy-open {
  overflow: hidden;
}

.axon-privacy-modal[hidden] {
  display: none !important;
}

.axon-privacy-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: 24px;
}

.axon-privacy-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 24, 32, 0.72);
  backdrop-filter: blur(4px);
}

.axon-privacy-modal-panel {
  position: relative;
  width: min(620px, 100%);
  max-height: min(680px, calc(100vh - 48px));
  overflow: auto;
  background: var(--axon-white);
  color: var(--axon-text);
  border: 1px solid var(--axon-border);
  border-radius: 20px;
  box-shadow: 0 28px 80px rgba(16, 24, 32, 0.28);
  padding: clamp(26px, 4vw, 42px);
}

.axon-privacy-modal-panel h2 {
  margin: 0 48px 14px 0;
  color: var(--axon-navy-dark);
  font-family: var(--font-heading);
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1.15;
}

.axon-privacy-modal-panel p {
  margin: 0 0 16px;
  color: var(--axon-text-soft);
  font-size: 16px;
  line-height: 1.65;
}

.axon-privacy-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border: 1px solid var(--axon-border);
  border-radius: 999px;
  background: var(--axon-white);
  color: var(--axon-navy-dark);
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}

.axon-privacy-modal-done {
  margin-top: 6px;
}

@media (max-width: 560px) {
  .axon-privacy-modal {
    align-items: end;
    padding: 12px;
  }
  .axon-privacy-modal-panel {
    width: 100%;
    border-radius: 18px;
    padding: 28px 22px 24px;
  }
}

/* ================================================================
   Pre-production widescreen composition
   ----------------------------------------------------------------
   Backgrounds remain full-bleed while the shared content shell grows
   progressively on high-resolution desktop viewports. Readable text
   measures remain controlled by the existing typography tokens.
================================================================ */
@media (min-width: 1600px) {
  :root { --container-max: 1440px; }
}

@media (min-width: 2000px) {
  :root { --container-max: 1600px; }
}

@media (min-width: 2800px) {
  :root { --container-max: 1760px; }
}

@media (min-width: 3600px) {
  :root { --container-max: 1920px; }
}