:root {
    /* Font Families */
    --font-display: neue-haas-grotesk-display, sans-serif;

    /* Weights */
    --weight-light: 300;
    --weight-regular: 400;
    --weight-medium: 600;
    --weight-bold: 700;
    --weight-black: 900;

      /* ── Brand ── */
  --color-primary:        #2e2a26;
  --color-primary-hover:  #4a433c;  /* mid warm brown, noticeably lighter */
  --color-secondary:      #7c746b;
  --color-secondary-soft: #d1ccc7; /* Muted, professional soft option */
  --color-secondary-tint: #e8e6e4; /* Ultra-soft background option */

  /* ── Status ── */
  --color-info:     #4a7fa5;  /* muted slate blue  */
  --color-error:    #b85040;  /* warm terracotta   */
  --color-warning:  #c4912a;  /* warm amber        */
  --color-success:  #4a8a6f;  /* warm muted green  */

  /* ── Backgrounds ── */
  --color-bg:       #ffffff;
  --color-bg-soft:  #f5f3f1;  /* warm off-white    */
  --color-bg-muted: #ede9e5;  /* warm light beige  */
  --color-bg-soft-alt: #f2f1f7;

  /*Helping Colors:*/

  /*--color-primary: #2e2a26;*/
  --color-primary-misty-charcoal: #4b463e;
  --color-primary-stone-grey: #6d685d;
  --color-primary-taupedo: #8e897e;
  --color-primary-dove-grey: #b1ada2;
  --color-primary-linen-white: #d4d1c9;

    /* --- TYPOGRAPHY SETTINGS --- */
  --font-sans:  "neue-haas-grotesk-display", sans-serif;
  --font-serif: "ivypresto-headline", serif;
  --font-mono: "input-mono", monospace;

    /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;

  --section-space-s: 2rem;
  --section-space-m: 3rem;
  --section-space-l: 4rem;

  /* Border radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  
  /* Word Breaking */
  --util-word-break-long: break-word;
  --util-word-break-normal: normal;

  /* Hyphenation */
  --util-hyphens-auto: auto;
  --util-hyphens-none: none;

  /* Text Alignment */
  --util-align-center: center;
  --util-align-left: left;
  --util-align-right: right;
  --util-align-justify: justify;

  /* Text Transform */
  --util-transform-caps: uppercase;
  --util-transform-lower: lowercase;
  --util-transform-initial: none;

  /* Text Decoration */
  --util-decoration-link: underline;
  --util-decoration-none: none;

  /* Letter Spacing */
  --util-letter-spacing-wide: 0.08em;
  --util-letter-spacing-tight: -0.015em;

  /* Font Weights */
  --font-light:   300;
  --font-regular: 400;
  --font-medium:  500;  /* sans only */
  --font-bold:    700;
  --font-black:   900;  /* sans only */

  /* Line Heights */
  --line-height-reset: 1;
  --line-height-compact: 0.92;
  --line-height-snug: 1.07;
  --line-height-tight: 1.14;
  --line-height-medium: 1.15;
  --line-height-relaxed: 1.43;
  --line-height-loose: 1.8;

  /* Widths */
  --width-xs: 65%;
  --width-sm: 70%;
  --width-md: 75%;
  --width-lg: 80%;
  --width-xl: 90%;
  --width-full: 100%;
  --width-half: 50%;

}

@supports (font-size: clamp(1rem, 1vi, 1rem)) {
  :root {
		--text-xs: clamp(0.79rem, 0.05vi + 0.78rem, 0.82rem);
		--text-s: clamp(0.89rem, 0.14vi + 0.86rem, 0.99rem);
		--text-m: clamp(1rem, 0.27vi + 0.95rem, 1.19rem);
		--text-l: clamp(1.13rem, 0.43vi + 1.04rem, 1.43rem);
		--text-xl: clamp(1.27rem, 0.63vi + 1.14rem, 1.71rem);
  }
}
/* For browsers that don't support clamp */
@supports not (font-size: clamp(1rem, 1vi, 1rem)) {
  :root {
		--text-xs: 0.79rem;
		--text-s: 0.89rem;
		--text-m: 1rem;
		--text-l: 1.13rem;
		--text-xl: 1.27rem;
  }
  @media screen and (min-width: 1440px) {
    :root {
			--text-xs: 0.82rem;
			--text-s: 0.99rem;
			--text-m: 1.19rem;
			--text-l: 1.43rem;
			--text-xl: 1.71rem;
    }
  }
}

