/* page-startband-about-v1.css - shared "Start a project" dark band (.lp-cta*) + .ab-cta-mid (About "So look around." as a light-green mid band), every rule scoped under .tb4-ab5.
   Source: page-startband-v1.css (deploy-new-pages-v1 mockups, README section 5). Loaded by one <link> in the page module; needs --gut and --serif from the page CSS. */
.tb4-ab5 .lp-cta{background:#231F20;padding:72px var(--gut);position:relative;overflow:hidden;
  border-top:6px solid transparent;border-image:linear-gradient(90deg,#3DB54A,#9FCC45 50%,#D7DF28) 1}
.tb4-ab5 .lp-cta::after{content:"";position:absolute;right:-200px;top:-300px;width:800px;height:800px;border-radius:50%;
  background:radial-gradient(circle,rgba(159,204,69,.14),rgba(159,204,69,0) 70%);pointer-events:none}
.tb4-ab5 .lp-cta-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:40px}
.tb4-ab5 .lp-cta p{margin:0;font-size:17px;line-height:1.5;color:#c9c6c3;max-width:56ch}
.tb4-ab5 .lp-cta-actions{display:flex;flex-direction:column;align-items:center;gap:12px;flex:0 0 auto}
.tb4-ab5 .lp-cta .btn-primary{font-size:17px;padding:17px 30px}
.tb4-ab5 .lp-cta-h{margin:0 0 12px;font-family:var(--serif) !important;font-size:clamp(28px,3vw,36px);line-height:1.2;color:#fff;font-weight:700}
.tb4-ab5 .lp-cta-reach{margin-top:16px!important;display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;font-size:15px!important;font-weight:700}
.tb4-ab5 .lp-cta-reach a{color:#9FCC45}
.tb4-ab5 .lp-cta-reach span{color:#6b6764}
.tb4-ab5 .ab-cta.ab-cta-mid{background:#F3F8E6;padding:56px var(--gut);border-top:0;border-image:none}
.tb4-ab5 .ab-cta.ab-cta-mid::after{content:none}
.tb4-ab5 .ab-cta-mid .ab-cta-h{font-size:34px;color:var(--ink)}
.tb4-ab5 .ab-cta-mid .ab-cta-inner p:not(.ab-cta-h){color:var(--ink-soft)}
.tb4-ab5 .ab-cta-mid .ab-btn-ghost{color:var(--ink);border-color:#231F20;background:#fff}
@media (max-width:860px){
  .tb4-ab5 .lp-cta{padding:52px var(--gut)}
  .tb4-ab5 .lp-cta-inner{flex-direction:column;align-items:flex-start;gap:26px}
  .tb4-ab5 .lp-cta-actions{align-items:stretch;width:100%}
  .tb4-ab5 .lp-cta .btn-primary{width:100%;min-height:54px;justify-content:center}
  .tb4-ab5 .ab-cta.ab-cta-mid{padding:44px var(--gut)}
  .tb4-ab5 .ab-cta-mid .ab-cta-h{font-size:28px}
}