/* GTGF v15.77 — Homepage Premium Feel.
 * Refines v15.76 without changing the product story: Planner -> Coach -> Fueling -> Progressie -> Startlijn.
 * Direction: quieter luxury, stronger hierarchy, fewer hard boxes, more editorial spacing.
 */

/* Home-only chrome */
body.gtgf-v14 .v14-site-header {
  background: rgba(5,5,5,.88);
  border-bottom-color: rgba(255,255,255,.09);
  backdrop-filter: blur(22px) saturate(118%);
  -webkit-backdrop-filter: blur(22px) saturate(118%);
}
body.gtgf-v14 .v14-nav-list > li > a { color: rgba(255,255,255,.76); }
body.gtgf-v14 .v14-nav-list > li:hover > a,
body.gtgf-v14 .v14-nav-list > li:focus-within > a { color: #fff; }

.v1577-home-main {
  --v1577-paper: #f5f2ec;
  --v1577-paper-soft: #ece8df;
  --v1577-ink: #0a0a0a;
  --v1577-muted: #716d66;
  --v1577-hairline: rgba(10,10,10,.13);
  --v1577-darkline: rgba(255,255,255,.12);
  background: #070707;
}
.v1577-home-main > section { padding-block: clamp(76px, 9vw, 128px); }
.v1577-home-main > .v1576-hero { padding-block: 0; }

/* Hero — one dominant message, product journey as a refined system line. */
.v1577-home-main .v1576-hero {
  min-height: min(900px, calc(100svh - var(--gtgf-header-h)));
  isolation: isolate;
  overflow: hidden;
}
.v1577-home-main .v1516-hero-media {
  object-position: 58% center;
  filter: saturate(.88) contrast(1.05) brightness(.92);
  transform: scale(1.015);
}
.v1577-home-main .v1576-hero .v14-hero-shade {
  background:
    linear-gradient(90deg, rgba(3,3,3,.99) 0%, rgba(3,3,3,.94) 33%, rgba(3,3,3,.66) 57%, rgba(3,3,3,.18) 79%, rgba(3,3,3,.08) 100%),
    linear-gradient(0deg, rgba(0,0,0,.74) 0%, rgba(0,0,0,.10) 50%, rgba(0,0,0,.20) 100%);
}
.v1577-home-main .v1576-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 77% 23%, rgba(255,90,0,.10), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 18% 82%, rgba(255,90,0,.025));
  mix-blend-mode: screen;
}
.v1577-home-main .v14-topolines { opacity: .10; }
.v1577-home-main .v1576-hero__content {
  max-width: 1320px;
  padding-top: clamp(96px, 11vw, 150px);
  padding-bottom: clamp(78px, 9vw, 120px);
}
.v1577-home-main .v1576-hero .v14-eyebrow {
  margin-bottom: 18px !important;
  color: rgba(255,255,255,.58);
  font-size: .68rem !important;
  letter-spacing: .22em;
}
.v1577-home-main .v1576-hero .v14-brand-heading {
  display: inline-flex;
  gap: .35em;
  max-width: none !important;
  margin: 0 0 22px !important;
  color: rgba(255,255,255,.90);
  font-family: var(--gtgf-font-body);
  font-size: .77rem !important;
  line-height: 1.2 !important;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.v1577-home-main .v1576-hero .v14-brand-heading span {
  display: inline;
  color: var(--gtgf-accent);
}
.v1577-home-main .v1576-hero h1 {
  max-width: 13.5ch;
  margin-bottom: 24px;
  font-size: clamp(3rem, 5.65vw, 6.25rem);
  line-height: .92;
  letter-spacing: -.062em;
  text-wrap: balance;
}
.v1577-home-main .v1576-hero .v14-lead {
  max-width: 610px;
  color: rgba(255,255,255,.70);
  font-size: clamp(1.02rem, 1.25vw, 1.16rem);
  line-height: 1.72;
}

/* Journey rail: no chip wall; one quiet product spine. */
.v1577-home-main .v1576-journey-rail {
  width: min(760px, 100%);
  gap: 0;
  margin-top: 34px;
  padding: 14px 0;
  border-top: 1px solid rgba(255,255,255,.14);
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.v1577-home-main .v1576-journey-rail span {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.76);
  font-size: .73rem;
  letter-spacing: .03em;
}
.v1577-home-main .v1576-journey-rail span b {
  color: var(--gtgf-accent);
  font-size: .60rem;
  letter-spacing: .12em;
}
.v1577-home-main .v1576-journey-rail i {
  width: clamp(18px, 2.5vw, 38px);
  height: 1px;
  margin: 0 clamp(8px, 1.3vw, 18px);
  overflow: hidden;
  color: transparent;
  background: rgba(255,255,255,.20);
}

/* Goal selector as a technical control, not a row of CTA blocks. */
.v1577-home-main .v1576-goal-picker {
  display: inline-flex;
  gap: 0;
  margin-top: 28px;
  padding: 4px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(9,9,9,.48);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.v1577-home-main .v1576-goal-picker button {
  min-width: 118px;
  border: 0;
  border-right: 1px solid rgba(255,255,255,.09);
  background: transparent;
  color: rgba(255,255,255,.68);
  font-size: .72rem;
  letter-spacing: .02em;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.v1577-home-main .v1576-goal-picker button:last-child { border-right: 0; }
.v1577-home-main .v1576-goal-picker button:hover { color: #fff; background: rgba(255,255,255,.045); }
.v1577-home-main .v1576-goal-picker button.is-active {
  background: #fff;
  color: #080808;
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
}
.v1577-home-main .v1576-hero__actions { margin-top: 22px; }
.v1577-home-main .v1576-hero__actions .v14-btn--orange {
  min-width: 220px;
  background: var(--gtgf-accent);
  box-shadow: 0 14px 32px rgba(255,90,0,.16);
}
.v1577-home-main .v1576-hero__actions .v14-btn--orange:hover {
  background: #ff6b1c;
  transform: translateY(-1px);
  box-shadow: 0 18px 38px rgba(255,90,0,.22);
}
.v1577-home-main .v1576-hero__trust {
  gap: 0;
  margin-top: 26px;
  color: rgba(255,255,255,.46);
  font-size: .69rem;
  font-weight: 750;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.v1577-home-main .v1576-hero__trust span {
  padding: 0 14px;
  border-right: 1px solid rgba(255,255,255,.12);
}
.v1577-home-main .v1576-hero__trust span:first-child { padding-left: 0; }
.v1577-home-main .v1576-hero__trust span:last-child { border-right: 0; }
.v1577-home-main .v1576-hero__trust span::before { display: none; }

/* Editorial section headings */
.v1577-home-main .v1576-section-head { margin-bottom: clamp(44px, 6vw, 76px); }
.v1577-home-main .v1576-section-head h2 {
  max-width: 10ch;
  font-size: clamp(2.8rem, 5.7vw, 5.6rem);
  letter-spacing: -.065em;
}
.v1577-home-main .v1576-section-head > p {
  max-width: 460px;
  color: var(--v1577-muted);
  font-size: 1rem;
}

/* Product route: 2 hero modules + 3 supporting modules. */
.v1577-home-main .v1576-flow {
  position: relative;
  background: var(--v1577-paper);
  color: var(--v1577-ink);
}
.v1577-home-main .v1576-flow::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(10,10,10,.14), transparent);
}
.v1577-home-main .v1576-flow__grid {
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 12px;
  border: 0;
  background: transparent;
}
.v1577-home-main .v1576-flow-card {
  min-height: 320px;
  padding: clamp(26px, 3vw, 38px);
  border: 1px solid rgba(10,10,10,.10);
  background: rgba(255,255,255,.68);
  box-shadow: 0 18px 44px rgba(35,27,20,.035);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.v1577-home-main .v1576-flow-card:nth-child(1),
.v1577-home-main .v1576-flow-card:nth-child(2) { grid-column: span 3; min-height: 360px; }
.v1577-home-main .v1576-flow-card:nth-child(n+3) { grid-column: span 2; min-height: 300px; }
.v1577-home-main .v1576-flow-card:nth-child(1) {
  background: #090909;
  color: #fff !important;
  border-color: #090909;
  box-shadow: 0 28px 65px rgba(0,0,0,.13);
}
.v1577-home-main .v1576-flow-card:nth-child(2) {
  background: linear-gradient(145deg, #15120f 0%, #0d0c0b 100%);
  color: #fff !important;
  border-color: rgba(255,90,0,.20);
  box-shadow: 0 26px 62px rgba(0,0,0,.11);
}
.v1577-home-main .v1576-flow-card:hover {
  background: #fff;
  border-color: rgba(10,10,10,.17);
  transform: translateY(-4px);
  box-shadow: 0 24px 55px rgba(35,27,20,.08);
}
.v1577-home-main .v1576-flow-card:nth-child(1):hover,
.v1577-home-main .v1576-flow-card:nth-child(2):hover { background: #101010; border-color: rgba(255,90,0,.30); }
.v1577-home-main .v1576-flow-card__number {
  font-size: .64rem;
  letter-spacing: .18em;
}
.v1577-home-main .v1576-flow-card__label {
  margin-top: clamp(42px, 6vw, 74px);
  color: #8a867f;
  font-size: .66rem;
  letter-spacing: .18em;
}
.v1577-home-main .v1576-flow-card:nth-child(1) .v1576-flow-card__label,
.v1577-home-main .v1576-flow-card:nth-child(2) .v1576-flow-card__label { color: rgba(255,255,255,.42); }
.v1577-home-main .v1576-flow-card h3 {
  max-width: 13ch;
  margin: 12px 0 15px;
  font-size: clamp(1.35rem, 2vw, 2.05rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}
.v1577-home-main .v1576-flow-card p {
  max-width: 33ch;
  color: #77726a;
  font-size: .91rem;
  line-height: 1.66;
}
.v1577-home-main .v1576-flow-card:nth-child(1) p,
.v1577-home-main .v1576-flow-card:nth-child(2) p { color: rgba(255,255,255,.58); }
.v1577-home-main .v1576-flow-card strong {
  color: #111;
  font-size: .72rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.v1577-home-main .v1576-flow-card:nth-child(1) strong,
.v1577-home-main .v1576-flow-card:nth-child(2) strong { color: var(--gtgf-accent); }

/* Mijn GTGF — darker, quieter and more product-like. */
.v1577-home-main .v1576-product {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 28%, rgba(255,90,0,.08), transparent 28%),
    #060606;
}
.v1577-home-main .v1576-product::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background: repeating-radial-gradient(ellipse at 78% 30%, transparent 0 42px, rgba(255,90,0,.12) 43px 44px, transparent 45px 78px);
}
.v1577-home-main .v1576-product__grid { position: relative; z-index: 1; grid-template-columns: minmax(0,.78fr) minmax(520px,1.22fr); gap: clamp(54px, 8vw, 120px); }
.v1577-home-main .v1576-product__copy h2 {
  max-width: 11.5ch;
  font-size: clamp(2.8rem, 5.1vw, 5.2rem);
  letter-spacing: -.064em;
}
.v1577-home-main .v1576-product__copy > p:not(.v14-eyebrow) { color: rgba(255,255,255,.61); }
.v1577-home-main .v1576-product__points {
  display: block;
  margin: 34px 0;
  border: 0;
  border-top: 1px solid var(--v1577-darkline);
  background: transparent;
}
.v1577-home-main .v1576-product__points span {
  display: grid;
  grid-template-columns: 112px minmax(0,1fr);
  gap: 18px;
  padding: 13px 0;
  border-bottom: 1px solid var(--v1577-darkline);
  background: transparent;
  color: rgba(255,255,255,.54);
}
.v1577-home-main .v1576-product__points b { margin: 0; color: #fff; }

.v1577-home-main .v1576-coach-demo {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 3vw, 38px);
  background: linear-gradient(155deg, rgba(25,25,25,.98), rgba(11,11,11,.98));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 42px 100px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.03);
}
.v1577-home-main .v1576-coach-demo::after {
  content: '';
  position: absolute;
  top: -80px;
  right: -95px;
  width: 230px;
  height: 230px;
  border: 1px solid rgba(255,90,0,.20);
  transform: rotate(29deg);
  pointer-events: none;
}
.v1577-home-main .v1576-coach-demo__top { padding-bottom: 20px; }
.v1577-home-main .v1576-coach-demo__top strong { font-size: 1rem; }
.v1577-home-main .v1576-coach-demo__training,
.v1577-home-main .v1576-coach-demo__done { padding: 20px 0; }
.v1577-home-main .v1576-coach-demo__training strong,
.v1577-home-main .v1576-coach-demo__done strong { font-size: 1.14rem; }
.v1577-home-main .v1576-coach-demo__coach {
  margin-top: 24px;
  padding: clamp(20px, 2.2vw, 28px);
  border-left-width: 2px;
  background: linear-gradient(120deg, rgba(255,90,0,.075), rgba(255,255,255,.025));
}
.v1577-home-main .v1576-coach-demo__coach h3 { max-width: 17ch; font-size: clamp(1.38rem, 2vw, 1.85rem); }
.v1577-home-main .v1576-coach-demo__coach button {
  border: 1px solid rgba(255,90,0,.70);
  background: transparent;
  color: #fff;
}
.v1577-home-main .v1576-coach-demo__coach button::after { content: '  →'; color: var(--gtgf-accent); }

/* Proof becomes typography rather than a boxed KPI dashboard. */
.v1577-home-main .v1576-proof {
  background: var(--v1577-paper);
  color: var(--v1577-ink);
  border-bottom: 0;
}
.v1577-home-main .v1576-proof__grid { gap: clamp(46px, 9vw, 130px); }
.v1577-home-main .v1576-proof__grid h2 { font-size: clamp(2.7rem, 5vw, 5rem); letter-spacing: -.06em; }
.v1577-home-main .v1576-proof__metrics {
  grid-template-columns: repeat(4, 1fr);
  border: 0;
  border-top: 1px solid var(--v1577-hairline);
  border-bottom: 1px solid var(--v1577-hairline);
}
.v1577-home-main .v1576-proof__metrics div {
  padding: 30px 20px 30px 0;
  border: 0;
  border-right: 1px solid var(--v1577-hairline);
}
.v1577-home-main .v1576-proof__metrics div:not(:first-child) { padding-left: 20px; }
.v1577-home-main .v1576-proof__metrics div:last-child { border-right: 0; }
.v1577-home-main .v1576-proof__metrics strong {
  font-size: clamp(1.55rem, 2.5vw, 2.6rem);
  font-weight: 900;
}
.v1577-home-main .v1576-proof__metrics span { margin-top: 8px; font-size: .62rem; letter-spacing: .15em; }

/* Secondary paths: intentionally quiet. */
.v1577-home-main .v1576-more { background: var(--v1577-paper-soft); }
.v1577-home-main .v1576-more__head { margin-bottom: 38px; }
.v1577-home-main .v1576-more__head h2 { font-size: clamp(2rem, 3.7vw, 3.7rem); letter-spacing: -.055em; }
.v1577-home-main .v1576-more__links { border-top-color: rgba(10,10,10,.16); }
.v1577-home-main .v1576-more__links a {
  position: relative;
  padding: 27px 44px 27px 0;
  border-bottom-color: rgba(10,10,10,.16);
  transition: padding-left .18s ease, color .18s ease;
}
.v1577-home-main .v1576-more__links a::after {
  content: '↗';
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gtgf-accent);
  font-size: 1rem;
}
.v1577-home-main .v1576-more__links a:hover { padding-left: 8px; }
.v1577-home-main .v1576-more__links strong { font-size: 1.04rem; }

/* Final CTA: editorial close, no extra visual noise. */
.v1577-home-main .v1576-final {
  position: relative;
  background: #070707;
  color: #fff;
}
.v1577-home-main .v1576-final::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: min(1280px, calc(100vw - 64px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
}
.v1577-home-main .v1576-final h2 {
  max-width: 12ch;
  font-size: clamp(3rem, 5.8vw, 6rem);
  letter-spacing: -.065em;
}
.v1577-home-main .v1576-final > .v14-shell > p:not(.v14-eyebrow) { color: rgba(255,255,255,.58); }

@media (max-width: 1100px) {
  .v1577-home-main .v1576-flow__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .v1577-home-main .v1576-flow-card:nth-child(n) { grid-column: auto; min-height: 300px; }
  .v1577-home-main .v1576-flow-card:last-child { grid-column: 1 / -1; min-height: 230px; }
  .v1577-home-main .v1576-product__grid { grid-template-columns: minmax(0,.85fr) minmax(430px,1.15fr); gap: 48px; }
  .v1577-home-main .v1576-proof__grid { grid-template-columns: .8fr 1.2fr; gap: 50px; }
  .v1577-home-main .v1576-proof__metrics { grid-template-columns: 1fr 1fr; }
  .v1577-home-main .v1576-proof__metrics div:nth-child(2) { border-right: 0; }
  .v1577-home-main .v1576-proof__metrics div:nth-child(-n+2) { border-bottom: 1px solid var(--v1577-hairline); }
}

@media (max-width: 760px) {
  .v1577-home-main > section { padding-block: 66px; }
  .v1577-home-main > .v1576-hero { padding-block: 0; }
  .v1577-home-main .v1516-hero-media { object-position: 64% center; transform: none; }
  .v1577-home-main .v1576-hero .v14-hero-shade {
    background: linear-gradient(0deg, rgba(3,3,3,.985) 0%, rgba(3,3,3,.92) 50%, rgba(3,3,3,.50) 100%);
  }
  .v1577-home-main .v1576-hero__content { padding-top: 88px; padding-bottom: 52px; }
  .v1577-home-main .v1576-hero h1 { max-width: 11ch; font-size: clamp(2.75rem, 14vw, 4.35rem); }
  .v1577-home-main .v1576-hero .v14-lead { max-width: 32ch; }
  .v1577-home-main .v1576-journey-rail {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
    padding: 12px 0;
  }
  .v1577-home-main .v1576-journey-rail span { justify-content: flex-start; }
  .v1577-home-main .v1576-journey-rail i { display: none !important; }
  .v1577-home-main .v1576-journey-rail span:nth-of-type(n+4) { display: none; }
  .v1577-home-main .v1576-goal-picker { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .v1577-home-main .v1576-goal-picker button { min-width: 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .v1577-home-main .v1576-hero__trust { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
  .v1577-home-main .v1576-hero__trust span { padding: 0; border: 0; }
  .v1577-home-main .v1576-section-head h2 { font-size: clamp(2.55rem, 12vw, 4rem); }
  .v1577-home-main .v1576-flow__grid { display: block; }
  .v1577-home-main .v1576-flow-card:nth-child(n) { min-height: 0; margin-bottom: 10px; }
  .v1577-home-main .v1576-flow-card__label { margin-top: 28px; }
  .v1577-home-main .v1576-product__grid,
  .v1577-home-main .v1576-proof__grid { grid-template-columns: 1fr; gap: 42px; }
  .v1577-home-main .v1576-product__points span { grid-template-columns: 92px 1fr; }
  .v1577-home-main .v1576-proof__metrics { grid-template-columns: 1fr 1fr; }
  .v1577-home-main .v1576-proof__metrics div { padding: 22px 12px 22px 0; }
  .v1577-home-main .v1576-proof__metrics div:not(:first-child) { padding-left: 12px; }
  .v1577-home-main .v1576-more__links { grid-template-columns: 1fr; }
  .v1577-home-main .v1576-more__links a { margin-right: 0 !important; }
  .v1577-home-main .v1576-final::before { width: calc(100vw - 28px); }
}

@media (prefers-reduced-motion: reduce) {
  .v1577-home-main .v1576-flow-card,
  .v1577-home-main .v1576-more__links a,
  .v1577-home-main .v1576-goal-picker button,
  .v1577-home-main .v1576-hero__actions .v14-btn--orange { transition: none; }
}
