.svc-hero-glow { position:absolute; top:-100px; right:-200px; width:600px; height:500px; pointer-events:none; z-index:0; }
.svc-hero-glow::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 65% 40%,rgba(0,119,204,.1) 0%,transparent 65%); filter:blur(50px); }

.terminal { background:#0d0f14; border:1px solid rgba(255,255,255,.09); border-radius:12px; overflow:hidden; box-shadow:0 28px 70px rgba(0,0,0,.6); }
.terminal-bar { background:#13151a; border-bottom:1px solid rgba(255,255,255,.06); padding:.65rem 1rem; display:flex; align-items:center; gap:.375rem; }
.tdot { width:10px; height:10px; border-radius:50%; }
.tdot-r { background:#ff5f57; }
.tdot-y { background:#febc2e; }
.tdot-g { background:#28c840; }
.t-title { margin-left:.5rem; font-family:var(--mono); font-size:.67rem; color:var(--subtle); flex:1; }
.t-online { display:flex; align-items:center; gap:.35rem; font-size:.63rem; color:var(--green); }
.t-pulse { width:5px; height:5px; border-radius:50%; background:var(--green); animation:pulse 2s ease infinite; }
.terminal-body { padding:1.5rem; font-family:var(--mono); font-size:.78rem; line-height:1.9; }
.tl { display:flex; align-items:baseline; gap:.55rem; }
.tl + .tl { margin-top:.02rem; }
.tl-g { margin-top:.7rem; }
.tp { color:var(--accent); flex-shrink:0; user-select:none; }
.tc { color:#c3e88d; }
.to { color:var(--muted); padding-left:1.6rem; }
.tok { color:var(--green)!important; }
.tinfo { color:var(--blue)!important; }
.t-cursor { display:inline-block; width:7px; height:13px; background:var(--accent); vertical-align:middle; animation:blink .9s step-end infinite; margin-left:2px; }

.metrics-strip { position:relative; z-index:1; border-top:1px solid var(--border); border-bottom:1px solid var(--border); display:grid; grid-template-columns:repeat(4,1fr); }
.metric-cell { padding:2rem 2.5rem; border-right:1px solid var(--border); position:relative; overflow:hidden; transition:background .2s; }
.metric-cell:last-child { border-right:none; }
.metric-cell:hover { background:var(--surface); }
.metric-n { font-size:1.75rem; font-weight:700; color:var(--white); letter-spacing:-.04em; line-height:1; margin-bottom:.35rem; display:flex; align-items:baseline; gap:.2rem; }
.metric-n sup { font-size:.8rem; font-weight:400; color:var(--muted); }
.metric-d { font-size:.8rem; color:var(--muted); line-height:1.55; }
.metric-sub { display:inline-flex; align-items:center; gap:.3rem; font-size:.67rem; color:var(--green); margin-top:.4rem; }

.rack-visual { background:var(--bg); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.rack-hdr { background:var(--bg2); border-bottom:1px solid var(--border); padding:.75rem 1.25rem; display:flex; align-items:center; justify-content:space-between; }
.rack-title { font-family:var(--mono); font-size:.67rem; color:var(--muted); }
.rack-ok { display:flex; align-items:center; gap:.4rem; font-size:.67rem; font-weight:500; color:var(--green); }
.rack-blink { width:6px; height:6px; border-radius:50%; background:var(--green); animation:blink 2s ease infinite; }
.rack-rows { padding:.875rem; display:flex; flex-direction:column; gap:.3rem; }
.rack-row { display:grid; grid-template-columns:28px 1fr auto auto; gap:.75rem; align-items:center; padding:.6rem .875rem; border-radius:8px; border:1px solid transparent; transition:all .2s; }
.rack-row:hover { background:var(--surface2); border-color:var(--border); }
.rack-ico { width:28px; height:28px; border-radius:6px; display:flex; align-items:center; justify-content:center; }
.rack-ico svg { width:13px; height:13px; }
.rack-svc { font-size:.78rem; font-weight:500; color:var(--text); }
.rack-detail { font-size:.63rem; color:var(--muted); font-family:var(--mono); margin-top:.15rem; }
.rack-load-val { font-family:var(--mono); font-size:.68rem; color:var(--muted); text-align:right; }
.rack-bar-bg { width:56px; height:3px; background:var(--surface2); border-radius:2px; margin-top:.3rem; overflow:hidden; }
.rack-bar { height:100%; width:0; border-radius:2px; transition:width .9s .3s ease; }
.rb-g{background:var(--green);}
.rb-y{background:var(--yellow);}
.rack-loaded .rb-w-0 { width:0; }
.rack-loaded .rb-w-2 { width:2%; }
.rack-loaded .rb-w-18 { width:18%; }
.rack-loaded .rb-w-34 { width:34%; }
.rack-loaded .rb-w-60 { width:60%; }
.rack-badge { font-size:.6rem; font-weight:600; padding:.18rem .5rem; border-radius:3px; white-space:nowrap; }
.rb-ok   { background:rgba(74,222,128,.1);  color:var(--green); }
.rb-warn { background:rgba(251,191,36,.1);  color:var(--yellow); }

.stack-section { position:relative; z-index:1; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:6rem 2rem; }
.stack-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.stack-group-label { font-size:.65rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:.75rem; }
.stack-tags { display:flex; flex-wrap:wrap; gap:.4rem; }
.stack-groups { display:flex; flex-direction:column; gap:2rem; }
.stag { font-size:.8rem; font-weight:500; padding:.35rem .75rem; border-radius:6px; background:var(--surface2); border:1px solid var(--border); color:var(--text); transition:all .15s; }
.stag:hover { border-color:var(--accent-b); color:var(--white); }

.section-center { max-width:760px; margin:0 auto; text-align:center; }
.mt-2 { margin-top:2rem; }

.tarif-section  { position:relative; z-index:1; background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:5rem 2rem; }
.tarif-steps    { display:flex; flex-direction:column; gap:.75rem; max-width:420px; margin:0 auto 2.5rem; }
.tarif-step     { display:flex; align-items:center; gap:.875rem; background:var(--bg2); border:1px solid var(--border); border-radius:10px; padding:.875rem 1.25rem; }
.tarif-step-ico { font-size:1.1rem; flex-shrink:0; }
.tarif-step-txt { font-size:.9rem; color:var(--text); }

@media (max-width: 1024px) {
  .stack-inner { grid-template-columns:1fr; gap:3rem; }
}

@media (max-width: 768px) {
  .tarif-section { padding:3.5rem 1.25rem; }
  .metrics-strip { grid-template-columns:repeat(2,1fr); }
  .metric-cell:nth-child(2){ border-right:none; }
  .metric-cell:nth-child(3){ border-top:1px solid var(--border); }
  .stack-section { padding:4rem 1.25rem; }
}

@media (max-width: 480px) {
  .metrics-strip { grid-template-columns:1fr; }
  .metric-cell { border-right:none; border-bottom:1px solid var(--border); }
  .metric-cell:last-child { border-bottom:none; }
}
