/* Generational overrides on top of the Franco Byq Webflow export.
   Keep this file additive. Preserve template classes and structure whenever possible. */

:root {
  --site-reveal-distance: 24px;
  --site-reveal-duration: 700ms;
  --site-reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --generational-green: #b6ff7d;
  --generational-amber: #ffcf6d;
}

/* ============================================================
   Webflow IX2 support for grafted sections

   Sections copied from one Webflow-exported page to another may
   keep inline opacity and data-w-id attributes, but their original
   IX2 page-id animations may not fire. Recreate broken behavior here
   with pure CSS and small vanilla JS rather than forking webflow.js.
   ============================================================ */

[data-reveal],
.site-reveal {
  opacity: 0;
  transform: translate3d(0, var(--site-reveal-distance), 0);
  transition:
    opacity var(--site-reveal-duration) var(--site-reveal-ease),
    transform var(--site-reveal-duration) var(--site-reveal-ease);
  transition-delay: var(--reveal-delay, 0ms);
}

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

@keyframes site-marquee-scroll {
  from {
    translate: 0 0;
  }

  to {
    translate: -50% 0;
  }
}

.site-marquee-track {
  display: flex;
  width: max-content;
  animation: site-marquee-scroll var(--marquee-duration, 32s) linear infinite;
}

.site-accordion-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 280ms ease;
}

.site-accordion-panel > * {
  min-height: 0;
  overflow: hidden;
}

.site-accordion-item.is-open .site-accordion-panel {
  grid-template-rows: 1fr;
}

/* Add grafted sections with inline opacity here:
   .section.example-section [style*="opacity:0"] {
     opacity: 1 !important;
   }
*/

main [style*="opacity:0"],
main [style*="opacity: 0"],
main [style*="translate3d(0, 200%"] {
  opacity: 1 !important;
  transform: none !important;
}

/* Transparent static nav: light wordmark on hero; dark wordmark when menu opens. */
.navbar.static-nav.w--nav-menu-open .brand-navbar.light {
  display: none;
}

.navbar.static-nav.w--nav-menu-open .brand-navbar.dark {
  display: block;
}

.site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000;
  padding: 18px 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0));
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  color: #fff;
}

.site-wordmark {
  color: currentColor;
  font-family: "Instrument Serif", Georgia, serif;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 0.9;
  text-decoration: none;
}

.site-nav-links {
  display: flex;
  align-items: center;
  gap: 22px;
}

.site-nav-links a,
.site-footer-links a {
  color: currentColor;
  text-decoration: none;
}

.site-nav-links a {
  font-size: 14px;
  letter-spacing: 0.02em;
}

.site-nav-cta {
  padding: 12px 18px;
  border: 1px solid rgba(255, 255, 255, 0.52);
  border-radius: 999px;
  color: #fff;
  text-decoration: none;
}

.generational-hero-wordmark {
  color: #fff;
  font-family: "Instrument Serif", Georgia, serif;
  font-size: clamp(64px, 16vw, 220px);
  line-height: 0.8;
}

.generational-hero-subhead {
  max-width: 760px;
  margin-top: 28px;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(17px, 2vw, 22px);
}

.generational-trust-line {
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
}

.generational-centered-copy,
.generational-section-heading p,
.cta-top-tile p {
  max-width: 820px;
  color: rgba(255, 255, 255, 0.72);
}

.home-a-services-section:not(.generational-services-grid) .services-marquee {
  overflow: hidden;
}

.home-a-services-section:not(.generational-services-grid) .services-marquee[data-marquee-interactive] {
  cursor: grab;
  touch-action: pan-y;
}

.home-a-services-section:not(.generational-services-grid) .services-marquee[data-marquee-interactive].is-scroll-container {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x pan-y;
  scrollbar-width: none;
}

.home-a-services-section:not(.generational-services-grid) .services-marquee[data-marquee-interactive].is-scroll-container::-webkit-scrollbar {
  display: none;
}

.home-a-services-section:not(.generational-services-grid) .services-marquee[data-marquee-interactive].is-scroll-container .marquee-services-master {
  translate: none !important;
}

