/* ==========================================================
   Sellerpad – v4: clearer story, light/dark rhythm, polish
   ========================================================== */

/* ---------- light backgrounds for all light sections ---------- */
#results.light,#pricing.light,#testimonials.light{
  color:var(--ink);
  background:
   radial-gradient(800px 420px at 100% 0%,rgba(142,197,244,.45),transparent 70%),
   radial-gradient(700px 400px at 0% 100%,rgba(92,165,232,.22),transparent 70%),
   linear-gradient(180deg,#F7FAFE 0%,#E9F2FC 100%)}
#pricing.light{background:radial-gradient(rgba(20,43,73,.07) 1.2px,transparent 1.2px) 0 0/30px 30px,linear-gradient(135deg,#F7FAFE,#DDEBFA 60%,#F3F8FE)}
#testimonials.light::after{opacity:.2;background:#8EC5F4}

/* ---------- dark backgrounds ---------- */
#about{background:
  radial-gradient(900px 480px at 50% 0%,rgba(92,165,232,.22),transparent 70%),
  radial-gradient(rgba(142,197,244,.12) 1.2px,transparent 1.2px) 0 0/30px 30px,
  linear-gradient(180deg,#142B49,#10243F);padding-top:150px}
#calculator{background:
  radial-gradient(700px 400px at 90% 10%,rgba(92,165,232,.2),transparent 70%),
  linear-gradient(135deg,#0F2139,#1C3D63 70%,#142B49)}
#case-studies{--orb:#4F8FD6}

/* ---------- Proof bar ---------- */
.proof-wrap{position:relative;z-index:6;margin-top:-34px}
.proof-bar{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-radius:24px;box-shadow:0 30px 70px -30px rgba(10,25,47,.7),0 0 0 1px rgba(20,43,73,.06);overflow:hidden}
.proof-item{padding:28px 30px;position:relative;color:var(--ink)}
.proof-item+.proof-item::before{content:"";position:absolute;left:0;top:24px;bottom:24px;width:1px;background:rgba(20,43,73,.12)}
.proof-item b{display:block;font-family:var(--mono);font-size:2.1rem;letter-spacing:-.04em;line-height:1.1;background:linear-gradient(180deg,#142B49,#2468B0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.proof-item span{display:block;margin-top:8px;font-size:.88rem;line-height:1.45;color:var(--ink-2)}
.proof-note{text-align:center;margin-top:16px;font-size:.8rem;color:#8EA5BF}

/* ---------- About: story cards ---------- */
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.story{padding:34px;display:flex;flex-direction:column;gap:14px}
.story h3{font-size:1.4rem;line-height:1.25;letter-spacing:-.02em}
.story p{color:var(--muted)}
.story-tag{align-self:flex-start;font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;border-radius:999px;border:1px solid}
.story-tag.t1{color:#F7C772;background:rgba(245,165,36,.1);border-color:rgba(245,165,36,.35)}
.story-tag.t2{color:var(--blue);background:rgba(142,197,244,.1);border-color:rgba(142,197,244,.35)}
.story-tag.t3{color:#86EFC4;background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.35)}
.story:nth-child(1)::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(245,165,36,.14),transparent 45%)}
.who{display:flex;align-items:center;gap:22px;margin:46px 0 60px;flex-wrap:wrap;justify-content:center}
.who-label{font-family:var(--mono);font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--blue)}
.who-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.who-row li{display:flex;align-items:center;gap:9px;padding:11px 18px;border-radius:999px;border:1px solid var(--line);background:var(--glass);font-weight:600;font-size:.95rem;transition:.25s}
.who-row li:hover{background:rgba(142,197,244,.14);border-color:rgba(142,197,244,.5);transform:translateY(-3px)}
.who-row .icon{color:var(--blue);width:18px;height:18px}
.strip-label{text-align:center;font-family:var(--mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#8EA5BF;margin-bottom:14px}

/* ---------- Services: tabs + richer cards ---------- */
.svc-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:34px}
.svc-tabs button{padding:12px 22px;border-radius:999px;font-weight:700;font-size:.95rem;background:#fff;color:var(--ink-2);border:1px solid var(--lt-line);transition:.25s;box-shadow:0 6px 18px -12px rgba(20,43,73,.4)}
.svc-tabs button:hover{color:var(--ink);border-color:rgba(36,104,176,.5);transform:translateY(-2px)}
.svc-tabs button.on{background:linear-gradient(180deg,#2F78C4,#1D5A9E);color:#fff;border-color:transparent;box-shadow:0 12px 26px -10px rgba(36,104,176,.8)}
.services-grid .svc{animation:cardIn .55s both}
.services-grid .svc[hidden]{display:none}
@keyframes cardIn{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
.svc-get{display:flex;gap:8px;align-items:flex-start;font-size:.82rem;font-weight:600;padding:10px 12px;border-radius:12px;background:#EEF5FD;color:var(--accent-d)}
.svc-get .icon{width:16px;height:16px;margin-top:2px}
.svc p{flex:none}
.svc .more{margin-top:auto}

/* ---------- Marketplaces ---------- */
.mp-grid{gap:24px}
.mp{padding:34px;gap:0;align-content:start}
.mp-top{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.mp-badge{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-weight:800;font-size:1.5rem;flex:none}
.mp.amz .mp-badge{background:rgba(245,165,36,.16);color:var(--amber)}
.mp.flp .mp-badge{background:rgba(92,165,232,.18);color:var(--blue-2)}
.mp.msh .mp-badge{background:rgba(236,72,153,.16);color:#F472B6}
.mp.shp .mp-badge{background:rgba(52,211,153,.16);color:var(--green)}
.mp-tag2{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;color:#8EA5BF}
.mp h3{font-size:1.45rem;margin-top:2px}
.mp-best{color:var(--muted);margin:0 0 20px;font-size:.96rem}
.mp-best b{color:#fff}
.mp-what{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);padding-top:18px;border-top:1px solid var(--line-2);margin-bottom:14px}
.mp ul.mp-list{display:grid;gap:12px;margin:0 0 26px}
.mp .mp-list li{display:flex;gap:11px;border:0;padding:0;border-radius:0;font-size:.95rem;color:#D9E6F4}
.mp-list .icon{color:var(--green);width:18px;height:18px;margin-top:3px}
.mp{position:relative}
.mp::marker{content:""}
.mp.amz{border-top:3px solid rgba(245,165,36,.7)}
.mp.flp{border-top:3px solid rgba(92,165,232,.8)}
.mp.msh{border-top:3px solid rgba(244,114,182,.7)}
.mp.shp{border-top:3px solid rgba(52,211,153,.7)}

/* ---------- Why ---------- */
.why-list{display:grid;gap:12px;margin-top:22px}
.why-list li{display:flex;gap:10px;font-weight:600;font-size:.95rem;color:var(--ink)}
.why-list .icon{color:#16A34A;width:18px;height:18px;margin-top:3px}

/* ---------- Process ---------- */
.getline{margin-top:16px;font-size:.84rem;padding:12px 14px;border-radius:14px;background:rgba(142,197,244,.08);border:1px solid var(--line);color:#D3E2F2;text-align:left}
.getline b{color:var(--blue)}
.step p{min-height:3.2em}

/* ---------- Results (light) + case studies (dark) ---------- */
.light .panel,.light .res-kpi{color:#fff}
.light .res-foot{color:var(--ink-2)}
.light .an-note.ok{background:#DCFCE7;border-color:#86EFAC;color:#15803D}
.read-list{display:grid;gap:16px;margin:6px 0 24px}
.read-list li{display:grid;gap:4px;padding-left:16px;border-left:2px solid var(--blue-2)}
.read-list b{font-size:.95rem}
.read-list span{color:var(--muted);font-size:.9rem}
#results .p-6{grid-column:span 6}
.cs-grid.two{grid-template-columns:repeat(2,1fr)}
#case-studies .cs-big{color:#fff}
#case-studies .cs-per{color:var(--muted)}
#case-studies .light-foot{color:#8EA5BF}
#case-studies .realtag{background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.4);color:#86EFAC}
#case-studies .cs-badge.amz{background:rgba(245,165,36,.16);color:var(--amber)}
#case-studies .cs-badge.flp{background:rgba(92,165,232,.18);color:var(--blue-2)}
#case-studies .results div{background:rgba(142,197,244,.08)}
#case-studies .results b{color:#fff}
#case-studies .cs-big{font-size:2.8rem}

/* ---------- Pricing (light) ---------- */
.light .inc p{color:var(--ink-2)}
.light .inc h3{color:var(--ink)}
.light .inc-n{color:var(--accent-d)}
.light .goal{background:#EEF5FD;color:var(--ink-2)}
.light .goal b{color:var(--accent-d)}
.light .term-toggle{background:#fff;border-color:var(--lt-line);box-shadow:0 10px 26px -16px rgba(20,43,73,.4)}
.light .term-toggle button{color:var(--ink-2)}
.light .term-toggle button:not(.on):hover{color:var(--ink)}
.light .mp-name{color:var(--ink)}
.light .amt{color:var(--ink)}
.light .per{color:var(--ink-2)}
.light .gst{color:#6C819B}
.light .mo{background:#E6F0FB;color:var(--accent-d)}
.light .price li{color:var(--ink)}
.light .price li .icon{color:#16A34A}
.light .price-note{color:var(--ink-2)}
.light .best-tag{background:#DCFCE7;color:#15803D;border-color:#86EFAC}
.light .price .mk-ico.a{background:#FFF3DC;color:#C77700}
.light .price .mk-ico.f{background:#E3F0FD;color:#2468B0}
.light .price .mk-ico.m{background:#FCE7F3;color:#BE185D}
.light .price:hover{border-color:rgba(36,104,176,.55)}

/* ---------- Testimonials (light) ---------- */
.light .t-card p{color:var(--ink)}
.light .t-who b{color:var(--ink)}
.light .t-who small{color:var(--ink-2)}
.light .t-card .q{color:var(--accent-d)}
.light .sl-btn{background:#fff;border-color:var(--lt-line);color:var(--ink)}
.light .sl-btn:hover{background:var(--accent-d);color:#fff}
.light .dots button{background:rgba(20,43,73,.2)}
.light .dots button.on{background:var(--accent-d)}

/* ---------- CTA ---------- */
.cta-call{margin:22px 0 0!important;font-size:1rem!important;color:#D3E2F2}
.cta-call a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* ---------- Calculator (dark) fields ---------- */
#calculator .calc-note{color:#8EA5BF}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .proof-bar{grid-template-columns:1fr 1fr}
  .proof-item:nth-child(3)::before{display:none}
  .proof-item:nth-child(n+3){border-top:1px solid rgba(20,43,73,.1)}
  .story-grid{grid-template-columns:1fr}
  .cs-grid.two{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  #about{padding-top:110px}
  .proof-wrap{margin-top:-20px}
  .proof-item{padding:20px 18px}
  .proof-item b{font-size:1.5rem}
  .proof-item span{font-size:.78rem}
  .svc-tabs{flex-wrap:nowrap;overflow-x:auto;margin-inline:-16px;padding:4px 16px 12px;scrollbar-width:none}
  .svc-tabs::-webkit-scrollbar{display:none}
  .svc-tabs button{white-space:nowrap;flex:none}
  .cs-grid.two{grid-template-columns:1fr}
  #case-studies .cs-big{font-size:2.2rem}
  .mp{padding:26px}
  #results .p-6{grid-column:span 12}
}

/* v4 fixes */
.scroll-hint{display:none}
.mp{display:flex;flex-direction:column}
.mp .btn{margin-top:auto;align-self:stretch}
.mp ul.mp-list{margin-bottom:28px}
.mp-best{min-height:3em}