/* For browsers that support clamp  */
@supports (font-size: clamp(1rem, 1vi, 1rem)) {
  :root {
		--headings-h6: clamp(0.8rem, -0.04vi + 0.81rem, 0.77rem);
		--headings-h5: clamp(1rem, 0.05vi + 0.99rem, 1.03rem);
		--headings-h4: clamp(1.25rem, 0.18vi + 1.21rem, 1.38rem);
		--headings-h3: clamp(1.56rem, 0.39vi + 1.49rem, 1.83rem);
		--headings-h2: clamp(1.95rem, 0.7vi + 1.81rem, 2.44rem);
		--headings-h1: clamp(2.44rem, 1.16vi + 2.21rem, 3.26rem);
		--headings-hero-title: clamp(3.05rem, 1.84vi + 2.68rem, 4.34rem);
  }
}
/* For browsers that don't support clamp */
@supports not (font-size: clamp(1rem, 1vi, 1rem)) {
  :root {
		--headings-h6: 0.8rem;
		--headings-h5: 1rem;
		--headings-h4: 1.25rem;
		--headings-h3: 1.56rem;
		--headings-h2: 1.95rem;
		--headings-h1: 2.44rem;
		--headings-hero-title: 3.05rem;
  }
  @media screen and (min-width: 1440px) {
    :root {
			--headings-h6: 0.77rem;
			--headings-h5: 1.03rem;
			--headings-h4: 1.38rem;
			--headings-h3: 1.83rem;
			--headings-h2: 2.44rem;
			--headings-h1: 3.26rem;
			--headings-hero-title: 4.34rem;
    }
  }
}

/* general css */

.one-column-content ul,
.special-mono-font-content ul {
  margin-inline-start: 1.3rem!important;
  margin-bottom: 1.5rem!important;
}

.one-column-content ul li,
.special-mono-font-content ul li {
  margin-bottom: 0rem!important;
}

/* Header CSS */

/* ── Logo Size ── */
.main-logo svg {
  height: 60px;
  width: auto;
}

@media (max-width: 1024px) {
  .main-logo svg {
    height: 40px;
  }
}

/* Social Media */
/* Social Media Icons */
.social-media-icons {
    display: flex;
    align-items: center;
    gap: var(--space-1, 0.4rem);
}

.social-media-icons__item {
    display: inline-flex;
    color: var(--color-primary-hover) !important;
    transition: color 0.2s ease;
}

.social-media-icons__item svg {
    width: 2.5rem;
    height: 2.5rem;
    display: block;
}

