/* Home sections styling (hero untouched) */

.home-band{
  position:relative;
  background: linear-gradient(145deg, color-mix(in srgb, var(--accent), var(--surface) 88%), var(--surface));
  border:1px solid color-mix(in srgb, var(--accent), var(--border) 55%);
  border-radius: var(--radius-lg);
  padding: clamp(1.4rem, 3vw, 2.2rem);
  box-shadow: var(--shadow-2);
  display:grid; gap: clamp(0.9rem, 1.6vw, 1.4rem);
  overflow:hidden;
}
.home-band::before{
  content:""; position:absolute; inset:-20% 10% auto auto; height:55%; width:60%;
  background: radial-gradient(320px 240px at 50% 50%, color-mix(in srgb, var(--accent), transparent 70%), transparent);
  opacity:.6; filter: blur(16px); pointer-events:none;
}
.band-solutions{ background: linear-gradient(150deg, color-mix(in srgb, var(--accent), var(--surface) 60%), var(--surface)); }
.band-offerings{ background: linear-gradient(150deg, color-mix(in srgb, var(--accent), var(--card) 82%), var(--card)); }
.band-insights{ background: linear-gradient(150deg, color-mix(in srgb, var(--accent), var(--surface) 75%), var(--card)); }
.band-head{ display:grid; gap:.35rem; position:relative; z-index:1; }
.band-head.center{ text-align:center; }
.band-head h2{ margin:0; letter-spacing:-0.01em; }
.band-head .muted{ max-width: 760px; }
.band-head .eyebrow, .cta-band .eyebrow{
  font-size:.82rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--accent); font-weight:800; margin:0 0 .2rem;
}
.band-grid{
  display:grid; gap:1rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.card-top{ display:flex; align-items:center; gap:.5rem; }
.pulse-dot{
  width:12px; height:12px; border-radius:50%; background: var(--accent);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent), transparent 30%);
  animation: pulseDot 2s ease-out infinite;
}
.solution-card, .offer-card, .insight-card{
  border:1px solid color-mix(in srgb, var(--accent), var(--border) 60%);
  background: color-mix(in srgb, var(--card), var(--surface) 40%);
  transition: transform .12s ease-out, border-color .12s ease-out, box-shadow .12s ease-out;
  position:relative; overflow:hidden;
  padding: clamp(1rem, 1.6vw, 1.3rem);
}
.solution-card:hover, .offer-card:hover, .insight-card:hover{
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent), var(--border) 40%);
  box-shadow: var(--shadow-2);
}
.solution-card::after, .offer-card::after, .insight-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(280px 200px at 90% 10%, color-mix(in srgb, var(--accent), transparent 80%), transparent);
  opacity:0; transition: opacity .18s ease-out;
}
.solution-card:hover::after, .offer-card:hover::after, .insight-card:hover::after{ opacity:1; }
.solution-card ul{ margin:.55rem 0 0; padding-left:1.1rem; color: var(--muted); display:grid; gap:.3rem; }
.offer-card .badge{ margin-bottom:.35rem; }
.offer-card p{ margin:.25rem 0 0; }
.insights-grid .card-top h3{ margin:0; }
.insight-card p{ margin:.25rem 0 0; }

.insights-grid{ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

.cta-band{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent), var(--card) 92%), var(--card));
  border:1px solid color-mix(in srgb, var(--accent), var(--border) 55%);
}
.cta-band h2{ margin:0; letter-spacing:-0.01em; }
.cta-copy{ display:grid; gap:.35rem; }
.cta-copy .muted{ margin:0; }
.cta-band .btn{ box-shadow: var(--shadow-1); }
.cta-band .btn.primary{ box-shadow: var(--shadow-2); }
.home-band .btn.primary{ box-shadow: var(--shadow-2); }
.home-band .btn{ box-shadow: var(--shadow-1); }
.home-band .muted{ color: var(--muted); }
.home-band h3{ margin:.1rem 0 .3rem; }
.home-band ul{ margin:0; padding:0; list-style:none; }
.home-band ul li{ position:relative; padding-left:1.1rem; }
.home-band ul li::before{
  content:"•"; position:absolute; left:0; color: var(--accent); font-weight:900;
}
.cta-band .muted{ max-width: 640px; margin:0; }
.cta-actions{ display:flex; gap:.6rem; flex-wrap:wrap; }

@media (max-width: 680px){
  .cta-band{ flex-direction:column; align-items:flex-start; }
}

@keyframes pulseDot{
  0%{ box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent), transparent 30%); }
  70%{ box-shadow: 0 0 0 16px transparent; }
  100%{ box-shadow: 0 0 0 0 transparent; }
}
