.elementor-kit-8{--e-global-color-primary:#121211;--e-global-color-secondary:#1f7a73;--e-global-color-text:#6D6E70;--e-global-color-accent:#CF3339;--e-global-color-off-white:#F3F3F3;--e-global-color-action-hover:#17605a;--e-global-color-np-teal:#3AB3AA;--e-global-color-faint:#909193;--e-global-color-8fa63d8:#7FD6CE;--e-global-color-3bfbceb:#F3F3F3;--e-global-color-cf2c1e7:#F3F3F3AD;--e-global-color-c14756d:#F2F3F3C7;--e-global-typography-primary-font-family:"Newsreader";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Newsreader";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Plus Jakarta Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Plus Jakarta Sans";--e-global-typography-accent-font-weight:500;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ═══════════════════════════════════════════════════════════════════════
   Jui Trivedi — M&A Speaker Site · COMPLETE STYLESHEET FOR ELEMENTOR
   Assembled from the design handoff (tokens/tokens.css + reference/styles.css)
   v1.0 handoff · 2026-08-12 — do not edit values; they are client-approved.

   Paste this whole file into ONE of:
     · Elementor Pro → Site Settings → Custom CSS
     · Appearance → Customize → Additional CSS
     · or hand it to Angie with Prompt 1 of the prompt pack.

   Swap the @import for self-hosted fonts before production launch.
   ═══════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,700&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

/* =========================================================================
   Jui Trivedi — Speaker Site
   Design token spec  ·  v1.0  ·  2026-08-12
   Derived from the Next Point Design System, extended with the
   speaker-site teal action ramp.

   Load this file once, globally, before any component CSS.
   Every value in the reference build resolves to a token here.
   ========================================================================= */

:root {
  /* ---------------------------------------------------------------------
     1. COLOR — brand
     --------------------------------------------------------------------- */
  --c-ink:              #121211;  /* NP Not Black — dark sections, body ink */
  --c-red:              #CF3339;  /* NP Red — the motif point, accent dots  */
  --c-red-dark:         #721417;  /* NP Dark Red — red-on-red, hover depth  */
  --c-teal:             #3AB3AA;  /* NP Teal — eyebrows on dark surfaces    */
  --c-off-white:        #F3F3F3;  /* NP Off White — section bg, dark-bg ink */
  --c-gray:             #6D6E70;  /* NP Dark Gray — secondary body copy     */
  --c-white:            #ffffff;

  /* ---------------------------------------------------------------------
     2. COLOR — action ramp (site extension of NP Teal)
     Red is reserved for the motif/accent marks; teal carries all CTAs.
     --------------------------------------------------------------------- */
  --c-action:           #1f7a73;  /* primary button fill, light-bg eyebrows */
  --c-action-hover:     #17605a;
  --c-action-tint:      #e4f5f3;  /* tag / pill background on white         */
  --c-action-on-dark:   #7fd6ce;  /* teal text on ink (hero subhead)        */
  --c-action-on-teal:   #c7ece7;  /* label text on the teal band            */
  --c-action-on-card:   #6bcabf;  /* sector-card kicker on #1a1a19          */

  /* ---------------------------------------------------------------------
     3. COLOR — surfaces
     --------------------------------------------------------------------- */
  --s-page:             #ffffff;
  --s-alt:              #F3F3F3;  /* off-white alternating section          */
  --s-dark:             #121211;
  --s-dark-card:        #1a1a19;  /* card on a dark section                 */
  --s-dark-card-hover:  #1e1e1d;
  --s-teal-band:        #1f7a73;  /* the full-bleed teal section            */
  --s-image-placeholder:#e6e6e6;

  /* ---------------------------------------------------------------------
     4. COLOR — text
     --------------------------------------------------------------------- */
  --t-primary:          #121211;
  --t-body:             #1c1c1b;  /* large serif body                       */
  --t-body-2:           #2b2b2a;  /* credential rows                        */
  --t-body-3:           #3f3f3e;  /* card decks, quotes                     */
  --t-secondary:        #565655;  /* sans body copy                         */
  --t-muted:            #6D6E70;  /* card support copy                      */
  --t-faint:            #909193;  /* metadata, captions, footer legal       */

  --t-on-dark:          #F3F3F3;
  --t-on-dark-strong:   rgba(243,243,243,0.92);
  --t-on-dark-body:     rgba(243,243,243,0.78);
  --t-on-dark-muted:    rgba(243,243,243,0.68);
  --t-on-dark-faint:    rgba(243,243,243,0.50);
  --t-on-teal-body:     rgba(255,255,255,0.88);
  --t-on-teal-muted:    rgba(255,255,255,0.72);

  /* ---------------------------------------------------------------------
     5. COLOR — borders & rules
     --------------------------------------------------------------------- */
  --b-subtle:           #ececec;
  --b-default:          #e6e6e6;  /* every light card                       */
  --b-band:             #e4e4e4;  /* full-width section hairline            */
  --b-strong:           #d9dadb;  /* section divider rules                  */
  --b-rule:             #d5d6d7;  /* micro-motif line on light             */
  --b-on-dark:          #2b2b2a;
  --b-on-dark-hairline: rgba(243,243,243,0.12);
  --b-on-dark-ghost:    rgba(243,243,243,0.32);  /* ghost button rest       */
  --b-on-dark-ghost-h:  rgba(243,243,243,0.70);  /* ghost button hover      */
  --b-on-teal:          rgba(255,255,255,0.24);

  /* ---------------------------------------------------------------------
     6. TYPE — families
     Serif  = Bely Display / Bely (licensed). Newsreader is the shipped,
              open-licence substitute. Swap the @font-face, keep the token.
     Sans   = Plus Jakarta Sans (exact brand font, self-hosted).
     --------------------------------------------------------------------- */
  --font-serif: 'Newsreader', 'Bely Display', 'Bely', Georgia, 'Times New Roman', serif;
  --font-sans:  'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* ---------------------------------------------------------------------
     7. TYPE — size scale
     Serif display sizes are editorial and jump hard; sans sizes are a
     tight functional ramp. Mobile overrides live in styles.css.
     --------------------------------------------------------------------- */
  --fs-hero:      clamp(54px, 6.3vw, 88px); /* h1, serif 500                */
  --fs-d1:        52px;   /* teal-band stat figure, serif 400               */
  --fs-d2:        46px;   /* section h2, serif 700                          */
  --fs-d3:        44px;   /* teal-band h2, serif 400                        */
  --fs-d4:        40px;   /* about h2, serif 700                            */
  --fs-d5:        36px;   /* reel / testimonial h2, serif 500               */
  --fs-d6:        34px;   /* keynote card h3, serif 500                     */
  --fs-d7:        30px;   /* credential figure, wordmark, serif 500         */
  --fs-d8:        25px;   /* insight card h3, serif 500                     */
  --fs-d9:        24px;   /* long-form serif body, serif 500                */
  --fs-d10:       22px;   /* pull quote, dark tile copy, serif 500          */
  --fs-d11:       20px;   /* keynote card deck, header wordmark             */

  --fs-xl:        21px;   /* session card h4, sans 700                      */
  --fs-lg:        20px;   /* hero subhead, credential row, sans 600         */
  --fs-md:        18px;   /* long body, sans 400                            */
  --fs-base:      16px;   /* body copy, sans 400                            */
  --fs-sm:        15px;   /* card support copy, buttons, sans 400/600       */
  --fs-xs:        14px;   /* nav links, sector list copy, sans 500          */
  --fs-2xs:       13px;   /* eyebrows, stat labels, sans 700                */
  --fs-3xs:       12px;   /* metadata caps, sans 600                        */
  --fs-4xs:       11px;   /* tag pills, logo captions, sans 700             */
  --fs-5xs:       10px;   /* header sub-wordmark, sans 700                  */

  /* ---------------------------------------------------------------------
     8. TYPE — weight, leading, tracking
     --------------------------------------------------------------------- */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;

  --lh-flat:    1;
  --lh-hero:    0.94;
  --lh-display: 1.08;   /* serif h2                                        */
  --lh-tight:   1.14;
  --lh-snug:    1.34;
  --lh-normal:  1.5;
  --lh-body:    1.65;
  --lh-loose:   1.75;

  --ls-hero:   -0.045em;
  --ls-display:-0.02em;
  --ls-tight:  -0.01em;
  --ls-normal:  0;
  --ls-caps:    0.14em;  /* eyebrow labels                                 */
  --ls-caps-sm: 0.12em;  /* tag pills, stat labels                         */
  --ls-caps-lg: 0.20em;  /* header sub-wordmark                            */

  /* ---------------------------------------------------------------------
     9. SPACING — 8px base grid, with 2px half-steps where type demands it
     --------------------------------------------------------------------- */
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-7:  28px;
  --sp-8:  32px;
  --sp-9:  36px;
  --sp-10: 40px;
  --sp-11: 48px;
  --sp-12: 56px;
  --sp-13: 64px;
  --sp-14: 80px;
  --sp-15: 96px;   /* standard section padding-block (desktop)             */
  --sp-16: 104px;
  --sp-17: 112px;

  /* Composite rhythm */
  --section-y:        var(--sp-15);
  --section-y-mobile: var(--sp-12);
  --gutter:           var(--sp-6);
  --gutter-mobile:    var(--sp-5);
  --grid-gap:         var(--sp-5);   /* card grids                         */
  --grid-gap-lg:      var(--sp-11);  /* two-column editorial splits        */

  /* ---------------------------------------------------------------------
     10. LAYOUT
     --------------------------------------------------------------------- */
  --w-container:   1200px;
  --w-measure:     760px;   /* comfortable reading width                   */
  --w-narrow:      900px;   /* centered CTA section                        */
  --h-header:      68px;
  --h-header-mobile: 60px;
  --scroll-offset: 84px;    /* scroll-margin-top for anchored sections     */

  /* ---------------------------------------------------------------------
     11. RADIUS
     --------------------------------------------------------------------- */
  --r-sm:   6px;    /* buttons, inputs                                     */
  --r-md:  10px;    /* small cards, media frames                           */
  --r-lg:  12px;    /* primary cards                                       */
  --r-xl:  14px;    /* feature tiles                                       */
  --r-2xl: 16px;    /* about panel                                         */
  --r-pill: 999px;

  /* ---------------------------------------------------------------------
     12. ELEVATION
     Cards read as a 1px border + a very soft double shadow, never heavy.
     --------------------------------------------------------------------- */
  --shadow-hairline: 0 1px 3px rgba(18,18,17,0.06);
  --shadow-card:     0 1px 3px rgba(18,18,17,0.06), 0 18px 40px rgba(18,18,17,0.05);
  --shadow-card-lg:  0 1px 3px rgba(18,18,17,0.06), 0 20px 46px rgba(18,18,17,0.06);
  --shadow-hover-sm: 0 18px 44px rgba(18,18,17,0.10);
  --shadow-hover-md: 0 24px 54px rgba(18,18,17,0.11);
  --shadow-hover-lg: 0 26px 60px rgba(18,18,17,0.12);

  /* ---------------------------------------------------------------------
     13. MOTION
     --------------------------------------------------------------------- */
  --dur-fast:  160ms;
  --dur-med:   300ms;
  --dur-slow:  760ms;
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --lift-card:  translateY(-4px);
  --lift-card-sm: translateY(-3px);
  --press:      scale(0.98);

  /* ---------------------------------------------------------------------
     14. EFFECTS
     --------------------------------------------------------------------- */
  --hero-image-filter: grayscale(1) contrast(0.94) brightness(1.05) blur(0.5px);
  --portrait-filter:   grayscale(1) contrast(1.04);
  --hero-scrim: linear-gradient(90deg,
                  rgba(18,18,17,0.98) 0%,
                  rgba(18,18,17,0.90) 32%,
                  rgba(18,18,17,0.62) 62%,
                  rgba(18,18,17,0.30) 100%);
  --header-blur: blur(14px);
  --header-fill: rgba(18,18,17,0.82);
  --focus-ring:  2px solid var(--c-action);
  --focus-ring-on-dark: 2px solid var(--c-action-on-dark);
  --focus-offset: 3px;
}

/* ---------------------------------------------------------------------
   15. BREAKPOINTS  (custom properties can't be used in media queries —
   these are the canonical values; mirror them in your build config.)

     --bp-sm:  640px   single column, tightest gutters
     --bp-md:  860px   PRIMARY BREAKPOINT — all multi-column grids collapse,
                       desktop nav is replaced by the CTA only
     --bp-lg: 1024px   3-up grids step down to 2-up
     --bp-xl: 1200px   container max-width reached; layout stops growing
   --------------------------------------------------------------------- */
/* =========================================================================
   Jui Trivedi — Speaker Site · Reference build stylesheet
   Requires tokens.css to be loaded first. No value below is hard-coded
   except structural zeroes and 1px hairlines.

   Structure
     1  Reset & base
     2  Layout primitives      .container .section .grid .split
     3  Typography             .eyebrow .display-* .lede .body .meta
     4  Motif                  .motif + draw-in animation
     5  Buttons                .btn
     6  Tag                    .tag
     7  Cards                  .card and its variants
     8  Header
     9  Hero
    10  Section-specific blocks
    11  Footer
    12  Responsive             1024 / 860 / 640
    13  Reduced motion & print
   ========================================================================= */

/* 1 ── Reset & base ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--s-page);
  color: var(--t-primary);
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

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

a { color: var(--c-action); text-decoration: none; }
a:hover { color: var(--c-action-hover); }

:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: var(--r-sm);
}
.on-dark :focus-visible { outline: var(--focus-ring-on-dark); }

h1, h2, h3, h4, p, blockquote, figure { margin: 0; }


/* 2 ── Layout primitives ────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.container--narrow { max-width: var(--w-narrow); }

.section { padding-block: var(--section-y); }
.section--flush { padding-block: 0; }
.section--white { background: var(--s-page); color: var(--t-primary); }
.section--alt   { background: var(--s-alt);  color: var(--t-primary); }
.section--dark  { background: var(--s-dark); color: var(--t-on-dark); }
.section--teal  { background: var(--s-teal-band); color: var(--t-on-dark); }
/* Any section with an id is an in-page anchor target. */
.section[id] { scroll-margin-top: var(--scroll-offset); }

.grid { display: grid; gap: var(--grid-gap); }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }

/* Editorial two-column split: heading rail + reading column. */
.split {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: var(--grid-gap-lg);
  align-items: start;
}
.split--even  { grid-template-columns: 1fr 1fr; align-items: stretch; }
.split--media { grid-template-columns: 0.62fr 1fr; align-items: center; }
.split--wide  { grid-template-columns: 1.1fr 0.9fr; align-items: stretch; gap: var(--sp-7); }

.stack { display: flex; flex-direction: column; gap: var(--sp-5); }
.stack--tight { gap: var(--sp-4); }
.row { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }


/* 3 ── Typography ───────────────────────────────────────────────────── */
.eyebrow {
  display: block;
  font-family: var(--font-sans);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
  line-height: var(--lh-flat);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--c-action);
}
.eyebrow--on-dark { color: var(--c-teal); }
.eyebrow--on-teal { color: var(--c-action-on-dark); }

.display {
  font-family: var(--font-serif);
  letter-spacing: var(--ls-display);
  line-height: var(--lh-display);
  text-wrap: pretty;
}
.display--hero {
  font-size: var(--fs-hero);
  font-weight: var(--fw-medium);
  line-height: var(--lh-hero);
  letter-spacing: var(--ls-hero);
}
.display--section { font-size: var(--fs-d2); font-weight: var(--fw-bold); }
.display--light   { font-size: var(--fs-d3); font-weight: var(--fw-regular); line-height: 1.12; }
.display--about   { font-size: var(--fs-d4); font-weight: var(--fw-bold); line-height: 1.12; }
.display--panel   { font-size: var(--fs-d5); font-weight: var(--fw-medium); line-height: var(--lh-tight); }
.display--card    { font-size: var(--fs-d6); font-weight: var(--fw-medium); line-height: 1.1; letter-spacing: var(--ls-display); }
.display--note    { font-size: var(--fs-d8); font-weight: var(--fw-medium); line-height: 1.28; letter-spacing: var(--ls-tight); }