.home-a-services-section:not(.generational-services-grid) .services-marquee[data-marquee-interactive].is-dragging {
  cursor: grabbing;
  user-select: none;
}

.home-a-services-section:not(.generational-services-grid) .marquee-services-master.is-manual-control {
  animation: none !important;
}

.home-a-services-section:not(.generational-services-grid) .marquee-services-master {
  --marquee-duration: 42s;
  display: flex;
  width: max-content;
  max-width: none;
  margin: 0;
  animation: site-marquee-scroll var(--marquee-duration) linear infinite;
  will-change: translate;
}

.home-a-services-section:not(.generational-services-grid) .single-services-marquee {
  display: flex;
  flex: none;
}

/* Third track is an IX2 loop duplicate; keep two tracks for CSS -50% scroll. */
.home-a-services-section:not(.generational-services-grid) .single-services-marquee:nth-child(n + 3) {
  display: none;
}

.home-a-services-section:not(.generational-services-grid) .service-card {
  height: 400px;
  gap: 0;
}

.home-a-services-section:not(.generational-services-grid) .service-card-bottom {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  min-height: 148px;
}

.home-a-services-section:not(.generational-services-grid) .service-card-bottom .text-h5 {
  min-height: 2.6em;
  line-height: 1.2;
  margin: 0;
}

.home-a-services-section:not(.generational-services-grid) .service-card-bottom p {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  max-width: 34ch;
  color: rgba(13, 33, 23, 0.68);
}

.home-a-services-section .service-card p,
.testimonial-card p,
.generational-empty-testimonial p,
.article-info-wrap p {
  margin-bottom: 0;
}

.home-a-services-section:not(.generational-services-grid) .service-card p {
  color: rgba(13, 33, 23, 0.68);
}

.testimonial-card p,
.generational-empty-testimonial p,
.article-info-wrap p {
  color: rgba(255, 255, 255, 0.68);
}

.generational-card-number,
.generational-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  color: currentColor;
  font-family: "DM Mono", monospace;
  font-size: 12px;
}

.home-a-features-section .icon-accordion.generational-tab-icon-wrap {
  display: inline-flex;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
}

.home-a-features-section .icon-accordion.generational-tab-icon-wrap img {
  width: 22px;
  height: 22px;
  opacity: 0.92;
  filter: brightness(0) invert(1);
}

.home-a-features-section .label-master.light {
  opacity: 1 !important;
}

.home-a-features-section .heading-process [style*="opacity:0"],
.home-a-features-section .heading-process [style*="translate3d(0, 200%"] {
  opacity: 1 !important;
  transform: none !important;
}

.generational-section-subscript {
  max-width: 520px;
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.72);
}

.generational-process-visual {
  display: flex;
  min-height: 620px;
  align-items: center;
  justify-content: center;
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)),
    url("../images/Home-C-Image_1Home%20C%20Image.avif") center / cover;
}

.generational-process-message {
  width: min(88%, 420px);
  padding: 28px 32px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 24px;
  backdrop-filter: blur(12px);
  background: rgba(0, 0, 0, 0.35);
}

.generational-process-message p {
  margin-bottom: 0;
  color: #fff;
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.15;
}

.generational-dashboard-card {
  width: min(88%, 420px);
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 24px;
  background: rgba(8, 8, 8, 0.72);
  color: #fff;
  backdrop-filter: blur(14px);
}

.generational-dashboard-sub {
  margin: 12px 0 4px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 15px;
  line-height: 1.45;
}

.generational-status-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  color: rgba(255, 255, 255, 0.78);
}

.generational-status-row span {
  position: relative;
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--generational-green);
}

.generational-status-row.is-complete span {
  width: 16px;
  height: 16px;
  border-radius: 0;
  background: transparent;
}

.generational-status-row.is-complete span::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 1px;
  width: 7px;
  height: 12px;
  border: solid var(--generational-green);
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
}

.generational-status-row.is-pending {
  color: rgba(255, 255, 255, 0.92);
}

.generational-status-row.is-pending .generational-status-icon {
  display: inline-flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 0;
  background: transparent;
  color: var(--generational-amber);
}

.generational-status-row.is-pending .generational-status-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

