.cattle-network {
  padding: clamp(74px,7vw,122px) var(--gutter);
  color: #eef5ef;
  background: radial-gradient(circle at 88% 3%,rgba(184,255,24,.08),transparent 24%),#04120d;
}
.network-inner { max-width: 1696px; margin: auto; }
.network-head { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); align-items: end; gap: clamp(40px,7vw,120px); margin-bottom: 52px; }
.network-kicker { margin: 0 0 25px; color: var(--lime); font-size: .75rem; font-weight: 800; line-height: 1.6; letter-spacing: .12em; text-transform: uppercase; }
.network-head h2 { margin: 0; font-size: clamp(2.8rem,4.55vw,5.15rem); font-weight: 600; line-height: .98; letter-spacing: -.06em; }
.network-head h2 em { color: var(--lime); font-style: normal; }
.network-intro { max-width: 690px; }
.network-intro p { margin: 0; color: #aabbb1; font-size: clamp(1rem,1.17vw,1.25rem); line-height: 1.68; }
.network-intro p + p { margin-top: 18px; padding-left: 18px; border-left: 2px solid rgba(184,255,24,.45); color: #c9d4cd; }
.network-intro strong { color: #f4f8f5; font-weight: 800; }
.network-stage { display: grid; grid-template-columns: minmax(0,1.48fr) minmax(390px,.52fr); align-items: stretch; background: #071a12; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 32px 80px rgba(0,0,0,.28); }
.network-figure { min-width: 0; margin: 0; align-self: start; background: #020b07; }
.network-figure > img { display: block; width: 100%; height: auto; object-fit: contain; }
.network-figure figcaption { padding: clamp(25px,2.5vw,41px); border-top: 1px solid rgba(184,255,24,.27); }
.network-figure figcaption span,.network-figure figcaption strong,.network-figure figcaption small { display: block; }
.network-figure figcaption span { color: var(--lime); font-size: .75rem; font-weight: 800; line-height: 1.5; letter-spacing: .1em; }
.network-figure figcaption strong { margin-top: 14px; font-size: clamp(1.45rem,1.95vw,2.1rem); font-weight: 600; line-height: 1.22; letter-spacing: -.04em; }
.network-figure figcaption small { max-width: 640px; margin-top: 16px; color: #9baea2; font-size: .8125rem; line-height: 1.6; }
.network-board { min-width: 0; display: flex; flex-direction: column; padding: clamp(24px,2.1vw,36px); background: #0a2117; border-left: 1px solid rgba(255,255,255,.13); }
.network-board > header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 9px 20px; padding-bottom: 20px; border-bottom: 1px solid rgba(255,255,255,.14); }
.network-board > header span { color: var(--lime); font-size: .75rem; font-weight: 800; line-height: 1.5; letter-spacing: .08em; }
.network-board > header small { color: #8da094; font-size: .75rem; line-height: 1.5; }
.network-board article { min-height: 122px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: start; gap: 13px; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.network-index { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(184,255,24,.46); border-radius: 50%; color: var(--lime); font-size: .75rem; font-weight: 800; }
.network-priority .network-index { color: #07140e; background: var(--lime); }
.network-board article span,.network-board article strong,.network-board article small { display: block; }
.network-board article span { color: #94a69a; font-size: .75rem; font-weight: 800; line-height: 1.45; letter-spacing: .055em; }
.network-board article strong { margin-top: 7px; color: #f2f7f3; font-size: .9375rem; line-height: 1.38; }
.network-board article small { margin-top: 7px; color: #84978b; font-size: .75rem; line-height: 1.45; }
.network-board article > b { color: var(--lime); font-size: .75rem; line-height: 1.5; }
.network-board > footer { margin-top: auto; padding-top: 22px; color: #9db0a4; font-size: .875rem; line-height: 1.62; }
.network-path { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 20px; margin-top: 28px; padding: 27px 30px; color: #07150f; background: var(--lime); }
.network-path > div { display: grid; grid-template-columns: 36px minmax(0,1fr); column-gap: 12px; align-items: start; }
.network-path span { grid-row: 1 / 3; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(7,21,15,.42); border-radius: 50%; font-size: .75rem; font-weight: 800; }
.network-path b { font-size: .9375rem; line-height: 1.4; }
.network-path small { margin-top: 4px; color: #2d421d; font-size: .75rem; line-height: 1.45; }
.network-path > i { font-size: 1.2rem; font-style: normal; }
.network-value { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 74px; border-top: 1px solid rgba(255,255,255,.15); border-left: 1px solid rgba(255,255,255,.15); }
.network-value article { min-width: 0; padding: clamp(25px,2.5vw,42px); border-right: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); }
.network-value span { color: var(--lime); font-size: .75rem; font-weight: 800; line-height: 1.5; letter-spacing: .06em; }
.network-value h3 { margin: 23px 0 14px; font-size: clamp(1.25rem,1.55vw,1.65rem); font-weight: 600; line-height: 1.25; letter-spacing: -.035em; }
.network-value p { margin: 0; color: #9fb1a6; font-size: 1rem; line-height: 1.66; }
@media (max-width: 1180px) {
  .network-head { grid-template-columns: 1fr; gap: 26px; }
  .network-head h2 { font-size: clamp(2.6rem,5.7vw,4.4rem); }
  .network-stage { grid-template-columns: minmax(0,1.25fr) minmax(360px,.75fr); }
  .network-path { grid-template-columns: 1fr 1fr; gap: 22px 34px; }
  .network-path > i { display: none; }
  .network-value { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 880px) {
  .network-stage { grid-template-columns: 1fr; }
  .network-board { border-left: 0; border-top: 1px solid rgba(184,255,24,.27); }
  .network-board > footer { margin-top: 22px; }
}
@media (max-width: 580px) {
  .cattle-network { padding-block: 64px; }
  .network-head { margin-bottom: 34px; }
  .network-head h2 { font-size: clamp(2.05rem,8.4vw,2.85rem); }
  .network-board article { grid-template-columns: 36px minmax(0,1fr); }
  .network-board article > b { grid-column: 2; }
  .network-path { grid-template-columns: 1fr; }
  .network-value { grid-template-columns: 1fr; margin-top: 52px; }
}