.social-media-icons__item--linkedin:hover  { color: #0a66c2 !important; }
.social-media-icons__item--facebook:hover  { color: #1877f2 !important; }
.social-media-icons__item--instagram:hover { color: #e1306c !important; }
.social-media-icons__item--x:hover         { color: #000000 !important; }
.social-media-icons__item--twitter:hover   { color: #1da1f2 !important; }
.social-media-icons__item--youtube:hover   { color: #ff0000 !important; }
.social-media-icons__item--tiktok:hover    { color: #010101 !important; }
.social-media-icons__item--pinterest:hover { color: #e60023 !important; }
.social-media-icons__item--whatsapp:hover  { color: #25d366 !important; }
.social-media-icons__item--substack:hover  { color: #ff6719 !important; }

.social-icons-mobile .social-media-icons {
    justify-content: center;
}

.social-icons-mobile .social-media-icons__item {
    color: var(--color-white) !important; /* or whatever color you need */
}

.social-icons-mobile .social-media-icons__item--linkedin:hover  { color: #0a66c2 !important; }
.social-icons-mobile .social-media-icons__item--substack:hover  { color: #ff6719 !important; }

.social-icons-mobile .social-media-icons {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}


/* 1. Remove or hide the ripple container entirely */
.w-nav-anchor .ripple-container {
    display: none !important;
}

/* 2. Remove any background applied on active or focus states */
.w-nav-anchor:active,
.w-nav-anchor:focus {
    background-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Mobile navigation */
.mobile-navigation .w-nav-list,
.w-nav.type_mobile.m_layout_fullscreen .w-nav-list.level_1.mobile-navigation {
  height: auto !important;
  min-height: auto !important;
  bottom: auto !important;
}

.mobile-navigation .w-nav-list li {
	margin-top: 0!important;
}

.mobile-navigation ul.w-nav-list {
	padding-top: 0!important;
	padding-left: 1.5rem!important;
}

.mobile-navigation-section {
  padding-top: var(--space-5);
  padding-bottom: var(--space-5);
}

.mobile-navigation-section .vc_column-inner > .wpb_wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.8rem;
}

.mobile-navigation-section ul.menu {
  font-size: var(--headings-h2);
  font-family: var(--font-display);
  font-weight: var(--font-bold);
}

.mobile-navigation-section .mobile-navigation-logo {
  height: 60px;
  width: auto;
}

/* Mobile-first: Default for smartphones and tablets (100% width) */
.w-image.infographics {
    width: 100%;
    margin: 0 auto;
}

.w-image.infographics img {
    width: 100%;
    height: auto;
    display: block;
}

/* Desktop and Laptop (1024px and up) */
@media (min-width: 1024px) {
    .w-image.infographics {
        width: 70%;
    }
}

/* ── Logo Colors ── */
.main-logo .logo-primary {
  fill: var(--color-primary, #2e2a26);
  transition: fill 0.4s ease;
}

.main-logo .logo-secondary {
  fill: var(--color-secondary, #7c746b);
  transition: fill 0.4s ease;
}

.main-logo a:hover .logo-primary {
  fill: var(--color-secondary, #7c746b);
}

.main-logo a:hover .logo-secondary {
  fill: var(--color-primary, #2e2a26);
}

.main-logo a {
  display: block;
  line-height: 0;
}

/* Section CSS */
.hero-section {
  min-height: 80dvh;
  padding-block: var(--section-space-l);
  padding-top: 60px;
}

@media (min-width: 1024px) {
  .hero-section {
    padding-top: 80px;
  }
}

.hero-section .l-section-h {
  display: flex;
  align-items: center;
  min-height: inherit;
}

.section-title {
  color: var(--color-bg-soft,  #f5f3f1);
  font-family: var(--font-serif);
  font-weight: var(--font-black);
  width: 100%;
}

.section-intro {
  color: var(--color-bg-soft,  #f5f3f1);
  font-size: var(--text-l);
  font-weight: var(--font-light);
  font-family: var(--font-sans);
  width: 100%;
}

@media (min-width: 1024px) {
  .section-title,
  .section-intro {
    width: 70%;
  }
}

.content-section {
  padding-block: var(--section-space-l);
  height: auto;
}

.two-column-content .wpb_wrapper {
  columns: 1;
  font-size: var(--text-s);
  font-weight: var(--font-medium);
  font-family: var(--font-sans);
}

@media (min-width: 1024px) {
  .two-column-content .wpb_wrapper {
    columns: 2;
    gap: 2rem;
  }
}

.normal-bg-section {
  padding-block: var(--section-space-l);
  min-height: 70dvh;
}

.normal-bg-section .l-section-h {
  display: flex;
  align-items: center;
  min-height: inherit;
}

.one-column-content .wpb_wrapper {
  columns: 1;
  font-size: var(--text-s);
  font-weight: var(--font-medium);
  font-family: var(--font-sans);
}

@media (min-width: 1024px) {
  .one-column-content .wpb_wrapper {
    columns: 1;
  }
}

.content-section .vc_column-inner > .wpb_wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}


@media (min-width: 1024px) {
.content-section .vc_column-inner > .wpb_wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}
}

.bg-section {
  min-height: 80dvh;
  padding-block: var(--section-space-l);
}

.bg-section .l-section-h {
  display: flex;
  align-items: center;
  min-height: inherit;
}

.dark-section {

}

.dark-section {
  height: auto;
  padding-block: var(--section-space-l);
  background: var(--color-primary-hover, #4a433c);
}

.dark-section-title {

}

.framework-section {
  height: auto;
  padding-block: var(--section-space-m);
  background: var(--color-bg-soft, #f5f3f1);
}

.framework-stage-title {
  font-size: var(--text-s);
  color: var(--color-primary-hover, #4a433c);
}

.framework-stage-content {
  font-size: var(--text-xs);
  color: var(--color-primary, #2e2a26);
}

.stages-grid .w-grid-item-h {
  padding: var(--space-5);
  background: var(--color-secondary-soft, #d1ccc7);
}

.stages-grid .w-grid-item-h p {
  margin-bottom: 0.7rem;
}

.stages-grid .w-grid-item-h ul {
  margin-bottom: 0!important;
  margin-left: 1.3rem!important;
}

.engagement-format-section {
  height: auto;
  padding-block: var(--section-space-l);
  background: var(--color-bg-soft, #f5f3f1);
}

.engagement-format-sub-title {
  font-size: var(--text-l);
  color: var(--color-primary-hover, #4a433c);
}

.engagement-format-title {
  font-size: var(--text-m);
  color: var(--color-primary-hover, #4a433c);
}

.engagement-format-content {
  font-size: var(--text-s);
  color: var(--color-primary, #2e2a26);
}

.engagement-format-grid .w-grid-item-h {
  padding: var(--space-5);
  background: var(--color-secondary-soft, #d1ccc7);
}

.stack-ai-economy-section {
  height: auto;
  padding-block: var(--section-space-l);
  background: var(--color-bg-soft, #f5f3f1);
}

.stack-ai-economy-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .stack-ai-economy-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}
}

.narrative-stack-sub-title {
  font-size: var(--text-l);
  width: 100%;
  text-align: center;
}

@media (min-width: 1024px) {
.narrative-stack-sub-title {
  font-size: var(--text-l);
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
}

.machine-reading-section {
  height: auto;
  padding-block: var(--section-space-l);
  background: var(--color-bg-soft, #f5f3f1);
}

.machine-reading-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}


@media (min-width: 1024px) {
.machine-reading-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}
}

h4.special-mono-font {
  font-family: var(--font-mono);
  font-weight: var(--font-bold);
  font-size: var(--text-s);
  opacity: 0.8;
}

.special-mono-font-content {
  font-family: var(--font-mono);
  font-weight: var(--font-regular);
  font-size: var(--text-xs);
  opacity: 0.8;
}

.special-wrapper {
  padding: 1.5rem;
  background: #FFFFFF;
}

.about-us-section {
  padding-block: var(--section-space-m);
  background: var(--color-primary);
  color: var(--color-bg-soft, #f5f3f1);
}

.about-us-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .about-us-inner-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem;
} 
}

.about-us-sub-title {
  font-size: var(--text-l);
  width: 100%;
  text-align: center;
  color: var(--color-bg-soft, #f5f3f1);
}

@media (min-width: 1024px) {
.about-us-sub-title {
  font-size: var(--text-l);
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  color: var(--color-bg-soft, #f5f3f1);
}
}

.about-us-inner-wrapper h4 {
  font-size: var(--text-m);
  color: var(--color-bg-soft, #f5f3f1);
}

/* Footer CSS */
.footer-section {
  padding-block: var(--section-space-s);
  background: var(--color-bg-soft,  #f5f3f1);
}

.footer-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .footer-inner-wrapper {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 3rem;
}
}

/* FAQ Page css */
.faq-hero-section {
  padding-block: var(--section-space-l);
  background: var(--color-primary, #2e2a26);
}


.faq-main-content-section {
  padding-block: var(--section-space-l);
  height: auto;
}

.narrative-architecture .eg-panel p,
.paprs-methods .eg-panel p,
.the-narrative-stack-of-the-ai-economy .eg-panel p,
.working-with-papr .eg-panel p,
.executive-use-cases .eg-panel p,
.peter-anderson-on-linkedin .eg-panel p,
.negotiating-attention-on-substack .eg-panel p {
    font-size: var(--fs-xs);
    color: var(--color-primary);
    font-family: var(--font-sans);
    line-height: var(--lh-base);
    font-weight: var(--fw-regular);
}

.narrative-architecture .eg-summary,
.paprs-methods .eg-summary,
.the-narrative-stack-of-the-ai-economy .eg-summary,
.working-with-papr .eg-summary,
.executive-use-cases .eg-summary,
.peter-anderson-on-linkedin .eg-summary,
.negotiating-attention-on-substack .eg-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 1.3rem !important;
    border-radius: 9999px;
    border: 0;
    font-size: var(--fs-xs);
    font-family: var(--font-sans);
    line-height: var(--lh-snug);
    color: var(--color-primary);
    background: var(--color-secondary-soft, #d1ccc7);
    transition: background 0.3s ease;
}

/* Ensure the icon has physical dimensions */
.eg-accordion-css .eg-acc-icon i {
    display: inline-block !important;
    font-size: 1.5rem !important; /* Force the icon to take up space */
    line-height: 1 !important;
    font-style: normal !important;
    vertical-align: middle !important;
}

.faq-main-content-section h2 {
  font-size: var(--headings-h3);
  text-align: center;
}

.faq-main-content-inner-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .faq-main-content-inner-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
}
}

.privacy-policy-section {
  padding-block: var(--section-space-l);
  height: auto;
}