/* Keep the helper introduction compact without changing shared page layouts. */
.get-paid-page {
  background: radial-gradient(ellipse at 0 12%, #d9f4ff 0, transparent 35%), radial-gradient(ellipse at 100% 50%, #e8e2ff 0, transparent 32%), #f4f8fc;
}
.get-paid-page .page-hero {
  padding: clamp(20px, 3vw, 40px);
  border-radius: 28px;
  background: radial-gradient(ellipse at top right, #19778b, transparent 60%), linear-gradient(125deg, #092b49, #153d67 60%, #313a80);
  box-shadow: 0 18px 45px #12395326, inset 0 1px 0 #ffffff66;
  border: 1px solid #609fba;
}
.get-paid-page .page-hero h1 { color: #fff; }
.get-paid-page .page-hero h1 span { color: #d7ff94; text-shadow: 0 3px 24px #bdff7240; }
.get-paid-page .page-hero p { color: #e2f2fb; }
.get-paid-page .page-hero .eyebrow { color: #d7ff94; }
.get-paid-page .page-hero .button.secondary { background: white; color: #123d60; }
.get-paid-page .section-title { color: #103550; text-shadow: 0 2px 0 #fff; }
.get-paid-page .section-title::after { content: ''; display: block; width: 84px; height: 5px; margin-top: 12px; border-radius: 6px; background: linear-gradient(90deg, #1474b8, #24ac9a, #bfde51); }
.get-paid-page :is(.card,.offer-group,.possibility-card,.step,.faq details) {
  --shine-color: #146aad;
  --shine-soft: #e6f3ff;
  position: relative;
  isolation: isolate;
  border-color: #aac9e0;
  background: linear-gradient(145deg, #fff 35%, var(--shine-soft));
  box-shadow: 0 10px 24px #193b5612, inset 0 1px 0 #fff;
}
.get-paid-page :is(.card,.offer-group,.possibility-card,.step,.faq details):nth-child(4n+2) { --shine-color: #6745a7; --shine-soft: #f0eaff; }
.get-paid-page :is(.card,.offer-group,.possibility-card,.step,.faq details):nth-child(4n+3) { --shine-color: #0d7563; --shine-soft: #e0f6ed; }
.get-paid-page :is(.card,.offer-group,.possibility-card,.step,.faq details):nth-child(4n+4) { --shine-color: #88500d; --shine-soft: #fff1d8; }
.get-paid-page :is(.card,.possibility-card) { border-top: 5px solid var(--shine-color); }
.get-paid-page :is(.card,.offer-group,.step) p,
.get-paid-page .offer-group ul { color: #40566a; }
.get-paid-page .card h3 { color: var(--shine-color); }
.get-paid-page .offer-group:not(.family-visits) > h3 {
  margin: -18px -18px 16px;
  padding: 18px;
  border-radius: 15px 15px 0 0;
  color: #fff;
  background: linear-gradient(125deg, var(--shine-color), #163953);
  box-shadow: inset 0 1px 0 #ffffff55, 0 5px 12px #183d5414;
}
.get-paid-page .offer-group li::marker { color: var(--shine-color); }
.get-paid-page .family-visits { border-left: 6px solid #198356; background: linear-gradient(110deg, #e1f8df, #f6fff8 60%, #d5f2ef); }
.get-paid-page .tag { color: var(--shine-color); background: var(--shine-soft); border: 1px solid #ffffff; box-shadow: 0 3px 7px #183d5410; }
.get-paid-page .worker-start-strip { background: linear-gradient(110deg, #d8f3ff, #eef5ff 48%, #e7e0ff); border-color: #99c2df; box-shadow: 0 8px 22px #183d5410; }
.get-paid-page .shareable-work-profile,
.get-paid-page .helper-possibilities { background: linear-gradient(130deg, #e1f2ff, #f8fbff 55%, #e8e4ff); border-color: #accbe0; }
.get-paid-page .step { border-left: 4px solid var(--shine-color); }
.get-paid-page .step::before { background: linear-gradient(145deg, var(--shine-color), #153b57); box-shadow: 0 4px 9px #183d5430, 0 0 0 4px #fff, 0 0 0 6px var(--shine-soft); text-shadow: 0 1px 2px #0003; }
.get-paid-page .faq details { padding: 0; overflow: hidden; border-left: 5px solid var(--shine-color); transition: border-color .2s, box-shadow .2s; }
.get-paid-page .faq summary { position: relative; padding: 19px 64px 19px 20px; list-style: none; color: #143b58; background: linear-gradient(110deg, var(--shine-soft), #fff 75%); }
.get-paid-page .faq summary::-webkit-details-marker { display: none; }
.get-paid-page .faq summary::after { content: '+'; position: absolute; top: 50%; right: 18px; transform: translateY(-50%); display: grid; place-items: center; width: 32px; height: 32px; font-size: 24px; line-height: 1; border-radius: 10px; color: #fff; background: var(--shine-color); box-shadow: inset 0 1px 0 #ffffff66, 0 3px 7px #123d5320; }
.get-paid-page .faq details[open] { border-color: var(--shine-color); box-shadow: 0 9px 24px #163b5820; }
.get-paid-page .faq details[open] summary { color: #fff; background: linear-gradient(115deg, var(--shine-color), #123550); }
.get-paid-page .faq details[open] summary::after { content: '−'; background: #ffffff24; }
.get-paid-page .faq details > p { margin: 0; padding: 20px; color: #40566a; background: #fff; }
.get-paid-page .faq details[open] > p { animation: helper-answer-in .3s ease-out; }
.get-paid-page .cta-band { background: radial-gradient(ellipse at top right, #167e79, transparent 65%), linear-gradient(115deg, #103959, #30387a); box-shadow: 0 15px 32px #183d5426, inset 0 1px 0 #ffffff66; border: 1px solid #6792bd; }
.get-paid-page .actions :is(.cta,.button) { position: relative; overflow: hidden; isolation: isolate; box-shadow: 0 6px 16px #143b5430, inset 0 2px 0 #ffffff66; transition: transform .18s, box-shadow .18s; }
.get-paid-page :is(.cta,.button,summary):focus-visible { outline: 3px solid #cb8b0b; outline-offset: 4px; }
.get-paid-page .actions :is(.cta,.button):active { transform: translateY(2px) scale(.98); }
.get-paid-page .worker-art { box-shadow: 0 6px 16px #143b5420, 0 0 0 3px #fff; }
.get-paid-page .shine-arrival::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(110deg, transparent 25%, #ffffff88 45%, transparent 65%); background-size: 300% 100%; opacity: 0; animation: helper-gloss 1.25s ease-out; }
.get-paid-page .tap-light { position: absolute; pointer-events: none; left: var(--tap-x); top: var(--tap-y); width: 90px; height: 90px; margin: -45px; border-radius: 50%; border: 2px solid #ffffffaa; background: #77dffb33; animation: helper-tap .55s ease-out forwards; }
@keyframes helper-gloss { 0% { background-position: 100% 0; opacity: 0; } 20% { opacity: .7; } 100% { background-position: 0 0; opacity: 0; } }
@keyframes helper-answer-in { from { opacity: .5; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
@keyframes helper-tap { from { transform: scale(.15); opacity: 1; } to { transform: scale(3); opacity: 0; } }
@media (hover: hover) and (pointer: fine) {
  .get-paid-page .actions :is(.cta,.button):hover { transform: translateY(-2px); box-shadow: 0 10px 22px #143b5440, inset 0 2px 0 #ffffff66; }
  .get-paid-page .faq summary:hover { filter: brightness(.97); }
}
@media (prefers-reduced-motion: reduce) {
  .get-paid-page .shine-arrival::after, .get-paid-page .tap-light { display: none; animation: none; }
  .get-paid-page .faq details[open] > p { animation: none; }
  .get-paid-page :is(.card,.button,.cta,.faq details) { transition: none; transform: none; }
}
.get-paid-page .worker-benefits {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.get-paid-page .card { padding: 20px; min-width: 0; }
.get-paid-page .worker-art {
  width: 88px;
  height: 88px;
  margin-bottom: 12px;
  border-radius: 16px;
  background-image: url('/assets/worker-benefit-art.webp');
  background-size: 500% 200%;
  background-repeat: no-repeat;
}
.get-paid-page .worker-art-0 { background-position: 0% 0%; }
.get-paid-page .worker-art-1 { background-position: 25% 0%; }
.get-paid-page .worker-art-2 { background-position: 50% 0%; }
.get-paid-page .worker-art-3 { background-position: 75% 0%; }
.get-paid-page .worker-art-4 { background-position: 100% 0%; }
.get-paid-page .worker-art-5 { background-position: 0% 100%; }
.get-paid-page .worker-art-6 { background-position: 25% 100%; }
.get-paid-page .worker-art-7 { background-position: 50% 100%; }
.get-paid-page .worker-art-8 { background-position: 75% 100%; }
.get-paid-page .worker-art-9 { background-position: 100% 100%; }
.get-paid-page .section { margin-top: clamp(32px, 3vw, 40px); }
.get-paid-page .shareable-work-profile { padding: clamp(20px, 3vw, 30px); }
.get-paid-page .shareable-work-profile > .grid { margin-top: 18px; }
.get-paid-page .offer-group { padding: 18px; min-width: 0; }
.get-paid-page .family-visits {
  grid-column: 1 / -1;
  padding: 22px;
  background: #edf7f0;
  border-color: #bfd8c7;
}
.get-paid-page .family-visits ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 32px;
  row-gap: 4px;
}
.get-paid-page .family-visits li { margin: 0; }
.get-paid-page .family-visits-note {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid #cbded1;
  color: #315b40;
  font-size: 1rem;
  font-weight: 650;
}
@media (max-width: 900px) {
  .get-paid-page .worker-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .get-paid-page .worker-benefits,
  .get-paid-page .family-visits ul { grid-template-columns: minmax(0, 1fr); }
  .get-paid-page .family-visits { padding: 20px; }
}
