/* ============================================================
   Intropy · Industries pages
   Layered on solutions.css. A distinct "operations blueprint"
   language: spec-sheet profile + numbered operations rail with
   Intropy capabilities mapped onto each stage.
   ============================================================ */

/* ---------- operating profile (spec sheet) ---------- */
.profile{display:grid; grid-template-columns:1fr 400px; margin-top:0; border:1px solid var(--line); background:var(--panel)}
.profile .pf-lead{padding:48px 46px}
.profile .pf-lead h2{font-size:clamp(24px,3vw,38px); font-weight:500; letter-spacing:-.03em; line-height:1.05; max-width:20ch}
.profile .pf-lead h2 .o{color:var(--accent)}
.profile .pf-lead p{color:var(--muted); font-size:15.5px; line-height:1.65; max-width:52ch; margin:22px 0 0}
.spec{border-left:1px solid var(--line); display:flex; flex-direction:column}
.spec-hd{font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); padding:16px 26px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between}
.spec-hd span:last-child{color:var(--faint); letter-spacing:.12em}
.spec-row{display:grid; grid-template-columns:118px 1fr; gap:14px; padding:15px 26px; border-bottom:1px solid var(--line); align-items:baseline; flex:1}
.spec-row:last-child{border-bottom:0}
.spec-row dt{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--faint); margin:0}
.spec-row dd{margin:0; font-size:14px; color:var(--ink-dim); line-height:1.45; font-weight:500}
@media(max-width:860px){ .profile{grid-template-columns:1fr} .profile .pf-lead{padding:32px 26px} .spec{border-left:0; border-top:1px solid var(--line)} .spec-hd{padding:14px 20px} .spec-row{grid-template-columns:96px 1fr; gap:10px; padding:14px 20px} }

/* ---------- operations rail ---------- */
.op-rail{margin-top:56px; border-top:1px solid var(--line)}
.op{display:grid; grid-template-columns:150px 1fr; border-bottom:1px solid var(--line); background:var(--panel); transition:background .3s; position:relative}
.op:hover{background:rgba(23,36,63,.85)}
.op-idx{border-right:1px solid var(--line); padding:34px 24px; display:flex; flex-direction:column; gap:14px; position:relative}
.op-idx .stg{font-family:var(--mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--accent)}
.op-idx .n{font-size:clamp(52px,5vw,74px); font-weight:600; line-height:.8; letter-spacing:-.04em; color:transparent; -webkit-text-stroke:1.2px var(--faint); transition:-webkit-text-stroke-color .3s, color .3s}
.op:hover .op-idx .n{-webkit-text-stroke-color:var(--accent); color:var(--accent-soft)}
/* spine node */
.op-idx::after{content:""; position:absolute; right:-6px; top:50%; transform:translateY(-50%); width:11px; height:11px; box-sizing:border-box; border-radius:50%; background:var(--bg); border:2px solid var(--faint); z-index:2; transition:border-color .3s, background .3s}
.op:hover .op-idx::after{border-color:var(--accent); background:var(--accent)}
.op-main{padding:32px 40px; display:grid; grid-template-columns:1fr 300px; gap:40px; align-items:start}
.op-main h3{font-size:22px; font-weight:600; letter-spacing:-.015em; color:var(--ink); margin:0 0 12px}
.op-main p{color:var(--muted); font-size:14.5px; line-height:1.6; margin:0; max-width:52ch}
.op-caps{display:flex; flex-direction:column; gap:8px}
.op-caps .ct{font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-bottom:2px}
.op-cap{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; border:1px solid var(--line); color:var(--ink-dim); font-size:13px; font-weight:500; transition:.18s; background:rgba(9,18,41,.4)}
.op-cap:hover{border-color:var(--accent-line); background:var(--accent-soft); color:var(--ink)}
.op-cap .cn{font-family:var(--mono); font-size:9px; color:var(--accent); letter-spacing:.06em; flex:none}
.op-cap .ar{color:var(--accent); font-family:var(--mono); flex:none; transition:transform .2s}
.op-cap:hover .ar{transform:translateX(3px)}
@media(max-width:860px){
  .op{grid-template-columns:96px 1fr}
  .op-idx{padding:24px 16px}
  .op-idx::after{display:none}
  .op-main{grid-template-columns:1fr; gap:24px; padding:26px 24px}
}

/* ---------- solutions in play (mapped grid) ---------- */
.smap{display:grid; grid-template-columns:repeat(3,1fr); margin-top:56px; border:1px solid var(--line); background:var(--panel)}
.sm{padding:34px 32px 30px; border-right:1px solid var(--line); display:flex; flex-direction:column; transition:background .3s; position:relative; overflow:hidden}
.smap .sm:last-child{border-right:0}
.sm::after{content:""; position:absolute; left:0; top:0; height:2px; width:0; background:var(--accent); transition:width .4s ease}
.sm:hover{background:rgba(23,36,63,.85)} .sm:hover::after{width:100%}
.sm .smn{font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-bottom:20px}
.sm h4{font-size:20px; font-weight:600; letter-spacing:-.015em; color:var(--ink); margin:0 0 12px; line-height:1.1}
.sm p{color:var(--muted); font-size:14px; line-height:1.6; margin:0 0 24px}
.sm .sm-cta{margin-top:auto; display:inline-flex; align-items:center; gap:9px; font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--accent); padding-top:16px; border-top:1px solid var(--line)}
.sm .sm-cta .ar{transition:transform .2s}
.sm:hover .sm-cta .ar{transform:translateX(4px)}
@media(max-width:860px){ .smap{grid-template-columns:1fr} .sm{border-right:0; border-bottom:1px solid var(--line)} .smap .sm:last-child{border-bottom:0} }

/* section sub-copy under lead */
.sec-sub{color:var(--muted); font-size:clamp(15px,1.3vw,17px); line-height:1.6; max-width:56ch; margin:18px 0 0}
