/* Kyvera custom section styles — extended incrementally as each section is rebuilt in Elementor. */

/* ===== Unified typography scale — used across every section for consistency.
   Ported verbatim from the original static reference (kyvera-home-page-
   template.html :root block). MUST stay defined here: every section's
   eyebrow/heading/card-title/copy font-size relies on these custom
   properties, and without a :root definition they resolve to nothing,
   which is what caused headings to render at inconsistent/default sizes
   across sections after the WordPress/Elementor conversion. ===== */
:root {
  --kyvera-h2-size: clamp(32px, 2.7vw, 46px);
  --kyvera-h2-line-height: 1.22;
  --kyvera-h2-letter-spacing: 0.005em;
  --kyvera-eyebrow-size: 11px;
  --kyvera-eyebrow-tracking: 0.3em;
  --kyvera-card-title-size: 16px;
  --kyvera-card-title-letter-spacing: 0.005em;
  --kyvera-card-title-line-height: 1.35;
  --kyvera-card-copy-size: 13px;
  --kyvera-lead-size: 18px;
  --kyvera-copy-size: 16px;
  --kyvera-copy-line-height: 1.75;
}

/* ===== About / Partner-with-Kyvera shared palette — used by every border,
   label, muted-text, and card-background rule ported from about.html and
   partner-with-kyvera.html (both reference files declare this exact same
   :root block verbatim). It was missed when those two pages were ported
   into this shared stylesheet, so every "border: 1.5px solid var(--line)",
   "color: var(--muted)", etc. across the About/Partner sections was
   silently resolving to an invalid value — for shorthand properties like
   `border`, an unresolved var() makes the WHOLE declaration invalid, so the
   browser dropped it entirely (border became "none" instead of just the
   wrong color), which is what caused the missing/red borders and missing
   hover states on the Partner form's persona/pill option cards. ===== */
:root {
  --ink: #102d3d;
  --muted: #5f6f78;
  --faint: #8b96a0;
  --accent: #c09043;
  --accent-light: #d4a75c;
  --line: rgba(16, 45, 61, 0.1);
  --card-bg: #fbfbf8;
}

/* Confines [data-reveal="left"/"right"] items (translateX(±48px) off-canvas
   before/after they're in view) so they never widen the page's horizontal
   scroll range — scoped to header/main/footer rather than html/body. Uses
   `clip` (not `hidden`) because `overflow-x: hidden` alone forces the UA to
   compute `overflow-y` as `auto`, which would turn these into their own
   independently-scrolling boxes (the "double scrollbar" bug). Ported
   verbatim from the original reference site's fix for the same issue. */
.hfeed.site > main,
.hfeed.site > footer {
  overflow: clip;
}

/* ===== Reveal-on-scroll animation system (shared across all pages) ===== */
[data-reveal] {
  transition-property: opacity, transform;
  transition-duration: 0.9s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

[data-reveal="up"]    { opacity: 0; transform: translateY(40px); }
[data-reveal="left"]  { opacity: 0; transform: translateX(-48px); }
[data-reveal="right"] { opacity: 0; transform: translateX(48px); }
[data-reveal="zoom"]  { opacity: 0; transform: scale(0.9); transition-duration: 0.85s; }
[data-reveal="fade"]  { opacity: 0; transition-duration: 1.1s; }

[data-reveal].is-visible { opacity: 1; transform: none; }

[data-reveal-stagger] > * {
  opacity: 0;
  transform: translateY(34px);
  transition-property: opacity, transform;
  transition-duration: 0.8s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal-stagger].is-visible > * { opacity: 1; transform: none; }

[data-reveal-stagger] > *:nth-child(1) { transition-delay: 0.03s; }
[data-reveal-stagger] > *:nth-child(2) { transition-delay: 0.11s; }
[data-reveal-stagger] > *:nth-child(3) { transition-delay: 0.19s; }
[data-reveal-stagger] > *:nth-child(4) { transition-delay: 0.27s; }
[data-reveal-stagger] > *:nth-child(5) { transition-delay: 0.35s; }
[data-reveal-stagger] > *:nth-child(6) { transition-delay: 0.43s; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal-stagger] > * {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ===== Site header (hero-scroll-nav) — floating pill, identical on every
   page. On the homepage only, custom.js morphs it from a transparent
   full-width bar into this same pill as the hero is scrolled past (see
   the homepage hero script once that section exists). ===== */
.hero-scroll-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 500 !important;
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  justify-content: center;
}

.hero-scroll-nav__inner,
.hero-scroll-nav__links {
  --display: flex !important;
  --flex-direction: row !important;
  --container-widget-width: initial !important;
  --container-widget-height: 100% !important;
  --container-widget-flex-grow: 0 !important;
  --container-widget-align-self: center !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}

.hero-scroll-nav__inner {
  width: calc(100% - 32px) !important;
  max-width: 960px !important;
  flex-grow: 0 !important;
  flex-shrink: 1 !important;
  flex-basis: auto !important;
  margin: 14px auto 0 !important;
  padding: 10px 22px !important;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-radius: 999px !important;
  background: rgba(16, 45, 61, 0.94);
  box-shadow: 0 18px 40px rgba(16, 45, 61, 0.28);
}

.hero-scroll-nav__logo img {
  display: block !important;
  height: 22px !important;
  width: auto !important;
  max-width: none !important;
  filter: brightness(0) invert(1);
}

.hero-scroll-nav__logo,
.hero-scroll-nav__link,
.hero-scroll-nav__cta {
  width: auto !important;
  flex: 0 0 auto !important;
}

/* The Elementor container's align-items resolves to "normal" (stretch) for
   this widget wrapper, so the wrapper div stretches to the nav's full
   cross-axis height while the plain-flow <img> inside it stays top-aligned
   — the logo visibly sits above centre instead of matching the nav links
   and CTA button. Making the wrapper itself a centered flex box fixes this
   regardless of how much the parent stretches it. */
.hero-scroll-nav__logo {
  display: flex !important;
  align-items: center !important;
}

.hero-scroll-nav__links {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 auto 0 30px;
}

.hero-scroll-nav__links .elementor-button-wrapper,
.hero-scroll-nav__cta .elementor-button-wrapper {
  display: contents;
}

.hero-scroll-nav__links a,
.hero-scroll-nav__links a.elementor-button {
  display: inline-block;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0;
  color: #fff !important;
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0.92;
  transition: opacity 160ms ease, color 160ms ease;
}

.hero-scroll-nav__links a:hover,
.hero-scroll-nav__links a:focus-visible,
.hero-scroll-nav__links a.is-active {
  opacity: 1;
  color: #d4a75c !important;
}

.hero-scroll-nav__cta {
  flex-shrink: 0;
}

.hero-scroll-nav__cta a,
.hero-scroll-nav__cta a.elementor-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: 40px;
  height: auto;
  padding: 0 20px !important;
  border-radius: 22px !important;
  background: #fff !important;
  color: #102d3d !important;
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  border: none !important;
  box-shadow: none !important;
}

/* Elementor's button-text/content-wrapper spans set their own font-family
   (Montserrat) that otherwise wins over the anchor's font-family above,
   making the CTA noticeably wider than the reference design at narrow
   mobile widths (GC Akihiko renders tighter). Force it through explicitly. */
.hero-scroll-nav__cta a .elementor-button-content-wrapper,
.hero-scroll-nav__cta a .elementor-button-text {
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
}

@media (max-width: 900px) {
  .hero-scroll-nav__links { display: none !important; }
}

@media (max-width: 420px) {
  .hero-scroll-nav__inner { gap: 10px !important; padding: 8px 14px !important; }
  .hero-scroll-nav__logo img { height: 18px !important; }
  .hero-scroll-nav__cta a,
  .hero-scroll-nav__cta a.elementor-button {
    padding: 0 10px !important;
    font-size: 9px !important;
    letter-spacing: 0.05em !important;
    min-height: 34px !important;
  }
  .hero-scroll-nav__cta a .elementor-button-content-wrapper,
  .hero-scroll-nav__cta a .elementor-button-text {
    letter-spacing: 0.05em !important;
  }
}

@media (min-width: 421px) and (max-width: 520px) {
  .hero-scroll-nav__logo img { height: 20px !important; }
}

/* ===== Site footer (kyvera-footer) ===== */
.kyvera-footer {
  background: #0a1c2b;
  color: #cfd8db;
  font-family: Arial, Helvetica, sans-serif;
}

.kyvera-footer__top {
  width: min(1320px, calc(100% - 120px));
  max-width: 1320px;
  margin: 0 auto !important;
  padding: 70px 0 46px !important;
  display: grid !important;
  grid-template-columns: minmax(210px, 0.85fr) minmax(230px, 1fr) minmax(190px, 0.95fr) minmax(140px, 0.55fr);
  gap: 32px;
  align-items: start;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.kyvera-footer__top > .e-con-inner,
.kyvera-footer__top.e-con > .e-con-inner {
  display: contents;
}

/* Elementor sizes each column widget to shrink-wrap its own content by
   default (fit-content), which collapses the grid cell's actual visual
   width down to whatever's narrowest inside it (e.g. the short "KYVERA"
   brand link) instead of the full minmax() track width — leaving the
   longer description/paragraph text to wrap at that same collapsed
   width, one word per line. Force each direct grid item (an Elementor
   "e-con e-child" nested container, one per column) to fill its track. */
.kyvera-footer__top > .e-con.e-child {
  width: 100% !important;
  min-width: 0 !important;
}

.kyvera-footer__brand,
.kyvera-footer__brand a {
  display: inline-flex;
  flex-direction: column;
  gap: 8px;
  color: #fbfbf8 !important;
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
  font-size: 26px !important;
  letter-spacing: 0.04em;
  text-decoration: none;
}

.kyvera-footer__tagline {
  display: block;
  color: #8b979c;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 8px;
}

.kyvera-footer__desc {
  margin: 18px 0 0 !important;
  max-width: 320px;
  color: #92a0a5 !important;
  font-size: 13.5px !important;
  line-height: 1.7 !important;
}

.kyvera-footer__nav-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 32px;
}

.kyvera-footer__nav-col > .e-con-inner { display: contents; }

/* Selector also targets the nested ".elementor-heading-title" (the actual
   <h6> Elementor renders inside this wrapper div) with !important: Elementor
   auto-generates ".elementor-widget-heading .elementor-heading-title {
   color: var(--e-global-color-primary) }" from the site's Kit global colors,
   which has higher specificity (2 classes) than a bare ".kyvera-footer__
   nav-title" (1 class) and was overriding our gold color directly on the
   heading text itself (color doesn't fall back to the wrapper's inherited
   value when the child has its own explicit, if non-!important, rule). */
.kyvera-footer__nav-title,
.kyvera-footer__nav-title .elementor-heading-title {
  grid-column: 1 / -1;
  margin: 0 0 4px !important;
  color: #d4a75c !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.kyvera-footer__nav-col a {
  color: #cfd8db !important;
  font-size: 14.5px !important;
  text-decoration: none;
  transition: 160ms ease;
  background: none !important;
  padding: 0 !important;
  border: none !important;
}

.kyvera-footer__nav-col a:hover,
.kyvera-footer__nav-col a:focus-visible {
  color: #d4a75c !important;
}

.kyvera-footer__social-title,
.kyvera-footer__social-title .elementor-heading-title,
.kyvera-footer__contact-title,
.kyvera-footer__contact-title .elementor-heading-title {
  margin: 0 0 16px !important;
  color: #d4a75c !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.kyvera-footer__contact {
  --flex-direction: column !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px;
}

.kyvera-footer__contact > .e-con-inner { display: contents; }

.kyvera-footer__contact-address {
  margin: 0 !important;
  max-width: 220px;
  color: #92a0a5 !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

.kyvera-footer__contact-phone a,
.kyvera-footer__contact-phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #cfd8db !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none;
  background: none !important;
  padding: 0 !important;
  border: none !important;
}

.kyvera-footer__contact-phone a:hover,
.kyvera-footer__contact-phone a:focus-visible {
  color: #d4a75c !important;
}

.kyvera-footer__contact-group {
  --flex-direction: column !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px;
}

.kyvera-footer__contact-group > .e-con-inner { display: contents; }

.kyvera-footer__contact-label {
  color: #7c8a90;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.kyvera-footer__contact-group a {
  color: #cfd8db !important;
  font-size: 13px !important;
  text-decoration: none;
  background: none !important;
  padding: 0 !important;
  border: none !important;
}

.kyvera-footer__contact-group a:hover,
.kyvera-footer__contact-group a:focus-visible {
  color: #d4a75c !important;
}

.kyvera-footer__social {
  display: flex;
  gap: 12px;
}

.kyvera-footer__social .elementor-icon,
.kyvera-footer__social a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 38px !important;
  height: 38px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 50% !important;
  color: #cfd8db !important;
  background: none !important;
  transition: 160ms ease;
}

.kyvera-footer__social a:hover,
.kyvera-footer__social a:focus-visible {
  border-color: #d4a75c !important;
  color: #d4a75c !important;
}

.kyvera-footer__social svg,
.kyvera-footer__social i {
  width: 16px;
  height: 16px;
  font-size: 16px;
}

.kyvera-footer__bottom {
  --flex-direction: row !important;
  --container-widget-width: initial !important;
  width: min(1320px, calc(100% - 120px));
  max-width: 1320px;
  margin: 0 auto !important;
  padding: 26px 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: space-between !important;
  gap: 20px;
  flex-wrap: wrap;
  color: #7c8a90 !important;
  font-size: 12.5px !important;
}

.kyvera-footer__bottom > * {
  width: auto !important;
  flex: 0 0 auto !important;
}

.kyvera-footer__bottom > .e-con-inner { display: contents; }

.kyvera-footer__copyright p,
.kyvera-footer__copyright {
  margin: 0;
  color: #7c8a90;
  font-size: 12.5px;
}

.kyvera-footer__disclaimer {
  width: min(1320px, calc(100% - 120px));
  max-width: 1320px;
  margin: 0 auto !important;
  padding: 26px 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1);

}

.kyvera-footer__disclaimer > .e-con-inner { display: contents; }

.kyvera-footer__disclaimer p {
  max-width: 900px;
  margin: 0 0 8px;
  color: #7c8a90;
  font-size: 12px;
  line-height: 1.7;
}

.kyvera-footer__disclaimer p:last-child { margin-bottom: 0; }

.kyvera-footer__legal {
  --flex-direction: row !important;
  --container-widget-width: initial !important;
  display: flex !important;
  flex-direction: row !important;
  gap: 22px;
}

.kyvera-footer__legal > * {
  width: auto !important;
  flex: 0 0 auto !important;
}

.kyvera-footer__legal > .e-con-inner { display: contents; }

.kyvera-footer__legal a {
  color: #7c8a90 !important;
  text-decoration: none;
  background: none !important;
  padding: 0 !important;
  border: none !important;
  font-size: 12.5px !important;
}

.kyvera-footer__legal a:hover,
.kyvera-footer__legal a:focus-visible {
  color: #d4a75c !important;
}

@media (max-width: 1160px) {
  .kyvera-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; row-gap: 40px; }
}

@media (max-width: 900px) {
  .kyvera-footer__top { grid-template-columns: 1fr !important; gap: 36px; }
  .kyvera-footer__contact-address { max-width: 100%; }
}

@media (max-width: 640px) {
  .kyvera-footer__top { width: min(100% - 42px, 560px); padding: 56px 0 36px !important; }
  .kyvera-footer__disclaimer { width: min(100% - 42px, 560px); }
  .kyvera-footer__bottom { width: min(100% - 42px, 560px); flex-direction: column !important; align-items: flex-start !important; }
}

/* Header/footer templates are placed inside HFE's own wrapper divs —
   ensure those wrappers never constrain our fixed/full-bleed layouts. */
.hfe-site-header-section,
.hfe-site-footer-section {
  padding: 0 !important;
}

/* =====================================================================
   Homepage scroll-driven hero intro (#heroStage) — homepage only.
   Plain custom markup inside one HTML widget, so none of these selectors
   fight Elementor's own container/widget base CSS (no !important needed).
   custom.js scrubs inline styles on scroll; see heroStage script.
   ===================================================================== */
.hero-scroll-stage {
  position: relative;
  height: 320vh;
}

.hero-scroll-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  background: #f7f7f3;
}

.hero-scroll-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 0;
  z-index: 1;
}

.hero-scroll-media img,
.hero-scroll-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hero-scroll-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 14, 20, 0.35) 0%, rgba(6, 14, 20, 0.05) 30%, rgba(6, 14, 20, 0.45) 100%);
  pointer-events: none;
}

.hero-scroll-heading {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  z-index: 2;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  pointer-events: none;
}

.hero-scroll-heading__half {
  display: block;
  white-space: nowrap;
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
  font-size: clamp(16px, 3vw, 40px);
  font-weight: 400;
  letter-spacing: 0.005em;
  line-height: 1.2;
  color: #ffffff;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.25);
}

.hero-scroll-heading__half--left { text-align: right; }
.hero-scroll-heading__half--right { text-align: left; }

