/* Growth system statement (2026-11-09): one short statement + a hub graphic.
   Four Flow-made tiles (listings, ads, KDP, TikTok Shop) wired to the Hawk Notch mark.
   Layout and motion follow the CreatorLayer .cl-statement section, in Hawk Notch colours. */

.gs{padding:clamp(80px,9vw,136px) 0;background:var(--white);overflow-x:clip}   /* tiles start 70px off their spot before they fly in */
.gs-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:center;gap:48px clamp(40px,6vw,104px)}

.gs-label{margin:0 0 20px;font:500 16px/24px var(--body);color:var(--slate-500)}
.gs-label span{font-weight:600;color:var(--green-700)}

.gs-text{max-width:17ch;margin:0 0 26px;font:600 clamp(32px,3.9vw,54px)/1.08 var(--display);letter-spacing:-.03em;color:var(--ink-900);text-wrap:balance}
.gs-text .gs-w{display:inline-block}

.gs-lead{max-width:30em;margin:0 0 32px;font-size:18px;line-height:1.65;color:var(--slate-500)}

.gs-art{margin:0}
.gs-sys{position:relative;aspect-ratio:1848/1408}
.gs-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.gs-wire,.gs-pulse{fill:none;stroke-linecap:round}
.gs-wire{stroke:var(--green-700);stroke-width:5;stroke-dasharray:1;stroke-dashoffset:0}
.gs-pulse{stroke:var(--green-500);stroke-width:9;stroke-dasharray:.12 1;stroke-dashoffset:.12;opacity:0}
.gs-dot{fill:var(--green-700)}

.gs-core{position:absolute;left:31.76%;top:26.07%;width:36.26%;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;
  background:var(--ink-900);
  background-image:radial-gradient(circle at 50% 30%,rgba(116,209,66,.18),transparent 62%);
  box-shadow:0 2px 4px rgba(22,28,34,.16),0 26px 40px -14px rgba(22,28,34,.5);will-change:transform}
.gs-core img{width:58%;height:auto;transform:translateY(2%)}

.gs-tile{position:absolute;width:28.14%;height:auto;border-radius:9%;
  filter:drop-shadow(0 2px 3px rgba(22,28,34,.08)) drop-shadow(0 20px 26px rgba(22,28,34,.14));will-change:transform}
.gs-tile--list{left:1.19%;top:1.56%}
.gs-tile--ads{left:70.67%;top:1.56%}
.gs-tile--kdp{left:1.19%;top:65.98%}
.gs-tile--tt{left:70.67%;top:65.98%}

.gs-points{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(24px,3vw,48px);margin:clamp(56px,6vw,96px) 0 0;padding:0;list-style:none}
.gs-points li{position:relative;padding:24px 0 0;border-top:1px solid var(--slate-200);font:500 18px/1.5 var(--body);color:var(--ink-900)}
.gs-points li::before{content:"";position:absolute;top:-1px;left:0;width:40px;height:2px;background:var(--green-500)}

@media (max-width:991px){
  .gs-grid{grid-template-columns:minmax(0,1fr)}
  .gs-text{max-width:20ch}
  .gs-art{max-width:620px;width:100%;margin-inline:auto}
  .gs-points{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
}
@media (max-width:575px){
  .gs-lead{font-size:17px}
  .gs-points{grid-template-columns:minmax(0,1fr);gap:0}
  .gs-points li{padding:18px 0;font-size:17px}
}