/* CodeByCP Expert Stats — frontend styles
   Colours are driven by CSS variables set from the Elementor panel. */

.cbcp-stats{
  --ink:#0B0E18;
  --ivory:#F4ECDC;
  --magenta:#FB39FB;
  --purple:#C64DF1;
  --cyan:#35D3FB;

  --ivory-soft:color-mix(in srgb, var(--ivory) 72%, transparent);
  --prism:linear-gradient(100deg, var(--magenta) 0%, var(--purple) 48%, var(--cyan) 100%);

  position:relative;
  overflow:hidden;
  background:var(--ink);
  color:var(--ivory);
  font-family:'Outfit',system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
  padding:clamp(44px,6vw,84px) clamp(20px,5vw,72px);
  isolation:isolate;
  border-radius:inherit;
}
.cbcp-stats *{box-sizing:border-box;}

.cbcp-stats .cbcp-stats-aura{
  position:absolute; z-index:0; pointer-events:none;
  width:60vw; height:60vw; max-width:680px; max-height:680px;
  top:50%; left:50%; transform:translate(-50%,-50%);
  background:radial-gradient(circle,
    color-mix(in srgb, var(--purple) 26%, transparent),
    color-mix(in srgb, var(--cyan) 10%, transparent) 45%, transparent 68%);
  filter:blur(90px); opacity:.55;
}
.cbcp-stats.cbcp-no-glow .cbcp-stats-aura{display:none;}

.cbcp-stats .cbcp-stats-wrap{
  position:relative; z-index:1;
  max-width:1180px; margin:0 auto;
}

/* heading */
.cbcp-stats .cbcp-stats-head{
  text-align:center; margin-bottom:clamp(28px,4vw,46px);
}
.cbcp-stats .cbcp-stats-kicker{
  display:inline-block;
  font-size:12px; letter-spacing:.34em; text-transform:uppercase; font-weight:500;
  background:var(--prism); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
.cbcp-stats .cbcp-stats-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-weight:500; font-style:italic;
  font-size:clamp(26px,3.4vw,42px); line-height:1.12;
  margin:.3em 0 0; color:var(--ivory);
}

/* grid */
.cbcp-stats .cbcp-stats-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

/* card */
.cbcp-stats .cbcp-stat-card{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; align-items:center;
  text-align:center;
  padding:34px 28px;
  border:1px solid rgba(244,236,220,.10);
  border-radius:16px;
  background:rgba(244,236,220,.035);
  backdrop-filter:blur(4px);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, box-shadow .35s ease;
}
/* prism top accent */
.cbcp-stats .cbcp-stat-accent{
  position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--prism);
  transform:scaleX(.4); transform-origin:left;
  opacity:.8; transition:transform .4s ease, opacity .4s ease;
}
.cbcp-stats.cbcp-no-accent .cbcp-stat-accent{display:none;}
.cbcp-stats .cbcp-stat-card:hover{
  transform:translateY(-5px);
  border-color:color-mix(in srgb, var(--purple) 45%, transparent);
  box-shadow:0 24px 50px rgba(0,0,0,.35), 0 0 0 1px color-mix(in srgb, var(--purple) 18%, transparent);
}
.cbcp-stats .cbcp-stat-card:hover .cbcp-stat-accent{transform:scaleX(1); opacity:1;}

/* value */
.cbcp-stats .cbcp-stat-value{
  font-family:'Outfit',sans-serif;
  font-weight:600; line-height:1;
  font-size:clamp(34px,4.4vw,54px);
  letter-spacing:-.01em;
  background:var(--prism); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  font-variant-numeric:tabular-nums;
}
.cbcp-stats .cbcp-stat-value--icon{
  display:flex; align-items:center; justify-content:center;
  min-height:1em;
}
.cbcp-stats .cbcp-stat-value--icon i,
.cbcp-stats .cbcp-stat-value--icon svg{
  font-size:clamp(30px,3.6vw,44px);
  width:1em; height:1em;
}
.cbcp-stats .cbcp-stat-value--icon i{
  background:var(--prism); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
.cbcp-stats .cbcp-stat-value--icon svg{ width:1em; height:1em; fill:var(--purple); }
.cbcp-stats .cbcp-stat-value--icon svg path{ fill:var(--purple); }

/* label */
.cbcp-stats .cbcp-stat-label{
  margin-top:14px;
  font-size:clamp(14px,1.4vw,16px); line-height:1.4;
  color:var(--ivory-soft); font-weight:400;
  max-width:18ch;
}

/* reveal */
.cbcp-stats .cbcp-stat-card{opacity:0; transform:translateY(20px);}
.cbcp-stats .cbcp-stat-card.cbcp-in{opacity:1;}
.cbcp-stats .cbcp-stat-card.cbcp-in:not(:hover){transform:translateY(0);}
.cbcp-stats[data-count="0"] .cbcp-stat-card,
.cbcp-stats.cbcp-shown .cbcp-stat-card{opacity:1;}

@media (prefers-reduced-motion:reduce){
  .cbcp-stats .cbcp-stat-card{opacity:1 !important; transform:none !important; transition:none;}
  .cbcp-stats .cbcp-stat-accent{transition:none;}
}

/* Base responsive fallback (Elementor's column control overrides these when changed). */
@media (max-width:1024px){
  .cbcp-stats .cbcp-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:600px){
  .cbcp-stats .cbcp-stats-grid{grid-template-columns:1fr;}
}