/* =========================================================
   NIVENTO - FOUNDATION STYLESHEET
   Section references below point to NIVENTO_MASTER_KNOWLEDGE_BASE.md
   ========================================================= */

/* -------------------------------------------------
   1. FONT LOADING
   Manrope is primary, Inter is the fallback (Section 2).
   Load both from Google Fonts. If a page needs to work
   offline or self-hosted fonts are preferred later, swap
   this @import for local @font-face declarations without
   touching anything below.
------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

/* -------------------------------------------------
   2. CSS VARIABLES (design tokens)
------------------------------------------------- */
:root {
  /* --- Brand colors (Section 2) --- */
  --color-navy: #0B1F33;
  --color-navy-deep: #071522;
  --color-charcoal: #071522;
  --color-charcoal-soft: #102A43;
  --color-teal: #159C9C;
  --color-teal-deep: #0D7777;
  --color-orange: #E77A2F;
  --color-red: #B84A45;
  --color-offwhite: #F6F4EF;
  --color-mist: #FFF1E5;

  /* --- Functional color roles ---
     Named by role rather than hue so page-level CSS never
     references raw colors directly; if a shade needs to
     shift later, it changes once, here. */
  --color-bg: #FFFFFF;
  --color-bg-offwhite: var(--color-offwhite);
  --color-bg-mist: var(--color-mist);
  --color-text: var(--color-charcoal);
  --color-text-muted: #4B5A67;
  --color-text-inverse: #FFFFFF;
  --color-heading: var(--color-navy);
  --color-accent: var(--color-teal);
  --color-accent-strong: var(--color-navy);
  --color-accent-warm: var(--color-orange);
  --color-border: #DDE4E8;
  --color-focus-ring: var(--color-teal);
  --shadow-card: 0 14px 40px rgba(7, 21, 34, 0.10);
  --shadow-card-hover: 0 20px 48px rgba(7, 21, 34, 0.16);

  /* --- Typography --- */
  --font-primary: 'Manrope', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-secondary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Type scale: modest, consulting-grade ratio (~1.2), not a
     dramatic editorial scale - this is a corporate advisory
     brand, not a magazine (Section 1, brand personality). */
  --text-xs:   0.75rem;   /* 12px  - fine print, labels */
  --text-sm:   0.875rem;  /* 14px  - captions, meta */
  --text-base: 1rem;      /* 16px  - body */
  --text-md:   1.125rem;  /* 18px  - lead paragraphs */
  --text-lg:   1.375rem;  /* 22px  - small headings (H4) */
  --text-xl:   1.75rem;   /* 28px  - H3 */
  --text-2xl:  2.25rem;   /* 36px  - H2 */
  --text-3xl:  3rem;      /* 48px  - H1 (desktop) */
  --text-4xl:  3.75rem;   /* 60px  - hero display (desktop) */

  --leading-tight: 1.2;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

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

  /* --- Spacing scale (4px base unit) --- */
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.5rem;   /* 24px */
  --space-6: 2rem;     /* 32px */
  --space-7: 3rem;     /* 48px */
  --space-8: 4rem;     /* 64px */
  --space-9: 6rem;     /* 96px */
  --space-10: 8rem;    /* 128px */

  /* --- Layout --- */
  --container-max: 1240px;
  --content-max: 760px;
  --container-padding: var(--space-5);
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --header-height: 76px;

  /* --- Motion (used sparingly, per design guidance) --- */
  --transition-fast: 150ms ease;
  --transition-base: 220ms ease;
}

/* -------------------------------------------------
   3. RESET / BASE
------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
}

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

body {
  margin: 0;
  font-family: var(--font-secondary);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-primary);
  color: var(--color-heading);
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  margin: 0 0 var(--space-4);
}

h1 { font-size: var(--text-3xl); }
h2 { font-size: var(--text-2xl); }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-lg); font-weight: var(--weight-semibold); }

/* Hero-scale display text - used once per page, not a generic h1 default */
.display-hero {
  font-size: var(--text-3xl);
}
@media (min-width: 768px) {
  .display-hero { font-size: var(--text-4xl); }
}

p {
  margin: 0 0 var(--space-4);
  color: var(--color-text);
  max-width: 68ch; /* keeps body copy under ~80 characters per line */
}

.text-muted { color: var(--color-text-muted); }
.text-lead { font-size: var(--text-md); color: var(--color-text-muted); }

a {
  color: var(--color-accent-strong);
  text-decoration: none;
}
a:hover { text-decoration: underline; }

img { max-width: 100%; display: block; }

/* Visible keyboard focus everywhere (accessibility floor) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid var(--color-focus-ring);
  outline-offset: 2px;
}

/* -------------------------------------------------
   4. LAYOUT UTILITIES
------------------------------------------------- */
.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

.section {
  padding-block: var(--space-8);
}

.section-tight {
  padding-block: var(--space-6);
}

.section-mist {
  background: var(--color-bg-mist);
}

.section-navy {
  background: var(--color-navy);
  color: var(--color-text-inverse);
}
.section-navy h1, .section-navy h2, .section-navy h3, .section-navy h4 {
  color: var(--color-text-inverse);
}
.section-navy p { color: rgba(255,255,255,0.82); }

/* -------------------------------------------------
   5. BUTTONS / CTAs
   One consistent CTA vocabulary sitewide (Section 15, item 5).
   .btn-primary is reserved for "Start a Discovery Call" and
   equally weighted primary conversion actions.
------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-family: var(--font-primary);
  font-weight: var(--weight-semibold);
  font-size: var(--text-base);
  line-height: 1;
  padding: 0.9rem 1.6rem;
  border-radius: var(--radius-sm);
  border: 2px solid transparent;
  cursor: pointer;
  transition: background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
  text-decoration: none;
  white-space: nowrap;
}

.btn-primary {
  background: var(--color-teal);
  color: var(--color-navy);
  border-color: var(--color-teal);
}
.btn-primary:hover {
  background: #009090;
  border-color: #009090;
  text-decoration: none;
}

.btn-secondary {
  background: transparent;
  color: var(--color-navy);
  border-color: var(--color-navy);
}
.btn-secondary:hover {
  background: var(--color-navy);
  color: var(--color-text-inverse);
  text-decoration: none;
}

/* For use on .section-navy or dark backgrounds */
.btn-secondary-inverse {
  background: transparent;
  color: var(--color-text-inverse);
  border-color: rgba(255,255,255,0.6);
}
.btn-secondary-inverse:hover {
  background: rgba(255,255,255,0.12);
  border-color: var(--color-text-inverse);
  text-decoration: none;
}

.btn-sm { padding: 0.6rem 1.1rem; font-size: var(--text-sm); }

/* -------------------------------------------------
   6. FORM ELEMENTS (base - extended per-form later)
------------------------------------------------- */
label {
  display: block;
  font-weight: var(--weight-medium);
  margin-bottom: var(--space-2);
  font-size: var(--text-sm);
}

input, textarea, select {
  width: 100%;
  font-family: var(--font-secondary);
  font-size: var(--text-base);
  padding: 0.75rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  color: var(--color-text);
}

/* -------------------------------------------------
   7. SITE HEADER / NAVIGATION
   Shared markup lives in partials/header.html and is injected
   on every page by js/include.js. Class names here are the
   fixed vocabulary - reuse exactly on every page (Section 15).
------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 500;
  background: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
  height: var(--header-height);
}

.site-header__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
}

.site-header__logo img {
  height: 36px;
  width: auto;
  display: block;
}

/* Desktop nav */
.site-nav {
  display: none;
}

.site-nav__list {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-nav__link {
  font-family: var(--font-primary);
  font-weight: var(--weight-medium);
  font-size: var(--text-base);
  color: var(--color-text);
  padding: var(--space-2) 0;
  border-bottom: 2px solid transparent;
}
.site-nav__link:hover,
.site-nav__link[aria-current="page"] {
  color: var(--color-navy);
  border-bottom-color: var(--color-teal);
  text-decoration: none;
}

/* Mega-menu for Solutions (the only item with children, Section 4/6) */
.site-nav__item--has-menu {
  position: relative;
}

.mega-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  min-width: 640px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 32px rgba(16, 42, 67, 0.12);
  padding: var(--space-5);
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-2) var(--space-6);
}

.site-nav__item--has-menu:hover .mega-menu,
.site-nav__item--has-menu:focus-within .mega-menu {
  display: grid;
}

.mega-menu__link {
  display: block;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  color: var(--color-text);
}
.mega-menu__link:hover {
  background: var(--color-bg-mist);
  text-decoration: none;
}

.site-header__cta {
  display: none;
}

/* Mobile: hamburger trigger */
.nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
}

.nav-toggle__bar,
.nav-toggle__bar::before,
.nav-toggle__bar::after {
  content: '';
  display: block;
  width: 24px;
  height: 2px;
  background: var(--color-navy);
  transition: transform var(--transition-base), opacity var(--transition-base);
}
.nav-toggle__bar { position: relative; }
.nav-toggle__bar::before { position: absolute; top: -7px; }
.nav-toggle__bar::after { position: absolute; top: 7px; }

.site-header.is-nav-open .nav-toggle__bar { background: transparent; }
.site-header.is-nav-open .nav-toggle__bar::before { transform: translateY(7px) rotate(45deg); }
.site-header.is-nav-open .nav-toggle__bar::after { transform: translateY(-7px) rotate(-45deg); }

/* Mobile nav panel: full accordion drawer, not a shrunk desktop nav */
.mobile-nav {
  display: none;
  position: fixed;
  inset: var(--header-height) 0 0 0;
  background: var(--color-bg);
  overflow-y: auto;
  z-index: 400;
  padding: var(--space-5) var(--container-padding) var(--space-8);
}