.hero-scroll-heading__logo-wrap {
  position: relative;
  display: inline-block;
  width: 6.65em;
  height: 0.685em;
  margin-left: 0.18em;
  vertical-align: baseline;
}

.hero-scroll-heading__logo-wrap img,
.hero-scroll-heading__logo-wrap .hero-scroll-heading__logo {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 6.65em;
  height: auto;
}

.hero-scroll-heading__logo--dark { opacity: 0; }

.hero-scroll-heading__logo-wrap .hero-scroll-heading__logo--lottie {
  width: 8.15em;
  height: 8.15em;
  opacity: 1;
  overflow: visible;
  pointer-events: none;
}

.hero-scroll-heading__logo--lottie svg { display: block; width: 100%; height: 100%; }

.hero-scroll-hint {
  position: absolute;
  bottom: 42px;
  left: 0;
  right: 0;
  z-index: 2;
  text-align: center;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  opacity: 0.85;
}

.hero-scroll-hint span {
  display: block;
  margin-top: 8px;
  animation: heroScrollBounce 1.8s ease-in-out infinite;
}

@keyframes heroScrollBounce {
  0%, 100% { transform: translateY(0); opacity: 0.6; }
  50% { transform: translateY(6px); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-scroll-hint span { animation: none; }
}

/* =====================================================================
   Main hero content section (kyvera-hero) — video background, sits right
   after the scroll-stage intro. Built from real Elementor widgets, so
   every rule below fights Elementor's own generated CSS -> !important.
   ===================================================================== */
.kyvera-hero {
  --kyvera-ink: #102d3d;
  --kyvera-muted: #5f6f78;
  --kyvera-line: rgba(16, 45, 61, 0.14);
  --kyvera-accent: #d4a75c;
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  min-height: 870px;
  background: #f7f7f3 !important;
  color: var(--kyvera-ink);
  font-family: Arial, Helvetica, sans-serif;
}

.kyvera-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(251, 251, 248, 0.98) 0%, rgba(251, 251, 248, 0.94) 29%, rgba(251, 251, 248, 0.5) 47%, rgba(251, 251, 248, 0.05) 70%);
  pointer-events: none;
}

.kyvera-hero > .elementor-background-video-container {
  z-index: 0 !important;
}

.kyvera-hero__inner {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 70px 5.5% 58px !important;
  display: block !important;
}

.kyvera-hero__eyebrow {
  display: flex !important;
  align-items: center;
  gap: 14px;
  margin: 0 0 21px !important;
}

.kyvera-hero__eyebrow .elementor-heading-title {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--kyvera-accent) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3em !important;
  line-height: 1.4 !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

.kyvera-hero__eyebrow .elementor-heading-title::before {
  content: "";
  width: 37px;
  height: 1px;
  background: var(--kyvera-accent);
  flex-shrink: 0;
}

.kyvera-hero__title,
.kyvera-hero__title .elementor-heading-title {
  /* Reference (index.html) uses max-width: 1180px on .kyvera-hero h1. The
     previous 800px value here was too narrow: at wider viewports the
     clamp()'d font-size grows toward 46px, and inside an 800px box the full
     heading text wraps to 3 lines instead of the intended 2 lines.
     !important guards against Elementor's own
     ".e-con.e-con > .e-con-inner > .elementor-widget { max-width: 100% }"
     rule, which has higher selector specificity and would otherwise let the
     widget stretch to the full container width regardless of this value. */
  max-width: 1180px !important;
  margin: 0 !important;
  color: var(--kyvera-ink) !important;
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
  font-size: clamp(26px, 2.7vw, 46px) !important;
  font-weight: 400 !important;
  letter-spacing: 0.005em;
  line-height: 1.3 !important;
}

.kyvera-hero__rule {
  width: 72px;
  height: 1px;
  margin: 32px 0 27px;
  background: var(--kyvera-accent);
}

.kyvera-hero__lead,
.kyvera-hero__lead p {
  /* !important needed: Elementor's own
     ".e-con.e-con > .e-con-inner > .elementor-widget { max-width: 100% }"
     rule (specificity 0,4,0) otherwise beats this 540px cap and the
     paragraph stretches across the full hero column, overlapping the
     visual on the right. */
  max-width: 550px !important;
  margin: 0 0 17px !important;
  color: var(--kyvera-ink) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.6 !important;
}

.kyvera-hero__copy,
.kyvera-hero__copy p {
  /* Same Elementor max-width:100% specificity issue as .kyvera-hero__lead
     above — !important keeps the copy text contained instead of spanning
     the full width of the hero section. */
  max-width: 540px !important;
  margin: 0 0 10px !important;
  color: var(--kyvera-muted) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}

.kyvera-hero__actions {
  --display: flex !important;
  --flex-direction: row !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 34px !important;
}

.kyvera-hero__actions .elementor-button-wrapper { display: contents; }

/* In the live Elementor markup the "_css_classes" (kyvera-hero__button) sit
   on the widget's own wrapper div (.elementor-widget-button), with the real
   <a class="elementor-button"> nested directly inside it — no intermediate
   .elementor-button-wrapper here. The rule below already gives that anchor
   its pill border/background, so if the wrapper div keeps rendering its own
   box too (matched by the bare ".kyvera-hero__button" selector) you get two
   concentric borders. Making the wrapper display:contents removes its box
   entirely while leaving the inner anchor's styling untouched. */
.kyvera-hero__button.elementor-widget-button {
  display: contents !important;
}

.kyvera-hero__button,
.kyvera-hero__button a.elementor-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: 46px;
  height: auto;
  padding: 0 21px !important;
  border: 1px solid var(--kyvera-ink) !important;
  border-radius: 24px !important;
  background: var(--kyvera-ink) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
  transition: 180ms ease;
  box-shadow: none !important;
}

.kyvera-hero__button:hover,
.kyvera-hero__button a.elementor-button:hover,
.kyvera-hero__button:focus-visible {
  border-color: var(--kyvera-accent) !important;
  background: var(--kyvera-accent) !important;
  color: var(--kyvera-ink) !important;
}

.kyvera-hero__button--outline,
.kyvera-hero__button--outline a.elementor-button {
  background: transparent !important;
  color: var(--kyvera-ink) !important;
}

.kyvera-hero__stats {
  --display: grid !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  max-width: 650px;
  margin-top: 48px !important;
}

.kyvera-hero__stat {
  --display: flex !important;
  --flex-direction: column !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 62px;
  padding: 0 24px 0 0 !important;
  border-right: 1px solid var(--kyvera-line);
  justify-content: center;
}

.kyvera-hero__stat:nth-child(n+2) { padding-left: 24px !important; }
.kyvera-hero__stat:last-child { border-right: 0; }