/* Long-form serif body — used in the "Why Jui" column. */
.serif-body {
  font-family: var(--font-serif);
  font-size: var(--fs-d9);
  font-weight: var(--fw-medium);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-tight);
  color: var(--t-body);
  text-wrap: pretty;
}
.serif-body + .serif-body { margin-top: var(--sp-5); }

.lede {
  font-size: var(--fs-lg);
  font-weight: var(--fw-semi);
  line-height: var(--lh-normal);
  color: var(--c-action-on-dark);
  max-width: 660px;
}
.body {
  font-size: var(--fs-base);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--t-secondary);
  max-width: var(--w-measure);
  text-wrap: pretty;
}
.body--lg { font-size: var(--fs-md); line-height: var(--lh-loose); }
.body--on-dark { color: var(--t-on-dark-muted); }
.body--on-teal { color: var(--t-on-teal-body); }
.body + .body { margin-top: var(--sp-4); }

.meta {
  font-size: var(--fs-3xs);
  font-weight: var(--fw-semi);
  line-height: var(--lh-normal);
  letter-spacing: var(--ls-caps-sm);
  text-transform: uppercase;
  color: var(--t-faint);
}
.meta--on-dark { color: var(--t-on-dark-faint); }

/* Small red/teal bullet used before credential and list rows. */
.dot {
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--c-red);
  width: 10px; height: 10px;
}
.dot--sm { width: 8px; height: 8px; background: var(--c-action); margin-top: 7px; }
.dot--xs { width: 7px; height: 7px; }
.dot--micro { width: 5px; height: 5px; background: var(--c-teal); }


/* 4 ── Motif ────────────────────────────────────────────────────────── */
/* The one piece of brand geometry: open circle → line → gap → red point.
   Three scales, all authored as inline SVG (see assets/motif.svg).       */
.motif { display: block; }
.motif--display { margin-block: var(--sp-1) 2px; }
.motif--rule    { margin-top: var(--sp-1); }
.motif--micro   { flex: 0 0 auto; }

@keyframes motif-draw   { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes motif-appear { from { opacity: 0; transform: scale(0.4); } to { opacity: 1; transform: scale(1); } }
@keyframes motif-fade   { from { opacity: 0; } to { opacity: 1; } }

/* Draw-in: circle fades, line draws toward the point, the point lands last. */
.motif__start { animation: motif-fade   240ms var(--ease-out) 480ms  both; }
.motif__line  { animation: motif-draw   640ms var(--ease-out) 600ms  both; }
.motif__point {
  animation: motif-appear 260ms var(--ease-out) 1280ms both;
  transform-box: fill-box;
  transform-origin: center;
}

/* Entrance reveal for hero content. */
@keyframes rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .rise   { animation: rise var(--dur-slow) var(--ease-out) both; }
  .rise-2 { animation-delay: 110ms; }
  .rise-3 { animation-delay: 210ms; }
  .rise-4 { animation-delay: 300ms; }
}