.site-header.is-nav-open .mobile-nav { display: block; }
.site-header.is-nav-open { position: fixed; width: 100%; }

.mobile-nav__list {
  list-style: none;
  margin: 0 0 var(--space-6);
  padding: 0;
  border-top: 1px solid var(--color-border);
}

.mobile-nav__item {
  border-bottom: 1px solid var(--color-border);
}

.mobile-nav__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-4) 0;
  font-family: var(--font-primary);
  font-weight: var(--weight-semibold);
  font-size: var(--text-md);
  color: var(--color-navy);
}
.mobile-nav__link:hover { text-decoration: none; }

/* Accordion sub-list for Solutions on mobile */
.mobile-nav__submenu {
  display: none;
  list-style: none;
  margin: 0 0 var(--space-3);
  padding: 0 0 0 var(--space-3);
}
.mobile-nav__item.is-open .mobile-nav__submenu {
  display: block;
}
.mobile-nav__sublink {
  display: block;
  padding: var(--space-3) 0;
  font-size: var(--text-base);
  color: var(--color-text-muted);
}

.mobile-nav__accordion-icon {
  transition: transform var(--transition-base);
}
.mobile-nav__item.is-open .mobile-nav__accordion-icon {
  transform: rotate(180deg);
}

.mobile-nav__cta {
  width: 100%;
}

@media (min-width: 1024px) {
  .site-nav { display: block; }
  .site-header__cta { display: inline-flex; }
  .nav-toggle { display: none; }
  .mobile-nav { display: none !important; }
}

/* -------------------------------------------------
   8. SITE FOOTER
   Groups per Section 4: Brand, Explore, Resources,
   Work With Nivento, Connect, Legal. Mobile collapses
   lower-priority groups (Resources, Work With Nivento)
   into a single accordion, per Section 4.
------------------------------------------------- */
.site-footer {
  background: var(--color-charcoal);
  color: rgba(255,255,255,0.82);
  padding-block: var(--space-8) var(--space-6);
}

.site-footer a {
  color: rgba(255,255,255,0.82);
}
.site-footer a:hover {
  color: var(--color-text-inverse);
}

.footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  padding-bottom: var(--space-6);
  border-bottom: 1px solid rgba(255,255,255,0.12);
}

.footer-group__title {
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  color: var(--color-text-inverse);
  text-transform: none; /* deliberately not uppercase, see design notes */
  margin-bottom: var(--space-3);
}

.footer-group__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer-group__list li {
  margin-bottom: var(--space-2);
  font-size: var(--text-sm);
}

.footer-group--brand p {
  color: rgba(255,255,255,0.7);
  font-size: var(--text-sm);
  max-width: 32ch;
}

.footer-group--secondary {
  display: none; /* collapsed by default on mobile, revealed by JS accordion */
}
.footer-group--secondary.is-open {
  display: block;
}
.footer-group--secondary-toggle {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  color: var(--color-text-inverse);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  padding: var(--space-3) 0;
  cursor: pointer;
}

.footer-bottom {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding-top: var(--space-5);
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.6);
}

.footer-legal-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Join Us strip - footer-adjacent, sits above footer sitewide,
   deliberately not styled like the footer or the nav (Section 1). */
.join-strip {
  background: var(--color-teal);
  color: var(--color-navy);
  padding-block: var(--space-6);
}
.join-strip__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
}
.join-strip h3 { color: var(--color-navy); margin-bottom: var(--space-2); }
.join-strip p {
  color: var(--color-navy);
  opacity: 0.82;
}
.join-strip .btn-secondary {
  border-color: var(--color-navy);
}

@media (min-width: 768px) {
  .footer-grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .footer-group--secondary {
    display: block; /* always shown at tablet+ */
  }
  .footer-group--secondary-toggle {
    display: none;
  }
  .footer-bottom {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  .join-strip__inner {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
}

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

/* -------------------------------------------------
   9. PAGE-FAMILY / REUSABLE COMPOSITION HELPERS
   Keep page-level intent in classes rather than inline styles.
------------------------------------------------- */
.page-home .section { padding-block: clamp(3.5rem, 7vw, 6rem); }
.page-standard .section { padding-block: clamp(3.5rem, 6vw, 5.5rem); }
.page-solutions .section { padding-block: clamp(3.5rem, 6vw, 5.5rem); }
.page-audience .section { padding-block: clamp(3.5rem, 6vw, 5.5rem); }
.page-solution-detail .section { padding-block: clamp(3.5rem, 6vw, 6rem); }

.section-offwhite { background: var(--color-bg-offwhite); }
.section-dark { background: var(--color-navy-deep); color: var(--color-text-inverse); }
.section-dark h1,
.section-dark h2,
.section-dark h3,
.section-dark h4 { color: var(--color-text-inverse); }
.section-dark p { color: rgba(255,255,255,0.78); }

.container--narrow { max-width: 920px; }
.content-measure { max-width: var(--content-max); }
.text-center { text-align: center; }
.text-center > p { margin-inline: auto; }
.stack-2 > * + * { margin-top: var(--space-2); }
.stack-3 > * + * { margin-top: var(--space-3); }
.stack-4 > * + * { margin-top: var(--space-4); }
.stack-5 > * + * { margin-top: var(--space-5); }
.cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.cluster--start { align-items: flex-start; }
.cluster--center { justify-content: center; }
.mt-4 { margin-top: var(--space-4); }
.mt-5 { margin-top: var(--space-5); }
.mt-6 { margin-top: var(--space-6); }

.eyebrow {
  display: inline-block;
  margin-bottom: var(--space-3);
  font-family: var(--font-primary);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-teal-deep);
}
.section-dark .eyebrow { color: #7ED0D0; }

.card-link { color: inherit; }
.card-link:hover { text-decoration: none; }

/* -------------------------------------------------
   10. IMAGE PLACEHOLDER COMPONENT
   Backs the <nivento-placeholder-image> custom element
   in js/image-placeholder.js (Section 2.1).
------------------------------------------------- */
nivento-placeholder-image {
  display: block;
  width: 100%;
}

.niv-ph {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--color-mist);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-sm);
}

.niv-ph__real {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.niv-ph__label {
  position: absolute;
  left: var(--space-3);
  bottom: var(--space-3);
  right: var(--space-3);
  background: rgba(16, 42, 67, 0.82);
  color: var(--color-text-inverse);
  font-family: var(--font-secondary);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  pointer-events: none;
}

.niv-ph__label strong {
  font-weight: var(--weight-semibold);
}

/* -------------------------------------------------
   10. HOMEPAGE COMPONENTS
   Mobile-first: single column by default, expanding at
   tablet/desktop breakpoints (Section 4: mobile is
   reorganized, not a shrunk desktop layout).
------------------------------------------------- */
.credibility-grid,
.approach-grid,
.verticals-grid,
.why-grid,
.evidence-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
}

.split-block {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: center;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-7);
  align-items: center;
}
@media (min-width: 900px) {
  .hero-grid { grid-template-columns: 1.1fr 1fr; }
}

.approach-step {
  text-align: center;
}

.vertical-card {
  display: block;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  transition: box-shadow var(--transition-base), transform var(--transition-base);
}
.vertical-card:hover {
  box-shadow: 0 12px 24px rgba(16, 42, 67, 0.1);
  transform: translateY(-2px);
  text-decoration: none;
}
.vertical-card h4 {
  margin-top: var(--space-4);
  margin-bottom: var(--space-2);
}
.vertical-card p { margin-bottom: 0; }

.vertical-card--wide {
  display: flex;
}

@media (min-width: 600px) {
  .credibility-grid { grid-template-columns: repeat(2, 1fr); }
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .evidence-grid { grid-template-columns: repeat(2, 1fr); }
  .verticals-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
  .split-block { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 1024px) {
  .approach-grid { grid-template-columns: repeat(5, 1fr); }
  .why-grid { grid-template-columns: repeat(4, 1fr); }
  .evidence-grid { grid-template-columns: repeat(3, 1fr); }
  .verticals-grid { grid-template-columns: repeat(3, 1fr); }
}

/* -------------------------------------------------
   12. INNER-PAGE COMPONENTS
   Shared building blocks for About and future inner pages
   (Solutions hub, Assessments, Insights, Contact, modules):
   eyebrow labels, breadcrumbs, a light page hero, a 4-step
   process pattern, and bordered principle/value cards.
------------------------------------------------- */
.eyebrow {
  font-family: var(--font-primary);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent-strong);
  margin: 0 0 var(--space-3);
}
.section-navy .eyebrow,
.page-hero .eyebrow {
  color: var(--color-teal);
}

.breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  margin-bottom: var(--space-5);
}
.breadcrumb a { color: var(--color-text-muted); }
.breadcrumb a:hover { color: var(--color-navy); }
.breadcrumb span[aria-current] { color: var(--color-text); }

.page-hero {
  background: var(--color-bg-mist);
  padding-block: var(--space-8);
  border-bottom: 1px solid var(--color-border);
}
.page-hero__intro {
  max-width: 68ch;
}

.process-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
  margin-top: var(--space-6);
}
.process-step__number {
  display: block;
  font-family: var(--font-primary);
  font-weight: var(--weight-extrabold);
  font-size: var(--text-xl);
  color: var(--color-teal);
  margin-bottom: var(--space-2);
}
@media (min-width: 768px) {
  .process-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .process-grid { grid-template-columns: repeat(4, 1fr); }
}

.principles-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
  margin-top: var(--space-6);
}
.principle-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
}
.principle-card h3 { font-size: var(--text-lg); margin-bottom: var(--space-2); }
.principle-card p { margin-bottom: 0; }
@media (min-width: 600px) {
  .principles-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .principles-grid { grid-template-columns: repeat(4, 1fr); }
}