.kyvera-hero__stat-label,
.kyvera-hero__stat-label .elementor-heading-title {
  display: block;
  margin: 0 0 5px !important;
  color: var(--kyvera-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em;
  line-height: 1 !important;
  white-space: nowrap;
}

.kyvera-hero__stat-copy,
.kyvera-hero__stat-copy .elementor-heading-title {
  display: block;
  margin: 0 !important;
  color: var(--kyvera-muted) !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em;
  line-height: 1.4 !important;
  text-transform: uppercase;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .hero-scroll-heading__half { font-size: clamp(14px, 3vw, 32px); }
}

@media (max-width: 767px) {
  .kyvera-hero { min-height: auto; }
  .kyvera-hero__inner { padding: 78px 21px 64px !important; }
  .kyvera-hero__title,
  .kyvera-hero__title .elementor-heading-title { font-size: clamp(30px, 8.5vw, 44px) !important; }
  .kyvera-hero__lead, .kyvera-hero__lead p { font-size: 17px !important; }
  .kyvera-hero__actions { gap: 8px !important; }
  .kyvera-hero__button, .kyvera-hero__button a.elementor-button { flex: 1; padding: 0 10px !important; font-size: 9px !important; letter-spacing: 0.04em; }
  .kyvera-hero__stats { margin-top: 40px !important; }
  .kyvera-hero__stat { padding-right: 9px !important; }
  .kyvera-hero__stat:nth-child(n+2) { padding-left: 9px !important; }
  .kyvera-hero__stat-label, .kyvera-hero__stat-label .elementor-heading-title { font-size: 16px !important; }
  .kyvera-hero__stat-copy, .kyvera-hero__stat-copy .elementor-heading-title { font-size: 6px !important; letter-spacing: 0.08em; }
}


/* =====================================================================
   Homepage remaining sections (ecosystem band -> section eight + modal)
   Ported verbatim from the approved static reference (kyvera-home-page-
   template.html, lines 849-4636). These sections render inside Elementor
   HTML widgets, so no !important overrides are needed here.
   ===================================================================== */
  /* ===== Trusted Ecosystem band (sits between the hero and "The
     Opportunity" section) — a compact, dark-navy banner reusing the same
     five-item ecosystem content as the About page, restyled for the
     homepage in the site's established dark-section language (see
     .kyvera-section-three / -five for the same background + watermark
     treatment). ===== */
  .kyvera-ecosystem-band {
    position: relative;
    overflow: hidden;
    background: #071a2a;
    color: #eef2f3;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-ecosystem-band::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("https://kyvera.io/wp-content/uploads/2026/09/kyvera-blue-watermark.png") center center / cover no-repeat;
    opacity: 0.4;
    transform: scale(1.08);
    filter: brightness(1.1) saturate(0.85);
    pointer-events: none;
  }

  .kyvera-ecosystem-band__inner {
    position: relative;
    z-index: 1;
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 104px 0 64px;
    text-align: center;
  }

  .kyvera-ecosystem-band__eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin: 0 0 30px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: #cfd8db;
  }

  /* The label repeatedly fades in, holds, then fades out — in sync with
     the converging rules beside it (also 3.6s) rather than a static
     caption. */
  .kyvera-ecosystem-band__eyebrow-text {
    display: inline-block;
    animation: ecosystemEyebrowFade 3.6s ease-in-out infinite;
  }

  @keyframes ecosystemEyebrowFade {
    0% { opacity: 0; }
    30%, 70% { opacity: 1; }
    100% { opacity: 0; }
  }

  @media (prefers-reduced-motion: reduce) {
    .kyvera-ecosystem-band__eyebrow-text {
      animation: none;
      opacity: 1;
    }
  }

  .kyvera-ecosystem-band__eyebrow::before,
  .kyvera-ecosystem-band__eyebrow::after {
    content: "";
    width: 40px;
    height: 1px;
    background: rgba(255, 255, 255, 0.4);
  }

  /* The two little rules repeatedly draw themselves in from the outside,
     growing inward until they reach the label — as if converging on it —
     then hold, fade back out, and repeat. */
  .kyvera-ecosystem-band__eyebrow::before {
    transform-origin: left center;
    animation: ecosystemRuleConverge 3.6s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  }

  .kyvera-ecosystem-band__eyebrow::after {
    transform-origin: right center;
    animation: ecosystemRuleConverge 3.6s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  }

  @keyframes ecosystemRuleConverge {
    0% { transform: scaleX(0); opacity: 0; }
    35% { transform: scaleX(1); opacity: 1; }
    75% { transform: scaleX(1); opacity: 1; }
    92%, 100% { transform: scaleX(0); opacity: 0; }
  }

  @media (prefers-reduced-motion: reduce) {
    .kyvera-ecosystem-band__eyebrow::before,
    .kyvera-ecosystem-band__eyebrow::after {
      animation: none;
      transform: none;
      opacity: 1;
    }
  }

  .kyvera-ecosystem-band__row {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    overflow: hidden;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  /* A more pronounced, clearly-sequential reveal for these five cards than
     the site-wide stagger default (which is tuned to be a subtle ~0.09s
     cascade) — each card now visibly follows the last rather than
     appearing almost together. Delay is carried via a custom property
     (rather than plain `transition-delay`) because .kyvera-ecosystem-band__item
     below must ALSO declare its own hover `transition` — and since
     `transition-property` is a single cascading value, whichever rule
     "wins" for it replaces the full list rather than merging, so both the
     reveal (opacity/transform) and hover (background/color/stroke)
     transitions have to be declared together on that one rule to coexist. */
  .kyvera-ecosystem-band__row > *:nth-child(1) { --stagger-delay: 0s; }
  .kyvera-ecosystem-band__row > *:nth-child(2) { --stagger-delay: 0.16s; }
  .kyvera-ecosystem-band__row > *:nth-child(3) { --stagger-delay: 0.32s; }
  .kyvera-ecosystem-band__row > *:nth-child(4) { --stagger-delay: 0.48s; }
  .kyvera-ecosystem-band__row > *:nth-child(5) { --stagger-delay: 0.64s; }

  .kyvera-ecosystem-band__row .kyvera-ecosystem-band__item {
    padding: 30px 18px;
    border-right: 1px solid rgba(255, 255, 255, 0.14);
    transition-property: opacity, transform, background-color;
    transition-duration: 0.7s, 0.7s, 0.25s;
    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1), cubic-bezier(0.16, 1, 0.3, 1), ease;
    transition-delay: var(--stagger-delay, 0s), var(--stagger-delay, 0s), 0s;
  }

  .kyvera-ecosystem-band__item:hover {
    background: #ffffff;
  }

  .kyvera-ecosystem-band__item:last-child { border-right: none; }

  .kyvera-ecosystem-band__item svg {
    width: 26px;
    height: 26px;
    stroke: #ffffff;
    margin: 0 auto 14px;
    display: block;
    transition: stroke 0.25s ease;
  }

  .kyvera-ecosystem-band__item:hover svg {
    stroke: var(--kyvera-ink, #102d3d);
  }

  .kyvera-ecosystem-band__item h4 {
    margin: 0 0 6px;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.01em;
    color: #ffffff;
    transition: color 0.25s ease;
  }

  .kyvera-ecosystem-band__item:hover h4 {
    color: var(--kyvera-ink, #102d3d);
  }

  .kyvera-ecosystem-band__item p {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.5;
    color: #aab7bc;
    transition: color 0.25s ease;
  }

  .kyvera-ecosystem-band__item:hover p {
    color: #2f5670;
  }

  @media (max-width: 900px) {
    .kyvera-ecosystem-band__row { grid-template-columns: repeat(2, 1fr); }
    .kyvera-ecosystem-band__item:nth-child(2n) { border-right: none; }
    .kyvera-ecosystem-band__item { border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
  }

  @media (max-width: 560px) {
    .kyvera-ecosystem-band__inner { padding: 92px 0 48px; }
    .kyvera-ecosystem-band__row { grid-template-columns: 1fr; }
    .kyvera-ecosystem-band__item { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
    .kyvera-ecosystem-band__item:last-child { border-bottom: none; }
  }

  .kyvera-section-two {
    background: #f7f7f3;
    color: #102d3d;
    font-family: Arial, Helvetica, sans-serif;
    border: 0;
    border-top: 0;
    border-bottom: 0;
  }

  .kyvera-section-two__inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 128px 0 138px;
    display: grid;
    grid-template-columns: minmax(280px, 3fr) minmax(0, 7fr);
    grid-template-areas:
      "header header"
      "left   right";
    gap: 0 clamp(50px, 6vw, 90px);
    align-items: start;
  }

  .kyvera-section-two__header {
    grid-area: header;
    max-width: 900px;
    margin: 0 0 56px;
  }

  .kyvera-section-two__left {
    grid-area: left;
  }

  .kyvera-section-two__right {
    grid-area: right;
    align-self: center;
  }

  .kyvera-section-two__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 24px;
    color: #c09043;
    font-size: var(--kyvera-eyebrow-size);
    font-weight: 700;
    letter-spacing: var(--kyvera-eyebrow-tracking);
    text-transform: uppercase;
  }

  .kyvera-section-two__eyebrow::before {
    content: "";
    width: 38px;
    height: 1px;
    background: #c09043;
  }

  .kyvera-section-two h2 {
    max-width: 100%;
    margin: 0;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-h2-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: var(--kyvera-h2-line-height);
  }

  .kyvera-section-two__description {
    max-width: 100%;
    margin: 24px 0 0;
    color: #5f6f78;
    font-size: var(--kyvera-copy-size);
    line-height: var(--kyvera-copy-line-height);
  }

  .kyvera-section-two__assets {
    margin: 36px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 100%;
  }

  .kyvera-section-two__assets li {
    padding: 14px 0;
    border-top: 1px solid rgba(16, 45, 61, 0.16);
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.15;
    white-space: nowrap;
    text-transform: uppercase;
  }

  .kyvera-section-two__assets li:last-child {
    border-bottom: 1px solid rgba(16, 45, 61, 0.16);
  }

  .kyvera-section-two__assets li::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 1px;
    margin: 0 12px 5px 0;
    background: rgba(192, 144, 67, 0.75);
    vertical-align: middle;
  }

  .kyvera-section-two__cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
  }

  /* Clearly sequential one-by-one reveal for these four cards (rather than
     the site-wide default's subtle ~0.09s cascade). Targets only the
     opacity/transform transition-delay set by the generic
     [data-reveal-stagger] system — the hover float above uses the separate
     `translate` property with its own transition, so the two never clash. */
  .kyvera-section-two__cards > *:nth-child(1) { transition-delay: 0s !important; }
  .kyvera-section-two__cards > *:nth-child(2) { transition-delay: 0.18s !important; }
  .kyvera-section-two__cards > *:nth-child(3) { transition-delay: 0.36s !important; }
  .kyvera-section-two__cards > *:nth-child(4) { transition-delay: 0.54s !important; }

  .kyvera-section-two__card {
    min-height: 250px;
    padding: 26px 10px 24px;
    border: 1px solid rgba(16, 45, 61, 0.08);
    border-radius: 12px;
    background: rgba(255, 255, 252, 0.78);
    box-shadow: 0 8px 24px rgba(16, 45, 61, 0.045);
    text-align: center;
    animation: none;
    translate: 0 0;
    transition:
      translate 320ms cubic-bezier(0.16, 1, 0.3, 1),
      background-color 320ms ease,
      border-color 320ms ease,
      box-shadow 320ms ease;
  }

  .kyvera-section-two__card-icon {
    display: block;
    width: 96px;
    height: 96px;
    margin: 0 auto 10px;
    object-fit: contain;
    transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .kyvera-section-two__card-number {
    display: block;
    margin-bottom: 13px;
    color: #b18a4d;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
  }

  .kyvera-section-two__card h3 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    margin: 0 0 12px;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    /* Fluid size (instead of the fixed --kyvera-card-title-size) so all 4
       card titles stay on a single line and the same size as each other at
       every width in the 4-column layout (1101px+) — "Technology Enablement"
       is the longest title and was wrapping to 2 lines at common desktop
       widths with the fixed 16px size. */
    font-size: clamp(11.5px, 1.03vw, var(--kyvera-card-title-size));
    font-weight: 400;
    line-height: var(--kyvera-card-title-line-height);
    letter-spacing: -0.02em;
    white-space: nowrap;
    transition: color 280ms ease;
  }

  .kyvera-section-two__card p {
    margin: 0;
    color: #68767c;
    font-size: var(--kyvera-card-copy-size);
    line-height: 1.6;
    transition: color 280ms ease;
  }

  .kyvera-section-two__card.is-featured {
    border-color: #102d3d;
    background: #102d3d;
    box-shadow: 0 18px 38px rgba(16, 45, 61, 0.18);
  }

  .kyvera-section-two__card.is-featured h3,
  .kyvera-section-two__card.is-featured p {
    color: #ffffff;
  }

  @media (hover: hover) {
    .kyvera-section-two__card:hover {
      translate: 0 -9px;
      border-color: #102d3d;
      background: #102d3d;
      box-shadow: 0 22px 46px rgba(16, 45, 61, 0.2);
    }

    .kyvera-section-two__card:hover h3,
    .kyvera-section-two__card:hover p {
      color: #ffffff;
    }

    .kyvera-section-two__card:hover .kyvera-section-two__card-icon {
      transform: translateY(-5px) scale(1.07) rotate(-2deg);
    }

    .kyvera-section-two__card.is-featured:hover {
      border-color: rgba(16, 45, 61, 0.12);
      background: #ffffff;
      box-shadow: 0 22px 46px rgba(16, 45, 61, 0.12);
    }

    .kyvera-section-two__card.is-featured:hover h3 {
      color: #102d3d;
    }

    .kyvera-section-two__card.is-featured:hover p {
      color: #68767c;
    }
  }

  @media (max-width: 1100px) {
    .kyvera-section-two__inner {
      grid-template-columns: 1fr;
      grid-template-areas:
        "header"
        "left"
        "right";
    }

    .kyvera-section-two__right {
      margin-top: 56px;
    }
  }

  @media (max-width: 1100px) and (min-width: 768px) {
    .kyvera-section-two__cards {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (max-width: 767px) {
    .kyvera-hero {
      height: auto;
      min-height: auto;
      background-position: 62% center;
    }

    .kyvera-hero__video {
      object-position: 62% center;
    }

    .kyvera-hero__inner {
      width: min(100% - 42px, 560px);
      padding: 78px 0 64px;
    }

    .kyvera-hero h1 {
      font-size: clamp(30px, 8.5vw, 44px);
    }

    .kyvera-hero__line {
      white-space: normal;
    }

    .kyvera-hero__lead {
      font-size: 17px;
    }

    .kyvera-hero__actions {
      gap: 8px;
    }

    .kyvera-hero__button {
      flex: 1;
      padding: 0 10px;
      font-size: 9px;
      letter-spacing: 0.04em;
    }

    .kyvera-hero__stats {
      margin-top: 40px;
    }

    .kyvera-hero__stat {
      padding-right: 9px;
    }

    .kyvera-hero__stat:not(:first-child) {
      padding-left: 9px;
    }

    .kyvera-hero__stat-label {
      font-size: 16px;
    }

    .kyvera-hero__stat-copy {
      font-size: 6px;
      letter-spacing: 0.08em;
    }

    .kyvera-hero__visual {
      min-height: 270px;
    }

    .kyvera-section-two__inner {
      width: min(100% - 42px, 560px);
      padding: 78px 0 82px;
      display: block;
    }

    .kyvera-section-two__assets {
      grid-template-columns: 1fr;
      margin-top: 38px;
    }

    .kyvera-section-two__assets li {
      white-space: normal;
    }

    .kyvera-section-two__right {
      margin-top: 62px;
    }

    .kyvera-section-two__description {
      font-size: 16px;
    }

    .kyvera-section-two__cards {
      grid-template-columns: 1fr;
    }

    .kyvera-section-two__card {
      min-height: 0;
    }

    .kyvera-section-two__card-icon {
      width: 128px;
      height: 128px;
    }
  }

  .kyvera-section-three {
    position: relative;
    overflow: hidden;
    background: #071a2a;
    color: #eef2f3;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-section-three::before,
  .kyvera-section-five::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("https://kyvera.io/wp-content/uploads/2026/09/kyvera-blue-watermark.png") center center / cover no-repeat;
    opacity: 0.7;
    transform: scale(1.08);
    filter: brightness(1.1) saturate(0.85);
    pointer-events: none;
  }

  .kyvera-section-three__inner {
    position: relative;
    z-index: 1;
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 90px 0 30px;
    display: grid;
    grid-template-columns: minmax(280px, 0.86fr) minmax(0, 1.14fr);
    gap: clamp(50px, 7vw, 110px);
  }

  .kyvera-section-three__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 26px;
    color: #cfd8db;
    font-size: var(--kyvera-eyebrow-size);
    font-weight: 700;
    letter-spacing: var(--kyvera-eyebrow-tracking);
    text-transform: uppercase;
  }

  .kyvera-section-three__eyebrow::after {
    content: "";
    width: 38px;
    height: 1px;
    background: rgba(255, 255, 255, 0.35);
  }

  .kyvera-section-three h2 {
    max-width: 480px;
    margin: 0 0 22px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-h2-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: var(--kyvera-h2-line-height);
  }

  .kyvera-section-three h2 em {
    color: #d4a75c;
    font-style: normal;
  }

  .kyvera-section-three__intro {
    max-width: 440px;
    margin: 0 0 22px;
    color: #aab7bc;
    font-size: var(--kyvera-copy-size);
    line-height: var(--kyvera-copy-line-height);
  }

  .kyvera-section-three__checklist {
    margin: 0 0 22px;
    padding: 0;
    list-style: none;
    max-width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, auto);
    grid-auto-flow: column;
    column-gap: 32px;
  }

  .kyvera-section-three__checklist li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    color: #dde4e6;
    font-size: var(--kyvera-copy-size);
  }

  .kyvera-section-three__checklist li::before {
    content: "✓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 1px solid rgba(212, 167, 92, 0.6);
    border-radius: 50%;
    color: #d4a75c;
    font-size: 11px;
    flex-shrink: 0;
  }

  .kyvera-section-three__copy {
    max-width: 440px;
    margin: 0 0 16px;
    color: #aab7bc;
    font-size: var(--kyvera-copy-size);
    line-height: var(--kyvera-copy-line-height);
  }

  .kyvera-section-three__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    margin-top: 14px;
    padding: 0 24px;
    border-radius: 26px;
    background: #d4a75c;
    color: #0a1f2c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-decoration: none;
    text-transform: uppercase;
    transition: 180ms ease;
  }

  .kyvera-section-three__cta:hover,
  .kyvera-section-three__cta:focus-visible {
    background: #e6bd77;
  }

  .kyvera-section-three__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-content: start;
  }

  /* Clearly sequential one-by-one reveal for these six cards (rather than
     the site-wide default's subtle ~0.09s cascade). */
  .kyvera-section-three__cards > *:nth-child(1) { transition-delay: 0s !important; }
  .kyvera-section-three__cards > *:nth-child(2) { transition-delay: 0.12s !important; }
  .kyvera-section-three__cards > *:nth-child(3) { transition-delay: 0.24s !important; }
  .kyvera-section-three__cards > *:nth-child(4) { transition-delay: 0.36s !important; }
  .kyvera-section-three__cards > *:nth-child(5) { transition-delay: 0.48s !important; }
  .kyvera-section-three__cards > *:nth-child(6) { transition-delay: 0.6s !important; }

  .kyvera-section-three__card {
    padding: 24px 20px 26px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    animation: none;
    transition: opacity 0.42s cubic-bezier(0.16, 1, 0.3, 1), transform 0.42s cubic-bezier(0.16, 1, 0.3, 1),
      border-color 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease;
  }

  .kyvera-section-three__cards.is-visible .kyvera-section-three__card:hover {
    animation: none;
    transform: translateY(-12px) scale(1.015);
    border-color: rgba(212, 167, 92, 0.38);
    background: rgba(255, 255, 255, 0.075);
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.24);
  }

  .kyvera-section-three__card-icon {
    display: block;
    width: 140px;
    height: 140px;
    margin: 0 auto 8px;
    object-fit: contain;
    transform-origin: 50% 70%;
    transition: filter 0.4s ease;
  }

  .kyvera-section-three__card:hover .kyvera-section-three__card-icon.is-visible {
    animation: cardIconHover 0.85s cubic-bezier(0.16, 1, 0.3, 1);
    filter: drop-shadow(0 12px 14px rgba(0, 0, 0, 0.28));
  }

  @media (prefers-reduced-motion: reduce) {
    .kyvera-section-three__cards.is-visible .kyvera-section-three__card:hover {
      transform: none;
    }

    .kyvera-section-three__card:hover .kyvera-section-three__card-icon.is-visible {
      animation: none;
    }
  }

  .kyvera-section-three__card-number {
    display: block;
    margin-bottom: 10px;
    color: #d4a75c;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }

  .kyvera-section-three__card h3 {
    margin: 0 0 8px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-card-title-size);
    font-weight: 400;
    line-height: var(--kyvera-card-title-line-height);
    letter-spacing: var(--kyvera-card-title-letter-spacing);
    transition: color 0.4s ease;
  }

  .kyvera-section-three__card p {
    margin: 0;
    color: #a7b3b8;
    font-size: var(--kyvera-card-copy-size);
    line-height: 1.6;
  }

  .kyvera-section-three__strip {
    position: relative;
    z-index: 1;
  }

  .kyvera-section-three__flow {
    position: relative;
    width: min(1440px, calc(100% - 80px));
    margin: 0 auto;
    padding: 60px 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .kyvera-section-three__flow-node {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    width: 216px;
    padding: 18px 20px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
  }

  .kyvera-section-three__flow-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 42px;
    margin-bottom: 14px;
  }

  .kyvera-section-three__flow-icon--lg {
    width: 70px;
    height: 64px;
    margin-bottom: 8px;
  }

  .kyvera-section-three__flow-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .kyvera-section-three__flow-node h4 {
    margin: 0 0 6px;
    color: #fbfbf8;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  .kyvera-section-three__flow-node p {
    margin: 0;
    color: rgba(238, 242, 243, 0.45);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
  }

  .kyvera-section-three__flow-line {
    position: relative;
    flex: 0 0 auto;
    z-index: 0;
    width: clamp(90px, 9vw, 150px);
    height: 1px;
    background: linear-gradient(90deg, rgba(212, 167, 92, 0.55), rgba(212, 167, 92, 0.55));
  }

  .kyvera-section-three__flow-line--tight {
    width: clamp(32px, 3.2vw, 54px);
  }

  .kyvera-section-three__flow-line::before,
  .kyvera-section-three__flow-line::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d4a75c;
    box-shadow: 0 0 10px rgba(212, 167, 92, 0.6);
    transform: translateY(-50%);
  }

  .kyvera-section-three__flow-line::before {
    left: 22%;
  }

  .kyvera-section-three__flow-line::after {
    left: 78%;
  }

  .kyvera-section-three__flow-line--tight::before,
  .kyvera-section-three__flow-line--tight::after {
    display: none;
  }

  .kyvera-section-three__flow-visual {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    width: clamp(280px, 24vw, 360px);
    pointer-events: none;
  }

  .kyvera-section-three__flow-visual img {
    display: block;
    width: 100%;
    height: auto;
  }

  @media (max-width: 1100px) {
    .kyvera-section-three__inner {
      grid-template-columns: 1fr;
    }

    .kyvera-section-three__flow-node {
      width: 158px;
      padding: 16px;
    }

    .kyvera-section-three__flow-line {
      width: clamp(50px, 6vw, 90px);
    }

    .kyvera-section-three__flow-line--tight {
      width: clamp(20px, 2.4vw, 34px);
    }

    .kyvera-section-three__flow-visual {
      width: clamp(220px, 26vw, 280px);
    }
  }

  @media (max-width: 767px) {
    .kyvera-section-three__inner {
      width: min(100% - 42px, 560px);
      padding: 78px 0 20px;
    }

    .kyvera-section-three__checklist {
      grid-template-columns: 1fr;
      grid-template-rows: none;
      grid-auto-flow: row;
    }

    .kyvera-section-three__cards {
      grid-template-columns: 1fr;
      margin-top: 40px;
    }

    .kyvera-section-three__flow {
      width: min(100% - 42px, 360px);
      flex-direction: column;
      padding: 0 0 50px;
      gap: 22px;
    }

    .kyvera-section-three__flow-visual {
      width: 220px;
    }

    .kyvera-section-three__flow-line {
      width: 1px;
      height: 28px;
    }

    .kyvera-section-three__flow-line--tight {
      width: 1px;
      height: 18px;
    }

    .kyvera-section-three__flow-line::before {
      left: 50%;
      top: 22%;
      transform: translate(-50%, -50%);
    }

    .kyvera-section-three__flow-line::after {
      left: 50%;
      top: 78%;
      transform: translate(-50%, -50%);
    }

    .kyvera-section-three__flow-node {
      width: 100%;
      max-width: 280px;
    }
  }

  .kyvera-section-four {
    background: #fbfbf8;
    color: #102d3d;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-section-four__inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 110px 0;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(200px, 0.5fr);
    gap: clamp(50px, 6vw, 90px);
  }

  .kyvera-section-four__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 22px;
    color: #c09043;
    font-size: var(--kyvera-eyebrow-size);
    font-weight: 700;
    letter-spacing: var(--kyvera-eyebrow-tracking);
    text-transform: uppercase;
  }

  .kyvera-section-four__eyebrow::before {
    content: "";
    width: 38px;
    height: 1px;
    background: #c09043;
  }

  .kyvera-section-four h2 {
    max-width: 760px;
    margin: 0 0 22px;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-h2-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: var(--kyvera-h2-line-height);
  }

  .kyvera-section-four__lead {
    max-width: 620px;
    margin: 0 0 6px;
    color: #29414d;
    font-size: var(--kyvera-lead-size);
    font-weight: 600;
    line-height: 1.6;
  }

  .kyvera-section-four__copy {
    max-width: 620px;
    margin: 0 0 40px;
    color: #5f6f78;
    font-size: var(--kyvera-copy-size);
    line-height: var(--kyvera-copy-line-height);
  }

  .kyvera-section-four__items {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
  }

  .kyvera-section-four__item-icon {
    display: block;
    width: 30px;
    height: 30px;
    margin-bottom: 18px;
    color: #102d3d;
  }

  .kyvera-section-four__item-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  .kyvera-section-four__item h3 {
    margin: 0 0 8px;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(12px, 0.9vw, var(--kyvera-card-title-size));
    font-weight: 400;
    letter-spacing: 0.005em;
    line-height: 1.3;
    white-space: nowrap;
    min-height: 22px;
    display: flex;
    align-items: center;
  }

  .kyvera-section-four__item p {
    margin: 0;
    color: #7c8991;
    font-size: var(--kyvera-card-copy-size);
    line-height: 1.6;
  }

  .kyvera-section-four__side {
    position: relative;
    padding-left: 34px;
    align-self: start;
    margin-top: 8px;
  }

  .kyvera-section-four__side::before {
    content: "";
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 0;
    width: 1px;
    background: rgba(16, 45, 61, 0.16);
  }

  .kyvera-section-four__quote {
    margin: 0 0 18px;
    color: #29414d;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-style: italic;
    font-weight: 400;
    line-height: 1.5;
  }

  .kyvera-section-four__signature {
    color: #a9865a;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.25em;
    text-transform: uppercase;
  }

  @media (max-width: 1100px) {
    .kyvera-section-four__inner {
      grid-template-columns: 1fr;
    }

    .kyvera-section-four__side {
      padding-left: 0;
      margin-top: 40px;
    }

    .kyvera-section-four__side::before {
      display: none;
    }
  }

  @media (max-width: 767px) {
    .kyvera-section-four__inner {
      width: min(100% - 42px, 560px);
      padding: 78px 0;
    }

    .kyvera-section-four__items {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      row-gap: 34px;
    }
  }

  