@media (prefers-reduced-motion: no-preference) {
  .generational-status-row.is-pending .generational-status-icon {
    animation: generational-pending-glow 2.4s ease-in-out infinite;
  }
}

@keyframes generational-pending-glow {
  0%,
  100% {
    opacity: 0.72;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-1px);
  }
}

.generational-status-row.muted span {
  background: var(--generational-amber);
}

.generational-centered-copy {
  margin: 22px auto 0;
  text-align: center;
}

.home-c-tabs-section .tab-b-image {
  object-fit: cover;
}

.generational-section-heading {
  margin-bottom: 56px;
}

.generational-role-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.generational-role-grid .testimonial-card {
  min-height: 360px;
}

#family .headline-home-a-story p {
  max-width: 920px;
  color: rgba(255, 255, 255, 0.7);
}

.generational-family-section .headline-home-a-story p {
  max-width: 920px;
  color: rgba(255, 255, 255, 0.7);
}

/* Founder story — eyebrow pill shrink-wraps; space before split headline */
.home-a-story-section .heading-home-a-about {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.home-a-story-section .heading-home-a-about .label-master {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 28px;
  padding: 10px 18px;
}

.generational-founder-quote {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.generational-founder-quote .text-underline {
  color: currentColor;
}

#founder .thirds-image-wrap:last-child {
  grid-column: span 2;
}

@media screen and (max-width: 767px) {
  #founder .thirds-image-wrap:last-child {
    grid-column: span 1;
  }
}

.generational-empty-testimonial {
  max-width: 760px;
  margin: 40px auto 0;
  padding: 36px;
  border: 1px dashed rgba(255, 255, 255, 0.28);
  border-radius: 24px;
  text-align: center;
}

.generational-blog-thirds {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.generational-blog-thirds .article-tile {
  height: 100%;
}

.site-footer {
  padding: 80px 0 36px;
  background: #080808;
  color: #fff;
}

.site-footer-grid {
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 40px;
}

.site-footer p {
  max-width: 440px;
  color: rgba(255, 255, 255, 0.68);
}

.footer-wordmark {
  display: inline-block;
  margin-bottom: 18px;
}

.site-footer-links {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  color: rgba(255, 255, 255, 0.72);
}

.site-footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  margin-top: 64px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.52);
  font-size: 14px;
}

/* FAQ page accordions — simple show/hide; Webflow IX2 height animations fight this layout. */
body.page-faq .section.hero-faq .expandable-single {
  cursor: pointer;
  display: block;
  width: 100%;
}

body.page-faq .section.hero-faq .expandable-single .expandable-top {
  width: 100%;
}

body.page-faq .section.hero-faq .expandable-single .expandable-bottom {
  display: none !important;
  overflow: hidden;
}

body.page-faq .section.hero-faq .expandable-single.is-open .expandable-bottom {
  display: flex !important;
}

body.page-faq .section.hero-faq .expandable-single.is-open .faq-vertical {
  transform: scaleY(0);
}

/* Custom accordions for grafted homepage learn section */
.generational-learn-section .expandable-single {
  cursor: pointer;
}

.generational-learn-section .expandable-single .expandable-top {
  width: 100%;
}

.generational-learn-section .expandable-single .expandable-bottom {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 280ms ease;
}

.generational-learn-section .expandable-single .expandable-bottom > * {
  min-height: 0;
  overflow: hidden;
}

.generational-learn-section .expandable-single.is-open .expandable-bottom {
  grid-template-rows: 1fr;
}

.generational-learn-section .expandable-single.is-open .faq-vertical {
  transform: scaleY(0);
}

body.page-faq [style*="opacity:0"],
body.page-faq [style*="opacity: 0"],
body.page-faq [style*="translate3d(0, 200%"] {
  opacity: 1 !important;
  transform: none !important;
}

body.page-faq .hide {
  overflow: visible;
}

@media screen and (max-width: 991px) {
  .site-nav-links {
    display: none;
  }

  .generational-role-grid,
  .generational-blog-thirds,
  .site-footer-grid {
    grid-template-columns: 1fr;
  }

  .generational-process-visual {
    min-height: 420px;
  }
}