/* -------------------------------------------------
   14. FLOW CHIPS & TAGS
   Reusable across vertical pages for frameworks/models
   (e.g. People -> Roles -> Capability -> ...) and for
   listing representative modules within a Level 2 family.
------------------------------------------------- */
.flow-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  margin-top: var(--space-5);
}
.flow-item {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-4);
  font-family: var(--font-primary);
  font-weight: var(--weight-semibold);
  font-size: var(--text-sm);
  color: var(--color-navy);
  white-space: nowrap;
}
.flow-arrow {
  color: var(--color-teal);
  font-weight: var(--weight-bold);
}
.section-navy .flow-item {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.25);
  color: var(--color-text-inverse);
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-3);
}
.tag {
  background: var(--color-bg-mist);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  padding: 0.35rem 0.9rem;
  font-size: var(--text-sm);
  color: var(--color-text);
}

.family-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
  margin-bottom: var(--space-5);
}
.family-card:last-child { margin-bottom: 0; }

/* -------------------------------------------------
   16. CONTACT DETAILS & MAP
------------------------------------------------- */
.contact-details-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.contact-details-list li {
  margin-bottom: var(--space-4);
}
.contact-details-list .contact-label {
  display: block;
  font-family: var(--font-primary);
  font-weight: var(--weight-semibold);
  font-size: var(--text-sm);
  color: var(--color-teal);
  margin-bottom: var(--space-1);
}

.map-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: var(--radius-md);
  display: block;
}

/* -------------------------------------------------
   17. STATUS BADGES
------------------------------------------------- */
.badge {
  display: inline-block;
  font-family: var(--font-primary);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  background: var(--color-bg-mist);
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
}
.card-muted {
  opacity: 0.7;
}

/* -------------------------------------------------
   15. VISUALLY HIDDEN (a11y utility, e.g. skip links)
------------------------------------------------- */
.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  top: -100px;
  left: var(--space-4);
  background: var(--color-navy);
  color: var(--color-text-inverse);
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-sm);
  z-index: 1000;
  transition: top var(--transition-fast);
}
.skip-link:focus {
  top: var(--space-4);
}
/* -------------------------------------------------
   18. LINKED TAGS (related modules)
------------------------------------------------- */
.tag-link {
  display: inline-block;
  background: var(--color-bg-mist);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  padding: 0.35rem 0.9rem;
  font-size: var(--text-sm);
  color: var(--color-navy);
  font-weight: var(--weight-medium);
}
.tag-link:hover {
  background: var(--color-navy);
  color: var(--color-text-inverse);
  border-color: var(--color-navy);
  text-decoration: none;
}

/* -------------------------------------------------
   FOUNDATION OVERRIDES
   Shared foundation only. Page-specific styling remains
   grouped later as each page family is rebuilt.
------------------------------------------------- */
.mega-menu {
  min-width: 760px;
  grid-template-columns: 0.9fr 1.6fr;
  gap: var(--space-5);
  padding: var(--space-6);
}
.mega-menu__intro {
  padding-right: var(--space-5);
  border-right: 1px solid var(--color-border);
}
.mega-menu__intro strong {
  display: block;
  margin-bottom: var(--space-4);
  font-family: var(--font-primary);
  font-size: var(--text-lg);
  line-height: var(--leading-tight);
  color: var(--color-navy);
}
.mega-menu__intro > a { font-size: var(--text-sm); font-weight: var(--weight-semibold); }
.mega-menu__links { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-2); }
.mega-menu__link--wide { grid-column: 1 / -1; }

.mobile-nav__secondary {
  display: block;
  margin-top: var(--space-3);
  text-align: center;
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
}

.footer-grid--sitemap { grid-template-columns: 1.4fr repeat(4, 1fr); }
.footer-group--brand img { width: 120px; height: auto; object-fit: contain; object-position: left center; margin-bottom: var(--space-3); }
.footer-group--brand p { margin-bottom: 0; }
.footer-group__list a { display: inline-block; padding-block: 2px; }

@media (max-width: 1023px) {
  .footer-grid--sitemap { grid-template-columns: repeat(2, 1fr); }
  .footer-group--brand { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
  .footer-grid--sitemap { grid-template-columns: 1fr; gap: var(--space-5); }
  .footer-group--brand { grid-column: auto; }
}

.footer-brand-mark { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); }
.footer-brand-mark img { width: 44px; height: 40px; object-fit: contain; }
.footer-brand-mark span { font-family: var(--font-primary); font-size: var(--text-xl); font-weight: var(--weight-extrabold); letter-spacing: 0.08em; color: var(--color-text-inverse); }

/* =========================================================
   NIVENTO HOMEPAGE REVAMP
   Warmer, higher-contrast visual system. Teal is reserved
   for small brand references. Grey is intentionally avoided.
   ========================================================= */
:root {
  --color-bg: #FFFFFF;
  --color-bg-offwhite: #FFF9F2;
  --color-bg-mist: #FFF1E5;
  --color-text: #102A43;
  --color-text-muted: #294661;
  --color-heading: #071522;
  --color-accent: #E77A2F;
  --color-accent-strong: #071522;
  --color-accent-warm: #E77A2F;
  --color-border: #E8CDB8;
  --color-focus-ring: #E77A2F;
  --color-teal: #159C9C;
  --color-teal-deep: #0D7777;
  --color-orange: #E77A2F;
  --color-red: #B83B32;
  --shadow-card: 0 12px 28px rgba(7, 21, 34, 0.09);
  --shadow-card-hover: 0 18px 36px rgba(7, 21, 34, 0.15);
}

body { color: var(--color-text); background: var(--color-bg); }
p { color: var(--color-text); }
.text-muted, .text-lead { color: var(--color-text-muted); }