/* =====================================================================
   THE KYVERA ORCHESTRATION LAYER — 5-stage flow section
   (sits directly above "How Kyvera Works"; reuses the site's shared
   reveal system + --kyvera-h2-*/--kyvera-copy-* typography tokens so its
   heading/description match every other section exactly; colors are
   scoped locally under .kyvera-orch to avoid clashing with any other
   section's own local custom properties)
   ===================================================================== */

/* Sequential left/right/zoom entrance for the header block — each child
   (logo, eyebrow, title, subtitle, copy) carries its own [data-reveal]
   direction; this nth-child ladder staggers WHEN each one starts
   animating (all trigger from the same scroll position since they're
   close together vertically) so they read as a deliberate one-by-one
   choreography rather than everything moving at once. */
.kyvera-orch__header > [data-reveal]:nth-child(1) { transition-delay: 0s; }
.kyvera-orch__header > [data-reveal]:nth-child(2) { transition-delay: 0.18s; }
.kyvera-orch__header > [data-reveal]:nth-child(3) { transition-delay: 0.36s; }
.kyvera-orch__header > [data-reveal]:nth-child(4) { transition-delay: 0.54s; }
.kyvera-orch__header > [data-reveal]:nth-child(5) { transition-delay: 0.72s; }

/* "Drop down" stagger variant for the 5 orchestration cards — each card
   starts slightly above its resting position and gently overshoots past
   it before settling (the overshoot comes from the cubic-bezier below,
   not from any scaleY squish, so the card's own text/image never
   distorts) — reads as each card individually "dropping" into place one
   after another, left to right. */
[data-reveal-stagger="drop"] > * {
  opacity: 0;
  transform: translateY(-46px);
  transition-property: opacity, transform;
  transition-duration: 0.95s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
[data-reveal-stagger="drop"].is-visible > * { opacity: 1; transform: none; }
[data-reveal-stagger="drop"] > *:nth-child(1) { transition-delay: 0.1s; }
[data-reveal-stagger="drop"] > *:nth-child(2) { transition-delay: 0.34s; }
[data-reveal-stagger="drop"] > *:nth-child(3) { transition-delay: 0.58s; }
[data-reveal-stagger="drop"] > *:nth-child(4) { transition-delay: 0.82s; }
[data-reveal-stagger="drop"] > *:nth-child(5) { transition-delay: 1.06s; }

.kyvera-orch {
  --orch-ink: #102d3d;
  --orch-muted: #5f6f78;
  --orch-faint: #8b96a0;
  --orch-accent: #c09043;
  --orch-accent-light: #d4a75c;
  --orch-line: rgba(16, 45, 61, 0.1);
  --orch-card-bg: #fbfbf8;
  position: relative;
  background: #f7f7f3;
  padding: 96px 0 110px;
  font-family: Arial, Helvetica, sans-serif;
  overflow: clip;
}

.kyvera-orch__bg-building,
.kyvera-orch__bg-globe {
  position: absolute;
  top: 0;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.kyvera-orch__bg-building {
  left: 0;
  width: clamp(180px, 18vw, 300px);
  height: auto;
  opacity: 0.9;
  -webkit-mask-image: linear-gradient(115deg, #000 55%, transparent 92%),
    linear-gradient(to bottom, #000 65%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(115deg, #000 55%, transparent 92%),
    linear-gradient(to bottom, #000 65%, transparent 100%);
  mask-composite: intersect;
}
.kyvera-orch__bg-globe {
  right: 0;
  width: clamp(200px, 20vw, 332px);
  height: auto;
  opacity: 0.9;
  -webkit-mask-image: linear-gradient(245deg, #000 55%, transparent 92%),
    linear-gradient(to bottom, #000 65%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(245deg, #000 55%, transparent 92%),
    linear-gradient(to bottom, #000 65%, transparent 100%);
  mask-composite: intersect;
}

.kyvera-orch__inner {
  position: relative;
  z-index: 1;
  width: min(1260px, calc(100% - 64px));
  margin: 0 auto;
}

/* ---- Header block ---- */
.kyvera-orch__header {
  text-align: center;
  max-width: 860px;
  margin: 0 auto 54px;
}

.kyvera-orch__logo {
  /* !important needed: Elementor's global ".elementor img { height: auto;
     max-width: 100%; }" reset has the same specificity as this selector
     and loads after custom.css, so without !important it wins the tie and
     the logo renders at its raw uploaded size (1520x192) instead of 26px. */
  display: block !important;
  height: 26px !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 auto 8px;
}

.kyvera-orch__eyebrow {
  margin: 0 0 30px;
  color: var(--orch-accent);
  font-size: var(--kyvera-eyebrow-size);
  font-weight: 700;
  letter-spacing: var(--kyvera-eyebrow-tracking);
  text-transform: uppercase;
}

.kyvera-orch__title {
  margin: 0 0 18px;
  color: var(--orch-ink);
  font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
  font-weight: 400;
  font-size: var(--kyvera-h2-size);
  letter-spacing: var(--kyvera-h2-letter-spacing);
  line-height: var(--kyvera-h2-line-height);
}

.kyvera-orch__subtitle {
  margin: 0 0 22px;
  color: #4a5b66;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.kyvera-orch__copy {
  margin: 0;
  color: var(--orch-muted);
  font-size: var(--kyvera-copy-size);
  line-height: var(--kyvera-copy-line-height);
}

/* ---- "ORCHESTRATION FLOW" divider ---- */
.kyvera-orch__flow-label {
  position: relative;
  margin: 0 0 22px;
  padding-top: 14px;
  text-align: center;
  color: var(--orch-ink);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}
.kyvera-orch__flow-label::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 46px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--orch-accent) 35%, var(--orch-accent) 65%, transparent);
}

/* ---- Connector (stem + bracket + drops into the outer/center badges) ---- */
.kyvera-orch__connector-shell {
  position: relative;
  height: 76px;
  /* Both this shell and .kyvera-orch__card below are position:relative
     with no z-index of their own — without this, plain DOM order decides
     stacking, and since the card grid comes AFTER this shell in the
     markup, the cards' white backgrounds would paint OVER the connector
     line/drops wherever the SVG (which intentionally extends down past
     the shell's own height, all the way to each badge) overlaps them. */
  z-index: 5;
}
.kyvera-orch__connector-svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: visible;
  pointer-events: none;
}
.kyvera-orch__connector-svg path {
  fill: none;
  stroke: var(--orch-accent);
  stroke-width: 2;
  stroke-linecap: round;
}
.kyvera-orch__connector-svg path.stem { stroke-linecap: butt; }

/* ---- 5-card grid ---- */
.kyvera-orch__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.kyvera-orch__card {
  position: relative;
  background: var(--orch-card-bg);
  border: 1px solid var(--orch-line);
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(16, 45, 61, 0.06);
  display: flex;
  flex-direction: column;
}

.kyvera-orch__banner {
  position: relative;
  height: 96px;
  margin: 0;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
}
.kyvera-orch__banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.kyvera-orch__badge {
  position: absolute;
  left: 50%;
  top: -25px;
  transform: translateX(-50%);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: var(--orch-ink);
  border: 2px solid var(--orch-accent-light);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 16px rgba(16, 45, 61, 0.28);
  z-index: 2;
}
.kyvera-orch__badge svg {
  width: 22px;
  height: 22px;
  stroke: var(--orch-accent-light);
}

.kyvera-orch__body {
  padding: 40px 18px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.kyvera-orch__num {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  color: var(--orch-accent);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
}
.kyvera-orch__num::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--orch-accent);
  flex-shrink: 0;
}

.kyvera-orch__card-title {
  margin: 0 0 6px;
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 800;
  font-size: 16.5px;
  line-height: 1.3;
  color: var(--orch-ink);
  min-height: 65px;
}

.kyvera-orch__card-subtitle {
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--orch-faint);
}

.kyvera-orch__card-divider {
  height: 1px;
  background: var(--orch-line);
  margin: 0 0 14px;
}

.kyvera-orch__label {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: var(--orch-ink);
}

.kyvera-orch__list {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  flex: 1;
}
.kyvera-orch__list li {
  position: relative;
  padding-left: 14px;
  margin: 0 0 9px;
  font-size: 12.5px;
  line-height: 1.5;
  color: #45535c;
}
.kyvera-orch__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--orch-accent);
}

.kyvera-orch__output {
  margin-top: auto;
  padding: 14px 14px;
  border-radius: 8px;
  background: rgba(16, 45, 61, 0.045);
}
.kyvera-orch__output b {
  display: block;
  margin: 0 0 4px;
  color: var(--orch-accent);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.kyvera-orch__output span {
  display: block;
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--orch-muted);
}

/* ---- bottom tagline ---- */
.kyvera-orch__tagline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 56px;
  color: var(--orch-faint);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}
.kyvera-orch__tagline::before,
.kyvera-orch__tagline::after {
  content: "";
  width: 46px;
  height: 1px;
  background: rgba(16, 45, 61, 0.18);
}