/* 5 ── Buttons ──────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-sans);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  line-height: var(--lh-flat);
  padding: var(--sp-4) var(--sp-7);
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard),
              border-color var(--dur-fast) var(--ease-standard),
              transform var(--dur-fast) var(--ease-standard);
}
.btn--primary { background: var(--c-action); color: var(--c-white); }
.btn--primary:hover { background: var(--c-action-hover); color: var(--c-white); }
.btn--primary:active { transform: var(--press); }

.btn--ghost {
  background: transparent;
  color: var(--t-on-dark);
  border-color: var(--b-on-dark-ghost);
}
.btn--ghost:hover {
  color: var(--t-on-dark);
  border-color: var(--b-on-dark-ghost-h);
  background: rgba(255,255,255,0.06);
}
.btn--ghost:active { transform: var(--press); }

/* Compact variant used in the sticky header. */
.btn--sm { font-size: var(--fs-2xs); padding: 10px 17px; }


/* 6 ── Tag ──────────────────────────────────────────────────────────── */
.tag {
  display: inline-flex;
  align-items: center;
  font-size: var(--fs-4xs);
  font-weight: var(--fw-bold);
  line-height: var(--lh-flat);
  letter-spacing: var(--ls-caps-sm);
  text-transform: uppercase;
  color: var(--c-action);
  background: var(--c-action-tint);
  padding: 6px 11px;
  border-radius: var(--r-pill);
}


/* 7 ── Cards ────────────────────────────────────────────────────────── */
.card {
  background: var(--s-page);
  border: 1px solid var(--b-default);
  border-radius: var(--r-lg);
  padding: var(--sp-9);
  box-shadow: var(--shadow-card);
  transition: transform var(--dur-med) var(--ease-out),
              box-shadow var(--dur-med) var(--ease-out),
              border-color var(--dur-med) var(--ease-out),
              background var(--dur-med) var(--ease-out);
}

/* 7a Keynote card — 2×2 grid, tag + serif title + deck + support line. */
.card--keynote {
  padding: 34px;
  min-height: 290px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: var(--shadow-card-lg);
}
.card--keynote:hover { transform: var(--lift-card); box-shadow: var(--shadow-hover-lg); }
.card__title { margin-top: var(--sp-5); }
.card__deck {
  margin-top: var(--sp-4);
  font-family: var(--font-serif);
  font-size: var(--fs-d11);
  font-weight: var(--fw-medium);
  line-height: 1.4;
  color: var(--t-body-3);
}
.card__support {
  margin-top: var(--sp-6);
  font-size: var(--fs-sm);
  line-height: 1.55;
  color: var(--t-muted);
}

/* 7b Session card — smaller 3-up tile, sans title only. */
.card--session {
  border-radius: var(--r-md);
  padding: var(--sp-7) 26px;
  min-height: 168px;
  box-shadow: none;
}
.card--session:hover {
  transform: var(--lift-card);
  box-shadow: var(--shadow-hover-sm);
  border-color: var(--b-strong);
}
.card--session h4 {
  font-size: var(--fs-xl);
  font-weight: var(--fw-bold);
  line-height: 1.25;
  letter-spacing: var(--ls-tight);
  color: var(--t-primary);
}
.card--session p {
  margin-top: var(--sp-3);
  font-size: var(--fs-sm);
  line-height: 1.55;
  color: var(--t-muted);
}

/* 7c Dark note tile — closes the session grid; not interactive. */
.card--note {
  background: var(--s-dark);
  border-color: var(--s-dark);
  border-radius: var(--r-md);
  padding: var(--sp-9) 30px;
  min-height: 168px;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--sp-5);
}
.card--note p {
  font-family: var(--font-serif);
  font-size: var(--fs-d10);
  font-weight: var(--fw-medium);
  line-height: 1.35;
  letter-spacing: var(--ls-tight);
  color: var(--t-on-dark);
  text-wrap: pretty;
}

/* 7d Sector card — on the dark section. */
.card--sector {
  background: var(--s-dark-card);
  border-color: var(--b-on-dark);
  border-radius: var(--r-lg);
  padding: var(--sp-7);
  box-shadow: none;
  display: flex;
  flex-direction: column;
}
.card--sector:hover { border-color: var(--c-action); background: var(--s-dark-card-hover); }
.card--sector h3 {
  font-size: var(--fs-d9);
  font-weight: var(--fw-bold);
  line-height: 1.1;
  letter-spacing: var(--ls-tight);
  color: var(--t-on-dark);
}
.card--sector .card__kicker {
  margin-top: var(--sp-2);
  font-size: 12.5px;
  font-weight: var(--fw-semi);
  line-height: 1.4;
  color: var(--c-action-on-card);
}
.card__signature {
  margin-top: var(--sp-5);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--b-on-dark);
}
.card__signature strong {
  display: block;
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1.3;
  color: var(--t-on-dark);
}
.card__signature p {
  margin-top: 6px;
  font-size: var(--fs-xs);
  line-height: var(--lh-normal);
  color: var(--t-on-dark-muted);
}
.card__list { margin-top: var(--sp-4); display: grid; gap: 9px; }
.card__list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13.5px;
  font-weight: var(--fw-medium);
  line-height: 1.35;
  color: var(--t-on-dark-body);
}

/* 7e Insight card — media / article. */
.card--insight {
  padding: 30px;
  min-height: 230px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 26px;
}
.card--insight:hover { transform: var(--lift-card-sm); box-shadow: var(--shadow-hover-md); }
.card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  border-top: 1px solid var(--b-subtle);
  padding-top: var(--sp-5);
}

/* 7f Panels — credentials, reel, testimonial. */
.panel {
  background: var(--s-page);
  border: 1px solid var(--b-default);
  border-radius: var(--r-xl);
  padding: var(--sp-10);
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--sp-8);
}
.panel--dark {
  background: var(--s-dark);
  border-color: var(--s-dark);
  color: var(--t-on-dark);
  box-shadow: none;
  min-height: 340px;
  gap: var(--sp-9);
}
.panel--credentials {
  border-radius: var(--r-lg);
  padding: 30px var(--sp-8);
  gap: var(--sp-5);
  height: 100%;
}
.credential {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-3);
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  line-height: var(--lh-normal);
  color: var(--t-body-2);
}


