/* Growth+ page. Sits on signal.css. */
.gp-hero{text-align:center;padding-top:56px;padding-bottom:150px}
.gp-hero .pill{margin-bottom:18px}
.gp-hero h1{max-width:980px;margin:0 auto 18px}
.gp-hero h1 .g{display:block}
.gp-hero .lead{max-width:600px;margin:0 auto 26px}
.gp-hero .ctas{justify-content:center;max-width:460px;margin:0 auto}
.gp-film{position:relative;max-width:1040px;margin:40px auto 0;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 0 0 1px rgba(124,240,192,.22),0 40px 120px rgba(0,0,0,.7),0 0 90px rgba(65,200,139,.14)}
.gp-film video{display:block;width:100%;height:100%;background:#000}
.gp-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:14px;width:100%;border:0;background:radial-gradient(ellipse 50% 50% at 50% 50%,rgba(0,0,0,.42),transparent);color:#fff;font:600 19px var(--font);cursor:pointer}
.gp-play-ic{position:relative;flex:none;width:68px;height:68px;border-radius:50%;background:linear-gradient(180deg,#A9F7D5,#41C88B 85%);box-shadow:0 0 50px rgba(65,200,139,.5);transition:transform .2s}
.gp-play-ic::after{content:'';position:absolute;left:27px;top:21px;border-left:20px solid var(--ink);border-top:13px solid transparent;border-bottom:13px solid transparent}
.gp-play:hover .gp-play-ic{transform:scale(1.07)}
.gp-play-t{text-align:left;line-height:1.25}
.gp-play-t small{display:block;font-size:14px;font-weight:400;color:var(--dark-muted)}
.gp-end{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;padding:16px;background:rgba(0,0,0,.72)}
.gp-note{margin-top:12px;font-size:13px;color:var(--muted)}
.gp-hero .checks-row{justify-content:center;margin-top:18px}
#how .head{margin-bottom:30px}
@media(min-width:900px){.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.steps .step{margin:0}}
.gp-row{display:grid;gap:26px;align-items:center}
.gp-row+.gp-row{margin-top:64px}
.gp-row .lead{margin-top:14px}
.gp-row .checks{margin-top:22px}
.gp-row .head{margin:0}
.gp-clip{border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#000;box-shadow:0 0 0 1px rgba(124,240,192,.16),var(--shadow)}
.gp-clip video{display:block;width:100%;height:100%;object-fit:cover}
@media(min-width:900px){.gp-row{grid-template-columns:1fr 1.25fr;gap:56px}.gp-row.flip{grid-template-columns:1.25fr 1fr}.gp-row.flip>:first-child{order:2}.gp-row+.gp-row{margin-top:96px}.dark .gp-row{grid-template-columns:1.25fr 1fr}}
.gp-plan{box-shadow:0 0 80px rgba(65,200,139,.12),var(--shadow)}
.gp-sticky{position:fixed;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:45;box-shadow:0 14px 44px rgba(0,0,0,.6),0 0 40px rgba(65,200,139,.3);transform:translateY(170%);opacity:0;transition:transform .38s cubic-bezier(.22,1,.36,1),opacity .25s}
.gp-sticky.on{transform:none;opacity:1}
@media(min-width:900px){.gp-sticky{display:none}}
.gp-play[hidden],.gp-end[hidden]{display:none}
@media(min-width:900px){.steps .step::after{display:none}}
.gp-play{align-items:flex-end;padding-bottom:22px;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.55))}
@media(max-width:699px){.gp-play{padding-bottom:12px;font-size:15px;gap:10px}.gp-play-ic{width:46px;height:46px}.gp-play-ic::after{left:18px;top:14px;border-left-width:14px;border-top-width:9px;border-bottom-width:9px}.gp-play-t small{font-size:12px}}

/* Things settle into place as you reach them */
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.gp-sticky{transition:none}}

/* ---------- Phones: designed for the hand, not a smaller desktop ---------- */
@media(max-width:699px){
  .sec{padding:64px 0}
  h2{font-size:clamp(36px,10.4vw,48px)}
  .lead{font-size:17px}

  /* First screen: the line, the film, the button */
  .gp-hero{padding:22px 0 118px}
  .gp-hero .container{display:flex;flex-direction:column;align-items:center}
  .gp-hero .pill{order:0;margin-bottom:14px}
  .gp-hero h1{order:1;font-size:min(19vw,96px);line-height:.96;letter-spacing:-.045em;margin:0}
  .gp-l{display:block}
  .gp-film{order:2;align-self:stretch;width:auto;max-width:none;margin:22px -20px 0;border-radius:0;box-shadow:0 -1px 0 rgba(124,240,192,.2),0 1px 0 rgba(124,240,192,.2),0 0 70px rgba(65,200,139,.16)}
  .gp-note{order:3;margin-top:9px;font-size:12px}
  .gp-hero .ctas{order:4;display:grid;grid-template-columns:1fr;gap:4px;width:100%;max-width:none;margin:16px 0 0}
  .gp-hero .ctas .btn-primary{height:58px;font-size:18px;box-shadow:0 0 44px rgba(65,200,139,.34)}
  .gp-hero .ctas .btn-secondary{grid-column:1;height:44px;background:none;border:0;color:var(--muted);font-weight:500}
  .gp-hero .lead{order:5;margin:18px 0 0}
  .gp-hero .checks-row{order:6;margin-top:18px}
  .signal-wave{height:230px}
  .gp-end{padding:10px}
  .gp-end .btn{height:44px;font-size:15px}

  /* How it works: one line of light, filling as you scroll */
  #how{padding-top:56px}
  #how .head{margin-bottom:34px}
  .steps{position:relative;display:block}
  .steps::before,.steps::after{content:'';position:absolute;left:22px;top:10px;width:2px;border-radius:2px}
  .steps::before{bottom:66px;background:rgba(255,255,255,.1)}
  .steps::after{height:var(--fill,0px);background:linear-gradient(180deg,#41C88B,#A9F7D5);box-shadow:0 0 14px rgba(124,240,192,.8)}
  .step{display:block;background:none;border:0;border-radius:0;padding:0 0 30px 64px;margin:0}
  .step::after{display:none}
  .step-ic{position:absolute;left:0;top:0;z-index:1;width:46px;height:46px;border-radius:50%;background:#0D1613;box-shadow:0 0 0 1px rgba(255,255,255,.12);color:var(--muted);transition:background .3s,color .3s,box-shadow .3s}
  .step.lit .step-ic{background:linear-gradient(180deg,#A9F7D5,#41C88B 85%);color:var(--ink);box-shadow:0 0 26px rgba(65,200,139,.55)}
  .step h3{font-size:21px;padding-top:9px}
  .step h3 span{display:none}
  .step p{font-size:16px;margin-top:6px}
  .step:last-child{padding-bottom:0}

  /* Each clip fills the phone, edge to edge */
  .gp-row,.gp-row.flip{display:flex;flex-direction:column;align-items:stretch;gap:26px}
  .gp-row>.gp-clip{order:-1;margin:0 -20px;border-radius:0;aspect-ratio:5/4;box-shadow:0 -1px 0 rgba(124,240,192,.14),0 1px 0 rgba(124,240,192,.14)}
  .gp-rows{padding-top:0}
  .gp-rows .gp-row+.gp-row{margin-top:64px}
  .gp-row .gp-ic{display:none}
  .gp-rows .checks{display:flex;flex-wrap:wrap;gap:8px}
  .gp-rows .checks li{align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:rgba(124,240,192,.07);font-size:14px}
  .gp-rows .checks .i{width:15px;height:15px;margin:0}
  .sec.dark{padding-top:0}

  /* Price and close */
  #price .head{margin-bottom:26px}
  .plan-price{font-size:68px;font-weight:500}
  .gp-plan .btn{height:58px;font-size:18px}
  .faq summary{min-height:56px}
  .cta-panel{padding:44px 20px}
  .cta-panel .btn-row .btn{width:100%;flex:0 0 54px;height:54px}
  .cta-panel .btn-row{flex-direction:column;flex-wrap:nowrap}
  .footer{padding-bottom:96px}
}

/* Phones: a quieter top bar and a tidier close to the first screen */
@media(max-width:899px){
  .nav .brand{font-size:0;gap:0;min-width:44px;min-height:44px}
  .nav .brand img{width:36px;height:36px}
  .nav-actions .btn-primary{display:none}
}
@media(max-width:699px){
  .gp-hero{padding-bottom:34px;overflow:visible}
  .gp-hero .lead{display:none}
  .gp-hero .checks-row{display:grid;grid-template-columns:repeat(3,1fr);gap:0;width:100%;margin-top:22px;padding:0;border-top:1px solid rgba(255,255,255,.09);border-bottom:1px solid rgba(255,255,255,.09)}
  .gp-hero .checks-row span{flex-direction:column;justify-content:flex-start;gap:7px;padding:15px 8px;font-size:13px;line-height:1.25;text-align:center}
  .gp-hero .checks-row span+span{border-left:1px solid rgba(255,255,255,.09)}
  /* The hill belongs to the room: it rises behind the buttons and fades out through the next section */
  .signal-wave{height:680px;bottom:-400px;opacity:.5;-webkit-mask-image:linear-gradient(180deg,transparent 4%,#000 34%,#000 58%,transparent 94%);mask-image:linear-gradient(180deg,transparent 4%,#000 34%,#000 58%,transparent 94%)}
  #how{background:transparent;padding-top:44px}
}