@media (max-width: 1080px) {
  .kyvera-orch__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; row-gap: 46px; }
  .kyvera-orch__connector-shell { display: none; }
}
@media (max-width: 640px) {
  .kyvera-orch__grid { grid-template-columns: 1fr; }
  .kyvera-orch__bg-building, .kyvera-orch__bg-globe { display: none; }
}
.kyvera-section-five {
    position: relative;
    overflow: hidden;
    background: #071a2a;
    color: #eef2f3;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-section-five__inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 120px 0;
    display: grid;
    grid-template-columns: minmax(340px, 1fr) minmax(340px, 1fr);
    align-items: center;
    gap: clamp(40px, 5vw, 80px);
  }

  .kyvera-section-five__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 24px;
    color: #ffffff;
    font-size: var(--kyvera-eyebrow-size);
    font-weight: 700;
    letter-spacing: var(--kyvera-eyebrow-tracking);
    text-transform: uppercase;
  }

  .kyvera-section-five__eyebrow::after {
    content: "";
    width: 38px;
    height: 1px;
    background: rgba(255, 255, 255, 0.8);
  }

  .kyvera-section-five h2 {
    max-width: 100%;
    margin: 0 0 46px;
    color: #ffffff;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(26px, 2.3vw, 36px);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: 1.2;
  }

  .kyvera-section-five__line {
    display: block;
    white-space: nowrap;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
  }

  .kyvera-approach-list {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-approach-list::before {
    content: "";
    position: absolute;
    top: 21px;
    bottom: 21px;
    left: 20px;
    width: 1px;
    background: linear-gradient(180deg, rgba(212, 167, 92, 0.55), rgba(212, 167, 92, 0.12));
  }

  .kyvera-approach-item {
    position: relative;
    display: flex;
    gap: 22px;
    padding-bottom: 32px;
    cursor: pointer;
    border-radius: 10px;
  }

  .kyvera-approach-item:last-child {
    padding-bottom: 0;
  }

  .kyvera-approach-item:focus-visible {
    outline: 2px solid #d4a75c;
    outline-offset: 8px;
  }

  .kyvera-approach-item__num {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(212, 167, 92, 0.55);
    border-radius: 50%;
    background: #0c2032;
    color: #d4a75c;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 15px;
    transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease;
  }

  .kyvera-approach-item:hover .kyvera-approach-item__num {
    border-color: #d4a75c;
  }

  .kyvera-approach-item.is-active .kyvera-approach-item__num {
    background: #d4a75c;
    color: #0c2032;
    border-color: #f0cf94;
    box-shadow: 0 0 0 5px rgba(212, 167, 92, 0.18), 0 0 18px rgba(212, 167, 92, 0.55);
    transform: scale(1.06);
  }

  .kyvera-approach-item h3 {
    margin: 4px 0 8px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-card-title-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-card-title-letter-spacing);
    line-height: var(--kyvera-card-title-line-height);
    transition: color 0.35s ease;
  }

  .kyvera-approach-item.is-active h3 {
    color: #d4a75c;
  }

  .kyvera-approach-item p {
    margin: 0;
    max-width: 460px;
    color: #a7b3b8;
    font-size: var(--kyvera-card-copy-size);
    line-height: 1.7;
  }

  .kyvera-orbit {
    position: relative;
    width: min(520px, 100%);
    aspect-ratio: 1 / 1;
    margin: 0 auto;
  }

  .kyvera-orbit__ring {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
  }

  .kyvera-orbit__ring--outer {
    width: 100%;
    height: 100%;
    border: 1px dashed rgba(212, 167, 92, 0.16);
  }

  .kyvera-orbit__ring--main {
    width: 82.6%;
    height: 82.6%;
    border: 1px solid rgba(212, 167, 92, 0.4);
  }

  .kyvera-orbit__ring--inner {
    width: 58%;
    height: 58%;
    border: 1px dotted rgba(212, 167, 92, 0.22);
  }

  /* These 4 @keyframes were referenced by "animation:" below (and by
     .kyvera-orbit__node-dot further down) but the keyframe DEFINITIONS
     themselves were never ported from the static reference (index.html)
     into this stylesheet — referencing an undefined animation name is
     silently ignored by the browser (no error), so the whole orbit diagram
     rendered fully static: no traveling light along the spoke lines, no
     center ring pulse, no node "arrival" flash, no active-node pulse. */
  @keyframes orbitPulseActive {
    0%, 100% {
      box-shadow: 0 0 0 6px rgba(212, 167, 92, 0.22), 0 0 22px rgba(212, 167, 92, 0.85);
      transform: scale(1.15);
    }
    50% {
      box-shadow: 0 0 0 10px rgba(212, 167, 92, 0.32), 0 0 34px rgba(212, 167, 92, 1);
      transform: scale(1.3);
    }
  }

  @keyframes orbitSpokeTravel {
    0%   { left: 0%;   opacity: 0; }
    7%   { opacity: 1; }
    44%  { left: 100%; opacity: 1; }
    52%  { left: 100%; opacity: 0; }
    100% { left: 100%; opacity: 0; }
  }

  @keyframes orbitCenterPulse {
    0%   { transform: scale(1);    opacity: 0.85; }
    10%  { transform: scale(1);    opacity: 0.85; }
    46%  { transform: scale(1.55); opacity: 0; }
    100% { transform: scale(1.55); opacity: 0; }
  }

  @keyframes orbitNodeArrival {
    0%, 38%   { box-shadow: 0 0 16px rgba(212, 167, 92, 0.55); filter: brightness(1); }
    46%       { box-shadow: 0 0 28px 9px rgba(246, 217, 160, 0.95); filter: brightness(1.4); }
    62%, 100% { box-shadow: 0 0 16px rgba(212, 167, 92, 0.55); filter: brightness(1); }
  }

  .kyvera-orbit__spoke {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 41.3%;
    height: 1px;
    background: linear-gradient(90deg, rgba(212, 167, 92, 0.5), rgba(212, 167, 92, 0));
    transform-origin: left center;
  }

  .kyvera-orbit__spoke::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0%;
    width: 44px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(212, 167, 92, 0) 0%, #fff3da 50%, rgba(212, 167, 92, 0) 100%);
    filter: drop-shadow(0 0 6px rgba(246, 217, 160, 0.85));
    transform: translate(-2px, -50%);
    opacity: 0;
    pointer-events: none;
    animation: orbitSpokeTravel 3.6s cubic-bezier(0.6, 0, 0.4, 1) infinite;
  }

  @media (prefers-reduced-motion: reduce) {
    .kyvera-orbit__spoke::after {
      animation: none;
      opacity: 0;
    }
  }

  .kyvera-orbit__spoke--01 { transform: rotate(-90deg); }
  .kyvera-orbit__spoke--02 { transform: rotate(-18deg); }
  .kyvera-orbit__spoke--03 { transform: rotate(54deg); }
  .kyvera-orbit__spoke--04 { transform: rotate(126deg); }
  .kyvera-orbit__spoke--05 { transform: rotate(198deg); }

  .kyvera-orbit__center {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 39%;
    height: 39%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(212, 167, 92, 0.45);
    background: radial-gradient(circle at 50% 40%, rgba(212, 167, 92, 0.14), rgba(12, 32, 50, 0.9) 70%);
    text-align: center;
  }

  .kyvera-orbit__center::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid rgba(246, 217, 160, 0.85);
    opacity: 0;
    pointer-events: none;
    animation: orbitCenterPulse 3.6s cubic-bezier(0.25, 0, 0.4, 1) infinite;
  }

  @media (prefers-reduced-motion: reduce) {
    .kyvera-orbit__center::after {
      animation: none;
      opacity: 0;
    }
  }

  .kyvera-orbit__center-brand {
    color: #fbfbf8;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(16px, 1.9vw, 22px);
    letter-spacing: 0.16em;
  }

  .kyvera-orbit__center-sub {
    margin-top: 8px;
    color: #d4a75c;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
  }

  .kyvera-orbit__node {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translate(-50%, -50%);
  }

  .kyvera-orbit__node-dot {
    display: block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid rgba(212, 167, 92, 0.75);
    background: radial-gradient(circle at 40% 35%, #f0cf94, #d4a75c 65%, #9c7538 100%);
    box-shadow: 0 0 16px rgba(212, 167, 92, 0.55);
    transition: transform 0.35s ease;
  }

  .kyvera-orbit__node.is-active .kyvera-orbit__node-dot {
    animation: orbitPulseActive 1.6s ease-in-out infinite;
    border-color: #f6d9a0;
    background: radial-gradient(circle at 40% 35%, #fff3da, #f0cf94 55%, #d4a75c 100%);
  }

  /* Syncs with orbitSpokeTravel (same 3.6s duration/phase) so each dot
     flashes brighter right as the traveling light reaches it. Skipped on
     the currently is-active dot, which already has its own pulse. */
  .kyvera-orbit__node:not(.is-active) .kyvera-orbit__node-dot {
    animation: orbitNodeArrival 3.6s cubic-bezier(0.6, 0, 0.4, 1) infinite;
  }

  @media (prefers-reduced-motion: reduce) {
    .kyvera-orbit__node:not(.is-active) .kyvera-orbit__node-dot {
      animation: none;
    }
  }

  .kyvera-orbit__node-label {
    margin-top: 10px;
    color: #cfd8db;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.5;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    transition: color 0.35s ease;
  }

  .kyvera-orbit__node.is-active .kyvera-orbit__node-label {
    color: #fbfbf8;
  }

  .kyvera-orbit__node-label b {
    display: block;
    color: #d4a75c;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    transition: color 0.35s ease, text-shadow 0.35s ease;
  }

  .kyvera-orbit__node.is-active .kyvera-orbit__node-label b {
    color: #f6d9a0;
    text-shadow: 0 0 12px rgba(212, 167, 92, 0.75);
  }

  .kyvera-orbit__node--01 {
    top: 8.7%;
    left: 50%;
    flex-direction: column-reverse;
  }

  .kyvera-orbit__node--01 .kyvera-orbit__node-label {
    margin-top: 0;
    margin-bottom: 10px;
  }

  .kyvera-orbit__node--02 { top: 37.2%; left: 89.3%; }
  .kyvera-orbit__node--03 { top: 83.4%; left: 74.3%; }
  .kyvera-orbit__node--04 { top: 83.4%; left: 25.7%; }
  .kyvera-orbit__node--05 { top: 37.2%; left: 10.7%; }

  @media (max-width: 1100px) {
    .kyvera-section-five__inner {
      grid-template-columns: 1fr;
    }

    .kyvera-orbit {
      margin-top: 20px;
    }
  }

  @media (max-width: 640px) {
    .kyvera-section-five__inner {
      width: min(100% - 42px, 560px);
      padding: 78px 0;
    }

    .kyvera-section-five h2 {
      font-size: clamp(13px, 4.6vw, 22px);
    }

    .kyvera-orbit__node-label {
      white-space: normal;
      max-width: 82px;
    }
  }

  /* ===== Section Six: Industries We Serve ===== */
  .kyvera-section-six {
    background: #f7f7f3;
    color: #102d3d;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-section-six__inner {
    width: min(1360px, calc(100% - 120px));
    margin: 0 auto;
    padding: 96px 0;
  }

  .kyvera-section-six__header {
    margin: 0 0 40px;
  }

  .kyvera-section-six__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 24px;
    color: #c09043;
    font-size: var(--kyvera-eyebrow-size);
    font-weight: 700;
    letter-spacing: var(--kyvera-eyebrow-tracking);
    text-transform: uppercase;
  }

  .kyvera-section-six__eyebrow::before {
    content: "";
    width: 38px;
    height: 1px;
    background: #c09043;
  }

  .kyvera-section-six h2 {
    max-width: 640px;
    margin: 0;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-h2-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: var(--kyvera-h2-line-height);
  }

  .kyvera-section-six__row {
    display: grid;
    grid-template-columns: minmax(300px, 0.88fr) minmax(340px, 1.12fr);
    align-items: stretch;
    gap: clamp(50px, 6vw, 90px);
  }

  .kyvera-section-six__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, 1fr);
    gap: 14px;
  }

  /* Clearly sequential one-by-one reveal for these six cards (rather than
     the site-wide default's subtle ~0.09s cascade). */
  .kyvera-section-six__cards > *:nth-child(1) { transition-delay: 0s !important; }
  .kyvera-section-six__cards > *:nth-child(2) { transition-delay: 0.12s !important; }
  .kyvera-section-six__cards > *:nth-child(3) { transition-delay: 0.24s !important; }
  .kyvera-section-six__cards > *:nth-child(4) { transition-delay: 0.36s !important; }
  .kyvera-section-six__cards > *:nth-child(5) { transition-delay: 0.48s !important; }
  .kyvera-section-six__cards > *:nth-child(6) { transition-delay: 0.6s !important; }

  .kyvera-section-six__card {
    padding: 18px 14px 18px;
    border: 1px solid rgba(16, 45, 61, 0.08);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(16, 45, 61, 0.05);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    translate: 0 0;
    transition:
      translate 320ms cubic-bezier(0.16, 1, 0.3, 1),
      background-color 320ms ease,
      border-color 320ms ease,
      box-shadow 320ms ease;
  }

  .kyvera-section-six__card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin: 0 auto 12px;
    border: 1px solid rgba(16, 45, 61, 0.14);
    border-radius: 50%;
    color: #102d3d;
    transition:
      color 280ms ease,
      border-color 280ms ease,
      background-color 280ms ease,
      transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .kyvera-section-six__card-icon svg {
    width: 21px;
    height: 21px;
  }

  .kyvera-section-six__card h3 {
    margin: 0 0 6px;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-card-title-size);
    font-weight: 400;
    line-height: var(--kyvera-card-title-line-height);
    letter-spacing: var(--kyvera-card-title-letter-spacing);
    transition: color 280ms ease;
  }

  .kyvera-section-six__card p {
    margin: 0;
    color: #68767c;
    font-size: var(--kyvera-card-copy-size);
    line-height: 1.6;
    transition: color 280ms ease;
  }

  .kyvera-section-six__card.is-featured {
    border-color: #102d3d;
    background: #102d3d;
    box-shadow: 0 18px 38px rgba(16, 45, 61, 0.18);
  }

  .kyvera-section-six__card.is-featured .kyvera-section-six__card-icon {
    border-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
  }

  .kyvera-section-six__card.is-featured h3,
  .kyvera-section-six__card.is-featured p {
    color: #ffffff;
  }

  @media (hover: hover) {
    .kyvera-section-six__card:hover {
      translate: 0 -9px;
      border-color: #102d3d;
      background: #102d3d;
      box-shadow: 0 22px 46px rgba(16, 45, 61, 0.2);
    }

    .kyvera-section-six__card:hover .kyvera-section-six__card-icon {
      border-color: rgba(255, 255, 255, 0.5);
      color: #ffffff;
      transform: translateY(-5px) scale(1.1) rotate(-5deg);
    }

    .kyvera-section-six__card:hover h3,
    .kyvera-section-six__card:hover p {
      color: #ffffff;
    }

    .kyvera-section-six__card.is-featured:hover {
      border-color: rgba(16, 45, 61, 0.12);
      background: #ffffff;
      box-shadow: 0 22px 46px rgba(16, 45, 61, 0.12);
    }

    .kyvera-section-six__card.is-featured:hover .kyvera-section-six__card-icon {
      border-color: rgba(16, 45, 61, 0.18);
      color: #102d3d;
    }

    .kyvera-section-six__card.is-featured:hover h3 {
      color: #102d3d;
    }

    .kyvera-section-six__card.is-featured:hover p {
      color: #68767c;
    }
  }

  .kyvera-section-six__visual {
    display: flex;
    justify-content: center;
    align-items: stretch;
    min-width: 0;
  }

  .kyvera-section-six__visual img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
  }

  @media (max-width: 1100px) {
    .kyvera-section-six__row {
      grid-template-columns: 1fr;
    }

    .kyvera-section-six__visual {
      order: 2;
      margin-top: 56px;
      height: auto;
    }

    .kyvera-section-six__visual img {
      height: auto;
      max-width: 100%;
    }
  }

  @media (max-width: 640px) {
    .kyvera-section-six__inner {
      width: min(100% - 42px, 560px);
      padding: 78px 0;
    }

    .kyvera-section-six__cards {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(3, auto);
    }
  }

  /* ===== CTA banner: sits between "Industries We Serve" and
     "The Kyvera Difference" ===== */
  .kyvera-cta-banner {
    position: relative;
    overflow: hidden;
    background:
      linear-gradient(118deg, rgba(7, 20, 35, 0.68) 0%, rgba(11, 32, 50, 0.6) 48%, rgba(18, 43, 64, 0.65) 100%),
      url("https://kyvera.io/wp-content/uploads/2026/09/kyvera-cta-bg-skyline.png") center 22% / cover no-repeat;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-cta-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 14% 22%, rgba(212, 167, 92, 0.22), transparent 38%),
      radial-gradient(circle at 88% 82%, rgba(212, 167, 92, 0.14), transparent 34%);
    pointer-events: none;
  }

  .kyvera-cta-banner__inner {
    position: relative;
    z-index: 1;
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;
    padding: 58px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
  }

  .kyvera-cta-banner__text h2 {
    margin: 0 0 8px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.3;
  }

  .kyvera-cta-banner__text p {
    margin: 0;
    max-width: 560px;
    color: #aab7bc;
    font-size: 14px;
    line-height: 1.65;
  }

  /* #kyveraCtaBanner-style scoping not available here (raw HTML section,
     no stable wrapper id) — .kyvera-cta-banner__btn prefixed with the
     section class instead. Needed because this is a <button type="button">,
     which also matches hello-elementor/reset.css's
     "[type=button],[type=submit],button { border:1px solid #cc3366; color:#cc3366 }"
     rule at the same (0,1,0) specificity as our own single-class selector;
     reset.css loads later and was winning the tie (same pattern fixed
     earlier for the chat widget and Partner form buttons). */
  .kyvera-cta-banner .kyvera-cta-banner__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-shrink: 0;
    min-height: 54px;
    padding: 0 30px;
    border: none;
    border-radius: 28px;
    background: linear-gradient(135deg, #f0cf94, #d4a75c 60%, #c09043);
    color: #10202c;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 14px 30px rgba(212, 167, 92, 0.28);
    transition: 220ms ease;
  }

  .kyvera-cta-banner__btn span {
    transition: transform 220ms ease;
  }

  .kyvera-cta-banner .kyvera-cta-banner__btn:hover,
  .kyvera-cta-banner .kyvera-cta-banner__btn:focus-visible {
    background: linear-gradient(135deg, #fff3da, #f0cf94 55%, #d4a75c);
    box-shadow: 0 18px 38px rgba(212, 167, 92, 0.4);
    transform: translateY(-2px);
  }

  .kyvera-cta-banner__btn:hover span,
  .kyvera-cta-banner__btn:focus-visible span {
    transform: translateX(3px);
  }

  @media (max-width: 720px) {
    .kyvera-cta-banner__inner {
      flex-direction: column;
      align-items: flex-start;
      padding: 44px 0;
    }

    .kyvera-cta-banner .kyvera-cta-banner__btn {
      width: 100%;
    }
  }

  /* ===== Section Seven: The Kyvera Difference ===== */
  .kyvera-section-seven {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #fdfdfb 0%, #f4f5f2 100%);
    color: #102d3d;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-section-seven__inner {
    width: min(1440px, calc(100% - 120px));
    margin: 0 auto;
    padding: 108px 0 56px;
    display: grid;
    grid-template-columns: minmax(240px, 0.72fr) minmax(220px, 0.66fr) minmax(280px, 0.92fr);
    align-items: center;
    gap: clamp(20px, 3.5vw, 56px);
  }

  .kyvera-section-seven__eyebrow {
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .kyvera-section-seven__eyebrow::before {
    content: "";
    width: 34px;
    height: 1px;
    background: #c09043;
  }

  .kyvera-section-seven__eyebrow::after {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #c09043;
  }

  .kyvera-section-seven h2 {
    max-width: 380px;
    margin: 0 0 20px;
    color: #102d3d;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-h2-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: var(--kyvera-h2-line-height);
  }

  .kyvera-section-seven h2 em {
    color: #c09043;
    font-style: normal;
  }

  .kyvera-section-seven__subheading {
    max-width: 340px;
    margin: 0;
    color: #102d3d;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-lead-size);
    font-weight: 600;
    line-height: 1.6;
  }

  .kyvera-section-seven__visual {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: end;
    width: 100%;
    max-width: 480px;
    aspect-ratio: 16 / 9;
    min-width: 0;
    overflow: visible;
  }

  .kyvera-section-seven__visual img {
    display: block;
    width: 100%;
    max-width: 480px;
    height: auto;
    border-radius: 0;
  }

  .kyvera-section-seven__visual video {
    /* !important on the geometry props: Elementor's global reset
       (".elementor embed, .elementor iframe, .elementor object,
       .elementor video { width: 100%; ... }") ties this rule's specificity
       (class + element, same as ours) and loads after custom.css, so it was
       winning the cascade and clamping the video to 100% width — collapsing
       the intended 210%-oversized, mask-cropped "peek through an oval" shot
       into a plain small rectangle sitting in the wrong spot. */
    position: absolute !important;
    top: -55% !important;
    left: -55% !important;
    width: 210% !important;
    height: 210% !important;
    max-width: none !important;
    /* centering uses plain top/left/width/height (not transform) because the
       site-wide reveal system forces transform:none on [data-reveal].is-visible */
    mix-blend-mode: multiply;
    -webkit-mask-image: radial-gradient(ellipse 46% 64% at 52% 54%, #000 0%, #000 46%, transparent 84%);
    mask-image: radial-gradient(ellipse 46% 64% at 52% 54%, #000 0%, #000 46%, transparent 84%);
    pointer-events: none;
  }

  .kyvera-section-seven__list {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-section-seven__list li {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 0;
    border-top: 1px solid rgba(16, 45, 61, 0.1);
  }

  .kyvera-section-seven__list li:first-child {
    padding-top: 0;
    border-top: none;
  }

  .kyvera-section-seven__list li:last-child {
    padding-bottom: 0;
  }

  .kyvera-section-seven__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #102d3d;
    color: #d4a75c;
  }

  .kyvera-section-seven__icon svg {
    width: 20px;
    height: 20px;
  }

  .kyvera-section-seven__list h3 {
    margin: 0 0 4px;
    color: #c09043;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-card-title-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-card-title-letter-spacing);
    line-height: var(--kyvera-card-title-line-height);
  }

  .kyvera-section-seven__list p {
    margin: 0;
    color: #5f6f78;
    font-size: var(--kyvera-card-copy-size);
    line-height: 1.6;
  }

  @media (max-width: 1100px) {
    .kyvera-section-seven__inner {
      grid-template-columns: 1fr;
      justify-items: center;
      text-align: center;
    }

    .kyvera-section-seven__eyebrow {
      justify-content: center;
    }

    .kyvera-section-seven h2 {
      max-width: 520px;
    }

    .kyvera-section-seven__visual {
      order: 2;
      margin: 20px 0 36px;
      overflow: hidden;
      border-radius: 16px;
    }

    .kyvera-section-seven__list {
      order: 3;
      width: 100%;
      max-width: 560px;
    }

    .kyvera-section-seven__list li {
      text-align: left;
    }
  }

  @media (max-width: 640px) {
    .kyvera-section-seven__inner {
      width: min(100% - 42px, 560px);
      padding: 72px 0;
    }
  }

  /* ===== Section: Explore Insights (blog feed, WordPress-powered) ===== */
  .kyvera-blog {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, #0d2242 0%, #0b1e3f 55%, #091a38 100%);
    color: #f2f5f8;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-blog__inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 100px 0;
  }

  .kyvera-blog__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin: 0 0 44px;
  }

  .kyvera-blog__eyebrow {
    margin: 0 0 12px;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: clamp(22px, 2vw, 30px);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  .kyvera-blog__eyebrow span {
    color: #6c93d8;
  }

  .kyvera-blog__subtitle {
    max-width: 620px;
    margin: 0;
    color: #a7b2c4;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
  }

  .kyvera-blog__nav {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
  }

  .kyvera-blog .kyvera-blog__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid #f2f5f8;
    background: transparent;
    color: #f2f5f8;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
  }

  .kyvera-blog__arrow svg {
    width: 16px;
    height: 16px;
  }

  .kyvera-blog .kyvera-blog__arrow:hover {
    border-color: #d4a75c;
    background: transparent;
    color: #d4a75c;
    transform: translateY(-2px);
  }

  .kyvera-blog .kyvera-blog__arrow--next {
    background: #f2f5f8;
    border-color: #f2f5f8;
    color: #0b1e3f;
  }

  .kyvera-blog .kyvera-blog__arrow--next:hover {
    background: #d4a75c;
    border-color: #d4a75c;
    color: #10202c;
  }

  .kyvera-blog__track-wrap {
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  .kyvera-blog__track-wrap::-webkit-scrollbar {
    display: none;
  }

  .kyvera-blog__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(300px, 1fr);
    gap: 32px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-blog__card {
    scroll-snap-align: start;
  }

  .kyvera-blog__track-wrap {
    scroll-snap-type: x proximity;
  }

  .kyvera-blog__card-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
  }

  .kyvera-blog__card-media {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 6px;
    aspect-ratio: 16 / 10;
    background: #0f2439;
  }

  .kyvera-blog__card-media img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain;
    transition: transform 0.5s ease;
  }

  .kyvera-blog__card-link:hover .kyvera-blog__card-media img {
    transform: scale(1.05);
  }

  .kyvera-blog__card-date {
    margin: 18px 0 10px;
    color: #8e9bb0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .kyvera-blog__card-title {
    margin: 0;
    color: #f2f5f8;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
  }

  @media (max-width: 900px) {
    .kyvera-blog__inner {
      padding: 76px 0;
    }

    .kyvera-blog__head {
      flex-direction: column;
      align-items: flex-start;
    }

    .kyvera-blog__track {
      grid-auto-columns: minmax(260px, 82%);
    }
  }

  @media (max-width: 640px) {
    .kyvera-blog__inner {
      width: min(100% - 42px, 560px);
      padding: 64px 0;
    }

    .kyvera-blog__eyebrow {
      font-size: 20px;
    }

    .kyvera-blog__track {
      grid-auto-columns: minmax(240px, 88%);
      gap: 20px;
    }
  }

  /* ===== Blog Archive ("Insights" posts page, /insights/) =====
     Reuses the exact same .kyvera-blog__card/-media/-date/-title classes
     as the homepage carousel above, but laid out as a paginated grid
     instead of a horizontal scroll track. See templates/
     elementor-template-wrapper.php + kyvera_blog_grid shortcode. */
  .kyvera-blog-archive {
    background: #0a1c2b;
    color: #cfd8db;
    font-family: "Montserrat", Arial, sans-serif;
  }

  .kyvera-blog-archive__hero {
    width: min(1320px, calc(100% - 120px));
    max-width: 1320px;
    margin: 0 auto;
    padding: 150px 0 40px;
  }

  .kyvera-blog-archive__eyebrow,
  .kyvera-blog-archive__eyebrow .elementor-heading-title {
    margin: 0 0 14px !important;
    color: #d4a75c !important;
    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: var( --kyvera-eyebrow-size ) !important;
    font-weight: 700 !important;
    letter-spacing: var( --kyvera-eyebrow-tracking );
    text-transform: uppercase;
  }

  .kyvera-blog-archive__title,
  .kyvera-blog-archive__title .elementor-heading-title {
    margin: 0 0 16px !important;
    color: #f2f5f8 !important;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
    font-size: var( --kyvera-h2-size ) !important;
    font-weight: 400 !important;
    letter-spacing: var( --kyvera-h2-letter-spacing );
    line-height: var( --kyvera-h2-line-height );
  }

  .kyvera-blog-archive__subtitle,
  .kyvera-blog-archive__subtitle p {
    max-width: 620px;
    margin: 0 !important;
    color: #a7b2c4 !important;
    font-size: var( --kyvera-copy-size ) !important;
    line-height: 1.7 !important;
  }

  .kyvera-blog-archive__body {
    width: min(1320px, calc(100% - 120px));
    max-width: 1320px;
    margin: 0 auto;
    padding: 10px 0 110px;
  }

  .kyvera-blog-archive__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px 32px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-blog-archive__empty {
    padding: 40px 0 10px;
    color: #a7b2c4;
    font-size: 15px;
  }

  .kyvera-blog-archive__pagination ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 56px 0 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-blog-archive__pagination a,
  .kyvera-blog-archive__pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 8px;
    border: 1px solid rgba(242, 245, 248, 0.18);
    border-radius: 50%;
    color: #cfd8db;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: 160ms ease;
  }

  .kyvera-blog-archive__pagination a:hover {
    border-color: #d4a75c;
    color: #d4a75c;
  }

  .kyvera-blog-archive__pagination span.current {
    background: #d4a75c;
    border-color: #d4a75c;
    color: #10202c;
  }

  @media (max-width: 900px) {
    .kyvera-blog-archive__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media (max-width: 620px) {
    .kyvera-blog-archive__hero,
    .kyvera-blog-archive__body {
      width: min(100% - 42px, 560px);
    }

    .kyvera-blog-archive__grid {
      grid-template-columns: 1fr;
      gap: 32px;
    }
  }

  /* ===== Single Post ("Kyvera Single Post" template, any /post-slug/) =====
     Layout order: full-bleed banner (featured image) -> centered title/meta
     -> boxed Table of Contents (auto-built from the article's own TOC list,
     see kyvera_get_processed_post_content() in kyvera-custom-assets.php)
     -> article body -> back-to-Insights button. Everything is centered on
     the page; article headings are centered too, while paragraph copy
     stays left-aligned within the centered column for readability. */
  .kyvera-post {
    background: #fff;
  }

  .kyvera-post .kyvera-post__banner-wrap {
    width: 100%;
    max-height: 520px;
    margin-top: 98px !important;
    overflow: hidden;
    background: #0f2439;
  }

  .kyvera-post__banner {
    display: block;
    width: 100%;
  }

  .kyvera-post__banner .kyvera-post__featured-image-img,
  .kyvera-post__featured-image-img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 520px;
    object-fit: cover;
    object-position: center;
  }

  .kyvera-post__hero {
    width: min(820px, calc(100% - 48px));
    max-width: 820px;
    align-self: center !important;
    align-items: center !important;
    margin: 0 auto !important;
    padding: 56px 0 8px;
    text-align: center;
  }

  .kyvera-post__meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 auto 16px;
    color: var( --muted, #5f6f78 );
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .kyvera-post__meta-cats a {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid currentColor;
  }

  .kyvera-post__title,
  .kyvera-post__title .kyvera-post__title-text {
    margin: 0 auto !important;
    color: var( --ink, #102d3d ) !important;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif !important;
    font-size: clamp(28px, 4vw, 44px) !important;
    font-weight: 400 !important;
    letter-spacing: 0.005em;
    line-height: 1.25 !important;
    text-align: center !important;
  }

  /* ---- Table of Contents ---- */
  .kyvera-post__toc-wrap {
    width: min(700px, calc(100% - 48px));
    max-width: 700px;
    align-self: center !important;
    align-items: center !important;
    margin: 0 auto !important;
    padding: 36px 0 0;
  }

  .kyvera-post__toc {
    display: block;
    padding: 28px 32px;
    border: 1px solid rgba(16, 45, 61, 0.1);
    border-radius: 14px;
    background: #fbfbf8;
  }

  .kyvera-post__toc-label {
    display: block;
    margin: 0 0 16px;
    color: #c09043;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-align: center;
    text-transform: uppercase;
  }

  .kyvera-post__toc-list {
    counter-reset: kyvera-toc;
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-post__toc-list li {
    counter-increment: kyvera-toc;
  }

  .kyvera-post__toc-list a {
    display: flex;
    align-items: baseline;
    gap: 10px;
    color: var( --ink, #102d3d );
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: none;
    transition: color 160ms ease;
  }

  .kyvera-post__toc-list a::before {
    content: counter(kyvera-toc);
    flex-shrink: 0;
    color: #d4a75c;
    font-weight: 700;
  }

  .kyvera-post__toc-list a:hover {
    color: #c09043;
  }

  .kyvera-post__body {
    width: min(760px, calc(100% - 48px));
    max-width: 760px;
    align-self: center !important;
    margin: 0 auto !important;
    padding: 44px 0 60px;
  }

  .kyvera-post__content-inner {
    color: #33404a;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.8;
    text-align: left;
  }

  .kyvera-post__content-inner > * {
    margin: 0 0 22px;
  }

  .kyvera-post__content-inner h2,
  .kyvera-post__content-inner h3,
  .kyvera-post__content-inner h4,
  .kyvera-post__section-heading {
    margin: 44px 0 18px;
    color: var( --ink, #102d3d );
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-weight: 400;
    line-height: 1.3;
    text-align: center;
  }

  .kyvera-post__content-inner h2,
  .kyvera-post__section-heading { font-size: 28px; }
  .kyvera-post__content-inner h3 { font-size: 22px; }
  .kyvera-post__content-inner h4 { font-size: 18px; }

  .kyvera-post__content-inner a {
    color: #c09043;
    text-decoration: underline;
  }

  .kyvera-post__content-inner ul,
  .kyvera-post__content-inner ol {
    padding-left: 22px;
    text-align: left;
  }

  .kyvera-post__content-inner img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
  }

  .kyvera-post__content-inner figure.wp-block-table {
    overflow-x: auto;
  }

  .kyvera-post__content-inner table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
  }

  .kyvera-post__content-inner table th,
  .kyvera-post__content-inner table td {
    padding: 10px 14px;
    border: 1px solid rgba(16, 45, 61, 0.12);
  }

  .kyvera-post__content-inner blockquote {
    margin: 0 0 22px;
    padding: 4px 0 4px 20px;
    border-left: 3px solid #d4a75c;
    color: #5f6f78;
    font-style: italic;
    text-align: left;
  }

  .kyvera-post__back-row {
    width: min(760px, calc(100% - 48px));
    max-width: 760px;
    align-self: center !important;
    margin: 0 auto !important;
    padding: 0 0 90px;
    border-top: 1px solid rgba(16, 45, 61, 0.1);
    padding-top: 40px;
  }

  .kyvera-post__back-row,
  .kyvera-post__back-row .e-con-inner {
    align-items: center !important;
    justify-content: center !important;
  }

  #kyvera-post-back-anchor,
  .kyvera-post .kyvera-post__back-btn.elementor-widget-button {
    display: contents !important;
  }

  .kyvera-post .kyvera-post__back-btn,
  .kyvera-post .kyvera-post__back-btn a.elementor-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 46px;
    padding: 0 24px;
    border: 1.5px solid rgba(16, 45, 61, 0.16);
    border-radius: 24px;
    background: transparent;
    color: var( --ink, #102d3d );
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-transform: uppercase;
    transition: 180ms ease;
  }

  .kyvera-post .kyvera-post__back-btn:hover,
  .kyvera-post .kyvera-post__back-btn a.elementor-button:hover {
    border-color: #d4a75c;
    color: #c09043;
  }

  @media (max-width: 640px) {
    .kyvera-post__banner-wrap {
      max-height: 260px;
    }

    .kyvera-post__banner .kyvera-post__featured-image-img,
    .kyvera-post__featured-image-img {
      max-height: 260px;
    }

    .kyvera-post__hero,
    .kyvera-post__toc-wrap,
    .kyvera-post__body,
    .kyvera-post__back-row {
      padding-left: 0;
      padding-right: 0;
    }

    .kyvera-post__hero {
      padding-top: 40px;
    }

    .kyvera-post__toc {
      padding: 22px 20px;
    }
  }

  /* ===== Section Eight: Education Before Adoption (sticky background) ===== */
  .kyvera-section-eight {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 760px;
    display: flex;
    align-items: center;
    background-image:
      linear-gradient(100deg, rgba(8, 22, 35, 0.93) 0%, rgba(8, 22, 35, 0.86) 38%, rgba(8, 22, 35, 0.62) 62%, rgba(8, 22, 35, 0.4) 100%),
      url("https://kyvera.io/wp-content/uploads/2026/09/kyvera-section8-bg-new.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: #f2f4f4;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-section-eight__inner {
    position: relative;
    z-index: 1;
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 120px 0;
  }

  .kyvera-section-eight__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 24px;
    color: #d4a75c;
    font-size: var(--kyvera-eyebrow-size);
    font-weight: 700;
    letter-spacing: var(--kyvera-eyebrow-tracking);
    text-transform: uppercase;
  }

  .kyvera-section-eight__eyebrow::before {
    content: "";
    width: 38px;
    height: 1px;
    background: rgba(212, 167, 92, 0.7);
  }

  .kyvera-section-eight h2 {
    max-width: 100%;
    margin: 0 0 26px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: var(--kyvera-h2-size);
    font-weight: 400;
    letter-spacing: var(--kyvera-h2-letter-spacing);
    line-height: var(--kyvera-h2-line-height);
  }

  .kyvera-section-eight__line {
    display: block;
    white-space: nowrap;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
  }

  .kyvera-section-eight__lead {
    max-width: 520px;
    margin: 0 0 14px;
    color: #eef2f3;
    font-size: var(--kyvera-lead-size);
    font-family: "Montserrat", Arial, sans-serif;
    font-weight: 600;
    line-height: 1.6;
  }

  .kyvera-section-eight__copy {
    max-width: 520px;
    margin: 0 0 14px;
    color: #c3ccd0;
    font-size: var(--kyvera-copy-size);
    line-height: var(--kyvera-copy-line-height);
  }

  .kyvera-section-eight__checklist {
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 40px;
    max-width: 560px;
  }

  .kyvera-section-eight__checklist li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    color: #e6eaeb;
    font-size: var(--kyvera-copy-size);
  }

  .kyvera-section-eight__checklist li::before {
    content: "✓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border: 1px solid rgba(212, 167, 92, 0.6);
    border-radius: 50%;
    color: #d4a75c;
    font-size: 11px;
  }

  @media (max-width: 900px) {
    .kyvera-section-eight {
      background-attachment: scroll;
    }
  }

  @media (max-width: 640px) {
    .kyvera-section-eight {
      min-height: 0;
    }

    .kyvera-section-eight__inner {
      width: min(100% - 42px, 560px);
      padding: 80px 0;
    }

    .kyvera-section-eight h2 {
      font-size: clamp(13px, 4.3vw, 22px);
      letter-spacing: 0.005em;
    }

    .kyvera-section-eight__checklist {
      grid-template-columns: 1fr;
    }
  }

  /* ===== Footer ===== */
  .kyvera-footer {
    background: #0a1c2b;
    color: #cfd8db;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-footer__top {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 70px 0 46px;
    display: grid;
    grid-template-columns: minmax(210px, 0.85fr) minmax(230px, 1fr) minmax(190px, 0.95fr) minmax(140px, 0.55fr);
    gap: 32px;
    align-items: start;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }

  .kyvera-footer__brand {
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
    color: #fbfbf8;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 26px;
    letter-spacing: 0.04em;
    text-decoration: none;
  }

  .kyvera-footer__tagline {
    color: #8b979c;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .kyvera-footer__desc {
    margin: 18px 0 0;
    max-width: 320px;
    color: #92a0a5;
    font-size: 13.5px;
    line-height: 1.7;
  }

  .kyvera-footer__nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 32px;
  }

  .kyvera-footer__nav-title,
  .kyvera-footer__nav-title .elementor-heading-title {
    grid-column: 1 / -1;
    margin: 0 0 4px !important;
    color: #d4a75c !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2em;
    text-transform: uppercase;
  }

  .kyvera-footer__nav a {
    color: #cfd8db;
    font-size: 14.5px;
    text-decoration: none;
    transition: 160ms ease;
  }

  .kyvera-footer__nav a:hover,
  .kyvera-footer__nav a:focus-visible {
    color: #d4a75c;
  }

  .kyvera-footer__social-title,
  .kyvera-footer__social-title .elementor-heading-title,
  .kyvera-footer__contact-title,
  .kyvera-footer__contact-title .elementor-heading-title {
    margin: 0 0 16px !important;
    color: #d4a75c !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2em;
    text-transform: uppercase;
  }

  .kyvera-footer__contact {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .kyvera-footer__contact-address {
    margin: 0;
    max-width: 220px;
    color: #92a0a5;
    font-size: 13px;
    line-height: 1.65;
  }

  .kyvera-footer__contact-phone {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #cfd8db;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: 160ms ease;
  }

  .kyvera-footer__contact-phone svg {
    width: 15px;
    height: 15px;
    color: #d4a75c;
    flex-shrink: 0;
  }

  .kyvera-footer__contact-phone:hover,
  .kyvera-footer__contact-phone:focus-visible {
    color: #d4a75c;
  }

  .kyvera-footer__contact-group {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }

  .kyvera-footer__contact-label {
    color: #7c8a90;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }

  .kyvera-footer__contact-group a {
    color: #cfd8db;
    font-size: 13px;
    text-decoration: none;
    transition: 160ms ease;
  }

  .kyvera-footer__contact-group a:hover,
  .kyvera-footer__contact-group a:focus-visible {
    color: #d4a75c;
  }

  .kyvera-footer__social {
    display: flex;
    gap: 12px;
  }

  .kyvera-footer__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    color: #cfd8db;
    transition: 160ms ease;
  }

  .kyvera-footer__social a:hover,
  .kyvera-footer__social a:focus-visible {
    border-color: #d4a75c;
    color: #d4a75c;
  }

  .kyvera-footer__social svg {
    width: 16px;
    height: 16px;
  }

  .kyvera-footer__bottom {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 26px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    color: #7c8a90;
    font-size: 12.5px;
  }

  .kyvera-footer__disclaimer {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 26px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }

  .kyvera-footer__disclaimer p {
    max-width: 900px;
    margin: 0 0 8px;
    color: #7c8a90;
    font-size: 12px;
    line-height: 1.7;
  }

  .kyvera-footer__disclaimer p:last-child {
    margin-bottom: 0;
  }

  .kyvera-footer__legal {
    display: flex;
    gap: 22px;
  }

  .kyvera-footer__legal a {
    color: #7c8a90;
    text-decoration: none;
  }

  .kyvera-footer__legal a:hover,
  .kyvera-footer__legal a:focus-visible {
    color: #d4a75c;
  }

  @media (max-width: 1160px) {
    .kyvera-footer__top {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      row-gap: 40px;
    }
  }

  @media (max-width: 900px) {
    .kyvera-footer__top {
      grid-template-columns: 1fr;
      gap: 36px;
    }

    .kyvera-footer__contact-address {
      max-width: 100%;
    }
  }

  @media (max-width: 640px) {
    .kyvera-footer__top {
      width: min(100% - 42px, 560px);
      padding: 56px 0 36px;
    }

    .kyvera-footer__disclaimer {
      width: min(100% - 42px, 560px);
    }

    .kyvera-footer__bottom {
      width: min(100% - 42px, 560px);
      flex-direction: column;
      align-items: flex-start;
    }
  }

  /* "body h1" etc (instead of bare "h1") bumps specificity from (0,0,1) to
     (0,0,2) so this always wins the cascade tie against the theme's own
     "h1, h2, h3, h4, h5, h6 { font-family: inherit; }" reset rule (same
     specificity, but hello-elementor/reset.css is enqueued after this
     stylesheet so it was winning ties and made bare headings fall back to
     the browser/system font instead of our intended heading typeface). */
  body h1, body h2, body h3, body h4, body h5, body h6,
  .hero-scroll-heading__half,
  .kyvera-hero__stat-label,
  .kyvera-section-two__assets li,
  .kyvera-section-two__card h3,
  .kyvera-section-three h2,
  .kyvera-section-three h3,
  .kyvera-section-four h2,
  .kyvera-section-four__items h3,
  .kyvera-section-five h2,
  .kyvera-section-five h3,
  .kyvera-section-six h2,
  .kyvera-section-six__card h3,
  .kyvera-section-seven h2,
  .kyvera-section-seven h3,
  .kyvera-section-eight h2,
  .kyvera-footer__brand {
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
  }

  /* "html body" (specificity 0,0,2) beats the theme reset's bare
     "body { font-family: ... }" rule (0,0,1) on the same cascade tie. */
  html body,
  p,
  a,
  li,
  span,
  button,
  .kyvera-hero__eyebrow,
  .kyvera-hero__lead,
  .kyvera-hero__copy,
  .kyvera-hero__button,
  .kyvera-hero__stat-copy,
  .kyvera-section-two__eyebrow,
  .kyvera-section-two__assets,
  .kyvera-section-two__description,
  .kyvera-section-three__eyebrow,
  .kyvera-section-three__intro,
  .kyvera-section-three__checklist,
  .kyvera-section-three__copy,
  .kyvera-section-three__card p,
  .kyvera-section-four__eyebrow,
  .kyvera-section-four__lead,
  .kyvera-section-four__copy,
  .kyvera-section-four__item p,
  .kyvera-section-five__eyebrow,
  .kyvera-approach-item p,
  .kyvera-orbit__node-label,
  .kyvera-section-six__eyebrow,
  .kyvera-section-six__card p,
  .kyvera-section-seven__subheading,
  .kyvera-section-seven__list p,
  .kyvera-section-eight__eyebrow,
  .kyvera-section-eight__lead,
  .kyvera-section-eight__copy,
  .kyvera-section-eight__checklist,
  .kyvera-footer__tagline,
  .kyvera-footer__desc,
  .kyvera-footer__nav,
  .kyvera-footer__contact,
  .kyvera-footer__bottom {
    font-family: "Montserrat", Arial, sans-serif;
  }

  /* ===== Book-a-call popup modal ===== */
  .kyvera-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }

  .kyvera-modal[hidden] {
    display: none;
  }

  .kyvera-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(5, 14, 22, 0.72);
    backdrop-filter: blur(4px);
  }

  .kyvera-modal__panel {
    position: relative;
    z-index: 1;
    width: min(960px, 100%);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    display: grid;
    grid-template-columns: minmax(220px, 0.85fr) minmax(0, 1.15fr);
    gap: 44px;
    padding: 48px;
    border-radius: 22px;
    background: #0a1f2c;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 40px 90px rgba(0, 0, 0, 0.45);
    font-family: Arial, Helvetica, sans-serif;
    animation: kyveraModalIn 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }

  @keyframes kyveraModalIn {
    from { opacity: 0; transform: translateY(18px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
  }

  /* #bookCallModal prefix bumps specificity to beat reset.css's
     "[type=button],[type=submit],button" red-border rule (same tie
     pattern fixed for the chat widget and Partner form buttons above). */
  #bookCallModal .kyvera-modal__close {
    position: absolute;
    top: 18px;
    right: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    background: transparent;
    color: #cfd8db;
    cursor: pointer;
    transition: 180ms ease;
  }

  .kyvera-modal__close svg {
    width: 15px;
    height: 15px;
  }

  #bookCallModal .kyvera-modal__close:hover,
  #bookCallModal .kyvera-modal__close:focus-visible {
    border-color: #d4a75c;
    color: #d4a75c;
  }

  .kyvera-modal__intro {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .kyvera-modal__eyebrow {
    margin: 0 0 14px;
    color: #d4a75c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3em;
    text-transform: uppercase;
  }

  .kyvera-modal__intro h2 {
    margin: 0 0 16px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(24px, 2.6vw, 30px);
    font-weight: 400;
    line-height: 1.28;
  }

  .kyvera-modal__intro h2 em {
    color: #d4a75c;
    font-style: normal;
  }

  .kyvera-modal__lead {
    margin: 0;
    color: #aab7bc;
    font-size: 14px;
    line-height: 1.7;
  }

  .kyvera-modal__social {
    display: flex;
    gap: 12px;
    margin-top: 28px;
  }

  .kyvera-modal__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    color: #cfd8db;
    transition: 180ms ease;
  }

  .kyvera-modal__social a:hover,
  .kyvera-modal__social a:focus-visible {
    border-color: #d4a75c;
    color: #d4a75c;
  }

  .kyvera-modal__social svg {
    width: 16px;
    height: 16px;
  }

  .kyvera-modal__form-card {
    padding: 32px 32px 36px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.03);
  }

  .kyvera-modal__form {
    display: flex;
    flex-direction: column;
  }

  .kyvera-modal__field {
    padding: 14px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
  }

  .kyvera-modal__field input,
  .kyvera-modal__field select,
  .kyvera-modal__field textarea {
    width: 100%;
    border: none;
    background: transparent;
    color: #fbfbf8;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    resize: none;
  }

  .kyvera-modal__field textarea {
    min-height: 22px;
    max-height: 90px;
  }

  .kyvera-modal__field input::placeholder,
  .kyvera-modal__field textarea::placeholder {
    color: rgba(207, 216, 219, 0.5);
  }

  .kyvera-modal__field select {
    appearance: none;
    color: rgba(207, 216, 219, 0.5);
    color-scheme: dark;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23cfd8db'%3e%3cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 15px;
    padding-right: 24px;
  }

  .kyvera-modal__field select:valid {
    color: #fbfbf8;
  }

  .kyvera-modal__field select option {
    background-color: #0e2536;
    color: #fbfbf8;
  }

  .kyvera-modal__field select option[disabled] {
    color: rgba(207, 216, 219, 0.6);
  }

  .kyvera-modal__field input:focus,
  .kyvera-modal__field select:focus,
  .kyvera-modal__field textarea:focus {
    outline: none;
  }

  .kyvera-modal__field:focus-within {
    border-bottom-color: #d4a75c;
  }

  #bookCallModal .kyvera-modal__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    margin-top: 26px;
    border: none;
    border-radius: 26px;
    background: linear-gradient(135deg, #f0cf94, #d4a75c 60%, #c09043);
    color: #10202c;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 14px 30px rgba(212, 167, 92, 0.25);
    transition: 220ms ease;
  }

  #bookCallModal .kyvera-modal__submit:hover,
  #bookCallModal .kyvera-modal__submit:focus-visible {
    background: linear-gradient(135deg, #fff3da, #f0cf94 55%, #d4a75c);
    transform: translateY(-2px);
  }

  .kyvera-modal__success {
    text-align: center;
    padding: 30px 0;
  }

  .kyvera-modal__success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: rgba(212, 167, 92, 0.14);
    color: #d4a75c;
  }

  .kyvera-modal__success-icon svg {
    width: 26px;
    height: 26px;
  }

  .kyvera-modal__success h3 {
    margin: 0 0 10px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
  }

  .kyvera-modal__success p {
    margin: 0;
    color: #aab7bc;
    font-size: 13.5px;
    line-height: 1.7;
  }

  @media (max-width: 760px) {
    .kyvera-modal__panel {
      grid-template-columns: 1fr;
      padding: 34px 24px;
      gap: 30px;
    }

    .kyvera-modal__social {
      margin-top: 20px;
    }
  }

  /* NOTE: The 'KYVERA ASSISTANT' floating chat widget CSS that used to live
     here has been moved out to its own dedicated plugin (kyvera-assistant),
     which now owns the single source of truth for the widget's HTML+CSS+JS
     and injects the markup via wp_footer. Removed the duplicate copy here
     to avoid two identical, non-!important '.kc-chip'/'.kc-launcher'/etc.
     rule sets both losing the same specificity tie against hello-elementor
     reset.css's '[type="button"], [type="submit"], button' rule. */