/* 8 ── Header ───────────────────────────────────────────────────────── */
.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--header-fill);
  backdrop-filter: var(--header-blur);
  -webkit-backdrop-filter: var(--header-blur);
  border-bottom: 1px solid var(--b-on-dark-hairline);
}
.site-header__inner {
  height: var(--h-header);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.wordmark { display: flex; flex-direction: column; gap: 3px; flex: 0 0 auto; }
.wordmark__name {
  font-family: var(--font-serif);
  font-size: var(--fs-d11);
  font-weight: var(--fw-medium);
  line-height: var(--lh-flat);
  letter-spacing: 0.01em;
  color: var(--t-on-dark);
}
.wordmark__role {
  font-size: var(--fs-5xs);
  font-weight: var(--fw-bold);
  line-height: var(--lh-flat);
  letter-spacing: var(--ls-caps-lg);
  text-transform: uppercase;
  color: var(--c-teal);
}
.site-nav { display: flex; align-items: center; gap: var(--sp-7); }
.site-nav a {
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  line-height: var(--lh-flat);
  color: rgba(243,243,243,0.82);
  transition: color var(--dur-fast) var(--ease-standard);
}
.site-nav a:hover { color: var(--c-white); }
.site-nav .btn { color: var(--c-white); }


/* 9 ── Hero ─────────────────────────────────────────────────────────── */
.hero {
  position: relative;
  background: var(--s-dark);
  color: var(--t-on-dark);
  overflow: hidden;
  min-height: 660px;
  display: flex;
  align-items: center;
}
.hero__media { position: absolute; inset: 0; z-index: 1; overflow: hidden; }
.hero__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 55% 42%;
  transform: scale(1.34);
  transform-origin: 40% 30%;
  filter: var(--hero-image-filter);
}
.hero__scrim { position: absolute; inset: 0; background: var(--hero-scrim); }
.hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-block: var(--sp-17) var(--sp-16);
}
.hero__content { max-width: 720px; display: flex; flex-direction: column; gap: var(--sp-5); }
.hero__proof { display: flex; align-items: center; gap: var(--sp-7); flex-wrap: wrap; margin-top: 2px; }
.hero__proof-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  line-height: 1.3;
  color: var(--t-on-dark-strong);
}
.hero__actions { display: flex; gap: var(--sp-3); flex-wrap: wrap; margin-top: 6px; }
.hero__audiences {
  margin-top: var(--sp-3);
  font-size: var(--fs-3xs);
  font-weight: var(--fw-semi);
  line-height: var(--lh-loose);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t-on-dark-faint);
  max-width: 640px;
}


/* 10 ── Section-specific blocks ─────────────────────────────────────── */

/* Stat trio on the teal band. */
.stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--grid-gap-lg);
  margin-bottom: var(--sp-13);
  padding-bottom: var(--sp-11);
  border-bottom: 1px solid var(--b-on-teal);
}
.stat { display: flex; flex-direction: column; gap: var(--sp-2); }
.stat__figure {
  font-family: var(--font-serif);
  font-size: var(--fs-d1);
  font-weight: var(--fw-regular);
  line-height: var(--lh-flat);
  letter-spacing: var(--ls-display);
  color: var(--t-on-dark);
  white-space: nowrap;
}
.stat__label {
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
  line-height: 1.3;
  letter-spacing: var(--ls-caps-sm);
  text-transform: uppercase;
  color: var(--c-action-on-teal);
}
.stat__note { font-size: var(--fs-xs); line-height: 1.45; color: var(--t-on-teal-muted); }

/* Credential figure strip under "Why Jui". */
.figures {
  margin-top: var(--sp-12);
  padding-top: var(--sp-9);
  border-top: 1px solid var(--b-strong);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-8);
}
.figure-row { display: flex; align-items: center; gap: var(--sp-4); }
.figure-row span:last-child {
  font-family: var(--font-serif);
  font-size: var(--fs-d7);
  font-weight: var(--fw-medium);
  line-height: 1.15;
  letter-spacing: var(--ls-tight);
  color: var(--t-primary);
}

/* About panel. */
.about-panel {
  background: var(--s-alt);
  border: 1px solid var(--b-default);
  border-radius: var(--r-2xl);
  padding: var(--sp-7);
}
.about-panel__media {
  height: 480px;
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--s-image-placeholder);
}
.about-panel__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 66% 38%;
  filter: var(--portrait-filter);
}

/* Press strip. */
.press-strip {
  background: var(--s-alt);
  border-block: 1px solid var(--b-band);
}
.press-strip__inner {
  padding-block: var(--sp-12);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--grid-gap-lg);
  flex-wrap: wrap;
}
.press-logos { display: flex; align-items: flex-start; gap: var(--sp-12); flex-wrap: wrap; }
.press-logo { display: flex; flex-direction: column; gap: 6px; align-items: center; text-align: center; }
.press-logo__mark {
  font-family: var(--font-serif);
  font-size: var(--fs-d7);
  font-weight: var(--fw-medium);
  line-height: 1.05;
  letter-spacing: var(--ls-tight);
  color: var(--t-primary);
}
.press-logo__caption {
  font-size: var(--fs-4xs);
  font-weight: var(--fw-semi);
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t-faint);
}

/* Reel placeholder. */
.reel-frame {
  aspect-ratio: 16 / 9;
  border: 1px dashed var(--b-on-dark-ghost);
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-4);
}
.reel-frame__play {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 2px solid rgba(243,243,243,0.5);
  display: flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}

/* Testimonial. */
.quote { display: flex; flex-direction: column; gap: var(--sp-5); }
.quote p {
  font-family: var(--font-serif);
  font-size: var(--fs-d10);
  font-weight: var(--fw-medium);
  line-height: 1.4;
  letter-spacing: var(--ls-tight);
  color: var(--t-body-3);
  text-wrap: pretty;
}

/* Closing CTA. */
.cta { text-align: center; }
.cta .motif { margin: 0 auto var(--sp-6); }
.cta h2 { max-width: var(--w-measure); margin-inline: auto; margin-top: var(--sp-4); line-height: 1.1; }
.cta .body { max-width: 640px; margin-inline: auto; margin-top: var(--sp-5); font-size: 17px; color: var(--t-on-dark-body); }
.cta .btn { margin-top: var(--sp-8); }
.cta .meta { margin-top: var(--sp-6); letter-spacing: var(--ls-caps); color: var(--t-on-dark-faint); }


