/* Project-specific visual layer. Shared layout and typography live in ir-design-system.css. */

/* ---------- Hosting: prostředí a datacentrum ---------- */
.ir-hosting-environment {
  padding: 1.875rem;
  border-radius: 1.5rem;
  background: rgba(255,255,255,.97);
  box-shadow: 0 1.75rem 4.875rem rgba(15,17,23,.12);
}
.ir-hosting-environment__shell > span {
  display: block;
  margin-bottom: .8125rem;
  color: var(--ir-coral);
  font-size: .625rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.ir-hosting-environment__layer { border-radius: 1.125rem; }
.ir-hosting-environment__layer small {
  display: block;
  color: #6b7179;
  font-size: .625rem;
  font-weight: 600;
}
.ir-hosting-environment__layer--outer { padding: 1.125rem; background: #f5f3f0; }
.ir-hosting-environment__layer--middle {
  margin-top: .6875rem;
  padding: 1.125rem;
  border: 1px solid var(--ir-line-soft);
  background: #fff;
}
.ir-hosting-environment__layer--inner {
  margin-top: .6875rem;
  padding: 1.375rem;
  color: #fff;
  background: var(--ir-surface-dark);
}
.ir-hosting-environment__layer--inner small { color: #aeb4bc; }
.ir-hosting-environment__layer--inner strong {
  display: block;
  margin-top: .4375rem;
  color: #fff;
  font-family: var(--ir-font-display);
  font-size: 1.8125rem;
  line-height: 1.25;
  font-weight: 600;
}
.ir-hosting-environment__contact {
  margin-top: .9375rem;
  padding: 1.125rem 1.25rem;
  border-left: 2px solid var(--ir-coral);
}
.ir-hosting-environment__contact span {
  display: block;
  color: var(--ir-coral);
  font-size: .625rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.ir-hosting-environment__contact strong {
  display: block;
  margin-top: .4375rem;
  font-family: var(--ir-font-display);
  font-size: 1.3125rem;
  line-height: 1.35;
  font-weight: 600;
}
.ir-datacenter-visual {
  padding: 1.875rem;
  border-radius: 1.375rem;
  background: var(--ir-surface-soft);
  box-shadow: 0 1.125rem 3rem rgba(15,17,23,.06);
}
.ir-datacenter-visual > div:first-child {
  padding: 1.375rem;
  border-radius: .875rem;
  background: #fff;
}
.ir-datacenter-visual > div:first-child span,
.ir-datacenter-visual > div:last-child span {
  display: block;
  color: var(--ir-coral);
  font-size: .625rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.ir-datacenter-visual > div:first-child strong {
  display: block;
  margin-top: .4375rem;
  font-family: var(--ir-font-display);
  font-size: 1.6875rem;
  line-height: 1.3;
  font-weight: 600;
}
.ir-datacenter-visual > div:last-child {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-top: 2.125rem;
}
.ir-datacenter-visual > div:last-child::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -2.125rem;
  width: 1px;
  height: 2.125rem;
  background: rgba(15,17,23,.15);
}
.ir-datacenter-visual article { padding: 1.1875rem; border-radius: .8125rem; background: #fff; }
.ir-datacenter-visual article strong {
  display: block;
  margin-top: .375rem;
  font-family: var(--ir-font-display);
  font-size: 1.125rem;
  line-height: 1.35;
  font-weight: 600;
}

@media (max-width: 66.25em) {
  .ir-hosting-environment,
  .ir-datacenter-visual { width: 100%; max-width: 47.5rem; }
}

@media (max-width: 43.75em) {
  .ir-hosting-environment,
  .ir-datacenter-visual { padding: 1.375rem; }
  .ir-datacenter-visual > div:last-child { grid-template-columns: 1fr; }
}