/* ===== About page (kyvera-about) ===== */
  .kyvera-about {
    max-width: 1320px;
    margin: 0 auto;
    padding: 118px 28px 0;
  }

  /* ===== Top identity row ===== */
  .kyvera-about__intro-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 34px;
  }

  .kyvera-about__eyebrow-col {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink);
    line-height: 1.7;
  }

  .kyvera-about__eyebrow-col--left { text-align: left; }
  .kyvera-about__eyebrow-col--right { text-align: right; align-items: flex-end; }

  .kyvera-about__eyebrow-rule {
    width: 30px;
    height: 1px;
    background: var(--accent);
    margin-top: 10px;
  }

  .kyvera-about__brand {
    width: 100%;
    text-align: center;
    padding: 0 20px;
  }

  .kyvera-about__brand-logo {
    display: block;
    height: clamp(22px, 2.7vw, 32px);
    width: auto;
    margin: 0 auto;
  }
  .kyvera-about__brand-sub {
    margin: 10px 0 0;
    font-size: clamp(13px, 1.5vw, 17px);
    font-weight: 700;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--ink);
  }

  .kyvera-about__brand-tag {
    margin: 10px 0 0;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--muted);
  }

  .kyvera-about__statement {
    max-width: 760px;
    margin: 0 auto 54px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
    text-align: center;
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 500;
    font-size: clamp(17px, 1.9vw, 23px);
    line-height: 1.55;
    color: var(--ink);
  }

  @media (max-width: 860px) {
    .kyvera-about__intro-inner {
      grid-template-columns: 1fr;
      text-align: center;
      justify-items: center;
    }
    .kyvera-about__eyebrow-col--left,
    .kyvera-about__eyebrow-col--right {
      text-align: center;
      align-items: center;
    }
    .kyvera-about__brand { order: -1; }
  }

  /* ===== Flow section: left panel | pillars | right panel ===== */
  .kyvera-about__flow-inner {
    display: grid;
    grid-template-columns: minmax(200px, 0.86fr) minmax(0, 3.1fr) minmax(200px, 0.86fr);
    gap: 30px;
    /* `start` (not `stretch`) so each column keeps its own natural/explicit
       height independently — the side panels get a JS-computed margin-top +
       height (below) that can stand taller than the pillars column without
       ever dragging the center pillar-grid's height along with it. */
    align-items: start;
    position: relative;
  }

  .kyvera-about__pillars {
    display: flex;
    flex-direction: column;
  }

  .kyvera-about__arrow {
    display: none;
  }

  @media (min-width: 861px) {
    .kyvera-about__panel--left { position: relative; }
    .kyvera-about__panel--right { position: relative; }
    .kyvera-about__panel--left::after,
    .kyvera-about__panel--right::before {
      content: "";
      position: absolute;
      top: 50%;
      width: 16px;
      height: 16px;
      transform: translateY(-50%) rotate(45deg);
      border-top: 2px solid var(--accent);
      border-right: 2px solid var(--accent);
    }
    .kyvera-about__panel--left::after { right: -23px; }
    .kyvera-about__panel--right::before { left: -23px; }
  }

  /* ---- side panels ---- */
  .kyvera-about__panel {
    background: var(--card-bg);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 28px 22px 24px;
    display: flex;
    flex-direction: column;
  }

  .kyvera-about__panel-title {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1.32;
    text-transform: uppercase;
    color: var(--ink);
  }

  .kyvera-about__panel-rule {
    width: 32px;
    height: 2px;
    background: var(--accent);
    margin: 0 0 26px;
  }

  .kyvera-about__panel-list {
    list-style: none;
    margin: auto 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
  }

  .kyvera-about__panel-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13.5px;
    font-weight: 500;
    color: #33424c;
  }

  .kyvera-about__panel-list svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    stroke: var(--ink);
  }

  .kyvera-about__panel-divider {
    height: 1px;
    background: var(--line);
    margin: 0 0 16px;
  }

  .kyvera-about__panel-caption {
    margin: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--faint);
    line-height: 1.7;
  }

  /* ---- connector tree (drawn precisely via JS into an SVG, see script) ---- */
  .kyvera-about__connector-shell {
    position: relative;
    height: clamp(96px, 12vw, 156px);
  }

  .kyvera-about__connector-svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: visible;
    pointer-events: none;
  }

  .kyvera-about__connector-svg path.track {
    fill: none;
    stroke: #a9752b;
    stroke-width: 2.4;
    stroke-linecap: round;
  }

  .kyvera-about__connector-svg path.glow {
    fill: none;
    stroke: #ffd58a;
    stroke-width: 2.8;
    stroke-linecap: round;
    opacity: 0;
  }

  .kyvera-about__connector-svg path.flare {
    stroke-width: 1.6;
  }

  .kyvera-about__connector-svg path.stem {
    stroke-linecap: butt;
  }

  /* ---- pillar cards ---- */
  .kyvera-about__pillar-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    align-items: stretch;
    flex: 1;
  }

  .kyvera-about__pillar {
    position: relative;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(16, 45, 61, 0.06);
    display: flex;
    flex-direction: column;
  }

  .kyvera-about__pillar-banner {
    position: relative;
    height: 96px;
    border-radius: 14px 14px 0 0;
    overflow: hidden;
  }

  .kyvera-about__pillar--rwa .kyvera-about__pillar-banner {
    background:
      linear-gradient(160deg, rgba(10, 20, 30, 0.55), rgba(10, 20, 30, 0.85)),
      linear-gradient(135deg, #2c3f52, #16232f);
  }

  .kyvera-about__pillar--capital .kyvera-about__pillar-banner {
    background:
      linear-gradient(160deg, rgba(8, 22, 14, 0.5), rgba(8, 22, 14, 0.85)),
      linear-gradient(135deg, #223626, #12201a);
  }

  .kyvera-about__pillar--ai .kyvera-about__pillar-banner {
    background:
      linear-gradient(160deg, rgba(6, 18, 26, 0.5), rgba(6, 18, 26, 0.85)),
      linear-gradient(135deg, #16303f, #0b1a24);
  }

  .kyvera-about__pillar-badge {
    position: absolute;
    left: 50%;
    top: -25px;
    transform: translateX(-50%);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--ink);
    border: 3px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 16px rgba(16, 45, 61, 0.28);
    z-index: 2;
  }

  .kyvera-about__pillar-badge svg {
    width: 22px;
    height: 22px;
    stroke: var(--accent-light);
  }

  .kyvera-about__pillar-body {
    padding: 32px 20px 26px;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex: 1;
  }

  .kyvera-about__pillar-head {
    min-height: 122px;
  }

  @media (max-width: 700px) {
    .kyvera-about__pillar-head { min-height: 0; }
    .kyvera-about__pillar-list h4 { white-space: normal; }
  }

  .kyvera-about__pillar-title {
    margin: 0 0 6px;
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 800;
    font-size: 18px;
    line-height: 1.28;
    letter-spacing: 0;
    color: var(--ink);
  }

  .kyvera-about__pillar-subtitle {
    margin: 0 0 14px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--faint);
  }

  .kyvera-about__pillar-copy {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--muted);
  }

  .kyvera-about__pillar-divider {
    height: 1px;
    background: var(--line);
    margin: 18px 0;
  }

  .kyvera-about__pillar-list {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 15px;
  }

  .kyvera-about__pillar-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
  }

  .kyvera-about__pillar-num {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ink);
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .kyvera-about__pillar-icon {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1.5px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .kyvera-about__pillar-icon svg {
    width: 14px;
    height: 14px;
    stroke: var(--ink);
  }

  .kyvera-about__pillar-list h4 {
    margin: 0 0 2px;
    font-size: 12px;
    font-weight: 700;
    color: var(--ink);
    white-space: nowrap;
  }

  .kyvera-about__pillar-list p {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--muted);
  }

  @media (max-width: 1100px) {
    .kyvera-about__flow-inner {
      grid-template-columns: 1fr;
    }
    .kyvera-about__panel--left::after,
    .kyvera-about__panel--right::before { display: none; }
  }

  @media (max-width: 700px) {
    .kyvera-about__pillar-grid { grid-template-columns: 1fr; }
    .kyvera-about__connector-shell { display: none; }
  }

  /* ===== Ecosystem row ===== */
  .kyvera-about__ecosystem {
    margin-top: 60px;
    text-align: center;
  }

  .kyvera-about__ecosystem-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin: 0 0 26px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--ink);
  }

  .kyvera-about__ecosystem-eyebrow::before,
  .kyvera-about__ecosystem-eyebrow::after {
    content: "";
    width: 40px;
    height: 1px;
    background: var(--line);
  }

  .kyvera-about__ecosystem-row {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: var(--card-bg);
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
  }

  .kyvera-about__ecosystem-item {
    padding: 28px 16px;
    border-right: 1px solid var(--line);
  }

  .kyvera-about__ecosystem-item:last-child { border-right: none; }

  .kyvera-about__ecosystem-item svg {
    width: 26px;
    height: 26px;
    stroke: var(--ink);
    margin: 0 auto 12px;
    display: block;
  }

  .kyvera-about__ecosystem-item h4 {
    margin: 0 0 6px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--ink);
  }

  .kyvera-about__ecosystem-item p {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--muted);
  }

  @media (max-width: 860px) {
    .kyvera-about__ecosystem-row { grid-template-columns: repeat(2, 1fr); }
    .kyvera-about__ecosystem-item:nth-child(2n) { border-right: none; }
    .kyvera-about__ecosystem-item { border-bottom: 1px solid var(--line); }
  }

  @media (max-width: 480px) {
    .kyvera-about__ecosystem-row { grid-template-columns: 1fr; }
  }


