.cic-slider-shell {
  --cic-text: #f5f8ff;
  --cic-muted: rgba(225,234,255,.78);
  --cic-line: rgba(255,255,255,.12);
  --cic-shadow: 0 28px 80px rgba(0,0,0,.45);
  --cic-radius: 28px;
  position: relative;
  min-height: 100vh;
  padding: 42px clamp(16px, 4vw, 54px) 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  overflow: hidden;
  color: var(--cic-text);
  background:
    radial-gradient(circle at top left, rgba(67,118,255,.22), transparent 30%),
    radial-gradient(circle at bottom right, rgba(0,234,255,.12), transparent 28%),
    linear-gradient(160deg, #020817 0%, #07162e 45%, #020b19 100%);
  font-family: Inter, system-ui, sans-serif;
}
.cic-slider-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.88), transparent 90%);
  pointer-events: none;
}
.cic-shimmer-grid,
.cic-stars,
.cic-ambient {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.cic-ambient { filter: blur(46px); opacity: .75; }
.cic-ambient-a {
  inset: auto auto -12% -8%;
  width: 38vw; height: 38vw;
  background: radial-gradient(circle, rgba(75,162,255,.33), transparent 68%);
  animation: cicBlob 10s ease-in-out infinite;
}
.cic-ambient-b {
  inset: -10% -10% auto auto;
  width: 30vw; height: 30vw;
  background: radial-gradient(circle, rgba(246,89,255,.22), transparent 70%);
  animation: cicBlob 12s ease-in-out infinite reverse;
}
.cic-shimmer-grid::before {
  content: "";
  position: absolute;
  inset: -20%;
  background: linear-gradient(115deg, transparent 20%, rgba(110,224,255,.06) 42%, rgba(255,255,255,.12) 50%, rgba(110,224,255,.05) 58%, transparent 80%);
  transform: translateX(-35%) rotate(-10deg);
  animation: cicGridSweep 8s linear infinite;
}
.cic-stars {
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 36% 26%, rgba(255,255,255,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 62% 18%, rgba(255,255,255,.95) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 12%, rgba(255,255,255,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 88% 30%, rgba(255,255,255,.7) 0 1px, transparent 2px),
    radial-gradient(circle at 22% 74%, rgba(255,255,255,.8) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 82%, rgba(255,255,255,.9) 0 1px, transparent 2px);
  animation: cicFloatStars 8s ease-in-out infinite alternate;
}
.cic-topbar, .cic-controls-row, .cic-fund-strip, .cic-slider { position: relative; z-index: 2; }
.cic-topbar {
  display: flex; align-items: end; justify-content: space-between; gap: 18px; flex-wrap: wrap;
}
.cic-eyebrow {
  margin: 0 0 8px; text-transform: uppercase; letter-spacing: .18em; font-size: 12px; color: #8bdcff;
}
.cic-main-title { margin: 0; font-size: clamp(30px, 4vw, 64px); line-height: 1.02; max-width: 12ch; }
.cic-status-pill {
  display: inline-flex; align-items: center; padding: 12px 18px; border-radius: 999px; border: 1px solid rgba(139,220,255,.3);
  background: linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.04)); box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 10px 40px rgba(0,0,0,.18); color:#dff6ff;
}
.cic-fund-strip {
  display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap;
  padding: 14px 18px; border-radius: 18px; border: 1px solid rgba(255,255,255,.1);
  background: linear-gradient(180deg, rgba(10,23,49,.7), rgba(7,14,28,.82));
  box-shadow: 0 14px 40px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
}
.cic-fund-strip-label { font-size: 12px; text-transform: uppercase; letter-spacing: .16em; color: #90e4ff; }
.cic-fund-strip-values { display: flex; gap: 10px; flex-wrap: wrap; }
.cic-fund-strip-values span {
  padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); color: #ecf7ff; font-size: 13px;
}
.cic-slider { display: grid; grid-template-columns: 58px 1fr 58px; align-items: center; gap: 16px; perspective: 1800px; }
.cic-viewport { overflow: hidden; padding: 16px 0; }
.cic-track { display: flex; gap: 26px; transition: transform .7s cubic-bezier(.22,.61,.36,1); will-change: transform; }
.cic-slide {
  position: relative; min-width: calc(100% - 2px); height: 72vh; border-radius: var(--cic-radius); overflow: hidden;
  transform-style: preserve-3d; border: 1px solid rgba(255,255,255,.09); box-shadow: var(--cic-shadow);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  transition: transform .5s ease, opacity .4s ease, filter .4s ease;
  opacity: .72; filter: saturate(.85);
}
.cic-slide.is-active { opacity: 1; filter: saturate(1); }
.cic-slide-bg, .cic-grid-lines, .cic-orb, .cic-scanline, .cic-energy-line, .cic-particle { position: absolute; inset: 0; pointer-events:none; }
.cic-slide-bg {
  background: radial-gradient(circle at 24% 18%, rgba(255,255,255,.12), transparent 26%), linear-gradient(135deg, rgba(255,255,255,.08), transparent 44%), linear-gradient(160deg, #0b1631 0%, #0a1130 40%, #07111e 100%);
}
.cic-slide[data-theme="pink"] .cic-slide-bg { background: radial-gradient(circle at 24% 18%, rgba(255,205,255,.16), transparent 26%), linear-gradient(135deg, rgba(255,255,255,.08), transparent 44%), linear-gradient(160deg, #2a0831 0%, #22091f 45%, #0d1023 100%); }
.cic-slide[data-theme="gold"] .cic-slide-bg { background: radial-gradient(circle at 24% 18%, rgba(255,226,141,.14), transparent 26%), linear-gradient(135deg, rgba(255,255,255,.08), transparent 44%), linear-gradient(160deg, #291b09 0%, #161221 50%, #0a111f 100%); }
.cic-grid-lines {
  background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 54px 54px; opacity: .24; transform: translateZ(0);
}
.cic-orb { filter: blur(8px); animation: cicPulse 4.5s ease-in-out infinite; }
.cic-orb-a { inset: auto auto 10% -6%; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(45,210,255,.22), transparent 68%); }
.cic-orb-b { inset: -8% 5% auto auto; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, rgba(255,106,224,.18), transparent 72%); animation-delay: -1.8s; }
.cic-scanline {
  background: linear-gradient(180deg, transparent, rgba(158,236,255,.18), transparent);
  transform: translateY(-180%) skewY(-8deg); animation: cicScan 8s ease-in-out infinite;
}
.cic-energy-line {
  height: 2px; inset: auto auto auto 0; width: 45%; background: linear-gradient(90deg, transparent, rgba(120,238,255,.95), transparent);
  box-shadow: 0 0 16px rgba(120,238,255,.5); opacity: .7;
}
.cic-energy-line-a { top: 22%; animation: cicBeam 4.8s linear infinite; }
.cic-energy-line-b { top: 78%; width: 35%; animation: cicBeam 5.6s linear infinite reverse; }
.cic-particle {
  width: 10px; height: 10px; border-radius: 50%; background: radial-gradient(circle, #fff 0%, rgba(135,234,255,.95) 30%, rgba(135,234,255,0) 72%);
  box-shadow: 0 0 22px rgba(114,225,255,.45);
}
.cic-particle-a { inset: 18% auto auto 62%; animation: cicParticleDrift 6.2s ease-in-out infinite; }
.cic-particle-b { inset: 66% auto auto 18%; animation: cicParticleDrift 7.2s ease-in-out infinite reverse; }
.cic-slide-inner { position: relative; z-index: 2; height: 100%; display: grid; grid-template-columns: minmax(320px, 1.05fr) minmax(300px, 1fr); align-items: center; gap: clamp(18px, 3vw, 42px); padding: clamp(22px, 4vw, 48px); }
.cic-slide-copy, .cic-slide-media { transition: transform .12s linear; transform-style: preserve-3d; }
.cic-slide-copy { align-self: center; max-width: 520px; }
.cic-tag { display: inline-flex; margin: 0 0 14px; padding: 10px 14px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); letter-spacing: .12em; text-transform: uppercase; font-size: 12px; color: #bfe1ff; }
.cic-slide-copy h3 { margin: 0 0 16px; font-size: clamp(28px, 4vw, 56px); line-height: 1.02; color: #fff; }
.cic-desc { margin: 0 0 24px; max-width: 42ch; font-size: clamp(15px,1.5vw,19px); line-height: 1.7; color: var(--cic-muted); }
.cic-donation-card {
  position: relative; overflow: hidden; margin: 0 0 24px; padding: 18px; border-radius: 22px; border: 1px solid rgba(138,224,255,.16);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 42px rgba(0,0,0,.18);
}
.cic-donation-card::before {
  content: ""; position: absolute; inset: -25% auto auto -10%; width: 180px; height: 180px; border-radius: 50%;
  background: radial-gradient(circle, rgba(78,224,255,.18), transparent 70%); animation: cicPulse 4.6s ease-in-out infinite;
}
.cic-donation-head { position: relative; z-index: 1; display: flex; gap: 12px; justify-content: space-between; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.cic-donation-chip { display: inline-flex; padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.07); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color:#9ce9ff; }
.cic-donation-percent { font-size: 28px; font-weight: 700; color:#ffffff; text-shadow: 0 0 22px rgba(113,233,255,.35); }
.cic-donation-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.cic-stat-box { padding: 12px 14px; border-radius: 16px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); }
.cic-stat-box span { display:block; margin-bottom: 6px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color:#a9e8ff; }
.cic-stat-box strong { display:block; font-size: clamp(16px, 2vw, 24px); color:#fff; }
.cic-donation-progress { position: relative; z-index: 1; height: 12px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.08); }
.cic-donation-progress span {
  display:block; height:100%; border-radius:inherit; background: linear-gradient(90deg, #44d8ff, #77ffd2); box-shadow: 0 0 28px rgba(68,216,255,.42); position: relative;
}
.cic-donation-progress span::after {
  content:""; position:absolute; inset:0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent); transform: translateX(-100%); animation: cicProgressSweep 2.6s linear infinite;
}
.cic-slide-button {
  display: inline-flex; align-items: center; justify-content: center; min-width: 180px; padding: 14px 22px; border-radius: 999px; text-decoration: none; color: #fff; border: 1px solid rgba(137,215,255,.6);
  background: linear-gradient(180deg, rgba(74,174,255,.16), rgba(31,78,147,.14)); box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset, 0 0 28px rgba(89,198,255,.22);
  transition: transform .2s ease, box-shadow .2s ease;
}
.cic-slide-button:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 0 34px rgba(89,198,255,.35); color:#fff; }
.cic-slide-media { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; }
.cic-media-frame {
  position: absolute; inset: 10% 8%; border-radius: 28px; background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.03)); border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 0 40px rgba(255,255,255,.03); transform: translateZ(20px);
}
.cic-rotor-glow {
  position: absolute; inset: 12% 16%; border-radius: 50%; background: radial-gradient(circle, rgba(103,232,255,.14), rgba(103,232,255,0) 68%);
  filter: blur(16px); animation: cicRotor 10s linear infinite;
}
.cic-slide-media img { position: relative; z-index: 1; width: 100%; max-width: 760px; max-height: 100%; object-fit: contain; filter: drop-shadow(0 24px 60px rgba(0,0,0,.34)); transform: translateZ(60px); user-select: none; pointer-events: none; animation: cicMediaFloat 6s ease-in-out infinite; }
.cic-pulse-ring {
  position: absolute; width: 48%; aspect-ratio: 1; border-radius: 999px; border: 1px solid rgba(131,211,255,.22); box-shadow: 0 0 0 0 rgba(131,211,255,.18); animation: cicRing 3.8s ease-out infinite;
}
.cic-pulse-ring-delayed { animation-delay: 1.8s; }
.cic-nav {
  position: relative; z-index: 5; width: 58px; height: 58px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #fff; border-radius: 50%; cursor: pointer; font-size: 22px; backdrop-filter: blur(16px); box-shadow: 0 10px 30px rgba(0,0,0,.25); transition: transform .2s ease, background .2s ease;
}
.cic-nav:hover { transform: scale(1.06); background: rgba(255,255,255,.11); }
.cic-controls-row { display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cic-progress-wrap { display: flex; align-items: center; gap: 14px; min-width: min(480px, 100%); }
.cic-progress-label { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: #b8d8ff; }
.cic-progress-bar { position: relative; flex: 1; height: 10px; border-radius: 999px; background: rgba(255,255,255,.08); overflow: hidden; border: 1px solid rgba(255,255,255,.08); }
.cic-progress-bar span { display: block; height: 100%; width: 33.333%; border-radius: inherit; background: linear-gradient(90deg, #41d7ff, #7effa8); box-shadow: 0 0 24px rgba(65,215,255,.28); transition: width .45s ease; }
.cic-dots { display: flex; align-items: center; gap: 10px; }
.cic-dot { width: 12px; height: 12px; border-radius: 50%; border: 0; cursor: pointer; background: rgba(255,255,255,.22); box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset; }
.cic-dot.active { background: #66dbff; box-shadow: 0 0 18px rgba(102,219,255,.52); }
@media (max-width: 1024px) {
  .cic-slide-inner { grid-template-columns: 1fr; text-align: center; }
  .cic-slide-copy { max-width: none; }
  .cic-desc { margin-left: auto; margin-right: auto; }
  .cic-slide-button { margin: 0 auto; }
}
@media (max-width: 767px) {
  .cic-slider-shell { min-height: auto; padding: 28px 14px 24px; }
  .cic-slider { grid-template-columns: 1fr; }
  .cic-nav { display: none; }
  .cic-slide { height: 680px; min-width: 100%; width: 100%; }
  .cic-progress-wrap { min-width: 100%; }
  .cic-donation-grid { grid-template-columns: 1fr; }
}
@keyframes cicBlob { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(18px,-12px,0) scale(1.06); } }
@keyframes cicPulse { 0%,100% { transform: scale(1); opacity:.35; } 50% { transform: scale(1.18); opacity:.7; } }
@keyframes cicScan { 0% { transform: translateY(-180%) skewY(-8deg); opacity:0; } 15% { opacity:.7; } 50% { opacity:.35; } 100% { transform: translateY(420%) skewY(-8deg); opacity:0; } }
@keyframes cicRing { 0% { transform: scale(.65); opacity:.65; box-shadow: 0 0 0 0 rgba(131,211,255,.24); } 100% { transform: scale(1.35); opacity:0; box-shadow: 0 0 0 36px rgba(131,211,255,0); } }
@keyframes cicMediaFloat { 0%,100% { transform: translateZ(60px) translateY(0); } 50% { transform: translateZ(60px) translateY(-10px); } }
@keyframes cicFloatStars { 0% { transform: translateY(0); opacity:.8; } 100% { transform: translateY(18px); opacity:1; } }
@keyframes cicGridSweep { 0% { transform: translateX(-40%) rotate(-10deg); } 100% { transform: translateX(70%) rotate(-10deg); } }
@keyframes cicBeam { 0% { transform: translateX(-20%); opacity: 0; } 15% { opacity: .85; } 100% { transform: translateX(220%); opacity: 0; } }
@keyframes cicParticleDrift { 0%,100% { transform: translate3d(0,0,0) scale(.8); opacity:.45; } 50% { transform: translate3d(18px,-24px,0) scale(1.3); opacity:1; } }
@keyframes cicProgressSweep { 0% { transform: translateX(-110%); } 100% { transform: translateX(110%); } }
@keyframes cicRotor { 0% { transform: rotate(0deg) scale(1); } 50% { transform: rotate(180deg) scale(1.05); } 100% { transform: rotate(360deg) scale(1); } }