/* 11 ── Footer ──────────────────────────────────────────────────────── */
.site-footer {
  background: var(--s-dark);
  border-top: 1px solid var(--b-on-dark);
}
.site-footer__inner {
  padding-block: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-5);
  flex-wrap: wrap;
}
.site-footer__name {
  font-family: var(--font-serif);
  font-size: var(--fs-d11);
  font-weight: var(--fw-medium);
  line-height: var(--lh-flat);
  color: var(--t-on-dark);
}
.site-footer__legal { font-size: var(--fs-2xs); line-height: var(--lh-normal); color: var(--t-faint); }


/* 12 ── Responsive ──────────────────────────────────────────────────── */

/* lg — 3-up grids become 2-up; the layout keeps its two-column editorial
   structure. Container padding is unchanged. */
@media (max-width: 1024px) {
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .split       { gap: var(--sp-10); }
  .split--wide { grid-template-columns: 1fr; }
  .about-panel__media { height: 400px; }
  .press-logos { gap: var(--sp-10); }
}

/* md — PRIMARY BREAKPOINT. Everything collapses to one column, the desktop
   nav is dropped in favour of the CTA, display type steps down. */
@media (max-width: 860px) {
  :root {
    --section-y: var(--section-y-mobile);
    --gutter: var(--gutter-mobile);
  }
  .grid--2, .grid--3, .split, .split--even, .split--media, .stats, .figures {
    grid-template-columns: 1fr;
  }
  .split, .split--even, .split--media { gap: var(--sp-8); }
  .stats { gap: var(--sp-8); margin-bottom: var(--sp-11); padding-bottom: var(--sp-9); }
  .figures { gap: var(--sp-5); margin-top: var(--sp-10); }

  .site-header__inner { height: var(--h-header-mobile); }
  .site-nav a:not(.btn) { display: none; }

  .hero { min-height: 0; }
  .hero__inner { padding-block: var(--sp-14) var(--sp-13); }
  .hero__media img { object-position: 62% 38%; transform: scale(1.5); }
  .hero__proof { gap: var(--sp-4); }
  .hero__actions .btn { flex: 1 1 100%; }

  .display--hero    { font-size: 38px; }
  .display--section,
  .display--light,
  .display--about   { font-size: 30px; }
  .display--panel   { font-size: 28px; }
  .display--card    { font-size: 26px; }
  .display--note    { font-size: 22px; }
  .serif-body       { font-size: 19px; line-height: 1.45; }
  .body--lg         { font-size: var(--fs-base); }
  .stat__figure     { font-size: 40px; }
  .figure-row span:last-child { font-size: 24px; }

  .card, .card--keynote, .card--insight { padding: var(--sp-6); }
  .card--keynote, .card--insight, .card--session, .card--note { min-height: 0; }
  .panel { padding: var(--sp-7); }
  .about-panel { padding: var(--sp-5); }
  .about-panel__media { height: 320px; }
  .press-strip__inner { gap: var(--sp-8); }
  .press-logos { gap: var(--sp-8); width: 100%; justify-content: space-between; }
}

/* sm — tighten the last of the padding and the press strip. */
@media (max-width: 640px) {
  .display--hero { font-size: 34px; }
  .press-logo { align-items: flex-start; text-align: left; }
  .press-logos { flex-direction: column; gap: var(--sp-5); }
  .site-footer__inner { flex-direction: column; align-items: flex-start; gap: var(--sp-3); }
  .cta .btn { width: 100%; }
}

/* Touch targets: every interactive element clears 44px at mobile sizes.
   .btn resolves to 47px tall (15px/1 + 16px padding-block); .btn--sm in the
   header resolves to 33px and is therefore desktop-only by design — if you
   surface it on mobile, bump its padding to var(--sp-4). */


/* 13 ── Reduced motion & print ──────────────────────────────────────── */
/* The motif draw-in is the brand's one essential motion and is exempt.
   Everything else stops. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .motif__start, .motif__line, .motif__point {
    animation-duration: 240ms !important;
    animation-delay: 0ms !important;
  }
}

@media print {
  .site-header { position: static; }
  .hero { min-height: 0; }
  .card, .panel { box-shadow: none; break-inside: avoid; }
}


/* ═══════════════════════════════════════════════════════════════════════
   14 ── ELEMENTOR ADAPTER (added for the Elementor build — not from the
   handoff). Elementor's "CSS Classes" field puts class names on the widget
   or container WRAPPER, not on the inner tag, and adds its own defaults.
   These rules bridge the two so the handoff classes style Elementor markup.
   ═══════════════════════════════════════════════════════════════════════ */

/* Heading & Text Editor widgets: let the wrapper's class typography cascade
   into the actual <h*>/<p> that Elementor renders inside. */
.elementor-widget .elementor-heading-title,
.elementor-widget-text-editor p,
.elementor-widget-text-editor {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: inherit;
}
.elementor-widget-text-editor p { margin: 0; }
.elementor-widget-text-editor p + p { margin-top: var(--sp-4); }

/* Kill Elementor's default widget bottom margin — spacing lives in the
   handoff classes, not widget gaps. */
.elementor-widget:not(:last-child) { margin-bottom: 0; }

/* Containers carrying section classes must span full width with no
   Elementor gap/padding interference. */
.e-con.section, .e-con.press-strip, .e-con.site-header,
.e-con.hero, .e-con.site-footer {
  max-width: 100%;
  --padding-top: 0; --padding-bottom: 0;
  --padding-left: 0; --padding-right: 0;
}

/* Containers carrying .container keep the boxed 1200px behaviour even if
   Elementor sets its own width. */
.e-con.container, .e-con-inner .container { row-gap: 0; }

/* Containers used as .stack / .split / .grid: neutralise Elementor's own
   flex gap so the handoff gap wins. */
.e-con.stack, .e-con.split, .e-con.hero__content { --gap: 0px; }

/* The hero container needs relative positioning context and no clipping
   overrides from Elementor. */
.e-con.hero { position: relative; }

/* Sticky header: Elementor sometimes wraps top-level containers; keep the
   sticky context intact. */
.e-con.site-header { position: sticky; top: 0; z-index: 30; }

/* HTML widgets should not constrain the snippets inside them. */
.elementor-widget-html .elementor-widget-container { width: 100%; }

/* Elementor image widgets inside media frames fill their frame. */
.about-panel__media .elementor-widget-image img,
.hero__media img { width: 100%; height: 100%; object-fit: cover; }