/* ===== Partner With Kyvera page (kyvera-partner) ===== */
  .kyvera-partner-hero {
    position: relative;
    overflow: hidden;
    padding: 150px 0 90px;
    background: #071a2a;
    color: #eef2f3;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-partner-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 18% 20%, rgba(212, 167, 92, 0.16), transparent 34%),
      radial-gradient(circle at 84% 66%, rgba(255, 255, 255, 0.06), transparent 30%);
    pointer-events: none;
  }

  .kyvera-partner-hero__inner {
    position: relative;
    z-index: 1;
    width: min(820px, calc(100% - 48px));
    margin: 0 auto;
    text-align: center;
  }

  .kyvera-partner-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 22px;
    color: #d4a75c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3em;
    text-transform: uppercase;
  }

  .kyvera-partner-hero__eyebrow::before,
  .kyvera-partner-hero__eyebrow::after {
    content: "";
    width: 30px;
    height: 1px;
    background: rgba(212, 167, 92, 0.5);
  }

  .kyvera-partner-hero h1 {
    margin: 0 0 22px;
    color: #fbfbf8;
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(26px, 3.1vw, 42px);
    font-weight: 400;
    letter-spacing: 0.005em;
    line-height: 1.18;
  }

  .kyvera-partner-hero h1 em {
    color: #fbfbf8;
    font-style: normal;
  }

  .kyvera-partner-hero__lead {
    margin: 0 auto;
    max-width: 620px;
    color: #aab7bc;
    font-size: 16px;
    line-height: 1.75;
  }

  /* ===== Form section shell ===== */
  .kyvera-partner-form {
    position: relative;
    background: #fbfbf8;
    padding: 64px 0 110px;
  }

  .kyvera-partner-form__inner {
    width: min(920px, calc(100% - 40px));
    margin: -56px auto 0;
    position: relative;
    z-index: 2;
  }

  .kyvera-partner-card {
    background: #ffffff;
    border: 1px solid rgba(16, 45, 61, 0.08);
    border-radius: 20px;
    box-shadow: 0 30px 70px rgba(16, 45, 61, 0.1);
    padding: clamp(28px, 4vw, 56px);
  }

  /* ---- Progress stepper ---- */
  .kyvera-partner-progress {
    display: flex;
    align-items: center;
    margin: 0 0 40px;
  }

  .kyvera-partner-progress__step {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
  }

  .kyvera-partner-progress__dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    border: 1.5px solid var(--line);
    border-radius: 50%;
    color: var(--faint);
    font-size: 12.5px;
    font-weight: 700;
    transition: 240ms ease;
  }

  .kyvera-partner-progress__label {
    color: var(--faint);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: 240ms ease;
    white-space: nowrap;
  }

  .kyvera-partner-progress__step.is-active .kyvera-partner-progress__dot,
  .kyvera-partner-progress__step.is-done .kyvera-partner-progress__dot {
    border-color: #d4a75c;
    background: #d4a75c;
    color: #102d3d;
  }

  .kyvera-partner-progress__step.is-active .kyvera-partner-progress__label,
  .kyvera-partner-progress__step.is-done .kyvera-partner-progress__label {
    color: var(--ink);
  }

  .kyvera-partner-progress__step.is-done .kyvera-partner-progress__dot {
    font-size: 0;
  }

  .kyvera-partner-progress__step.is-done .kyvera-partner-progress__dot::after {
    content: "✓";
    font-size: 13px;
  }

  .kyvera-partner-progress__line {
    flex: 1 1 auto;
    height: 1px;
    margin: 0 14px;
    background: var(--line);
    transition: 320ms ease;
  }

  .kyvera-partner-progress__line.is-done {
    background: #d4a75c;
  }

  @media (max-width: 620px) {
    .kyvera-partner-progress__label { display: none; }
    .kyvera-partner-progress__line { margin: 0 8px; }
  }

  /* ---- Step panels ---- */
  .kyvera-partner-step {
    display: none;
  }

  .kyvera-partner-step.is-active {
    display: block;
    animation: partnerStepIn 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  }

  @keyframes partnerStepIn {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .kyvera-partner-step__title {
    margin: 0 0 6px;
    color: var(--ink);
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(22px, 2.6vw, 28px);
    font-weight: 400;
  }

  .kyvera-partner-step__hint {
    margin: 0 0 30px;
    color: var(--muted);
    font-size: 14.5px;
    line-height: 1.6;
  }

  /* ---- Step 1: persona cards ---- */
  .kyvera-partner-personas {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .kyvera-partner-persona {
    position: relative;
  }

  .kyvera-partner-persona input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  .kyvera-partner-persona label {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    height: 100%;
    padding: 13px 16px;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    background: #fcfcfa;
    cursor: pointer;
    transition: 220ms ease;
  }

  .kyvera-partner-persona__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: rgba(16, 45, 61, 0.05);
    color: var(--ink);
    transition: 220ms ease;
  }

  .kyvera-partner-persona__icon svg {
    width: 17px;
    height: 17px;
  }

  .kyvera-partner-persona__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }

  .kyvera-partner-persona__title {
    color: var(--ink);
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
  }

  .kyvera-partner-persona__for {
    margin: 0;
    color: var(--faint);
    font-size: 11px;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .kyvera-partner-persona input:checked + label {
    border-color: #d4a75c;
    background: rgba(212, 167, 92, 0.07);
    box-shadow: 0 10px 26px rgba(212, 167, 92, 0.18);
  }

  .kyvera-partner-persona input:checked + label .kyvera-partner-persona__icon {
    background: #d4a75c;
    color: #102d3d;
  }

  #partnerForm .kyvera-partner-persona input:focus-visible + label,
  #partnerForm .kyvera-partner-persona label:hover {
    border-color: rgba(212, 167, 92, 0.55);
  }

  @media (max-width: 620px) {
    .kyvera-partner-personas {
      grid-template-columns: 1fr;
    }
  }

  /* ---- Fields (shared across steps 2 & 3) ---- */
  .kyvera-partner-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 24px;
  }

  .kyvera-partner-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .kyvera-partner-field--full {
    grid-column: 1 / -1;
  }

  .kyvera-partner-field label,
  .kyvera-partner-field > span.kyvera-partner-field__label {
    color: var(--ink);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
  }

  .kyvera-partner-field input[type="text"],
  .kyvera-partner-field input[type="email"],
  .kyvera-partner-field input[type="tel"],
  .kyvera-partner-field input[type="url"],
  .kyvera-partner-field select,
  .kyvera-partner-field textarea {
    width: 100%;
    padding: 13px 16px;
    border: 1.5px solid var(--line);
    border-radius: 10px;
    background: #fcfcfa;
    color: var(--ink);
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 14.5px;
    transition: 200ms ease;
  }

  .kyvera-partner-field textarea {
    min-height: 110px;
    resize: vertical;
  }

  .kyvera-partner-field select {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%235f6f78'%3e%3cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 16px;
    padding-right: 38px;
  }

  .kyvera-partner-field input:focus,
  .kyvera-partner-field select:focus,
  .kyvera-partner-field textarea:focus {
    outline: none;
    border-color: #d4a75c;
    box-shadow: 0 0 0 3px rgba(212, 167, 92, 0.15);
  }

  /* ---- Pill / checkbox option groups ---- */
  .kyvera-partner-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .kyvera-partner-pill {
    position: relative;
  }

  .kyvera-partner-pill input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  .kyvera-partner-pill label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1.5px solid var(--line);
    border-radius: 999px;
    background: #fcfcfa;
    color: var(--ink);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: 200ms ease;
    white-space: nowrap;
  }

  .kyvera-partner-pill input:checked + label {
    border-color: #d4a75c;
    background: #d4a75c;
    color: #102d3d;
  }

  #partnerForm .kyvera-partner-pill label:hover {
    border-color: rgba(212, 167, 92, 0.6);
  }

  /* ---- Persona-specific step 2 panels ---- */
  .kyvera-partner-subpanel {
    display: none;
  }

  .kyvera-partner-subpanel.is-active {
    display: block;
  }

  .kyvera-partner-subpanel + .kyvera-partner-subpanel {
    margin-top: 0;
  }

  .kyvera-partner-question {
    margin: 0 0 26px;
  }

  .kyvera-partner-question:last-child {
    margin-bottom: 0;
  }

  .kyvera-partner-question > p {
    margin: 0 0 12px;
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
  }

  /* ---- Actions row ---- */
  .kyvera-partner-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 36px;
    padding-top: 28px;
    border-top: 1px solid var(--line);
  }

  /* #partnerForm prefix bumps specificity so these decisively beat
     hello-elementor/reset.css's "[type=button],[type=submit],button" rule
     (border: 1px solid crimson) — these are <button type="button"|"submit">
     elements, so they match that rule's attribute selector at the same
     (0,1,0) specificity as a single class, and reset.css loads later and
     was winning the tie (same pattern fixed earlier for the chat widget). */
  #partnerForm .kyvera-partner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 50px;
    padding: 0 28px;
    border: none;
    border-radius: 26px;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: 180ms ease;
  }

  #partnerForm .kyvera-partner-btn--primary {
    background: #d4a75c;
    color: #102d3d;
  }

  #partnerForm .kyvera-partner-btn--primary:hover {
    background: #e6bd77;
  }

  #partnerForm .kyvera-partner-btn--ghost {
    background: transparent;
    color: var(--muted);
    border: 1.5px solid var(--line);
  }

  #partnerForm .kyvera-partner-btn--ghost:hover {
    border-color: var(--muted);
    color: var(--ink);
  }

  #partnerForm .kyvera-partner-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
  }

  .kyvera-partner-actions__spacer {
    flex: 1 1 auto;
  }

  /* ---- Inline submit-error banner (network/mail-server failure) ---- */
  .kyvera-partner-form-error {
    margin: 20px 0 0;
    padding: 12px 16px;
    border-radius: 10px;
    background: rgba(196, 68, 68, 0.08);
    border: 1px solid rgba(196, 68, 68, 0.28);
    color: #a83f3f;
    font-size: 13px;
    line-height: 1.6;
  }

  .kyvera-partner-btn--primary.is-loading {
    opacity: 0.75;
    cursor: wait;
  }

  /* ---- Success state ---- */
  .kyvera-partner-success {
    display: none;
    text-align: center;
    padding: 20px 0;
  }

  .kyvera-partner-success.is-active {
    display: block;
    animation: partnerStepIn 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .kyvera-partner-success__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 66px;
    margin: 0 auto 22px;
    border-radius: 50%;
    background: rgba(212, 167, 92, 0.14);
    color: #d4a75c;
  }

  .kyvera-partner-success__icon svg {
    width: 30px;
    height: 30px;
  }

  .kyvera-partner-success h2 {
    margin: 0 0 12px;
    color: var(--ink);
    font-family: "GC Akihiko", "Montserrat", Arial, sans-serif;
    font-size: clamp(22px, 2.6vw, 28px);
    font-weight: 400;
  }

  .kyvera-partner-success p {
    margin: 0 auto;
    max-width: 460px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.7;
  }

  .kyvera-partner-success__persona {
    display: inline-block;
    margin-top: 16px;
    padding: 8px 18px;
    border-radius: 999px;
    background: rgba(16, 45, 61, 0.05);
    color: var(--ink);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.05em;
  }

  @media (max-width: 620px) {
    .kyvera-partner-fields {
      grid-template-columns: 1fr;
    }

    .kyvera-partner-form__inner {
      margin-top: -40px;
    }

    .kyvera-partner-actions {
      flex-wrap: wrap;
    }
  }