.site-header { border-bottom-color: #E8CDB8; }
.site-header__logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--color-heading);
  text-decoration: none;
}
.site-header__logo:hover { text-decoration: none; }
.site-header__logo img { width: 38px; height: 38px; object-fit: contain; }
.site-header__brand-text { display: flex; flex-direction: column; line-height: 1; }
.site-header__brand-text strong {
  font-family: var(--font-primary);
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.site-header__brand-text small {
  margin-top: 5px;
  font-family: var(--font-secondary);
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--color-red);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.site-nav__link:hover,
.site-nav__link[aria-current="page"] { border-bottom-color: var(--color-orange); color: var(--color-red); }
.site-header__cta { background: var(--color-orange); border-color: var(--color-orange); color: #FFFFFF; }
.site-header__cta:hover { background: var(--color-red); border-color: var(--color-red); color: #FFFFFF; }

.btn-primary, .btn-warm {
  background: var(--color-orange);
  color: #FFFFFF;
  border-color: var(--color-orange);
}
.btn-primary:hover, .btn-warm:hover { background: var(--color-red); border-color: var(--color-red); color: #FFFFFF; }
.btn-secondary { border-color: var(--color-heading); color: var(--color-heading); }
.btn-secondary:hover { background: var(--color-heading); color: #FFFFFF; }

/* Hero */
.home-hero {
  position: relative;
  overflow: hidden;
  background: var(--color-navy-deep);
  color: #FFFFFF;
  padding-block: clamp(3.5rem, 7vw, 7rem);
}
.home-hero__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: center;
}
.home-hero__copy { max-width: 700px; }
.home-hero__eyebrow { color: #FFB36D; margin-bottom: 1rem; }
.home-hero h1 { color: #FFFFFF; font-size: clamp(2.55rem, 5vw, 4.7rem); letter-spacing: -0.045em; max-width: 12ch; }
.home-hero__lead { color: #FFF4E9; font-size: clamp(1.05rem, 1.6vw, 1.2rem); max-width: 60ch; }
.home-hero__actions { margin-top: 1.8rem; }
.home-hero__text-link { color: #FFFFFF; font-weight: 700; }
.home-hero__text-link:hover { color: #FFB36D; text-decoration: none; }
.home-hero__visual { position: relative; }
.home-hero__visual img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; border: 1px solid rgba(255,255,255,.18); }
.home-hero__visual-note { position: absolute; left: 16px; right: 16px; bottom: 16px; display: flex; flex-wrap: wrap; gap: 7px 14px; padding: 12px 14px; background: rgba(7,21,34,.88); border-left: 4px solid var(--color-orange); color: #FFFFFF; }
.home-hero__visual-note strong { color: #FFB36D; }
.home-hero__visual-note span { color: #FFFFFF; }
.home-hero__glow { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .32; pointer-events: none; }
.home-hero__glow--orange { width: 280px; height: 280px; background: var(--color-orange); right: -120px; top: -120px; }
.home-hero__glow--red { width: 220px; height: 220px; background: var(--color-red); left: -120px; bottom: -120px; }

.home-statement { background: var(--color-bg); text-align: center; }
.home-statement__inner { max-width: 880px; }
.home-statement h2 { max-width: 22ch; margin-inline: auto; font-size: clamp(2rem, 4vw, 3.3rem); }
.home-statement h2::after { content: ''; display: block; width: 72px; height: 5px; margin: 22px auto 0; background: linear-gradient(90deg, var(--color-orange), var(--color-red)); }
.home-statement .eyebrow, .home-works .eyebrow, .home-audiences .eyebrow, .home-why .eyebrow, .home-discover .eyebrow, .home-reviews .eyebrow, .home-soft-cta .eyebrow { color: var(--color-red); }

.section-heading-row { display: grid; grid-template-columns: 1.05fr .95fr; gap: 3rem; align-items: end; margin-bottom: 2.25rem; }
.section-heading-row > p { margin: 0; max-width: 48ch; }
.section-heading-row--center { align-items: end; }
.section-heading-row h2 { margin-bottom: .5rem; }

.home-works { background: var(--color-bg-offwhite); }
.home-works__figure { margin: 0; border: 1px solid var(--color-border); border-bottom: 5px solid var(--color-orange); background: #FFFFFF; box-shadow: var(--shadow-card); }
.home-works__figure img { width: 100%; height: auto; display: block; }

.home-audiences { background: #FFFFFF; }
.audience-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.audience-card {
  display: grid;
  grid-template-columns: 108px 1fr;
  min-height: 126px;
  background: #FFFFFF;
  border: 1px solid var(--color-border);
  border-right: 4px solid var(--color-orange);
  border-radius: 4px;
  overflow: hidden;
  color: var(--color-text);
  box-shadow: 0 6px 18px rgba(7,21,34,.06);
  transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
.audience-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-card-hover); border-color: #DCA57E; text-decoration: none; }
.audience-card img { width: 108px; height: 100%; min-height: 126px; object-fit: cover; }
.audience-card__body { padding: 17px 16px; display: flex; flex-direction: column; justify-content: center; }
.audience-card__body strong { font-family: var(--font-primary); font-size: 1.08rem; line-height: 1.2; color: var(--color-heading); }
.audience-card__body small { margin-top: 7px; color: var(--color-text-muted); line-height: 1.45; }
.audience-card--wide { grid-column: 1 / -1; grid-template-columns: 160px 1fr; }
.audience-card--wide img { width: 160px; }

.home-why { background: var(--color-navy); }
.home-why h2, .home-why p, .home-why .section-heading-row > p { color: #FFFFFF; }
.home-why .why-image-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.why-image-card { background: #FFFFFF; border: 1px solid #F0D2BC; border-bottom: 5px solid var(--color-orange); border-radius: 4px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,.14); }
.why-image-card img { width: 100%; aspect-ratio: 16 / 8.5; object-fit: cover; }
.why-image-card > div { padding: 16px; }
.why-image-card span { color: var(--color-red); font-weight: 800; font-size: .78rem; }
.why-image-card h3 { margin: 5px 0 6px; font-size: 1.25rem; }
.why-image-card p { color: var(--color-text-muted); margin: 0; font-size: .92rem; }

.home-discover { background: var(--color-bg-offwhite); }
.home-discover__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.discover-card { display: grid; grid-template-columns: 42% 58%; min-height: 230px; background: #FFFFFF; border: 1px solid var(--color-border); border-bottom: 5px solid var(--color-red); border-radius: 4px; overflow: hidden; color: var(--color-text); box-shadow: 0 6px 18px rgba(7,21,34,.06); }
.discover-card--insights { border-bottom-color: var(--color-orange); }
.discover-card:hover { text-decoration: none; box-shadow: var(--shadow-card-hover); transform: translateY(-2px); }
.discover-card img { width: 100%; height: 100%; object-fit: cover; }
.discover-card > div { padding: 20px; display: flex; flex-direction: column; justify-content: center; }
.discover-card h2 { font-size: clamp(1.45rem, 2.3vw, 2rem); margin-bottom: 12px; }
.discover-card span { font-weight: 800; color: var(--color-red); }

.home-reviews { background: #FFFFFF; }
.reviews-head { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 10px; }
.home-reviews__intro { color: var(--color-text-muted); max-width: 70ch; }
.review-rating { display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 10px; min-width: 230px; }
.review-rating strong { font-family: var(--font-primary); font-size: 2.5rem; color: var(--color-heading); }
.review-rating span { color: var(--color-orange); letter-spacing: 2px; }
.review-rating small { grid-column: 1 / -1; color: var(--color-text-muted); }
.review-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.review-card { background: var(--color-bg-offwhite); border: 1px solid var(--color-border); border-left: 4px solid var(--color-orange); border-radius: 4px; padding: 20px; display: flex; flex-direction: column; min-height: 285px; }
.review-card__stars { color: var(--color-orange); letter-spacing: 2px; font-size: .9rem; margin-bottom: 10px; }
.review-card p { font-size: .95rem; line-height: 1.62; }
.review-card footer { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--color-border); display: flex; flex-direction: column; }
.review-card footer strong { color: var(--color-heading); }
.review-card footer span { color: var(--color-text-muted); font-size: .82rem; margin-top: 3px; }

.home-soft-cta { background: linear-gradient(105deg, var(--color-bg-offwhite), #FFE3CC); border-top: 1px solid var(--color-border); }
.home-soft-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-block: 42px; }
.home-soft-cta h2 { max-width: 25ch; margin: 0; font-size: clamp(1.65rem, 3vw, 2.45rem); }
.home-soft-cta .eyebrow { margin-bottom: 8px; }
.home-hero__text-link--dark { color: var(--color-heading); }
.home-hero__text-link--dark:hover { color: var(--color-red); }

.whatsapp-float { position: fixed; z-index: 450; right: 0; top: 52%; transform: translateY(-50%); display: inline-flex; align-items: center; gap: 9px; background: #0E7A4A; color: #FFFFFF; padding: 12px 13px 12px 10px; border-radius: 7px 0 0 7px; box-shadow: 0 8px 24px rgba(7,21,34,.2); font-family: var(--font-primary); font-weight: 800; font-size: .84rem; }
.whatsapp-float:hover { background: #075F39; color: #FFFFFF; text-decoration: none; }
.whatsapp-float__icon { width: 25px; height: 25px; display: inline-grid; place-items: center; border: 2px solid #FFFFFF; border-radius: 50%; font-size: .72rem; line-height: 1; }

@media (min-width: 900px) {
  .home-hero__inner { grid-template-columns: 1.02fr .98fr; }
}
@media (max-width: 1023px) {
  .audience-grid { grid-template-columns: repeat(2, 1fr); }
  .home-why .why-image-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  :root { --container-padding: 18px; }
  .site-header__logo img { width: 34px; height: 34px; }
  .site-header__brand-text strong { font-size: 1.3rem; }
  .site-header__brand-text small { font-size: .52rem; }
  .section-heading-row, .reviews-head, .home-soft-cta__inner { grid-template-columns: 1fr; display: grid; gap: 1.1rem; }
  .section-heading-row { margin-bottom: 1.5rem; }
  .home-hero h1 { max-width: 15ch; }
  .home-hero__visual-note { position: static; margin-top: 10px; }
  .audience-grid { grid-template-columns: 1fr; gap: 14px; }
  .audience-card, .audience-card--wide { grid-template-columns: 94px 1fr; min-height: 112px; }
  .audience-card img, .audience-card--wide img { width: 94px; min-height: 112px; }
  .home-why .why-image-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .why-image-card > div { padding: 13px; }
  .why-image-card h3 { font-size: 1.05rem; }
  .why-image-card p { font-size: .84rem; }
  .home-discover__grid { grid-template-columns: 1fr; }
  .discover-card { min-height: 180px; }
  .review-grid { grid-template-columns: 1fr; }
  .review-card { min-height: 0; }
  .whatsapp-float { top: auto; bottom: 18px; transform: none; border-radius: 999px; right: 14px; padding: 11px 14px 11px 11px; }
}

.review-carousel { position: relative; display: grid; grid-template-columns: 42px 1fr 42px; gap: 10px; align-items: center; }
.review-carousel__viewport { overflow: hidden; }
.review-carousel__track { display: flex; gap: 18px; transition: transform 260ms ease; }
.review-carousel .review-card { flex: 0 0 calc((100% - 36px) / 3); }
.review-carousel__button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--color-border); background: #FFFFFF; color: var(--color-heading); font-size: 1.7rem; cursor: pointer; box-shadow: 0 4px 12px rgba(7,21,34,.08); }
.review-carousel__button:hover { background: var(--color-orange); border-color: var(--color-orange); color: #FFFFFF; }
.review-card details { margin-top: -4px; margin-bottom: 14px; }
.review-card summary { cursor: pointer; color: var(--color-red); font-weight: 700; font-size: .84rem; }
.review-card details p { margin-top: 10px; font-size: .88rem; }
@media (max-width: 1023px) { .review-carousel .review-card { flex-basis: calc((100% - 18px) / 2); } }
@media (max-width: 767px) {
  .review-carousel { grid-template-columns: 34px 1fr 34px; gap: 6px; }
  .review-carousel .review-card { flex-basis: 100%; }
  .review-carousel__button { width: 34px; height: 34px; font-size: 1.4rem; }
}
.core-wide-image { width: 100%; display: block; border: 1px solid var(--color-border); border-bottom: 5px solid var(--color-orange); }
.how-work-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-top: 28px; }
.how-work-grid article { padding: 18px; border: 1px solid var(--color-border); border-top: 4px solid var(--color-orange); background: #FFFFFF; }
.how-work-grid span { color: var(--color-red); font-weight: 800; font-size: .8rem; }
.how-work-grid h2 { font-size: 1.2rem; margin: 7px 0; }
.how-work-grid p { margin: 0; font-size: .9rem; color: var(--color-text-muted); }
@media (max-width: 900px) { .how-work-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px) { .how-work-grid { grid-template-columns: 1fr; } }

/* Warm accent takes precedence over legacy teal accents on active site components. */
.section-dark .eyebrow,
.section-navy .eyebrow,
.process-step__number,
.contact-details-list .contact-label,
.flow-arrow { color: var(--color-orange); }
.insight-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.insight-card { display:flex; flex-direction:column; min-height:260px; padding:22px; background:#FFFFFF; border:1px solid var(--color-border); border-bottom:5px solid var(--color-orange); border-radius:4px; color:var(--color-text); box-shadow:0 6px 18px rgba(7,21,34,.06); }
.insight-card:hover { text-decoration:none; transform:translateY(-2px); box-shadow:var(--shadow-card-hover); }
.insight-card span { color:var(--color-red); font-weight:800; font-size:.8rem; }
.insight-card h2 { font-size:1.45rem; margin:10px 0; }
.insight-card p { color:var(--color-text-muted); }
.insight-card strong { margin-top:auto; color:var(--color-red); }
.article-body { font-size:1.08rem; line-height:1.78; }
.article-body p { color:var(--color-text); max-width:70ch; }
.article-next { margin-top:42px; padding:26px; background:var(--color-bg-offwhite); border-left:5px solid var(--color-orange); }
.article-next strong { font-family:var(--font-primary); font-size:1.25rem; color:var(--color-heading); }
.article-next p { margin-top:8px; }
@media (max-width:900px) { .insight-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .insight-grid { grid-template-columns:1fr; } .article-body { font-size:1rem; } }

/* =========================================================
   NIVENTO VISUAL POLISH - 02
   Warm premium palette, tighter cards, stronger brand mark.
   ========================================================= */
:root {
  --color-text-muted: #29445F;
  --color-border: #F0C8A6;
  --color-focus-ring: var(--color-orange);
  --color-accent: var(--color-orange);
  --color-accent-strong: var(--color-navy);
  --color-bg-offwhite: #FFF9F2;
  --color-bg-mist: #FFF1E5;
  --shadow-card: 0 12px 30px rgba(7,21,34,.09);
  --shadow-card-hover: 0 18px 38px rgba(7,21,34,.15);
}

.text-muted, .text-lead { color: var(--color-text-muted); }

/* Header wordmark: use the actual Nivento artwork so the name and
   tagline retain the logo's original typography rather than a CSS substitute. */
.site-header__logo { display: block; flex: 0 0 auto; }
.site-header__logo img {
  width: 246px;
  height: auto;
  max-height: 56px;
  object-fit: contain;
}
.site-header { border-bottom-color: #F0C8A6; }
.site-nav__link:hover,
.site-nav__link[aria-current="page"] { border-bottom-color: var(--color-orange); color: var(--color-red); }
.site-header__cta { background: var(--color-orange); border-color: var(--color-orange); }
.site-header__cta:hover { background: var(--color-red); border-color: var(--color-red); }

/* Tighter, more premium cards across the shared vocabulary. */
.audience-card,
.vertical-card,
.principle-card,
.insight-card,
.review-card,
.discover-card,
.why-image-card {
  border-color: #F0C8A6;
  box-shadow: 0 8px 22px rgba(7,21,34,.07);
}
.audience-card { border-bottom: 4px solid var(--color-orange); }
.audience-card:hover { border-color: var(--color-orange); border-bottom-color: var(--color-red); }
.vertical-card { border-bottom: 4px solid var(--color-orange); }
.vertical-card:hover { border-color: var(--color-orange); }
.principle-card { border-left: 4px solid var(--color-orange); }
.insight-card { border-bottom: 4px solid var(--color-red); }
.insight-card:hover { border-bottom-color: var(--color-orange); }
.review-card { border-left-color: var(--color-orange); }

/* Footer copyright and supporting text must remain clearly readable. */
.footer-bottom,
.footer-bottom p,
.footer-legal-list a { color: #FFFFFF; }
.footer-bottom { opacity: 1; }
.footer-group--brand p { color: rgba(255,255,255,.86); }

/* Replace the previous teal Join Us strip with a clean white transition. */
.join-strip {
  background: #FFFFFF;
  color: var(--color-navy);
  border-top: 1px solid #F0C8A6;
  border-bottom: 4px solid var(--color-orange);
}
.join-strip h3 { color: var(--color-navy); }
.join-strip p { color: var(--color-text-muted); opacity: 1; }
.join-strip .eyebrow { color: var(--color-red); }
.join-strip .btn-primary { background: var(--color-orange); color: #FFFFFF; border-color: var(--color-orange); }
.join-strip .btn-primary:hover { background: var(--color-red); border-color: var(--color-red); }

/* Persistent WhatsApp tab: vertical on desktop, compact pill on mobile. */
.whatsapp-float {
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 50px;
  min-height: 178px;
  padding: 14px 10px;
  border-radius: 8px 0 0 8px;
  flex-direction: column;
  justify-content: center;
  gap: 11px;
  background: #0E7A4A;
  box-shadow: 0 10px 28px rgba(7,21,34,.18);
}
.whatsapp-float__label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  white-space: nowrap;
  font-size: .78rem;
}
.whatsapp-float__icon { flex: 0 0 auto; }

/* Homepage spacing/alignment refinements. */
.home-statement__inner { padding-block: 76px; }
.home-works__figure { border-color: #F0C8A6; border-bottom-color: var(--color-orange); }
.home-audiences .section-heading-row--center,
.home-why .section-heading-row--center { align-items: end; }
.home-why { background: var(--color-navy-deep); }
.home-discover { background: #FFF9F2; }
.home-soft-cta { background: #FFFFFF; border-top: 1px solid #F0C8A6; }
.home-soft-cta h2 { max-width: 28ch; }

@media (min-width: 768px) {
  .site-header__logo img { width: 264px; max-height: 60px; }
}

@media (max-width: 767px) {
  .site-header__logo img { width: 202px; max-height: 48px; }
  .whatsapp-float {
    top: auto;
    bottom: 18px;
    right: 14px;
    transform: none;
    width: auto;
    min-height: 0;
    flex-direction: row;
    border-radius: 999px;
    padding: 11px 14px 11px 11px;
  }
  .whatsapp-float__label {
    writing-mode: horizontal-tb;
    transform: none;
    font-size: .78rem;
  }
}

/* Editorial / blog compositions */
.section-warm { background: #FFF9F2; }
.insights-feature { padding-top: 0; }
.insight-feature {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  background: #FFFFFF;
  border: 1px solid #F0C8A6;
  border-bottom: 5px solid var(--color-orange);
  color: var(--color-text);
  box-shadow: var(--shadow-card);
}
.insight-feature:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow-card-hover); }
.insight-feature img { width: 100%; height: 100%; min-height: 380px; object-fit: cover; }
.insight-feature__body { padding: clamp(28px,4vw,54px); align-self: center; }
.insight-feature__body h2 { font-size: clamp(2rem,4vw,3.25rem); max-width: 15ch; margin-top: 10px; }
.insight-feature__body p { color: var(--color-text-muted); font-size: 1.05rem; }
.insight-feature__body strong { color: var(--color-red); }
.insight-grid--editorial { grid-template-columns: repeat(2, 1fr); }
.insight-card--editorial { min-height: 280px; padding: 26px; }
.insight-card--editorial > span { color: var(--color-red); font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.insight-card--editorial h2 { font-size: clamp(1.45rem,2.2vw,2rem); margin-top: 12px; }
.insight-card--editorial p { color: var(--color-text-muted); }
.insight-card--editorial strong { margin-top: auto; color: var(--color-red); }
.insights-closing { background: #FFFFFF; }
.insights-closing__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.insights-closing h2 { max-width: 18ch; }

.article-hero { background: var(--color-navy-deep); color: #FFFFFF; padding: clamp(48px,7vw,92px) 0; }
.article-hero h1 { color: #FFFFFF; font-size: clamp(2.5rem,5vw,4.5rem); max-width: 15ch; }
.article-hero .text-lead { color: rgba(255,255,255,.86); max-width: 62ch; }
.article-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 5rem; align-items: center; }
.article-hero__grid > img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-bottom: 5px solid var(--color-orange); }
.article-back { display: inline-block; color: #FFFFFF; font-weight: 700; margin-bottom: 34px; }
.article-back:hover { color: #FFB36D; }
.article-meta { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 24px; color: #FFB36D; font-size: .85rem; font-weight: 700; }
.article-layout { background: #FFFFFF; }
.article-layout__grid { display: grid; grid-template-columns: 250px minmax(0,760px); gap: 5rem; align-items: start; }
.article-sidebar { position: sticky; top: 105px; padding: 22px; background: #FFF9F2; border-left: 4px solid var(--color-orange); }
.article-sidebar ol { margin: 12px 0 0; padding-left: 20px; }
.article-sidebar li { margin-bottom: 10px; font-size: .9rem; }
.article-sidebar a { color: var(--color-navy); }
.article-section { margin-bottom: 50px; }
.article-section h2 { font-size: clamp(1.55rem,2.5vw,2.2rem); margin-bottom: 15px; }
.article-body p { font-size: 1.06rem; line-height: 1.8; color: var(--color-text); }
.article-takeaway { margin: 58px 0; padding: 30px; background: #FFF1E5; border-left: 5px solid var(--color-red); }
.article-takeaway p:last-child { font-family: var(--font-primary); font-size: 1.25rem; line-height: 1.55; color: var(--color-navy); margin: 0; }
.article-next { margin-top: 58px; padding: 34px; background: var(--color-navy); border-bottom: 5px solid var(--color-orange); }
.article-next h2, .article-next p { color: #FFFFFF; }
.article-next .eyebrow { color: #FFB36D; }

@media (max-width: 900px) {
  .insight-feature, .article-hero__grid, .insights-closing__inner { grid-template-columns: 1fr; }
  .insight-feature img { min-height: 260px; }
  .article-layout__grid { grid-template-columns: 1fr; gap: 2rem; }
  .article-sidebar { position: static; }
}
@media (max-width: 767px) {
  .insight-grid--editorial { grid-template-columns: 1fr; }
  .insight-feature__body { padding: 24px; }
  .article-hero__grid { gap: 2rem; }
  .article-hero__grid > img { aspect-ratio: 16 / 10; }
  .article-body p { font-size: 1rem; }
}

/* =========================================================
   SOLUTIONS SYSTEM + FINAL VISUAL SCALE OVERRIDES
   ========================================================= */
:root {
  --color-charcoal: #0B1F33;
  --color-charcoal-soft: #173B59;
  --color-text: #173B59;
  --color-text-muted: #244E70;
  --color-heading: #0B1F33;
  --color-border: #F1C29F;
  --color-bg-mist: #FFF1E5;
  --color-bg-offwhite: #FFF9F3;
  --color-focus-ring: #E77A2F;
  --shadow-card: 0 12px 30px rgba(11,31,51,.08);
  --shadow-card-hover: 0 18px 40px rgba(11,31,51,.14);
}

/* Smaller, calmer heading scale across inner pages. */
h1 { font-size: clamp(2rem, 3.8vw, 3.25rem); letter-spacing: -0.025em; }
h2 { font-size: clamp(1.65rem, 2.7vw, 2.35rem); letter-spacing: -0.018em; }
h3 { font-size: clamp(1.2rem, 1.9vw, 1.55rem); }
.display-hero { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.page-hero h1,
.solution-hero h1 { font-size: clamp(2.05rem, 3.7vw, 3.25rem); max-width: 24ch; }

/* No grey visual surfaces. */
.text-muted { color: var(--color-text-muted); }
.section-mist { background: var(--color-bg-mist); }
.section-warm { background: var(--color-bg-offwhite); }

/* Solution hero */
.solution-hero {
  background: #FFF9F3;
  border-bottom: 1px solid var(--color-border);
  padding-block: clamp(42px, 6vw, 72px);
}
.solution-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  gap: clamp(32px, 6vw, 80px);
  align-items: center;
}
.solution-hero__grid--single { grid-template-columns: minmax(0, 900px); }
.solution-hero__visual img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-bottom: 5px solid var(--color-orange);
  box-shadow: var(--shadow-card);
}
.solution-hero .text-lead { max-width: 65ch; color: var(--color-text-muted); }
.solution-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 24px; }
.text-action { color: var(--color-navy); font-weight: 800; }
.text-action:hover { color: var(--color-red); text-decoration: none; }

/* Compact card grids used consistently throughout Solutions. */
.solution-family-grid,
.solution-hub-grid,
.module-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
  margin-top: 30px;
}
.solution-family-card,
.solution-hub-card,
.module-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: #FFFFFF;
  border: 1px solid #F1C29F;
  border-bottom: 4px solid var(--color-orange);
  padding: 24px 24px 21px;
  color: var(--color-text);
  box-shadow: 0 7px 18px rgba(11,31,51,.05);
  transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
.solution-family-card:hover,
.solution-hub-card:hover,
.module-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-card-hover);
  border-color: var(--color-orange);
  text-decoration: none;
}
.solution-card__index,
.module-card__number {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-width: 34px;
  height: 28px;
  padding-inline: 8px;
  border-left: 3px solid var(--color-red);
  color: var(--color-red);
  font-family: var(--font-primary);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  margin-bottom: 15px;
}
.solution-family-card h3,
.solution-hub-card h2,
.module-card h3 { margin-bottom: 9px; color: var(--color-navy); }
.solution-family-card p,
.solution-hub-card p,
.module-card p { color: var(--color-text-muted); margin-bottom: 0; }
.solution-card__link,
.module-card__link {
  margin-top: auto;
  padding-top: 20px;
  color: var(--color-red);
  font-size: .86rem;
  font-weight: 800;
}
.solution-tags,
.focus-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 15px;
}
.solution-tags span,
.focus-chips span {
  display: inline-block;
  border: 1px solid #F1C29F;
  background: #FFF9F3;
  color: var(--color-navy);
  padding: 5px 9px;
  font-size: .74rem;
  line-height: 1.2;
}
.solution-family-card .solution-card__link { margin-top: 6px; }

.solution-context,
.family-intro,
.solution-choice,
.focus-strip {
  display: grid;
  grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr);
  gap: clamp(30px, 7vw, 90px);
  align-items: start;
}
.solution-context p,
.family-intro p { color: var(--color-text-muted); }
.solution-choice { align-items: center; }
.solution-choice h2 { max-width: 22ch; }
.solution-choice .cluster { justify-content: flex-end; }

/* The hub cards have slightly more presence than family cards. */
.solution-hub-card { min-height: 205px; }
.solution-hub-card h2 { font-size: clamp(1.35rem, 2vw, 1.8rem); }

/* Final homepage close: two clear cards instead of two white strips. */
.home-statement__inner { max-width: 920px; text-align: center; margin-inline: auto; }
.home-statement__inner h2 { max-width: 27ch; margin-inline: auto; }
.home-statement__inner .text-lead { margin-inline: auto; }
.home-close { background: #FFF9F3; border-top: 1px solid #F1C29F; padding-block: 68px; }
.home-close__heading { margin-bottom: 28px; }
.home-close__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.home-close-card {
  min-height: 270px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid #F1C29F;
  border-bottom: 5px solid var(--color-orange);
}
.home-close-card--orange { background: #FFF1E5; }
.home-close-card--navy { background: var(--color-navy); border-color: var(--color-navy); border-bottom-color: var(--color-red); }
.home-close-card h3 { font-size: clamp(1.45rem, 2.4vw, 2rem); }
.home-close-card--navy h3,
.home-close-card--navy p { color: #FFFFFF; }
.home-close-card--navy .eyebrow { color: #FFB36D; }
.home-close-card__link { color: #FFFFFF; font-weight: 800; }
.home-close-card__link:hover { color: #FFB36D; text-decoration: none; }

/* WhatsApp: true right-edge vertical tab on desktop. */
.whatsapp-float {
  position: fixed;
  z-index: 450;
  right: 0;
  top: 52%;
  transform: translateY(-50%);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  width: 74px;
  padding: 16px 8px;
  background: #0E7A4A;
  color: #FFFFFF;
  border-radius: 9px 0 0 9px;
  box-shadow: 0 10px 28px rgba(11,31,51,.18);
}
.whatsapp-float:hover { background: #075F39; color: #FFFFFF; text-decoration: none; }
.whatsapp-float__icon { width: 29px; height: 29px; display: inline-grid; place-items: center; border: 2px solid #FFFFFF; border-radius: 50%; font-size: .68rem; line-height: 1; }
.whatsapp-float__label { writing-mode: vertical-rl; transform: rotate(180deg); font-size: .75rem; font-weight: 800; line-height: 1; white-space: nowrap; }

/* Buttons: warm orange primary, teal no longer dominates site actions. */
.btn-primary,
.btn-warm { background: var(--color-orange); border-color: var(--color-orange); color: #FFFFFF; }
.btn-primary:hover,
.btn-warm:hover { background: var(--color-red); border-color: var(--color-red); color: #FFFFFF; }
.btn-secondary { border-color: var(--color-navy); color: var(--color-navy); background: #FFFFFF; }
.btn-secondary:hover { border-color: var(--color-orange); color: var(--color-red); background: #FFF9F3; }
.btn-outline-light { border: 1px solid rgba(255,255,255,.72); color: #FFFFFF; background: transparent; }
.btn-outline-light:hover { background: #FFFFFF; color: var(--color-navy); border-color: #FFFFFF; }

@media (max-width: 900px) {
  .solution-hero__grid,
  .solution-context,
  .family-intro,
  .solution-choice,
  .focus-strip { grid-template-columns: 1fr; }
  .solution-family-grid,
  .solution-hub-grid,
  .module-grid { grid-template-columns: 1fr; }
  .solution-choice .cluster { justify-content: flex-start; }
}
@media (max-width: 767px) {
  .solution-hero { padding-block: 36px; }
  .solution-hero__grid { gap: 28px; }
  .solution-hero h1,
  .page-hero h1 { font-size: 2rem; }
  .home-close { padding-block: 48px; }
  .home-close__grid { grid-template-columns: 1fr; }
  .home-close-card { min-height: 235px; padding: 24px; }
  .whatsapp-float { top: auto; bottom: 18px; transform: none; right: 14px; width: auto; min-height: 0; flex-direction: row; border-radius: 999px; padding: 11px 14px 11px 11px; }
  .whatsapp-float__label { writing-mode: horizontal-tb; transform: none; font-size: .78rem; }
}


/* =========================================================
   NIVENTO FINAL VISUAL SYSTEM
   Compact corporate scale, warm colour rhythm, no grey wash.
========================================================= */
:root{
 --color-navy:#0B1F33;
 --color-navy-deep:#071522;
 --color-charcoal:#13283A;
 --color-teal:#159C9C;
 --color-teal-deep:#0D7777;
 --color-orange:#E77A2F;
 --color-red:#B84A45;
 --color-offwhite:#FFF8F1;
 --color-mist:#FFF1E5;
 --color-sand:#F3E5D7;
 --color-bg:#FFFFFF;
 --color-text:#18344C;
 --color-text-muted:#36546C;
 --color-heading:#0B1F33;
 --color-text-inverse:#FFFFFF;
 --color-border:#E9D6C5;
 --color-border-strong:#D8B79A;
 --shadow-card:0 5px 18px rgba(11,31,51,.06);
 --shadow-card-hover:0 10px 26px rgba(11,31,51,.10);
 --text-xs:.75rem;
 --text-sm:.875rem;
 --text-base:1rem;
 --text-md:1.05rem;
 --text-lg:1.25rem;
 --text-xl:1.55rem;
 --text-2xl:2rem;
 --text-3xl:2.7rem;
 --text-4xl:3.25rem;
 --leading-tight:1.16;
 --leading-normal:1.55;
 --leading-relaxed:1.65;
 --weight-regular:400;
 --weight-medium:500;
 --weight-semibold:600;
 --weight-bold:700;
 --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.6rem;--space-7:2.25rem;--space-8:3rem;--space-9:4rem;
 --radius-sm:6px;--radius-md:12px;--radius-lg:18px;
}
body{font-family:var(--font-secondary);font-size:16px;line-height:1.55;color:var(--color-text);background:#fff}
h1,h2,h3,h4,h5,h6{font-family:var(--font-primary);font-weight:600;line-height:1.16;color:var(--color-heading);letter-spacing:-.02em}
h1{font-size:clamp(2rem,3.5vw,3.25rem)}h2{font-size:clamp(1.55rem,2.5vw,2rem)}h3{font-size:clamp(1.2rem,1.7vw,1.55rem)}h4{font-size:1.1rem}
.display-hero{font-size:clamp(2rem,3.8vw,3.25rem)!important}
.text-lead{font-size:1.05rem;line-height:1.6;color:var(--color-text-muted)}
p{color:var(--color-text);line-height:1.6}
.section{padding-block:2.75rem}.section-tight{padding-block:2rem}.section-mist,.section-warm{background:var(--color-offwhite)}.section-navy{background:var(--color-navy)}
.page-hero{padding-block:2.75rem!important;min-height:0!important}.page-hero--compact{padding-block:2.2rem!important}.page-hero h1{max-width:20ch}.page-hero__intro{max-width:68ch}
.section-heading-row{gap:2rem;margin-bottom:1.75rem}.section-heading-row h2{margin-bottom:.65rem}
.card-link,.module-card,.solution-family-card,.solution-hub-card,.assessment-centre-card,.home-close-card,.result-card{border:1px solid var(--color-border);box-shadow:var(--shadow-card);border-radius:var(--radius-md);background:#fff}
.module-card,.solution-family-card,.solution-hub-card,.assessment-centre-card{padding:1.35rem!important;min-height:0!important;border-bottom:3px solid var(--color-orange);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.module-card:hover,.solution-family-card:hover,.solution-hub-card:hover,.assessment-centre-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card-hover);border-color:var(--color-border-strong)}
.module-grid,.solution-family-grid,.solution-hub-grid,.assessment-centre-grid{gap:1rem!important}.solution-family-grid,.solution-hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.solution-hub-card h2,.solution-family-card h3,.module-card h3{font-size:1.25rem!important}.assessment-centre-card h3{font-size:1.25rem!important}.assessment-centre-card p,.module-card p,.solution-family-card p{font-size:.94rem;line-height:1.55}
.solution-hero{position:relative;min-height:410px!important;padding:0!important;display:flex;align-items:stretch;overflow:hidden;background:var(--color-navy)}.solution-hero__grid{position:relative;z-index:2;width:100%;min-height:410px!important;display:flex!important;align-items:center!important}.solution-hero__grid>div:first-child{width:53%;padding-block:2.5rem}.solution-hero__visual{position:absolute!important;inset:0 0 0 28%!important;width:auto!important}.solution-hero__visual img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.solution-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.94) 34%,rgba(255,255,255,.35) 53%,rgba(255,255,255,0) 70%);z-index:1}.solution-hero .breadcrumb,.solution-hero .eyebrow,.solution-hero h1,.solution-hero .text-lead,.solution-hero .solution-hero__actions{position:relative;z-index:3}.solution-hero h1{font-size:clamp(2rem,3.5vw,3rem)!important;max-width:18ch}.solution-hero .text-lead{max-width:55ch;color:#18344C}.solution-hero--family{min-height:310px!important;background:var(--color-offwhite);color:var(--color-heading)}.solution-hero--family .solution-hero__grid{min-height:310px!important}.solution-hero--family .solution-hero__grid>div:first-child{width:100%;padding-block:2.2rem}.solution-hero--family::after{display:none}.solution-hero--family h1{font-size:clamp(1.9rem,3vw,2.65rem)!important}
.solution-hero__actions{gap:1rem}.text-action{font-weight:600}
.home-close{padding-block:2.5rem!important;background:#fff!important;border-top:1px solid var(--color-border)}.home-close__grid{gap:1rem}.home-close-card{min-height:190px;padding:1.35rem!important}.home-close-card--orange{background:var(--color-mist)}.home-close-card--navy{background:var(--color-navy)}
.faq-section .faq-list details{border-bottom:1px solid var(--color-border);padding:.85rem 0}.faq-section h2{margin-bottom:1.25rem}
.site-footer{color:#fff}.site-footer *{color:inherit}.site-footer a{color:#fff}.site-footer__copyright,.footer-copyright{color:#fff!important;opacity:1!important}
/* Legal and editorial reading scale */
.legal-content,.legal-page .container,.legal-main{max-width:820px!important;margin-inline:auto!important}.legal-content h1,.legal-page h1{font-size:2.25rem!important}.legal-content h2,.legal-page h2{font-size:1.45rem!important;margin-top:2rem}.legal-content h3,.legal-page h3{font-size:1.15rem!important}.legal-content p,.legal-page p,.legal-content li,.legal-page li{font-size:1rem;line-height:1.7}.legal-content{text-align:left!important}
/* Assessment centre */
.assessment-page{background:#fff}.assessment-stage{background:var(--color-offwhite)}.assessment-hero{max-width:920px}.assessment-hero h1{font-size:clamp(2rem,3.3vw,3rem)!important;max-width:20ch}.assessment-meta{font-size:.9rem;color:var(--color-text-muted);margin-top:.65rem}.assessment-progress{margin-bottom:1rem}.assessment-progress__top{display:flex;justify-content:space-between;gap:1rem;font-size:.82rem;font-weight:600;color:var(--color-navy);margin-bottom:.45rem}.assessment-progress__track{height:5px;background:#F0DCCB;border-radius:999px;overflow:hidden}.assessment-progress__track span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--color-orange),var(--color-red));transition:width .2s ease}.assessment-form-card{background:#fff;border:1px solid var(--color-border);border-radius:14px;box-shadow:var(--shadow-card);padding:1.65rem!important}.assessment-question__header{display:flex;align-items:center;gap:.65rem;margin-bottom:1rem}.assessment-question__number{font-family:var(--font-primary);font-size:.9rem;font-weight:700;color:var(--color-orange)}.assessment-question__dimension{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;color:var(--color-red)}.assessment-form-card h2{font-size:clamp(1.35rem,2.2vw,1.8rem)!important;max-width:46ch;margin-bottom:0}.assessment-question__separator{height:1px;background:var(--color-border);margin:1.35rem 0}.assessment-options{border:0;padding:0;margin:0;display:grid;gap:.6rem}.assessment-option{display:grid;grid-template-columns:38px 1fr;align-items:center;column-gap:.8rem;padding:.75rem .85rem;border:1px solid var(--color-border);border-radius:9px;background:#fff;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}.assessment-option:hover{border-color:var(--color-orange);background:var(--color-offwhite)}.assessment-option.is-selected{border-color:var(--color-orange);background:#FFF4E9;box-shadow:inset 3px 0 0 var(--color-orange)}.assessment-option input{position:absolute;opacity:0;pointer-events:none}.assessment-option__value{width:30px;height:30px;border:1px solid var(--color-border-strong);border-radius:50%;display:grid;place-items:center;font-weight:700;color:var(--color-navy);font-size:.9rem}.assessment-option.is-selected .assessment-option__value{background:var(--color-orange);border-color:var(--color-orange);color:#fff}.assessment-option__text{font-weight:600;font-size:.96rem;color:var(--color-navy)}.assessment-question__footer{display:flex;justify-content:space-between;align-items:center;margin-top:1.35rem;padding-top:1rem;border-top:1px solid var(--color-border)}.assessment-question__footer .btn:disabled{opacity:.4;cursor:not-allowed}.assessment-lead-card{background:#fff;border:1px solid var(--color-border);border-top:4px solid var(--color-orange);border-radius:14px;box-shadow:var(--shadow-card);padding:1.75rem}.assessment-lead-card h2{font-size:1.8rem}.form-grid{gap:1rem}.form-grid label{display:block;font-size:.84rem;font-weight:600;margin-bottom:.35rem;color:var(--color-navy)}.form-grid input,.form-grid select,.form-grid textarea{width:100%;padding:.75rem .8rem;border:1px solid var(--color-border-strong);border-radius:7px;background:#fff;color:var(--color-text);font:inherit}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:var(--color-orange);outline:2px solid rgba(231,122,47,.18)}
.result-summary{background:var(--color-navy);color:#fff;border-radius:14px;padding:1.75rem;margin-bottom:1rem}.result-summary h2,.result-summary p{color:#fff}.result-summary .eyebrow{color:#FFB36D}.result-summary__score{display:flex;align-items:baseline;gap:1rem;margin:.5rem 0}.result-summary__score strong{font-size:2.7rem;color:#fff}.result-summary__score span{font-weight:600;color:#FFD0A7}.result-profile{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:1.25rem}.result-profile div{border:1px solid rgba(255,255,255,.22);border-radius:9px;padding:.8rem}.result-profile span{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:#FFD0A7;margin-bottom:.25rem}.result-profile strong{font-size:.92rem;color:#fff}.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1rem}.result-card{padding:1.25rem}.result-card__top{display:flex;justify-content:space-between;gap:1rem;align-items:start}.result-card__top strong{font-size:1.15rem;color:var(--color-orange)}.score-bar{height:6px;background:#F0DCCB;border-radius:99px;overflow:hidden;margin:.7rem 0}.score-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--color-orange),var(--color-red))}.result-card p{font-size:.92rem}.result-card__guidance{font-weight:600;color:var(--color-navy)!important}.result-priority{border-left:4px solid var(--color-red);background:var(--color-mist);padding:1.25rem;margin:1rem 0 2rem}.result-priority h3{margin-bottom:.4rem}.result-responses h2{margin-bottom:.35rem}.result-responses details{border:1px solid var(--color-border);border-radius:9px;background:#fff;margin:.55rem 0;overflow:hidden}.result-responses summary{list-style:none;display:grid;grid-template-columns:44px 1fr auto;gap:.75rem;align-items:center;padding:.85rem 1rem;cursor:pointer;font-weight:600;color:var(--color-navy)}.result-responses summary::-webkit-details-marker{display:none}.result-responses summary span{color:var(--color-orange);font-size:.8rem}.result-responses summary b{font-size:.8rem;color:var(--color-red)}.result-responses details>div{border-top:1px solid var(--color-border);padding:.85rem 1rem;background:var(--color-offwhite)}.result-responses details p{font-size:.92rem}.assessment-next{margin-top:2rem;padding:1.5rem;background:#fff;border:1px solid var(--color-border);border-radius:12px;display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:center}.assessment-next h2{font-size:1.6rem}.assessment-next .cluster{justify-content:flex-end}
/* Header brand sizing */
.site-header__logo img{width:250px!important;height:auto!important;max-height:58px;object-fit:contain}.site-header__logo{display:flex;align-items:center}.site-header{min-height:72px}
/* Reduce inline-style damage on legacy pages */
[style*="font-size: 3"],[style*="font-size:3"],[style*="font-size: 4"],[style*="font-size:4"]{font-size:inherit!important}
@media(max-width:900px){.solution-hero__grid>div:first-child{width:62%}.solution-hero__visual{inset:0 0 0 38%!important}.solution-hero h1{font-size:2.15rem!important}.solution-family-grid,.solution-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.result-grid{grid-template-columns:1fr}}
@media(max-width:767px){.section{padding-block:2.15rem}.page-hero{padding-block:2rem!important}.page-hero h1,.assessment-hero h1{font-size:1.95rem!important}.solution-hero{min-height:430px!important}.solution-hero__grid{min-height:430px!important;align-items:flex-end!important}.solution-hero__grid>div:first-child{width:100%;padding:2rem 0 2.2rem}.solution-hero__visual{inset:0!important;opacity:.62}.solution-hero::after{background:linear-gradient(180deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.78) 46%,rgba(255,255,255,.98) 72%)}.solution-hero--family{min-height:250px!important}.solution-hero--family .solution-hero__grid{min-height:250px!important;align-items:center!important}.solution-hero--family .solution-hero__grid>div:first-child{padding-block:1.5rem}.solution-hero--family h1{font-size:1.9rem!important}.solution-family-grid,.solution-hub-grid,.assessment-centre-grid{grid-template-columns:1fr!important}.assessment-form-card{padding:1.2rem!important}.assessment-question__footer{gap:.75rem}.assessment-question__footer .btn{flex:1}.result-profile{grid-template-columns:1fr}.assessment-next{grid-template-columns:1fr}.assessment-next .cluster{justify-content:flex-start}.site-header__logo img{width:210px!important}}
/* Final tuning: distinguish warm sections without a grey wash. */
.section-mist{background:#FFFFFF!important}
.section-warm{background:#FFF1E5!important}
.section-sand{background:#F3E5D7!important}

/* Final compact homepage hero. Keep the image strong without making the page tall. */
.home-hero{padding-block:3.25rem!important}
.home-hero h1{font-size:clamp(2.15rem,3.8vw,3.35rem)!important;line-height:1.12!important;max-width:16ch!important}
.home-hero__inner{gap:2.5rem!important}
.home-hero__visual img{aspect-ratio:16/8.3!important}

/* Inner-page heroes: shorter, quieter, more corporate. */
.solution-hero{min-height:365px!important}.solution-hero__grid{min-height:365px!important}
.solution-hero--family{min-height:270px!important}.solution-hero--family .solution-hero__grid{min-height:270px!important}
.article-hero{padding-block:2.6rem!important}.article-hero h1{font-size:clamp(2rem,3.2vw,2.85rem)!important;line-height:1.15!important}

/* Legal pages should read like documents, not landing pages. */
.legal-page .page-hero{padding-block:2rem!important;background:#FFF1E5}
.legal-page .page-hero h1{font-size:2.15rem!important;font-weight:600!important}
.legal-page .page-hero .text-muted{font-size:.9rem!important}
.legal-content h2,.legal-page .legal-content h2{font-weight:600!important}

.footer-bottom p{color:#FFFFFF!important;font-size:.85rem!important;opacity:1!important}
.site-map-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem 1.5rem;list-style:none;margin:0;padding:0}
.site-map-list li{border-bottom:1px solid var(--color-border);padding:.5rem 0}
.site-map-list a{color:var(--color-navy);font-weight:500;font-size:.92rem}
.site-map-list a:hover{color:var(--color-red)}

/* Consistent card diet on remaining legacy/focused solution pages. */
.module-card,.flow-item,.solution-card,.card{box-shadow:var(--shadow-card)!important}
.module-card h3,.solution-card h3{font-weight:600!important}

@media(max-width:767px){
 .home-hero{padding-block:2.25rem!important}.home-hero h1{font-size:2.05rem!important}
 .solution-hero{min-height:390px!important}.solution-hero__grid{min-height:390px!important}
 .solution-hero--family{min-height:230px!important}.solution-hero--family .solution-hero__grid{min-height:230px!important}
 .legal-page .page-hero h1{font-size:1.85rem!important}
 .site-map-list{grid-template-columns:1fr}
}
/* =========================================================
   NIVENTO SITEWIDE WHATSAPP STANDARD
   Small circular icon-only control on every page.
   ========================================================= */
.whatsapp-float {
  position: fixed !important;
  right: 22px !important;
  bottom: 22px !important;
  top: auto !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  max-width: 52px !important;
  max-height: 52px !important;
  aspect-ratio: 1 / 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: #128C5A !important;
  color: #fff !important;
  text-decoration: none !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  z-index: 9999 !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.18) !important;
  transform: none !important;
  flex-direction: row !important;
}
.whatsapp-float:hover { background: #0F784D !important; color: #fff !important; }
.whatsapp-float__label { display: none !important; }
.whatsapp-float__icon {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  max-width: 28px !important;
  max-height: 28px !important;
  flex: 0 0 28px !important;
  display: grid !important;
  place-items: center !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  font-size: .62rem !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
}
@media (max-width: 768px) {
  .whatsapp-float {
    right: 16px !important;
    bottom: 16px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    max-width: 48px !important;
    max-height: 48px !important;
  }
  .whatsapp-float__icon {
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;
    min-height: 25px !important;
    max-width: 25px !important;
    max-height: 25px !important;
    flex-basis: 25px !important;
  }
}


/* JOIN US OPPORTUNITY CARDS */
.join-opportunities{padding-top:2.8rem;padding-bottom:3rem}.join-opportunities .section-heading{max-width:760px;margin-bottom:1.5rem}.join-opportunity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.join-opportunity-card{position:relative;min-height:310px;padding:1.45rem;border:1px solid var(--color-border);border-radius:14px;box-shadow:var(--shadow-card);overflow:hidden}.join-opportunity-card--white{background:#fff}.join-opportunity-card--sand{background:#fff6ec;border-color:#f0d8c2}.join-opportunity-card--navy{background:var(--color-navy);color:#fff;border-color:var(--color-navy)}.join-opportunity-card--navy p:not(.eyebrow),.join-opportunity-card--navy h3{color:#fff}.join-opportunity-card .eyebrow{margin-bottom:.45rem}.join-opportunity-card__number{position:absolute;right:1.1rem;top:1rem;font-size:.75rem;font-weight:800;letter-spacing:.08em;color:var(--color-orange)}.join-opportunity-card h3{font-size:1.35rem!important;max-width:18ch;margin-bottom:.7rem}.join-opportunity-card p{font-size:.92rem;line-height:1.58}.join-opportunity-card__note{margin-top:1rem;padding-top:.8rem;border-top:1px solid rgba(10,37,64,.13);font-weight:700}.join-opportunity-card--navy .join-opportunity-card__note{border-top-color:rgba(255,255,255,.2)}
@media(max-width:900px){.join-opportunity-grid{grid-template-columns:1fr 1fr}.join-opportunity-card--navy{grid-column:1/-1}}
@media(max-width:640px){.join-opportunity-grid{grid-template-columns:1fr}.join-opportunity-card--navy{grid-column:auto}.join-opportunity-card{min-height:0}}


/* LEGAL PAGE SYNC */
.legal-page .page-hero{padding-block:2.25rem 2.5rem;background:linear-gradient(135deg,#fff8f1 0%,#f8efe7 100%)}.legal-page .page-hero h1{font-size:clamp(2rem,3.2vw,2.8rem)!important;max-width:18ch}.legal-page .legal-content{max-width:820px}.legal-page .legal-content a{color:var(--color-orange);font-weight:600}.legal-page .section{padding-block:2.8rem 4rem}.legal-page .site-footer{margin-top:0}


/* ENHANCED ASSESSMENT REPORT */
.report-dimension{margin:1.25rem 0 1.5rem}.report-dimension__head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--color-border)}.report-dimension__head h3{margin:0;font-size:1.2rem}.report-dimension__head>strong{font-size:1.15rem;color:var(--color-orange)}.report-dimension__reasoning{background:var(--color-offwhite);border-left:4px solid var(--color-orange);padding:.8rem 1rem;margin:.7rem 0;font-size:.92rem}.report-q-list details{border:1px solid var(--color-border);border-radius:9px;background:#fff;margin:.55rem 0;overflow:hidden}.report-q-list summary{list-style:none;display:grid;grid-template-columns:42px 1fr auto;gap:.75rem;align-items:center;padding:.82rem 1rem;cursor:pointer;color:var(--color-navy)}.report-q-list summary::-webkit-details-marker{display:none}.report-q-list summary span{color:var(--color-orange);font-size:.78rem;font-weight:800}.report-q-list summary em{font-style:normal;font-weight:600;font-size:.9rem}.report-q-list summary b{font-size:.78rem;color:var(--color-red)}.report-q-list details>div{border-top:1px solid var(--color-border);background:#fffaf5;padding:.8rem 1rem;font-size:.88rem}.report-q-list details p{margin:.3rem 0}