.s-solutions-page{
  position:relative;
  background:var(--c-bg);
  color:var(--c-text);
  font-family:var(--font-body);
  padding-block-end:clamp(56px,8vw,104px);
  overflow-x:clip;
}
.s-solutions-page .btn{min-height:44px;}

/* ---------- Hero ---------- */
.sp-hero{
  position:relative;
  padding-block:clamp(28px,4.5vw,56px) clamp(24px,4vw,48px);
  overflow:hidden;
}
.sp-hero::before{
  content:"";
  position:absolute;
  inset-block-start:-38%;
  inset-inline-end:-14%;
  width:min(680px,88vw);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle at center,color-mix(in srgb,var(--c-primary) 24%,transparent),transparent 68%);
  pointer-events:none;
}
.sp-hero::after{
  content:"";
  position:absolute;
  inset-block-end:-42%;
  inset-inline-start:-16%;
  width:min(420px,70vw);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle at center,color-mix(in srgb,var(--c-accent) 22%,transparent),transparent 70%);
  pointer-events:none;
}
.sp-hero__inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(28px,4.5vw,60px);
  align-items:center;
}
.sp-hero__copy{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.sp-hero__title{
  margin:0;
  font-family:var(--font-head);
  font-weight:700;
  font-size:clamp(1.95rem,4.4vw,3.2rem);
  line-height:1.22;
  letter-spacing:-.02em;
  color:var(--c-secondary);
  text-wrap:balance;
}
.sp-hero__lede{
  margin:0;
  max-width:58ch;
  font-size:clamp(.9875rem,1.1vw,1.0625rem);
  line-height:1.85;
  color:var(--c-muted);
}
.sp-hero__actions{gap:12px;flex-wrap:wrap;}
.sp-hero__badges{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.sp-hero__media{
  position:relative;
  margin:0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-md);
  background:linear-gradient(135deg,color-mix(in srgb,var(--c-primary) 16%,var(--c-surface)),color-mix(in srgb,var(--c-secondary) 12%,var(--c-surface)));
  min-height:260px;
}
.sp-hero__media img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}
.sp-hero__stat{
  position:absolute;
  inset-block-end:16px;
  inset-inline-start:16px;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:12px 18px;
  border-radius:var(--radius);
  background:var(--c-surface);
  box-shadow:var(--shadow-sm);
  border-inline-start:3px solid var(--c-accent);
  max-width:min(78%,260px);
}
.sp-hero__stat strong{
  font-family:var(--font-head);
  font-size:1.375rem;
  line-height:1.15;
  color:var(--c-secondary);
}
.sp-hero__stat span{
  font-size:.8125rem;
  line-height:1.5;
  color:var(--c-muted);
}

/* ---------- Grid ---------- */
.sp-body{
  padding-block-start:clamp(28px,4.5vw,52px);
  scroll-margin-block-start:calc(var(--header-h) + 16px);
}
.sp-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,2.2vw,24px);
  margin-block-start:clamp(26px,3.6vw,42px);
}
.sp-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:clamp(22px,2.6vw,30px);
  border-radius:var(--radius-lg);
  background:var(--c-surface);
  border:1px solid var(--c-border);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.sp-card::before{
  content:"";
  position:absolute;
  inset-block-start:0;
  inset-inline:0;
  height:3px;
  background:linear-gradient(90deg,var(--c-primary),var(--c-accent));
  opacity:0;
  transition:opacity .3s ease;
}
.sp-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-md);
  border-color:color-mix(in srgb,var(--c-primary) 32%,var(--c-border));
}
.sp-card:hover::before{opacity:1;}
.sp-card .icon-circle{
  width:52px;
  height:52px;
  border-radius:16px;
  background:color-mix(in srgb,var(--c-primary) 10%,var(--c-surface));
  color:var(--c-primary);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c-primary) 16%,transparent);
}
.sp-card .icon-circle svg{width:24px;height:24px;}
.sp-card h3{
  margin:0;
  font-family:var(--font-head);
  font-size:1.0625rem;
  font-weight:600;
  line-height:1.55;
  color:var(--c-secondary);
}
.sp-card p{
  margin:0;
  font-size:.9375rem;
  line-height:1.8;
  color:var(--c-muted);
}
.sp-card__tags{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:0;
  padding:0;
}
.sp-card__tags li{
  font-size:.75rem;
  font-weight:500;
  line-height:1.5;
  padding:4px 10px;
  border-radius:999px;
  background:color-mix(in srgb,var(--c-primary) 8%,var(--c-surface));
  color:var(--c-secondary);
}
.sp-card__link{
  margin-block-start:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding-block:8px;
  font-size:.875rem;
  font-weight:600;
  color:var(--c-primary);
  text-decoration:none;
  border-radius:8px;
  transition:color .25s ease;
}
.sp-card__link svg{width:16px;height:16px;transition:transform .25s ease;}
.sp-card__link:hover{color:var(--c-secondary);}
.sp-card__link:hover svg{transform:translateX(3px);}
.sp-card__link:focus-visible{outline:2px solid var(--c-primary);outline-offset:4px;}

/* ---------- CTA ---------- */
.sp-cta{
  position:relative;
  overflow:hidden;
  margin-block-start:clamp(38px,5.5vw,68px);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:clamp(20px,3vw,36px);
  padding:clamp(26px,4vw,48px);
  border-radius:var(--radius-lg);
  background:var(--c-secondary);
  color:var(--c-bg);
  box-shadow:var(--shadow-md);
}
.sp-cta::after{
  content:"";
  position:absolute;
  inset-block-start:-60%;
  inset-inline-end:-10%;
  width:min(340px,80vw);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c-primary) 45%,transparent),transparent 70%);
  pointer-events:none;
}
.sp-cta__text{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:10px;
  max-width:60ch;
}
.sp-cta .eyebrow{color:var(--c-accent);}
.sp-cta h2{
  margin:0;
  font-family:var(--font-head);
  font-size:clamp(1.3rem,2.3vw,1.85rem);
  line-height:1.4;
  color:var(--c-bg);
}
.sp-cta p{
  margin:0;
  font-size:.9375rem;
  line-height:1.8;
  color:color-mix(in srgb,var(--c-bg) 78%,transparent);
}
.sp-cta__actions{position:relative;z-index:1;gap:12px;flex-wrap:wrap;}
.sp-cta .btn-outline{
  color:var(--c-bg);
  border-color:color-mix(in srgb,var(--c-bg) 45%,transparent);
  word-break:break-word;
}
.sp-cta .btn-outline:hover{
  background:color-mix(in srgb,var(--c-bg) 14%,transparent);
  border-color:var(--c-bg);
}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .sp-hero__inner{grid-template-columns:1fr;}
  .sp-hero__media{max-width:640px;}
  .sp-hero__media img{aspect-ratio:16/10;}
  .sp-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:600px){
  .sp-grid{grid-template-columns:1fr;}
  .sp-hero__actions .btn{flex:1 1 100%;justify-content:center;}
  .sp-hero__stat{inset-block-end:12px;inset-inline-start:12px;padding:10px 14px;}
  .sp-cta{flex-direction:column;align-items:flex-start;}
  .sp-cta__actions{width:100%;}
  .sp-cta__actions .btn{flex:1 1 100%;justify-content:center;}
}
@media (prefers-reduced-motion:reduce){
  .sp-card,.sp-card::before,.sp-card__link svg{transition:none;}
  .sp-card:hover{transform:none;}
  .sp-card__link:hover svg{transform:none;}
}