/* ===== Explore Insights blog feed (kyvera-blog) ===== */
  /* ===== Section: Explore Insights (blog feed, WordPress-powered) ===== */
  .kyvera-blog {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, #0d2242 0%, #0b1e3f 55%, #091a38 100%);
    color: #f2f5f8;
    font-family: Arial, Helvetica, sans-serif;
  }

  .kyvera-blog__inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;
    padding: 100px 0;
  }

  .kyvera-blog__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin: 0 0 44px;
  }

  .kyvera-blog__eyebrow {
    margin: 0 0 12px;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: clamp(22px, 2vw, 30px);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  .kyvera-blog__eyebrow span {
    color: #6c93d8;
  }

  .kyvera-blog__subtitle {
    max-width: 620px;
    margin: 0;
    color: #a7b2c4;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
  }

  .kyvera-blog__nav {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
  }

  .kyvera-blog .kyvera-blog__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid #f2f5f8;
    background: transparent;
    color: #f2f5f8;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
  }

  .kyvera-blog__arrow svg {
    width: 16px;
    height: 16px;
  }

  .kyvera-blog .kyvera-blog__arrow:hover {
    border-color: #d4a75c;
    background: transparent;
    color: #d4a75c;
    transform: translateY(-2px);
  }

  .kyvera-blog .kyvera-blog__arrow--next {
    background: #f2f5f8;
    border-color: #f2f5f8;
    color: #0b1e3f;
  }

  .kyvera-blog .kyvera-blog__arrow--next:hover {
    background: #d4a75c;
    border-color: #d4a75c;
    color: #10202c;
  }

  .kyvera-blog__track-wrap {
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  .kyvera-blog__track-wrap::-webkit-scrollbar {
    display: none;
  }

  .kyvera-blog__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(300px, 1fr);
    gap: 32px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .kyvera-blog__card {
    scroll-snap-align: start;
  }

  .kyvera-blog__track-wrap {
    scroll-snap-type: x proximity;
  }

  .kyvera-blog__card-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
  }

  .kyvera-blog__card-media {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 6px;
    aspect-ratio: 16 / 10;
    background: #0f2439;
  }

  .kyvera-blog__card-media img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain;
    transition: transform 0.5s ease;
  }

  .kyvera-blog__card-link:hover .kyvera-blog__card-media img {
    transform: scale(1.05);
  }

  .kyvera-blog__card-date {
    margin: 18px 0 10px;
    color: #8e9bb0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .kyvera-blog__card-title {
    margin: 0;
    color: #f2f5f8;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
  }

  @media (max-width: 900px) {
    .kyvera-blog__inner {
      padding: 76px 0;
    }

    .kyvera-blog__head {
      flex-direction: column;
      align-items: flex-start;
    }

    .kyvera-blog__track {
      grid-auto-columns: minmax(260px, 82%);
    }
  }

  @media (max-width: 640px) {
    .kyvera-blog__inner {
      width: min(100% - 42px, 560px);
      padding: 64px 0;
    }

    .kyvera-blog__eyebrow {
      font-size: 20px;
    }

    .kyvera-blog__track {
      grid-auto-columns: minmax(240px, 88%);
      gap: 20px;
    }
  }