/* Qanattar Corporate Site v0.5.6 — final visual rhythm + motion polish */
.qcs-v056{
  --qcs-v056-ease:cubic-bezier(.22,.8,.22,1);
  --qcs-v056-border:rgba(83,183,255,.17);
  --qcs-v056-border-strong:rgba(83,183,255,.34);
  --qcs-v056-panel:linear-gradient(145deg,rgba(8,25,53,.78),rgba(3,12,29,.9));
}

/* Services → proof → NIS2: one continuous visual story, not three detached blocks. */
.qcs-v056 .qcs-services-section{padding-bottom:50px}
.qcs-v056 .qcs-services-section .qcs-section-head{margin-bottom:34px}
.qcs-v056 .qcs-service-grid-v020{position:relative;z-index:2;gap:14px}
.qcs-v056 .qcs-service-grid-v020:after{content:"";position:absolute;left:50%;bottom:-39px;width:1px;height:30px;transform:translateX(-50%);background:linear-gradient(180deg,rgba(83,183,255,.42),transparent);box-shadow:0 0 18px rgba(83,183,255,.22);pointer-events:none}
.qcs-v056 .qcs-service-quicklinks{margin-top:18px}

/* Unified service-card motion. */
.qcs-v056 .qcs-service-card-v020{transition:transform .34s var(--qcs-v056-ease),border-color .34s ease,box-shadow .34s ease,background .34s ease}
.qcs-v056 .qcs-service-card-v020:hover{transform:translateY(-7px);border-color:var(--qcs-v056-border-strong);background:linear-gradient(155deg,rgba(12,39,82,.82),rgba(4,14,31,.88));box-shadow:0 28px 70px rgba(0,15,55,.34),0 0 36px rgba(21,94,239,.07),inset 0 1px 0 rgba(255,255,255,.045)}
.qcs-v056 .qcs-service-card-v020 .qcs-service-arrow{transition:transform .34s var(--qcs-v056-ease),color .34s ease}
.qcs-v056 .qcs-service-card-v020:hover .qcs-service-arrow{transform:translateX(7px);color:#8cd1ff}

/* Operating Loop: stronger rail/pulse, subtle directional sheen, still restrained. */
.qcs-v056 .qcs-service-flow{margin:38px 0 18px;padding:27px 28px 24px;border-color:rgba(83,183,255,.22);background:radial-gradient(circle at 16% -5%,rgba(21,94,239,.19),transparent 34%),radial-gradient(circle at 84% 110%,rgba(83,183,255,.07),transparent 36%),linear-gradient(145deg,rgba(7,24,51,.94),rgba(2,10,25,.96));box-shadow:0 34px 88px rgba(0,0,0,.31),0 0 50px rgba(21,94,239,.055),inset 0 1px 0 rgba(255,255,255,.045)}
.qcs-v056 .qcs-service-flow:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 4%,rgba(83,183,255,.035) 38%,transparent 62%);transform:translateX(-105%);animation:qcs-v056-flow-sheen 8s ease-in-out infinite}
.qcs-v056 .qcs-service-flow-rail{height:3px;background:linear-gradient(90deg,rgba(83,183,255,.12),rgba(83,183,255,.24),rgba(83,183,255,.12))}
.qcs-v056 .qcs-service-flow-beam{height:3px;box-shadow:0 0 16px rgba(83,183,255,.58),0 0 34px rgba(21,94,239,.22);transition:width .78s var(--qcs-v056-ease)}
.qcs-v056 .qcs-service-flow-pulse{width:15px;height:15px;background:#8ad2ff;box-shadow:0 0 0 6px rgba(83,183,255,.08),0 0 28px rgba(83,183,255,.95),0 0 55px rgba(21,94,239,.35);transition:left .78s var(--qcs-v056-ease),top .78s var(--qcs-v056-ease)}
.qcs-v056 .qcs-service-flow.is-flow-reverse .qcs-service-flow-pulse{background:#79c8ff}
.qcs-v056 .qcs-service-flow-node{transition:transform .34s var(--qcs-v056-ease),border-color .34s ease,box-shadow .34s ease,background .34s ease,color .34s ease}
.qcs-v056 .qcs-service-flow-step.is-active .qcs-service-flow-node{transform:translateY(-4px) scale(1.08);box-shadow:0 13px 32px rgba(21,94,239,.28),0 0 32px rgba(83,183,255,.18),inset 0 1px 0 rgba(255,255,255,.1)}
.qcs-v056 .qcs-service-flow-step.is-active strong{color:#fff;text-shadow:0 0 18px rgba(83,183,255,.12)}
.qcs-v056 .qcs-service-flow-live{margin-top:17px;padding:14px 16px;border-color:rgba(83,183,255,.14);background:linear-gradient(90deg,rgba(3,13,31,.82),rgba(4,17,38,.68));box-shadow:inset 3px 0 0 rgba(83,183,255,.24)}

/* Proof/results: reduce the empty dashboard feeling and improve card hierarchy. */
.qcs-v056 .qcs-proof-section{padding:52px 0 62px;background:radial-gradient(circle at 50% -15%,rgba(21,94,239,.11),transparent 38%),radial-gradient(circle at 90% 60%,rgba(83,183,255,.035),transparent 25%),linear-gradient(180deg,rgba(3,10,24,.76),rgba(6,13,31,.82))}
.qcs-v056 .qcs-proof-section:before{content:"";position:absolute;left:50%;top:0;width:min(720px,72vw);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(83,183,255,.25),transparent);box-shadow:0 0 24px rgba(83,183,255,.09)}
.qcs-v056 .qcs-proof-head{grid-template-columns:minmax(0,1.1fr) minmax(310px,.55fr);gap:44px;margin-bottom:25px}
.qcs-v056 .qcs-proof-head h2{font-size:clamp(30px,3vw,44px)}
.qcs-v056 .qcs-proof-grid-v055{gap:14px}
.qcs-v056 .qcs-proof-card-v055{min-height:238px;padding:21px 20px 24px;border-color:var(--qcs-v056-border);background:radial-gradient(circle at 100% 0,rgba(21,94,239,.11),transparent 38%),var(--qcs-v056-panel);transition:transform .34s var(--qcs-v056-ease),border-color .34s ease,box-shadow .34s ease}
.qcs-v056 .qcs-proof-card-v055:hover{transform:translateY(-7px);border-color:var(--qcs-v056-border-strong);box-shadow:0 30px 70px rgba(0,0,0,.28),0 0 42px rgba(21,94,239,.075),inset 0 1px 0 rgba(255,255,255,.05)}
.qcs-v056 .qcs-proof-card-top{margin-bottom:22px}
.qcs-v056 .qcs-proof-card-icon{transition:transform .34s var(--qcs-v056-ease),box-shadow .34s ease,border-color .34s ease}
.qcs-v056 .qcs-proof-card-v055:hover .qcs-proof-card-icon{transform:translateY(-2px) rotate(-3deg);border-color:rgba(83,183,255,.38);box-shadow:0 0 24px rgba(21,94,239,.14)}
.qcs-v056 .qcs-proof-card-v055>strong{font-size:clamp(46px,4vw,60px);margin-bottom:8px}
.qcs-v056 .qcs-proof-card-v055 h3{font-size:14.5px}
.qcs-v056 .qcs-proof-note-v055{margin-top:14px;padding-left:2px}

/* NIS2: tighter vertical alignment and stronger product-module feel. */
.qcs-v056 .qcs-nis2-feature{padding:78px 0 86px;background:radial-gradient(circle at 74% 44%,rgba(21,94,239,.18),transparent 28%),radial-gradient(circle at 96% 12%,rgba(227,30,36,.07),transparent 20%),linear-gradient(180deg,#030a18 0%,#061329 52%,#030a18 100%)}
.qcs-v056 .qcs-nis2-feature-grid{grid-template-columns:minmax(0,.88fr) minmax(540px,1.12fr);gap:62px;align-items:stretch}
.qcs-v056 .qcs-nis2-copy{display:flex;flex-direction:column;justify-content:center;padding:18px 0}
.qcs-v056 .qcs-nis2-copy h2{margin-top:14px;margin-bottom:21px;font-size:clamp(39px,3.8vw,58px)}
.qcs-v056 .qcs-nis2-copy>p{font-size:15px;line-height:1.78}
.qcs-v056 .qcs-nis2-signals{margin:23px 0 27px}
.qcs-v056 .qcs-nis2-visual{align-self:center;padding:23px;border-color:rgba(83,183,255,.24);box-shadow:0 38px 105px rgba(0,0,0,.4),0 0 58px rgba(21,94,239,.09),inset 0 1px 0 rgba(255,255,255,.045);transition:transform .45s var(--qcs-v056-ease),border-color .4s ease,box-shadow .4s ease}
.qcs-v056 .qcs-nis2-visual:hover{transform:translateY(-4px);border-color:rgba(83,183,255,.36);box-shadow:0 44px 120px rgba(0,0,0,.44),0 0 72px rgba(21,94,239,.12),inset 0 1px 0 rgba(255,255,255,.05)}
.qcs-v056 .qcs-nis2-steps article{min-height:174px;transition:transform .34s var(--qcs-v056-ease),border-color .34s ease,background .34s ease,box-shadow .34s ease}
.qcs-v056 .qcs-nis2-steps article:hover{transform:translateY(-5px)}
.qcs-v056 .qcs-nis2-step-icon{transition:transform .34s var(--qcs-v056-ease),box-shadow .34s ease}
.qcs-v056 .qcs-nis2-steps article:hover .qcs-nis2-step-icon{transform:translateY(-2px) scale(1.04);box-shadow:0 12px 32px rgba(21,94,239,.16),0 0 24px rgba(83,183,255,.09),inset 0 1px 0 rgba(255,255,255,.06)}

/* One reveal language for cards. */
.qcs-v056 .qcs-polish-reveal{opacity:.92;transform:translateY(6px);transition:opacity .62s var(--qcs-v056-ease) var(--qcs-reveal-delay,0ms),transform .62s var(--qcs-v056-ease) var(--qcs-reveal-delay,0ms)}
.qcs-v056 .qcs-polish-reveal.is-qcs-revealed{opacity:1;transform:none}
.qcs-v056 :where(.qcs-service-card-v020,.qcs-proof-card-v055,.qcs-nis2-steps article):focus-visible{outline:2px solid rgba(83,183,255,.74);outline-offset:3px}

@keyframes qcs-v056-flow-sheen{0%,63%{transform:translateX(-105%);opacity:0}70%{opacity:.7}86%{transform:translateX(105%);opacity:.18}100%{transform:translateX(105%);opacity:0}}

@media(max-width:1180px){
  .qcs-v056 .qcs-nis2-feature-grid{grid-template-columns:1fr;gap:38px}
  .qcs-v056 .qcs-nis2-copy{padding:0;max-width:760px}
  .qcs-v056 .qcs-nis2-visual{width:100%;max-width:840px}
}
@media(max-width:820px){
  .qcs-v056 .qcs-services-section{padding-bottom:42px}
  .qcs-v056 .qcs-service-grid-v020:after{bottom:-31px;height:23px}
  .qcs-v056 .qcs-service-flow{margin-top:31px;padding:21px 18px}
  .qcs-v056 .qcs-service-flow-rail{height:auto;width:3px}
  .qcs-v056 .qcs-service-flow-beam{width:3px;height:calc(var(--qcs-flow-progress) * 1%)}
  .qcs-v056 .qcs-proof-section{padding:46px 0 52px}
  .qcs-v056 .qcs-proof-head{grid-template-columns:1fr;gap:15px}
  .qcs-v056 .qcs-nis2-feature{padding:62px 0 68px}
  .qcs-v056 .qcs-nis2-feature-grid{gap:32px}
  .qcs-v056 .qcs-nis2-visual{padding:18px}
}
@media(max-width:580px){
  .qcs-v056 .qcs-services-section .qcs-section-head{margin-bottom:25px}
  .qcs-v056 .qcs-service-flow{border-radius:19px}
  .qcs-v056 .qcs-service-flow-head{padding-bottom:16px}
  .qcs-v056 .qcs-service-flow-live{padding:12px 13px}
  .qcs-v056 .qcs-service-quicklinks{margin-top:14px}
  .qcs-v056 .qcs-proof-section{padding:40px 0 44px}
  .qcs-v056 .qcs-proof-grid-v055{gap:11px}
  .qcs-v056 .qcs-proof-card-v055{min-height:205px;padding:18px 18px 23px}
  .qcs-v056 .qcs-proof-card-top{margin-bottom:17px}
  .qcs-v056 .qcs-proof-card-v055>strong{font-size:51px}
  .qcs-v056 .qcs-proof-note-v055{align-items:flex-start;line-height:1.55}
  .qcs-v056 .qcs-nis2-feature{padding:54px 0 58px}
  .qcs-v056 .qcs-nis2-copy h2{font-size:35px}
  .qcs-v056 .qcs-nis2-visual{border-radius:20px}
}
@media(prefers-reduced-motion:reduce){
  .qcs-v056 .qcs-service-flow:after{animation:none;display:none}
  .qcs-v056 .qcs-polish-reveal{opacity:1;transform:none;transition:none}
  .qcs-v056 :where(.qcs-service-card-v020,.qcs-proof-card-v055,.qcs-nis2-visual,.qcs-nis2-steps article,.qcs-service-flow-node){transition:none}
}
