/* TaskPay beginner-friendly navigation and platform guides */
.mobile-guide-menu { display:none; }
.beginner-explore .section-heading h2 { max-width:720px; }
.beginner-path { display:flex; gap:10px; align-items:stretch; margin:0 0 20px; }
.beginner-path > span {
  display:flex; align-items:center; gap:10px; flex:1;
  background:#edf1e5; border:1px solid #d6dfcb; border-radius:11px;
  padding:12px 15px; font-weight:650; font-size:13px; line-height:1.3;
}
.beginner-path b {
  width:29px; height:29px; display:inline-grid; place-items:center; flex:0 0 auto;
  background:var(--green); color:#fff; font-size:15px; border-radius:50%;
}
.beginner-explore .card-grid { row-gap:15px; }
.beginner-explore .opportunity-card .card-link { font-size:12px; font-weight:750; color:var(--green); }
.beginner-explore .opportunity-card .card-link:hover { text-decoration:underline; text-underline-offset:3px; }
.beginner-explore .opportunity-card a:focus-visible,
.guide-page a:focus-visible, .guide-page button:focus-visible,
.mobile-guide-menu summary:focus-visible, .mobile-guide-menu a:focus-visible,
.other-platforms summary:focus-visible {
  outline:3px solid #80a85b; outline-offset:3px;
}
.other-platforms { border:1px solid #c9d4c5; border-radius:13px; margin:23px 0 0; background:#fffef8; }
.other-platforms>summary {
  cursor:pointer; list-style:none; padding:17px 20px; min-height:54px;
  display:flex; justify-content:space-between; align-items:center;
  color:var(--green); font-size:16px; font-weight:750;
}
.other-platforms>summary::-webkit-details-marker { display:none; }
.other-platforms>summary>span { font-size:12px; color:var(--muted); }
.other-platforms>p { padding:0 20px 14px; font-size:13px; color:var(--muted); }
.other-platforms>.card-grid { padding:0 16px 18px; }
.other-platforms[open] { background:#f6f7ee; }

.guide-page { padding-top:38px; padding-bottom:40px; }
.guide-back { display:inline-flex; align-items:center; min-height:44px; font-size:14px; color:var(--green); font-weight:650; text-decoration:underline; text-underline-offset:4px; }
.guide-intro {
  display:grid; grid-template-columns:minmax(0,1.65fr) minmax(240px,.9fr);
  gap:28px; align-items:center; border-bottom:1px solid var(--line); padding:17px 0 28px;
}
.guide-intro .eyebrow { margin-bottom:10px; }
.guide-intro h1 { font-size:clamp(38px,4vw,56px); line-height:1.05; letter-spacing:-.055em; margin:0 0 12px; }
.guide-lead { max-width:700px; color:var(--muted); font-size:16px; line-height:1.65; }
.guide-start { background:#e7eddb; padding:19px; border:1px solid #d7dfca; border-radius:12px; }
.guide-start .button, .guide-finish .button { width:100%; min-height:49px; font-size:15px; justify-content:space-between; }
.guide-disclaimer { margin:11px 0 0; font-size:12px; line-height:1.58; color:#4e5a4c; }
.guide-main { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(245px,0.88fr); gap:24px; align-items:start; margin-top:26px; }
.guide-steps { background:#fffefa; border:1px solid var(--line); border-radius:16px; padding:23px 25px; }
.guide-section-heading .eyebrow { margin-bottom:9px; }
.guide-steps h2 { font-size:clamp(27px,2.5vw,36px); line-height:1.15; margin-bottom:9px; }
.guide-section-heading>p:not(.eyebrow) { color:var(--muted); font-size:14px; line-height:1.6; }
.guide-steps ol { list-style:none; margin:23px 0 0; padding:0; display:flex; flex-direction:column; gap:0; }
.guide-steps ol li { display:grid; grid-template-columns:42px 1fr; gap:13px; align-items:start; padding:14px 0; border-top:1px solid #e2e7dd; }
.guide-steps ol li p { font-size:15px; line-height:1.6; color:#28382e; margin:3px 0 0; }
.guide-step-number { display:grid; place-items:center; width:36px; height:36px; background:var(--green); border-radius:50%; color:white; font-weight:800; font-size:18px; }
.guide-step-label { text-transform:uppercase; letter-spacing:.1em; font-size:10px; font-weight:750; color:#607654; }
.guide-reminder { font-size:12px; line-height:1.55; color:var(--muted); margin:15px 0 0; }
.guide-video { margin-top:25px; }
.guide-video h3 { margin-bottom:12px; font-size:19px; }
.guide-video video { width:100%; border-radius:10px; }
.guide-information { display:flex; flex-direction:column; gap:12px; }
.guide-info-card { padding:18px; background:#edf1e5; border:1px solid #d9e1d1; border-radius:12px; }
.guide-info-card h2 { font-size:17px; font-weight:750; margin-bottom:8px; line-height:1.3; }
.guide-info-card p { color:#465547; font-size:13px; line-height:1.65; margin:0; }
.guide-warning { background:#fff3d9; border-color:#efdeb1; }
.guide-warning h2 { color:#764716; }
.guide-source { padding:2px 4px; }
.guide-source a { display:inline-flex; align-items:center; min-height:43px; gap:10px; color:var(--green); text-decoration:underline; text-underline-offset:4px; font-size:12px; }
.guide-finish { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(220px,.8fr); gap:24px; align-items:center; margin-top:25px; padding:24px; background:#e7eddb; border:1px solid #d3deca; border-radius:15px; }
.guide-finish .eyebrow { margin-bottom:6px; }
.guide-finish h2 { font-size:27px; line-height:1.15; margin-bottom:6px; }
.guide-finish p { color:#4e5a4c; font-size:12px; line-height:1.6; }
.guide-finish .guide-affiliate { margin-top:7px; font-size:11px; }
.guide-finish form { min-width:0; }
.admin-tutorial-fields { background:#f4f7ef; padding:16px; border-radius:12px; border:1px solid #d4decf; margin-top:18px; }
.admin-tutorial-fields h3 { font-size:18px; margin-bottom:11px; }
.admin-tutorial-fields textarea { min-height:74px; resize:vertical; }
.admin-tutorial-fields label { display:block; margin-top:12px; }

@media(max-width:800px) {
  .mobile-guide-menu { display:block; position:relative; z-index:40; }
  .mobile-guide-menu>summary { cursor:pointer; list-style:none; min-height:44px; display:flex; align-items:center; padding:9px 13px; border:1px solid #c5d1bd; border-radius:9px; color:var(--green); font-weight:700; font-size:13px; }
  .mobile-guide-menu>summary::-webkit-details-marker { display:none; }
  .mobile-guide-menu nav { display:flex; flex-direction:column; gap:3px; position:absolute; left:50%; transform:translateX(-50%); top:calc(100% + 6px); width:min(270px,calc(100vw - 20px)); background:#fffef9; padding:10px; border:1px solid var(--line); border-radius:11px; box-shadow:0 15px 35px rgba(13,40,29,.15); }
  .mobile-guide-menu nav a { display:flex; align-items:center; min-height:45px; padding:10px 13px; font-size:14px; border-radius:7px; }
  .mobile-guide-menu nav a:hover { background:#edf2e6; }
  .guide-intro { grid-template-columns:1fr; gap:15px; }
  .guide-main { grid-template-columns:1fr; }
  .guide-finish { grid-template-columns:1fr; }
}
@media(max-width:560px) {
  .beginner-explore .section-heading h2 { font-size:clamp(28px,7vw,33px); }
  .beginner-path { flex-direction:column; gap:6px; margin-bottom:13px; }
  .beginner-path>span { padding:7px 11px; font-size:12px; min-height:40px; }
  .beginner-path b { width:25px; height:25px; font-size:13px; }
  .beginner-explore .card-body p { font-size:11px; line-height:1.4; }
  .other-platforms>summary { padding:13px; font-size:13px; }
  .other-platforms>.card-grid { padding-inline:8px; }
  .guide-page { padding-top:16px; padding-bottom:26px; }
  .guide-intro { padding-top:8px; padding-bottom:17px; }
  .guide-intro h1 { font-size:39px; }
  .guide-lead { font-size:14px; line-height:1.6; }
  .guide-steps { padding:17px 16px; }
  .guide-section-heading h2 { font-size:27px; }
  .guide-steps ol li { grid-template-columns:35px 1fr; gap:11px; padding:12px 0; }
  .guide-step-number { width:32px; height:32px; font-size:16px; }
  .guide-steps ol li p { font-size:14px; line-height:1.58; }
  .guide-info-card { padding:15px; }
  .guide-finish { padding:17px; gap:15px; }
}

/* Hub-specific, source-backed free starter-kit explanation. */
.hub-trust {
  padding-top: 35px;
  padding-bottom: 34px;
  border-bottom: 1px solid var(--line);
}
.hub-trust-heading {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: end;
  gap: 24px;
}
.hub-trust .eyebrow { margin:0 0 9px; font-size:10px; }
.hub-trust h2 { max-width: 810px; margin: 0; font-size:clamp(27px,2.5vw,37px); letter-spacing:-.047em; line-height:1.15; }
.hub-trust-heading p:not(.eyebrow) { max-width:850px; font-size:14px; line-height:1.65; color:var(--muted); margin:11px 0 0; }
.hub-trust .hub-trust-cta {
  max-width:270px; min-height:46px;
  padding:11px 14px; font-size:12px;
  align-items:center; white-space:normal; text-align:left;
}
.hub-trust-points {
  display:grid; grid-template-columns: repeat(3,minmax(0,1fr));
  gap:14px; margin:22px 0 0;
}
.hub-trust-item {
  display:flex; gap:13px; align-items:flex-start;
  padding:16px 14px; border:1px solid #d8e2d1; background:#f0f4eb;
  border-radius:11px; min-height:106px;
}
.hub-trust-index {
  display:inline-grid; place-items:center; flex:0 0 30px;
  height:30px; border-radius:50%; color:var(--green);
  background:#dceacf; font-size:12px; font-weight:800;
}
.hub-trust-item h3 { margin:0 0 5px; font-size:16px; line-height:1.2; letter-spacing:-.025em; }
.hub-trust-item p { margin:0; font-size:12px; line-height:1.55; color:var(--muted); }
.hub-trust-faq {
  margin:14px 0 0; padding:0 15px;
  border:1px solid var(--line); border-radius:10px;
  background:#fffdf7;
}
.hub-trust-faq summary {
  min-height:46px; display:flex; justify-content:space-between;
  align-items:center; gap:12px; cursor:pointer;
  font-size:13px; font-weight:700; line-height:1.4;
  list-style:none; color:var(--green);
}
.hub-trust-faq summary::-webkit-details-marker { display:none; }
.hub-trust-faq summary span { font-size:20px; font-weight:400; }
.hub-trust-faq[open] summary span { transform:rotate(45deg); }
.hub-trust-faq>p {
  font-size:12px; line-height:1.6; color:var(--muted);
  border-top:1px solid var(--line); padding:12px 0 14px; margin:0;
}
.hub-trust-note { font-size:11px; line-height:1.55; color:#58665b; margin:9px 0 0; }
.hub-trust a:focus-visible,.hub-trust summary:focus-visible {
  outline:3px solid #88a96b; outline-offset:3px;
}

.hub-guide-trust {
  background:#edf4e8; border:1px solid #cadcc2; border-radius:13px;
  padding:21px 25px; margin:19px 0 0;
}
.hub-guide-trust .eyebrow { display:block; margin:0 0 11px; font-size:10px; }
.hub-guide-trust-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:28px; }
.hub-guide-trust h2 { font-size:24px; line-height:1.18; margin:0 0 7px; }
.hub-guide-trust strong { display:block; font-size:16px; line-height:1.3; margin-bottom:8px; }
.hub-guide-trust p { font-size:13px; color:#465949; line-height:1.57; margin:0; }
.hub-guide-trust .hub-guide-trust-note {
  padding-top:13px; margin-top:14px;
  border-top:1px solid #cadcc2; font-size:11px;
}

@media(max-width:800px){
  .hub-trust-heading { grid-template-columns:1fr; gap:16px; }
  .hub-trust .hub-trust-cta { max-width:340px; }
  .hub-trust-points { gap:9px; }
  .hub-trust-item { padding:12px; gap:8px; min-height:122px; }
  .hub-trust-index { flex-basis:25px; height:25px; font-size:11px; }
  .hub-trust-item h3 { font-size:14px; }
  .hub-trust-item p { font-size:11px; }
}
@media(max-width:560px){
  .hub-trust { padding-top:24px; padding-bottom:25px; }
  .hub-trust .eyebrow { font-size:9px; margin-bottom:7px; }
  .hub-trust h2 { font-size:27px; line-height:1.18; }
  .hub-trust-heading p:not(.eyebrow) { font-size:12.8px; line-height:1.55; margin-top:9px; }
  .hub-trust .hub-trust-cta { max-width:none; justify-content:space-between; width:100%; min-height:44px; }
  .hub-trust-points { grid-template-columns:1fr; gap:7px; margin-top:14px; }
  .hub-trust-item { align-items:center; min-height:0; padding:11px; }
  .hub-trust-index { height:28px; flex-basis:28px; }
  .hub-trust-item h3 { font-size:14px; margin-bottom:3px; }
  .hub-trust-item p { font-size:11.8px; }
  .hub-trust-faq { margin-top:10px; }
  .hub-trust-faq summary { font-size:12px; }
  .hub-trust-note { font-size:10.8px; }
  .hub-guide-trust { padding:16px; margin-top:17px; }
  .hub-guide-trust-grid { grid-template-columns:1fr; gap:12px; }
  .hub-guide-trust h2 { font-size:22px; }
  .hub-guide-trust strong { font-size:14px; }
  .hub-guide-trust p { font-size:12px; }
}