/* Qanattar Corporate Site v0.5.8 — unified icon system + card polish */

.qcs-v058{
  --qcs-icon-blue:#69c8ff;
  --qcs-icon-blue-strong:#32a8ff;
  --qcs-icon-red:#ff4058;
  --qcs-icon-border:rgba(95,190,255,.34);
  --qcs-icon-bg:rgba(7,34,72,.72);
  --qcs-icon-glow:rgba(32,137,255,.22);
}

/* Shared Qanattar glyph shell */
.qcs-v058 .qcs-icon-shell-v058{
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  color:var(--qcs-icon-blue);
  border:1px solid var(--qcs-icon-border);
  background:
    linear-gradient(145deg,rgba(13,54,106,.88),rgba(4,22,50,.93));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 0 22px rgba(31,114,230,.08),
    0 0 0 1px rgba(1,9,25,.4),
    0 12px 32px rgba(0,0,0,.18);
  overflow:hidden;
  isolation:isolate;
  transition:
    transform .34s cubic-bezier(.2,.8,.2,1),
    border-color .34s ease,
    box-shadow .34s ease,
    background .34s ease;
}
.qcs-v058 .qcs-icon-shell-v058::before{
  content:"";
  position:absolute;
  inset:-35%;
  z-index:-1;
  background:conic-gradient(from 210deg,transparent 0 42%,rgba(83,183,255,.16) 49%,transparent 56% 100%);
  opacity:.55;
  transform:rotate(0deg);
  transition:opacity .3s ease;
}
.qcs-v058 .qcs-icon-shell-v058::after{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  bottom:5px;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--qcs-icon-blue-strong),transparent);
  box-shadow:0 0 9px rgba(83,183,255,.65);
  opacity:.46;
}
.qcs-v058 .qcs-icon-svg-v058{
  display:block;
  width:100%;
  height:100%;
  padding:12px;
}
.qcs-v058 .qcs-icon-svg-v058 svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}
.qcs-v058 .qcs-icon-svg-v058 .qcs-icon-main,
.qcs-v058 .qcs-icon-svg-v058 .qcs-icon-accent{
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.qcs-v058 .qcs-icon-svg-v058 .qcs-icon-accent{
  color:var(--qcs-icon-red);
  stroke:var(--qcs-icon-red);
  stroke-width:1.8;
  filter:drop-shadow(0 0 3px rgba(255,64,88,.45));
}

/* Services: one icon language for all seven cards */
.qcs-v058 .qcs-service-card-v058{
  overflow:hidden;
  isolation:isolate;
}
.qcs-v058 .qcs-service-card-v058::before{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  left:-130px;
  top:-128px;
  border:1px solid rgba(83,183,255,.08);
  border-radius:50%;
  box-shadow:0 0 50px rgba(21,94,239,.04);
  pointer-events:none;
}
.qcs-v058 .qcs-service-card-v058::after{
  content:"";
  position:absolute;
  right:18px;
  top:18px;
  width:24px;
  height:24px;
  border-top:1px solid rgba(83,183,255,.13);
  border-right:1px solid rgba(83,183,255,.13);
  border-radius:0 8px 0 0;
  pointer-events:none;
  opacity:.7;
}
.qcs-v058 .qcs-service-glyph-v058{
  width:62px;
  height:62px;
  border-radius:16px;
  margin:0 0 17px;
}
.qcs-v058 .qcs-service-card-v058>small{
  top:18px;
  right:18px;
  color:rgba(111,159,213,.72);
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
}
.qcs-v058 .qcs-service-card-v058 h3{
  letter-spacing:-.015em;
}
.qcs-v058 .qcs-service-card-v058:hover .qcs-service-glyph-v058,
.qcs-v058 .qcs-service-card-v058:focus-visible .qcs-service-glyph-v058{
  transform:translateY(-3px) scale(1.035);
  color:#8bd6ff;
  border-color:rgba(83,183,255,.58);
  background:linear-gradient(145deg,rgba(16,70,137,.95),rgba(5,26,59,.97));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 0 28px rgba(32,137,255,.12),
    0 0 28px rgba(32,137,255,.14),
    0 16px 36px rgba(0,0,0,.22);
}
.qcs-v058 .qcs-service-card-v058:hover .qcs-icon-shell-v058::before,
.qcs-v058 .qcs-service-card-v058:focus-visible .qcs-icon-shell-v058::before{
  opacity:.92;
  animation:qcs-v058-icon-orbit 3.6s linear infinite;
}
.qcs-v058 .qcs-service-card-v058:hover .qcs-icon-accent,
.qcs-v058 .qcs-service-card-v058:focus-visible .qcs-icon-accent{
  filter:drop-shadow(0 0 5px rgba(255,64,88,.78));
}
.qcs-v058 .qcs-service-card-v058 .qcs-service-arrow{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid transparent;
}
.qcs-v058 .qcs-service-card-v058:hover .qcs-service-arrow,
.qcs-v058 .qcs-service-card-v058:focus-visible .qcs-service-arrow{
  border-color:rgba(83,183,255,.23);
  background:rgba(21,94,239,.08);
  box-shadow:0 0 18px rgba(21,94,239,.10);
}

/* Business proof: larger, product-grade glyphs */
.qcs-v058 .qcs-proof-card-v055{
  --qcs-proof-accent:#53b7ff;
}
.qcs-v058 .qcs-proof-card-v055.is-primary-proof{
  --qcs-proof-accent:#72d1ff;
}
.qcs-v058 .qcs-proof-card-top{
  align-items:center;
  gap:13px;
  margin-bottom:24px;
}
.qcs-v058 .qcs-proof-glyph-v058{
  width:54px;
  height:54px;
  border-radius:15px;
  color:var(--qcs-proof-accent);
}
.qcs-v058 .qcs-proof-glyph-v058 .qcs-icon-svg-v058{
  padding:10px;
}
.qcs-v058 .qcs-proof-card-top small{
  color:#7894b8;
  font-size:9px;
  letter-spacing:.125em;
}
.qcs-v058 .qcs-proof-card-v055>strong{
  margin-top:2px;
}
.qcs-v058 .qcs-proof-card-v055:hover .qcs-proof-glyph-v058{
  transform:translateY(-3px) scale(1.045);
  border-color:rgba(83,183,255,.58);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 0 24px rgba(32,137,255,.12),
    0 0 32px rgba(32,137,255,.15),
    0 14px 34px rgba(0,0,0,.22);
}
.qcs-v058 .qcs-proof-card-v055.is-primary-proof .qcs-proof-glyph-v058{
  width:58px;
  height:58px;
  border-color:rgba(105,200,255,.48);
  background:
    radial-gradient(circle at 50% 48%,rgba(83,183,255,.12),transparent 60%),
    linear-gradient(145deg,rgba(15,65,126,.96),rgba(5,27,60,.97));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 34px rgba(21,94,239,.13),
    0 16px 38px rgba(0,0,0,.2);
}
.qcs-v058 .qcs-proof-card-v055.is-primary-proof::after{
  content:"LIVE";
  position:absolute;
  right:22px;
  top:22px;
  padding:5px 8px 4px;
  border:1px solid rgba(99,217,170,.22);
  border-radius:999px;
  color:#75ddb2;
  background:rgba(15,92,72,.08);
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.14em;
  box-shadow:0 0 18px rgba(99,217,170,.05);
}
.qcs-v058 .qcs-proof-card-v055.is-primary-proof::after{
  text-shadow:0 0 10px rgba(99,217,170,.3);
}

/* Small circuit signature on proof cards */
.qcs-v058 .qcs-proof-card-v055 .qcs-proof-card-line::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:4px;
  height:4px;
  margin-top:-2px;
  border-radius:50%;
  background:#68c7ff;
  box-shadow:0 0 10px rgba(83,183,255,.72);
}

