/* ============================================================
   CIDA INFRASTRUCTURE SITES — shared layer
   Control Plane · Data Lake · Archive · Vault
   ============================================================ */

.hero{position:relative;padding:160px 0 88px;overflow:hidden}
.hero .orb--royal{width:820px;height:820px;top:-400px;left:52%;transform:translateX(-50%)}
.hero .orb--steel{width:520px;height:520px;bottom:-300px;right:-140px}
.hero__in{position:relative;z-index:2}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
@media(max-width:980px){.hero__grid{grid-template-columns:1fr;gap:40px}}
.hero h1{margin:22px 0 24px}
.hero .lead{max-width:620px}
.hero__cta{display:flex;gap:13px;flex-wrap:wrap;margin-top:34px}

.panel{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(165deg,rgba(15,21,35,.96),rgba(7,10,19,.96));box-shadow:var(--shadow-3)}
.panel__bar{display:flex;align-items:center;gap:12px;padding:12px 18px;
  border-bottom:1px solid var(--line);background:rgba(4,6,12,.6)}
.panel__dots{display:flex;gap:6px}
.panel__dots i{width:9px;height:9px;border-radius:50%;background:var(--steel-600);display:block}
.panel__title{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--text-mute)}
.panel__badge{margin-left:auto;display:flex;align-items:center;gap:7px;font-family:var(--font-mono);
  font-size:10px;letter-spacing:.14em;color:var(--accent-mint);text-transform:uppercase}
.panel__body{padding:24px}
.panel__foot{padding:13px 18px;border-top:1px solid var(--line);background:rgba(4,6,12,.5);
  display:flex;gap:18px;flex-wrap:wrap}
.lg{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text-dim)}
.lg i{width:9px;height:9px;border-radius:50%;display:block}

/* stat rows inside panels */
.rows{display:flex;flex-direction:column}
.row{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;
  padding:14px 20px;border-bottom:1px solid var(--line)}
.row:last-child{border-bottom:none}
.row__k{font-size:13.5px;color:var(--text-dim)}
.row__k small{display:block;font-family:var(--font-mono);font-size:9.6px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-mute);margin-top:3px}
.row__v{font-family:var(--font-mono);font-size:13px;color:var(--steel-100);text-align:right}
.tag{font-family:var(--font-mono);font-size:9.4px;letter-spacing:.16em;text-transform:uppercase;
  padding:3px 9px;border-radius:99px;border:1px solid var(--line-strong);color:var(--steel-300)}
.tag--ok{border-color:rgba(56,224,176,.4);color:var(--accent-mint);background:rgba(56,224,176,.08)}
.tag--warn{border-color:rgba(242,177,53,.4);color:var(--accent-amber);background:rgba(242,177,53,.08)}
.tag--seal{border-color:rgba(139,108,246,.4);color:var(--accent-violet);background:rgba(139,108,246,.08)}

/* bars */
.bar{height:5px;border-radius:99px;background:rgba(185,192,203,.13);overflow:hidden;width:120px}
.bar i{display:block;height:100%;border-radius:99px;width:0;
  background:linear-gradient(90deg,#1a49c9,#3ec9f5);transition:width 1.2s cubic-bezier(.2,.7,.3,1)}
.bar i.mint{background:linear-gradient(90deg,#1f9e78,#38e0b0)}
.bar i.amber{background:linear-gradient(90deg,#b57c14,#f2b135)}
.bar i.violet{background:linear-gradient(90deg,#5b3fd0,#8b6cf6)}

/* split feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split--rev{direction:rtl}.split--rev>*{direction:ltr}
@media(max-width:940px){.split{grid-template-columns:1fr;gap:36px}.split--rev{direction:ltr}}
.feat-list li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);
  font-size:14px;color:var(--text-dim)}
.feat-list li:last-child{border-bottom:none}
.feat-list b{color:var(--text);font-weight:600}
.tick{width:18px;height:18px;flex:none;margin-top:2px;border-radius:5px;background:rgba(0,47,167,.2);
  border:1px solid rgba(95,134,255,.3);display:flex;align-items:center;justify-content:center}
.tick svg{width:10px;height:10px;stroke:#7fa0ff;stroke-width:2.4;fill:none}

/* code block */
.code{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:rgba(4,6,12,.85)}
.code__bar{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--line)}
.code pre{margin:0;padding:20px;overflow-x:auto;font-family:var(--font-mono);font-size:12.2px;
  line-height:1.8;color:#c9d3e4}
.code .c-key{color:#7fa0ff}.code .c-str{color:#63dcb4}.code .c-com{color:#5f6b80}
.code .c-num{color:#f2b135}.code .c-fn{color:#c9a6ff}

/* pipeline stages */
.stages{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.stage{background:var(--ink-100);padding:24px 20px}
.stage__n{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.2em;color:var(--text-mute);text-transform:uppercase}
.stage__t{font-size:14.5px;font-weight:600;margin:9px 0 8px;color:var(--steel-100)}
.stage__d{font-size:12.4px;color:var(--text-dim);line-height:1.6}
@media(max-width:900px){.stages{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.stages{grid-template-columns:1fr}}

/* CTA band */
.band{position:relative;border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;
  background:linear-gradient(140deg,rgba(0,47,167,.24),rgba(7,10,19,.94) 58%);padding:54px;text-align:center}
.band .orb--royal{width:500px;height:500px;top:-250px;right:-100px}
.band__in{position:relative;z-index:2;max-width:660px;margin:0 auto}
@media(max-width:700px){.band{padding:34px 22px}}

/* spec table */
.spec{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.spec th,.spec td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--line);font-size:13.5px}
.spec th{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text-mute);background:rgba(4,6,12,.5);font-weight:500}
.spec td{color:var(--text-dim)}
.spec td:first-child{color:var(--text);font-weight:500}
.spec tr:last-child td{border-bottom:none}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}