/* V403: the family path starts with partner links and product learning; automation is optional. */
body[data-family-guided="true"] .rolf-guide {
  width: min(1060px, calc(100% - 24px));
}

body[data-family-guided="true"][data-rolf-guided="true"] .rolf-guide > .rolf-guide__today,
body[data-family-guided="true"][data-rolf-guided="true"] .rolf-guide > .rolf-guide__programs,
body[data-family-guided="true"][data-rolf-guided="true"] .rolf-guide > .rolf-guide__link:not([hidden]),
body[data-family-guided="true"][data-rolf-guided="true"] .rolf-guide > .rolf-guide__optional-help {
  display: grid !important;
}

body[data-family-guided="true"] .rolf-guide__hero { order: 1; }
body[data-family-guided="true"] .rolf-guide__today { order: 2; }
body[data-family-guided="true"] .rolf-guide__programs { order: 3; }
body[data-family-guided="true"] .rolf-guide__link { order: 4; }
body[data-family-guided="true"] .rolf-guide__optional-help { order: 5; }

body[data-family-guided="true"] .rolf-guide__optional-help {
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 18px;
  background: rgba(255, 255, 255, .018);
  overflow: hidden;
}

body[data-family-guided="true"] .rolf-guide__optional-help > summary {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  color: #d8e8e6;
  font-weight: 900;
  cursor: pointer;
  list-style-position: inside;
}

body[data-family-guided="true"] .rolf-guide__optional-help > summary b {
  color: #78949a;
  font-size: 11px;
}

body[data-family-guided="true"] .rolf-guide__optional-help > .rolf-signup {
  margin: 0 12px 12px;
  border-radius: 16px;
}

body[data-family-guided="true"] .rolf-guide__optional-help:not([open]) .rolf-signup {
  display: none !important;
}

body[data-family-guided="true"] .rolf-guide__programs > header b {
  color: #07131f;
  background: linear-gradient(110deg, #39e6bd, #5ad9ff);
}

body[data-family-guided="true"] .rolf-program__actions {
  min-width: 225px;
}

body[data-family-guided="true"] .rolf-program__actions button {
  border-color: rgba(57, 230, 189, .3);
  color: #bffbed;
}

@media (max-width: 850px) {
  body[data-family-guided="true"] .rolf-guide { width: min(100% - 12px, 1060px); }
  body[data-family-guided="true"] .rolf-guide__optional-help > summary { align-items: flex-start; flex-direction: column; }
  body[data-family-guided="true"] .rolf-program__actions { min-width: 0; }
}