@keyframes qcs-v058-icon-orbit{
  to{transform:rotate(360deg)}
}

@media (max-width:980px){
  .qcs-v058 .qcs-service-glyph-v058{width:58px;height:58px}
  .qcs-v058 .qcs-proof-glyph-v058{width:50px;height:50px}
  .qcs-v058 .qcs-proof-card-v055.is-primary-proof .qcs-proof-glyph-v058{width:54px;height:54px}
}

@media (max-width:640px){
  .qcs-v058 .qcs-service-glyph-v058{width:54px;height:54px;border-radius:14px;margin-bottom:14px}
  .qcs-v058 .qcs-icon-svg-v058{padding:10px}
  .qcs-v058 .qcs-proof-card-top{margin-bottom:18px}
  .qcs-v058 .qcs-proof-glyph-v058,
  .qcs-v058 .qcs-proof-card-v055.is-primary-proof .qcs-proof-glyph-v058{width:48px;height:48px;border-radius:13px}
  .qcs-v058 .qcs-proof-card-v055.is-primary-proof::after{right:16px;top:16px}
}

@media (prefers-reduced-motion:reduce){
  .qcs-v058 .qcs-icon-shell-v058,
  .qcs-v058 .qcs-service-card-v058 .qcs-service-arrow{transition:none}
  .qcs-v058 .qcs-service-card-v058:hover .qcs-icon-shell-v058::before,
  .qcs-v058 .qcs-service-card-v058:focus-visible .qcs-icon-shell-v058::before{animation:none}
}