@media screen and (max-width: 767px) {
  .site-header {
    padding: 12px 0;
  }

  .site-nav {
    gap: 12px;
  }

  .site-nav-cta {
    padding: 9px 12px;
    font-size: 12px;
  }

  .generational-hero-subhead {
    font-size: 16px;
  }

  .site-footer-bottom {
    flex-direction: column;
  }
}

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

  [data-reveal],
  .site-reveal,
  main [style*="translate3d(0, 200%"] {
    opacity: 1 !important;
    transform: none !important;
  }

  .home-a-services-section .marquee-services-master {
    animation: none !important;
  }
}

/* ============================================================
   Homepage polish pass
   Pull custom adaptations back toward stable Franco section shapes.
   ============================================================ */

.site-header {
  pointer-events: none;
  transition:
    padding 220ms ease,
    background 220ms ease,
    backdrop-filter 220ms ease;
}

.site-nav {
  pointer-events: auto;
}

.site-header:not(.is-scrolled) .site-wordmark {
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
}

.site-header.is-scrolled {
  padding: 10px 0;
  background: rgba(8, 12, 9, 0.76);
  backdrop-filter: blur(16px);
}

.site-header .site-wordmark {
  font-size: clamp(20px, 2.2vw, 30px);
  transition:
    opacity 220ms ease,
    transform 220ms ease;
}

.site-header .site-nav-cta {
  padding: 10px 16px;
}

.hero-home-a .generational-hero-wordmark {
  font-size: clamp(72px, 14vw, 170px);
}

/* Hero tagline row (mono labels under wordmark). */
.hero-home-a .home-a-title-bottom-tikle {
  width: 100%;
}

.hero-home-a .home-a-title-bottom-tikle .label {
  font-size: 16px;
  line-height: 1.25;
}

@media screen and (max-width: 767px) {
  .hero-home-a .home-a-title-bottom-tikle {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
  }

  .hero-home-a .home-a-title-bottom-tikle .label {
    font-size: 12px;
    line-height: 16px;
  }
}

/* Hero video lightbox: estate planning consultation thumbnail. */
.hero-home-a .lightbox-home-a {
  background-image: url("../images/hero-lightbox-estate-planning.png");
  background-position: 50% 35%;
}

/* Waitlist page: Contact-A hero ported from template (opacity:0 IX2 fallbacks). */
.section.hero-contact-a [style*="opacity:0"] {
  opacity: 1 !important;
}

.page-waitlist .waitlist-centered {
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  flex-flow: column;
  align-items: center;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.page-waitlist .waitlist-headline {
  text-align: center;
  align-items: center;
}

.page-waitlist .waitlist-headline .text-body {
  max-width: 480px;
}

.page-waitlist .waitlist-form-wrap {
  width: 100%;
}

.page-waitlist .waitlist-form-wrap .contact-form {
  width: 100%;
}

.page-waitlist .waitlist-form-wrap .input-halves {
  grid-template-columns: 1fr;
}

/* Force inputs to 16px font on every breakpoint - keeps them above iOS's
   auto-zoom threshold and matches the CTA below them. The template's
   mobile media query drops text-field to 14px which causes Safari to zoom
   on focus and looks under-sized next to the submit button. */
.page-waitlist .waitlist-form-wrap .text-field {
  font-size: 16px;
  height: 56px;
  padding: 16px 18px;
}

/* CTA matches input height (56px) and font (16px) so the form reads as a
   single confident column. */
.page-waitlist .waitlist-form-wrap .cta-main.small {
  width: 100%;
  margin-top: 8px;
  height: 56px;
  font-size: 16px;
  padding: 0 24px;
  line-height: 1;
}

.page-waitlist .waitlist-form-note {
  margin-top: 16px;
  text-align: center;
}

.page-waitlist .waitlist-hero {
  justify-content: center;
  min-height: calc(100svh - 80px);
  padding-top: 144px;
  padding-bottom: 96px;
}

/* Problem / Promise section: ported from home-a-testimonials-section,
   composed as a 2-up testimonial-card grid. The section wrapper
   (`.section.home-a-testimonials-section`) supplies 120px vertical
   padding so it never collides with the hero. */
.generational-promise-section {
  position: relative;
  z-index: 1;
  background: #f3eee4;
  color: #0d2117;
}

.generational-promise-section .headline-home-a-story {
  align-items: flex-start;
  max-width: 920px;
  margin-bottom: 56px;
}

.generational-promise-section .headline-home-a-story p {
  max-width: 760px;
  color: rgba(13, 33, 23, 0.7);
}

.generational-promise-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-top: 12px;
  align-items: stretch;
}