/* Production refinement (handoff requirement): hover lifts only on devices
   that actually hover, so taps don't leave cards stuck lifted. */
@media (hover: none) {
  .card--keynote:hover, .card--session:hover, .card--insight:hover {
    transform: none;
    box-shadow: var(--shadow-card);
  }
  .card--session:hover { box-shadow: none; border-color: var(--b-default); }
  .card--sector:hover { border-color: var(--b-on-dark); background: var(--s-dark-card); }
}


/* ══ NATIVE WIDGET ADAPTER v2.1 (2026-08-16) — native-widget rebuild ══ */
.elementor-widget.elementor-widget-heading .elementor-heading-title, .elementor-widget.elementor-widget-text-editor p { font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; margin: 0; }
.e-con.grid { display: grid !important; gap: var(--grid-gap) !important; }
.e-con.grid--2 { grid-template-columns: repeat(2, 1fr); }
.e-con.grid--3 { grid-template-columns: repeat(3, 1fr); }
.e-con.grid--tight { gap: 16px !important; }
@media (max-width: 1024px) { .e-con.grid--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 860px) { .e-con.grid--2, .e-con.grid--3 { grid-template-columns: 1fr; } }
.e-con.stack-none { gap: 0 !important; }
.e-con.hero__content { gap: var(--sp-5) !important; }
.e-con.hero__proof { gap: var(--sp-7) !important; flex-direction: row !important; flex-wrap: wrap; align-items: center; }
.e-con.hero__actions { gap: var(--sp-3) !important; flex-direction: row !important; flex-wrap: wrap; }
.e-con.card--keynote { gap: 0 !important; }
.e-con.card--note { gap: var(--sp-5) !important; }
.e-con.card--session { gap: 0 !important; }
.mt-12 { margin-top: 12px !important; } .mt-16 { margin-top: 16px !important; }
.mt-20 { margin-top: var(--sp-5) !important; } .mt-36 { margin-top: var(--sp-9) !important; }
.elementor-widget-button.btnw { width: auto; }
.btnw .elementor-button { font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: var(--fw-semi); line-height: var(--lh-flat); padding: var(--sp-4) var(--sp-7); border: 1px solid transparent; border-radius: var(--r-sm); box-shadow: none; transition: background var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.btnw--primary .elementor-button { background: var(--c-action); color: var(--c-white); }
.btnw--primary .elementor-button:hover, .btnw--primary .elementor-button:focus { background: var(--c-action-hover); color: var(--c-white); }
.btnw .elementor-button:active { transform: scale(0.98); }
.btnw--ghost .elementor-button { background: transparent; color: var(--t-on-dark); border-color: var(--b-on-dark-ghost); }
.btnw--ghost .elementor-button:hover, .btnw--ghost .elementor-button:focus { color: var(--t-on-dark); border-color: var(--b-on-dark-ghost-h); background: rgba(255,255,255,0.06); }
@media (max-width: 860px) { .hero__actions .elementor-widget-button { flex: 1 1 100%; } .hero__actions .elementor-button { width: 100%; } }
.elementor-widget.tagw { align-self: flex-start; width: auto; font-size: var(--fs-4xs); font-weight: var(--fw-bold); line-height: var(--lh-flat); letter-spacing: var(--ls-caps-sm); text-transform: uppercase; color: var(--c-action); background: var(--c-action-tint); padding: 6px 11px; border-radius: var(--r-pill); }
.dot-red-xs p { display: flex; align-items: center; gap: 10px; }
.dot-red-xs p::before { content: ''; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--c-red); }
.elementor-widget.session-title { font-size: var(--fs-xl); font-weight: var(--fw-bold); line-height: 1.25; letter-spacing: var(--ls-tight); color: var(--t-primary); }
.elementor-widget.session-support { margin-top: var(--sp-3) !important; font-size: var(--fs-sm); line-height: 1.55; color: var(--t-muted); }
@media (max-width: 860px) { .elementor-widget.session-title { font-size: 19px; } }
.elementor-widget.note-copy { font-family: var(--font-serif); font-size: var(--fs-d10); font-weight: var(--fw-medium); line-height: 1.35; letter-spacing: var(--ls-tight); color: var(--t-on-dark); }
@media (max-width: 860px) { .elementor-widget.note-copy { font-size: 22px; } }
.elementor-widget.lede { font-size: var(--fs-lg); font-weight: var(--fw-semi); line-height: var(--lh-normal); color: var(--c-action-on-dark); max-width: 660px; }
.elementor-widget.hero__audiences { margin-top: var(--sp-3) !important; font-size: var(--fs-3xs); font-weight: var(--fw-semi); line-height: var(--lh-loose); letter-spacing: 0.1em; text-transform: uppercase; color: var(--t-on-dark-faint); max-width: 640px; }
.elementor-widget.hero__proof-item { font-size: var(--fs-sm); font-weight: var(--fw-semi); line-height: 1.3; color: var(--t-on-dark-strong); }
.elementor-widget.card__deck { margin-top: var(--sp-4) !important; font-family: var(--font-serif); font-size: var(--fs-d11); font-weight: var(--fw-medium); line-height: 1.4; color: var(--t-body-3); }
.elementor-widget.card__support { margin-top: var(--sp-6) !important; font-size: var(--fs-sm); line-height: 1.55; color: var(--t-muted); }
.hero .elementor-widget-html, .hero .elementor-widget-html .elementor-widget-container { position: static; }
.e-con > .elementor-widget-html { width: 100%; }