.generational-promise-grid .testimonial-card {
  min-height: 360px;
  padding: 36px;
  overflow: hidden;
  color: #fff;
}

.generational-promise-grid .testimonial-card.white-card {
  color: #0d2117;
}

.generational-promise-grid .testimonial-card .testimonial-text {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.generational-promise-grid .testimonial-card .label-master {
  margin: 0;
}

.generational-promise-grid .testimonial-card p {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
}

.generational-promise-grid .testimonial-card.white-card p {
  color: rgba(13, 33, 23, 0.7);
}

.home-a-services-section {
  background: #f3eee4;
  color: #0d2117;
}

.home-a-services-section .headline-moving-features {
  margin-bottom: 44px;
}

.home-a-services-section.generational-services-grid .services-marquee {
  overflow: visible;
  padding: 0 clamp(18px, 4vw, 56px) 96px;
}

.home-a-services-section.generational-services-grid .marquee-services-master {
  display: grid;
  width: 100%;
  max-width: 1380px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  margin: 0 auto;
  animation: none !important;
}

.home-a-services-section.generational-services-grid .single-services-marquee {
  display: contents;
}

.home-a-services-section.generational-services-grid .single-services-marquee[aria-hidden="true"] {
  display: none;
}

.home-a-services-section.generational-services-grid .service-card {
  min-width: 0;
  min-height: 300px;
  justify-content: space-between;
  padding: 34px;
  border: 1px solid rgba(13, 33, 23, 0.08);
  background: rgba(13, 33, 23, 0.04);
  color: #0d2117;
}

.home-a-services-section.generational-services-grid .service-card p {
  color: rgba(13, 33, 23, 0.68);
}

.home-a-features-section .process-halves {
  align-items: start;
}

.home-a-features-section .tabs-menu-features {
  max-height: none;
}

/* Empty tab panes; plan-status card is .generational-process-visual */
.home-a-features-section .tabs-content-features {
  display: none;
}

@media screen and (max-width: 991px) {
  .home-a-features-section .features-image-placeholder.generational-process-visual {
    display: flex;
    height: auto;
    min-height: 420px;
    margin-top: 48px;
  }
}

.generational-process-visual {
  position: sticky;
  top: 96px;
  overflow: hidden;
}

.generational-dashboard-section {
  background: #f3eee4;
  color: #0d2117;
}

.generational-dashboard-section .headline-expandable-tabs {
  align-items: center;
  margin-bottom: 0;
  text-align: center;
}

.generational-dashboard-section .label,
.generational-dashboard-section .generational-centered-copy {
  color: rgba(13, 33, 23, 0.72);
}

.generational-dashboard-section .generational-centered-copy {
  margin-top: 18px;
}

.generational-dashboard-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  margin-top: 52px;
  align-items: stretch;
}

.generational-dashboard-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 520px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(13, 33, 23, 0.1);
  border-radius: 28px;
  background: #0d2117;
}

.generational-dashboard-tile img {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.03);
}

.generational-dashboard-tile::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background: linear-gradient(
    180deg,
    rgba(13, 33, 23, 0.06) 0%,
    rgba(13, 33, 23, 0.18) 38%,
    rgba(13, 33, 23, 0.72) 68%,
    rgba(13, 33, 23, 0.94) 100%
  );
  pointer-events: none;
}

.generational-dashboard-tile-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 14px;
  height: 252px;
  padding: 28px;
  color: #fff;
}

.generational-dashboard-tile-copy .generational-step {
  margin: 0;
  border-color: rgba(255, 255, 255, 0.28);
  color: #fff;
}

.generational-dashboard-tile-copy h3 {
  margin: 0;
  font-size: var(--heading--h4);
  letter-spacing: var(--letter-spacing--3);
  line-height: 1.05;
}