/* NATIVE ADAPTER v3 */ .e-con.split, .e-con.split--even, .e-con.split--wide, .e-con.about-panel, .e-con.stats, .e-con.figures { display: grid !important; } .e-con.split { grid-template-columns: 0.95fr 1.05fr; gap: var(--grid-gap-lg) !important; align-items: start; } .e-con.split--even { grid-template-columns: 1fr 1fr; gap: var(--grid-gap-lg) !important; align-items: stretch; } .e-con.split--wide { grid-template-columns: 1.1fr 0.9fr; gap: var(--sp-7) !important; align-items: stretch; } .e-con.about-panel { grid-template-columns: 0.62fr 1fr; gap: var(--grid-gap-lg) !important; align-items: center; } .e-con.stats { grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap-lg) !important; } .e-con.figures { grid-template-columns: repeat(3, 1fr); gap: var(--sp-8) !important; } .e-con.stat { gap: var(--sp-2) !important; } @media (max-width: 1024px) { .e-con.split--wide { grid-template-columns: 1fr; } .e-con.split { gap: var(--sp-10) !important; } } @media (max-width: 860px) { .e-con.split, .e-con.split--even, .e-con.about-panel, .e-con.stats, .e-con.figures { grid-template-columns: 1fr !important; } .e-con.stats { gap: var(--sp-8) !important; } .e-con.figures { gap: var(--sp-5) !important; } } .e-con.panel { gap: var(--sp-8) !important; } .e-con.panel--credentials { gap: var(--sp-5) !important; height: 100%; } .e-con.panel--dark { gap: var(--sp-9) !important; } .e-con.quote { gap: var(--sp-5) !important; } .e-con.card__footer { flex-direction: row !important; justify-content: space-between; align-items: center; gap: var(--sp-4) !important; } .e-con.card__signature { gap: 0 !important; } .e-con.card--insight { gap: 26px !important; } .e-con.card--sector { gap: 0 !important; } .e-con.cta { gap: 0 !important; align-items: center !important; } .e-con.about-panel__media { gap: 0 !important; } .about-panel__media .elementor-widget-image, .about-panel__media .elementor-widget-image .elementor-widget-container { height: 100%; } .about-panel__media .elementor-widget-image img { width: 100%; height: 100%; object-fit: cover; object-position: 66% 38%; filter: var(--portrait-filter); } .elementor-widget.stat-label { font-size: var(--fs-2xs); font-weight: var(--fw-bold); line-height: 1.3; letter-spacing: var(--ls-caps-sm); text-transform: uppercase; color: var(--c-action-on-teal); } .elementor-widget.stat-note { font-size: var(--fs-xs); line-height: 1.45; color: var(--t-on-teal-muted); } .elementor-widget.serif-col { font-family: var(--font-serif); font-size: var(--fs-d9); font-weight: var(--fw-medium); line-height: var(--lh-snug); letter-spacing: var(--ls-tight); color: var(--t-body); } .serif-col p + p { margin-top: var(--sp-5) !important; } .elementor-widget.body-col { font-size: var(--fs-base); line-height: var(--lh-body); color: var(--t-secondary); max-width: var(--w-measure); } .body-col p + p { margin-top: var(--sp-4) !important; } .elementor-widget.body-dark { font-size: var(--fs-base); line-height: var(--lh-body); color: var(--t-on-dark-muted); max-width: var(--w-measure); } .elementor-widget.body-teal { font-size: var(--fs-md); line-height: var(--lh-loose); color: var(--t-on-teal-body); } .elementor-widget.body-lg-col { font-size: var(--fs-md); line-height: var(--lh-loose); color: var(--t-secondary); max-width: 720px; } .elementor-widget.cta-body { font-size: 17px; line-height: var(--lh-body); color: var(--t-on-dark-body); } .elementor-widget.sector-name { font-size: var(--fs-d9); font-weight: var(--fw-bold); line-height: 1.1; letter-spacing: var(--ls-tight); color: var(--t-on-dark); } .elementor-widget.sector-kicker { margin-top: var(--sp-2) !important; font-size: 12.5px; font-weight: var(--fw-semi); line-height: 1.4; color: var(--c-action-on-card); } .elementor-widget.sig-title { font-size: var(--fs-sm); font-weight: var(--fw-bold); line-height: 1.3; color: var(--t-on-dark); } .elementor-widget.sig-desc { margin-top: 6px !important; font-size: var(--fs-xs); line-height: var(--lh-normal); color: var(--t-on-dark-muted); } .elementor-widget.sector-item { font-size: 13.5px; font-weight: var(--fw-medium); line-height: 1.35; color: var(--t-on-dark-body); } .sector-item p + p { margin-top: 9px !important; } .elementor-widget.credential-line { font-size: var(--fs-md); font-weight: var(--fw-semi); line-height: var(--lh-normal); color: var(--t-body-2); } .elementor-widget.figure-item { font-family: var(--font-serif); font-size: var(--fs-d7); font-weight: var(--fw-medium); line-height: 1.15; letter-spacing: var(--ls-tight); color: var(--t-primary); } .elementor-widget.quote-p { font-family: var(--font-serif); font-size: var(--fs-d10); font-weight: var(--fw-medium); line-height: 1.4; letter-spacing: var(--ls-tight); color: var(--t-body-3); } .elementor-widget.meta-label { font-size: var(--fs-3xs); font-weight: var(--fw-semi); line-height: var(--lh-normal); letter-spacing: var(--ls-caps-sm); text-transform: uppercase; color: var(--t-faint); } .elementor-widget.meta-dark { color: var(--t-on-dark-faint) !important; letter-spacing: var(--ls-caps); } @media (max-width: 860px) { .elementor-widget.serif-col { font-size: 19px; line-height: 1.45; } .elementor-widget.body-lg-col, .elementor-widget.body-teal { font-size: var(--fs-base); } .elementor-widget.figure-item { font-size: 24px; } } .dot-cred p { display: flex; align-items: flex-start; gap: var(--sp-3); } .dot-cred p::before { content: ''; flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--c-action); margin-top: 7px; } .dot-fig p { display: flex; align-items: center; gap: var(--sp-4); } .dot-fig p::before { content: ''; flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: var(--c-red); } .dot-teal p { display: flex; align-items: center; gap: 10px; } .dot-teal p::before { content: ''; flex: 0 0 auto; width: 5px; height: 5px; border-radius: 50%; background: var(--c-teal); } .mw-960 { max-width: 960px; } .mw-760 { max-width: var(--w-measure); margin-inline: auto; } .mw-640 { max-width: 640px; margin-inline: auto; } .mw-440 { max-width: 440px; } .mt-6 { margin-top: 6px !important; } .mt-24 { margin-top: var(--sp-6) !important; } .mt-26 { margin-top: 26px !important; } .mt-32 { margin-top: var(--sp-8) !important; } .mt-40 { margin-top: var(--sp-10) !important; } .mt-44 { margin-top: 44px !important; } .py-104 { padding-block: var(--sp-16) !important; } .ls-16 { letter-spacing: 0.16em !important; } .btnw--sm .elementor-button { font-size: var(--fs-2xs); padding: 10px 17px; }
/* FOOTER WIDTH FIX */ .card__footer .elementor-widget-html { width: auto !important; flex: 0 0 auto; } .card__footer .elementor-widget.meta-label { width: auto; flex: 1 1 auto; }/* End custom CSS */