.generational-dashboard-tile-copy p {
  flex: 1;
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 15px;
  line-height: 1.5;
}

.generational-family-section,
.generational-testimonials-section,
.generational-learn-section {
  background: #f3eee4;
  color: #0d2117;
}

.generational-family-section .headline-home-a-story p,
.generational-testimonials-section .headline-home-a-story p,
.generational-learn-section .faq-paragraph {
  color: rgba(13, 33, 23, 0.7);
}

.generational-role-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  margin-top: 52px;
}

.generational-role-grid .testimonial-card {
  min-height: 360px;
  overflow: hidden;
  padding: 28px;
  color: #fff;
}

.generational-role-grid .testimonial-card.white-card {
  color: #0d2117;
}

.generational-role-grid .testimonial-card p {
  color: rgba(255, 255, 255, 0.7);
}

.generational-role-grid .testimonial-card.white-card p {
  color: rgba(13, 33, 23, 0.68);
}

.generational-testimonials-section .testimonial-thirds {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 52px;
}

.generational-testimonials-section .testimonial-card {
  min-height: 470px;
  overflow: hidden;
}

.generational-testimonials-section .testimonial-card p,
.generational-testimonials-section .testimonial-card .text-h5 {
  color: inherit;
}

.generational-learn-section .faq-halves {
  align-items: start;
}

.generational-learn-section .heading-faq {
  position: sticky;
  top: 110px;
}

.generational-learn-section .faq-block {
  border-top: 1px solid rgba(13, 33, 23, 0.14);
}

.generational-learn-section .expandable-single {
  border-bottom: 1px solid rgba(13, 33, 23, 0.14);
}

.generational-learn-section .expandable-top {
  padding: 30px 0;
}

.generational-learn-section .faq-animated-box,
.generational-learn-section .faq-horizontal,
.generational-learn-section .faq-vertical {
  border-color: rgba(13, 33, 23, 0.42);
  background-color: #0d2117;
}

.cta-section {
  position: relative;
  z-index: 2;
}

.site-footer {
  position: relative;
  z-index: 10;
  isolation: isolate;
  margin-top: 0;
  background: #07130d;
}

.site-footer .footer-wordmark {
  font-size: clamp(42px, 8vw, 92px);
}

.site-footer-grid {
  align-items: start;
}

@media screen and (max-width: 1180px) {
  .home-a-services-section.generational-services-grid .marquee-services-master,
  .generational-dashboard-grid,
  .generational-role-grid,
  .generational-testimonials-section .testimonial-thirds {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 991px) {
  .generational-promise-grid {
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 767px) {
  .home-a-services-section.generational-services-grid .marquee-services-master,
  .generational-dashboard-grid,
  .generational-role-grid,
  .generational-testimonials-section .testimonial-thirds {
    grid-template-columns: 1fr;
  }

  .generational-dashboard-tile {
    min-height: 380px;
  }

  .generational-dashboard-tile-copy {
    height: auto;
    min-height: 200px;
    padding: 24px;
  }

  .generational-learn-section .heading-faq,
  .generational-process-visual {
    position: static;
  }
}

/* home.html baseline — show content if Webflow IX2 does not run */
body.page-home-a [style*="opacity:0"],
body.page-home-a [style*="opacity: 0"],
body.page-home-a [style*="translate3d(0, 200%"] {
  opacity: 1 !important;
  transform: none !important;
}

body.page-home-a .hide {
  overflow: visible;
}

/* home-a-column-section: why points replace template logo marquee */
.home-a-column-section .generational-why-points {
  display: flex;
  flex-flow: column;
  gap: 16px;
  width: 100%;
}

.home-a-column-section .generational-why-points .home-number-feature {
  width: 100%;
}

/* Mobile-menu closing CTA. Sits in .menu-bottom-tile (which only renders
   on mobile, while the .w-nav-menu is open), full width, matching the
   16px / 56px sizing established for the waitlist form for visual rhythm. */
.menu-bottom-tile .menu-cta-bottom {
  width: 100%;
  height: 56px;
  font-size: 16px;
  line-height: 1;
  padding: 0 24px;
}